/*
Theme Name: Astra Child – iOS26 Woo Only
Theme URI: 
Description: iOS26 look ONLY for WooCommerce pages (Shop, Product, Cart, Checkout, My Account) on Astra.
Author: Generated
Template: astra
Version: 5.10.19
Text Domain: astra-child-ios26-woo
*/

/* =========================================================
   iOS26 – WooCommerce Pagination (centered glass pills)
   ========================================================= */
.woocommerce nav.woocommerce-pagination{margin:28px 0 10px;text-align:center}
.woocommerce nav.woocommerce-pagination ul.page-numbers{
  display:inline-flex!important;justify-content:center;align-items:center;gap:10px;
  padding:10px 12px;margin:0 auto;border:0;list-style:none;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-radius:999px;box-shadow:0 10px 30px rgba(0,0,0,.35)
}
.woocommerce nav.woocommerce-pagination ul.page-numbers li{margin:0!important;border:0!important}
.woocommerce nav.woocommerce-pagination ul.page-numbers a,
.woocommerce nav.woocommerce-pagination ul.page-numbers span{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:40px;padding:0 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  color:rgba(255,255,255,.92)!important;
  font-weight:600;letter-spacing:.2px;text-decoration:none!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease
}
.woocommerce nav.woocommerce-pagination ul.page-numbers a:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.09);
  border-color:rgba(255,255,255,.22);
  box-shadow:0 8px 18px rgba(0,0,0,.25)
}
.woocommerce nav.woocommerce-pagination ul.page-numbers .current{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.28);
  box-shadow:0 10px 22px rgba(0,0,0,.32)
}
.woocommerce nav.woocommerce-pagination ul.page-numbers .prev,
.woocommerce nav.woocommerce-pagination ul.page-numbers .next{
  padding:0 12px;min-width:44px
}
@media (max-width:520px){
  .woocommerce nav.woocommerce-pagination ul.page-numbers{gap:8px;padding:9px 10px}
  .woocommerce nav.woocommerce-pagination ul.page-numbers a,
  .woocommerce nav.woocommerce-pagination ul.page-numbers span{
    min-width:36px;height:36px;padding:0 12px;font-size:14px
  }
}


/* =========================================================
   iOS26 – Pagination overrides (force horizontal + center)
   ========================================================= */
.woocommerce .woocommerce-pagination,
.woocommerce nav.woocommerce-pagination{
  text-align:center !important;
}

.woocommerce .woocommerce-pagination .page-numbers,
.woocommerce nav.woocommerce-pagination ul.page-numbers,
.woocommerce nav.woocommerce-pagination .page-numbers{
  display:inline-flex !important;
  flex-direction:row !important;
  justify-content:center !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin:0 auto !important;
  padding:10px 12px !important;
  list-style:none !important;
  border:0 !important;
}

.woocommerce .woocommerce-pagination .page-numbers li,
.woocommerce nav.woocommerce-pagination ul.page-numbers li{
  display:inline-flex !important;
  float:none !important;
  border:0 !important;
  margin:0 !important;
}

/* Make sure links/spans become pill buttons even if theme overrides */
.woocommerce .woocommerce-pagination a.page-numbers,
.woocommerce .woocommerce-pagination span.page-numbers,
.woocommerce nav.woocommerce-pagination a.page-numbers,
.woocommerce nav.woocommerce-pagination span.page-numbers{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:40px !important;
  height:40px !important;
  padding:0 14px !important;
  border-radius:999px !important;
  text-decoration:none !important;
}

/* If the theme outputs only arrows as characters, keep them centered */
.woocommerce .woocommerce-pagination a.prev,
.woocommerce .woocommerce-pagination a.next,
.woocommerce nav.woocommerce-pagination a.prev,
.woocommerce nav.woocommerce-pagination a.next{
  min-width:44px !important;
}



/* ================================
   iOS26 Subtle 3-Color Glow (All pages)
   - Glow stays small near the top
   - Prevents "overfilling" long pages
================================ */

/* Base: keep page black */
html, body{
  background: #000 !important;
  min-height: 100%;
}

/* Glow overlay (fades out downward) */
body::before{
  content:"";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;

  background:
    radial-gradient(circle at 12% 18%, rgba(0, 90, 255, 0.35), transparent 38%),
    radial-gradient(circle at 88% 16%, rgba(0, 200, 120, 0.26), transparent 38%),
    radial-gradient(circle at 50% 88%, rgba(255, 50, 50, 0.18), transparent 45%);



/* Astra layers that often paint a solid background */
.site, #page, .site-content, .ast-container,
.ast-separate-container .site-content,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single,
.ast-separate-container .ast-article,
.ast-plain-container .site-content{
  background: transparent !important;
}

/* Mobile: even softer */
@media (max-width: 768px){
  body::before{
    background:
      radial-gradient(circle at 15% 18%, rgba(0, 90, 255, 0.26), transparent 45%),
      radial-gradient(circle at 85% 16%, rgba(0, 200, 120, 0.20), transparent 45%),
      radial-gradient(circle at 50% 92%, rgba(255, 50, 50, 0.14), transparent 55%);