/* ==========================================================================
   RAMANJI HANDLOOMS - Home redesign (editorial layout)
   Loaded after design-system.css. Brand palette only: maroon / antique gold /
   ivory / deep chocolate. No external brand references.
   ========================================================================== */

/* ---------- Full-bleed helper (breaks out of Astra's content container) ---- */
/* --sbw is the scrollbar width, set once at runtime, so 100vw does not
   overflow by the scrollbar and crop the right edge. */
.rh-full{
  width: calc(100vw - var(--sbw, 0px));
  margin-left: calc(50% - ((100vw - var(--sbw, 0px)) / 2));
  margin-right: calc(50% - ((100vw - var(--sbw, 0px)) / 2));
  max-width: calc(100vw - var(--sbw, 0px));
}

/* ==========================================================================
   1. HERO - edge to edge photograph, dark gradient, copy on the left
   ========================================================================== */
.rh-hero{
  position:relative; min-height:clamp(460px, 76vh, 760px);
  display:flex; align-items:center; overflow:hidden;
  background: var(--color-primary-dark);
}
.rh-hero__media{ position:absolute; inset:0; z-index:0; }
.rh-hero__media img{
  width:100%; height:100%; object-fit:cover; object-position:center 30%;
  display:block;
}
/* Gradient: strong on the copy side so the serif heading always reads */
.rh-hero__scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(20,11,4,.92) 0%, rgba(20,11,4,.78) 38%, rgba(20,11,4,.30) 68%, rgba(20,11,4,.12) 100%),
    linear-gradient(0deg, rgba(20,11,4,.55) 0%, rgba(20,11,4,0) 45%);
}
.rh-hero__inner{
  position:relative; z-index:2; width:100%;
  max-width:var(--container-max, 1280px); margin:0 auto;
  padding:clamp(2.5rem,6vw,5rem) clamp(1.25rem,5vw,3rem);
}
.rh-hero__copy{ max-width:34rem; }
.rh-hero__eyebrow{
  display:inline-block; font-family:var(--font-body); font-weight:600;
  letter-spacing:.18em; text-transform:uppercase; font-size:.72rem;
  color:var(--color-accent-light); margin-bottom:1rem;
}
.rh-hero__eyebrow::after{
  content:''; display:block; width:44px; height:2px; background:var(--color-accent);
  margin-top:.6rem;
}
.rh-hero h1{
  font-family:var(--font-display); font-weight:600; color:#FBF6EC;
  font-size:clamp(2.1rem, 5.2vw, 4rem); line-height:1.08; margin:0 0 1rem;
  text-shadow:0 2px 18px rgba(0,0,0,.45);
}
.rh-hero p{
  color:#EBDCC0; font-size:clamp(.98rem,1.6vw,1.12rem); line-height:1.7;
  margin:0 0 1.75rem; max-width:32rem;
}
.rh-hero__actions{ display:flex; flex-wrap:wrap; gap:.85rem; }
.rh-hero__trust{
  margin-top:2rem; display:flex; flex-wrap:wrap; gap:.4rem 1.4rem;
  font-size:.72rem; letter-spacing:.13em; text-transform:uppercase; color:#C6B18A;
}
.rh-hero__trust span{ display:inline-flex; align-items:center; gap:.5rem; }
.rh-hero__trust span+span::before{ content:'\2022'; color:var(--color-accent); margin-right:.4rem; }

@media (max-width:782px){
  .rh-hero{ min-height:auto; padding:0; }
  .rh-hero__media img{ object-position:center 22%; }
  /* Much darker on small screens so the copy always wins over the photograph */
  .rh-hero__scrim{
    background:
      linear-gradient(180deg, rgba(20,11,4,.62) 0%, rgba(20,11,4,.80) 45%, rgba(20,11,4,.94) 100%);
  }
  .rh-hero__inner{ padding:4.5rem 1.25rem 2.25rem; }
  .rh-hero__copy{ max-width:100%; }
  .rh-hero p{ margin-bottom:1.5rem; }
  /* CTA sits low in the band, inside comfortable thumb reach */
  .rh-hero__actions{ flex-direction:column; align-items:stretch; gap:.7rem; }
  .rh-hero__actions .rh-btn{ width:100%; justify-content:center; padding:1em 1.25em; font-size:1rem; }
  .rh-hero__trust{ margin-top:1.5rem; font-size:.64rem; gap:.35rem 1rem; }
}

/* ==========================================================================
   2. FEATURE PILL STRIP - maroon band, rounded ivory badges
   ========================================================================== */
.rh-pills{
  background:var(--color-secondary);
  background-image:
    radial-gradient(circle at 12% 20%, rgba(184,137,43,.18) 0, transparent 42%),
    radial-gradient(circle at 88% 80%, rgba(184,137,43,.14) 0, transparent 40%);
  padding:clamp(1.75rem,4vw,2.75rem) clamp(1rem,4vw,2rem);
}
.rh-pills__grid{
  max-width:var(--container-max,1280px); margin:0 auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
}
.rh-pill{
  display:flex; align-items:center; justify-content:center; gap:.7rem;
  background:var(--color-bg); border-radius:999px;
  padding:.95rem 1.35rem; text-align:left;
  font-family:var(--font-heading); font-size:.95rem; line-height:1.25;
  color:var(--color-primary-dark); text-decoration:none;
  box-shadow:0 6px 18px rgba(20,11,4,.18);
  transition:transform var(--transition), box-shadow var(--transition), background var(--transition);
}
.rh-pill:hover{
  transform:translateY(-3px); background:#fff;
  box-shadow:0 12px 26px rgba(20,11,4,.28); color:var(--color-secondary);
}
.rh-pill__ico{
  flex:0 0 auto; width:34px; height:34px; border-radius:50%;
  background:var(--color-bg-alt); color:var(--color-secondary);
  display:flex; align-items:center; justify-content:center; font-size:1.05rem;
}
.rh-pill span:last-child{ min-width:0; }

@media (max-width:900px){
  /* 2 x 2 - never a horizontal scroll */
  .rh-pills__grid{ grid-template-columns:repeat(2,1fr); gap:.7rem; }
  .rh-pill{ font-size:.82rem; padding:.8rem .9rem; gap:.5rem; }
  .rh-pill__ico{ width:28px; height:28px; font-size:.9rem; }
}
/* Keep the 2 x 2 grid on phones - only very narrow screens drop to one column */
@media (max-width:600px){
  .rh-pill{ flex-direction:column; text-align:center; gap:.45rem; padding:.85rem .6rem;
            font-size:.78rem; line-height:1.3; border-radius:18px; }
  .rh-pill__ico{ width:30px; height:30px; font-size:.95rem; }
}
@media (max-width:340px){
  .rh-pills__grid{ grid-template-columns:1fr; }
  .rh-pill{ flex-direction:row; text-align:left; justify-content:flex-start; border-radius:999px; }
}

/* ==========================================================================
   3. PRODUCT CARDS - zoom + crossfade on hover, clean name/price beneath
   ========================================================================== */
.woocommerce ul.products li.product{ border:none; box-shadow:none; background:transparent; }
.woocommerce ul.products li.product:hover{ transform:none; box-shadow:none; border:none; }
.woocommerce ul.products li.product a img{
  border-radius:var(--radius-md);
  transition:transform .7s cubic-bezier(.2,.6,.2,1), filter .5s ease;
}
.woocommerce ul.products li.product .rh-media-wrap{ position:relative; overflow:hidden; border-radius:var(--radius-md); }
/* Crossfade veil that lifts as the image scales */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link{
  display:block; position:relative; overflow:hidden; border-radius:var(--radius-md);
}
.woocommerce ul.products li.product .woocommerce-LoopProduct-link::after{
  content:''; position:absolute; inset:0; border-radius:var(--radius-md);
  background:linear-gradient(0deg, rgba(20,11,4,.42) 0%, rgba(20,11,4,0) 55%);
  opacity:0; transition:opacity .5s ease; pointer-events:none;
}
@media (hover:hover){
  .woocommerce ul.products li.product:hover a img{ transform:scale(1.07); }
  .woocommerce ul.products li.product:hover .woocommerce-LoopProduct-link::after{ opacity:1; }
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-family:var(--font-heading); font-size:1.02rem; font-weight:500;
  color:var(--color-primary-dark); padding:.9rem 0 .15rem; margin:0;
}
.woocommerce ul.products li.product .price{
  font-family:var(--font-body); font-size:.98rem; font-weight:600;
  color:var(--color-secondary); padding:0; margin:0 0 .5rem;
}
.woocommerce ul.products li.product .rh-cat-label{ padding:.9rem 0 0; }
.woocommerce ul.products li.product .rh-card-meta{ padding:0; }
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .rh-btn{ margin:0 0 .5rem; }
.woocommerce ul.products li.product .rh-interested{ padding:0 0 .5rem; }
.woocommerce ul.products li.product .tinv-wrapper{ padding:0 0 .5rem; }

/* Equal-height cards: titles that wrap to 2 lines were pushing Add to Cart /
   WhatsApp / Wishlist further down than cards with a 1-line title, so buttons
   did not line up across a row. Make each card a flex column, reserve fixed
   height for the title, and pin the price/button block to the bottom. */
.woocommerce ul.products{ align-items:stretch; }
.woocommerce ul.products li.product{ display:flex; flex-direction:column; height:100%; }
.woocommerce ul.products li.product .woocommerce-loop-product__title{ min-height:2.6em; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.woocommerce ul.products li.product .price{ margin-top:auto; }
.woocommerce ul.products li.product .button, .woocommerce ul.products li.product .rh-btn{ width:100%; box-sizing:border-box; }

/* Touch devices: no hover state, the whole image is simply a link to the product */
@media (hover:none){
  .woocommerce ul.products li.product a img{ transition:none; }
  .woocommerce ul.products li.product .woocommerce-LoopProduct-link::after{ display:none; }
}
@media (max-width:720px){
  .woocommerce ul.products{ grid-template-columns:repeat(2,1fr) !important; gap:1.1rem !important; }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{ font-size:.88rem; padding-top:.6rem; }
  .woocommerce ul.products li.product .price{ font-size:.88rem; }
}

/* ==========================================================================
   Section headings used across the redesigned home page
   ========================================================================== */
.rh-sec{ padding:clamp(3rem,7vw,5rem) 0; }
.rh-sec--alt{ background:var(--color-bg-alt); }
.rh-sec__head{ text-align:center; max-width:46rem; margin:0 auto clamp(1.75rem,4vw,2.75rem); }
.rh-sec__head .rh-eyebrow{ color:var(--color-secondary); }
.rh-sec__head h2{ margin:.2rem 0 .6rem; }
.rh-sec__head p{ color:var(--color-muted); margin:0; }

/* Editorial split band */
.rh-split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,4vw,3rem); align-items:center; }
.rh-split img{ width:100%; border-radius:var(--radius-md); box-shadow:var(--shadow-card); display:block; }
@media (max-width:860px){ .rh-split{ grid-template-columns:1fr; } }

/* ==========================================================================
   Coming Soon block (Semi Pattu Sarees)
   ========================================================================== */
.rh-coming-soon{
  background:var(--color-bg-alt); border:1px dashed var(--color-secondary);
  border-radius:var(--radius-md); padding:clamp(1.75rem,4vw,2.75rem); text-align:center;
}
.rh-coming-soon__badge{
  display:inline-block; background:var(--color-accent); color:var(--color-primary-dark);
  font-family:var(--font-body); font-weight:700; font-size:.7rem; letter-spacing:.12em;
  text-transform:uppercase; padding:.35em .9em; border-radius:999px; margin-bottom:1rem;
}
.rh-coming-soon h2{ margin:0 0 .6rem; font-size:clamp(1.25rem,3vw,1.75rem); }
.rh-coming-soon p{ color:var(--color-muted); max-width:44em; margin:0 auto 1.25rem; }
.rh-coming-soon__actions{ display:flex; flex-wrap:wrap; gap:.75rem; justify-content:center; }
.rh-coming-soon__note{ font-size:.82rem; margin-top:1.25rem !important; color:var(--color-muted); }
@media (max-width:600px){
  .rh-coming-soon__actions{ flex-direction:column; }
  .rh-coming-soon__actions .rh-btn{ width:100%; justify-content:center; }
}

/* Coming Soon tag in navigation and lists */
.rh-soon-tag, .menu-item .rh-soon-tag{
  display:inline-block; font-style:normal; font-family:var(--font-body);
  font-size:.6rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  background:var(--color-accent); color:var(--color-primary-dark);
  padding:.15em .5em; border-radius:999px; margin-left:.4em; vertical-align:middle;
}

/* ==========================================================================
   All Types of Sarees - numbered category list
   ========================================================================== */
.rh-cat-list{ display:grid; grid-template-columns:repeat(2,1fr); gap:.85rem; }
.rh-cat-list__item{
  display:flex; align-items:center; gap:1rem; text-decoration:none;
  background:#fff; border:1px solid var(--color-border); border-radius:var(--radius-md);
  padding:1.1rem 1.35rem; transition:all var(--transition);
}
.rh-cat-list__item:hover{
  border-color:var(--color-accent); box-shadow:var(--shadow-card); transform:translateY(-2px);
}
.rh-cat-list__num{
  font-family:var(--font-display); font-size:1.35rem; font-weight:600;
  color:var(--color-accent); flex:0 0 auto; min-width:1.6em;
}
.rh-cat-list__body{ flex:1 1 auto; min-width:0; }
.rh-cat-list__body strong{
  display:block; font-family:var(--font-heading); font-weight:500; font-size:1.02rem;
  color:var(--color-primary-dark); margin-bottom:.15rem;
}
.rh-cat-list__body span{ font-size:.85rem; color:var(--color-muted); }
.rh-cat-list__go{ color:var(--color-secondary); font-size:1.1rem; flex:0 0 auto; }
.rh-cat-list__item.is-soon{ background:var(--color-bg-alt); }
@media (max-width:760px){ .rh-cat-list{ grid-template-columns:1fr; } }

/* ==========================================================================
   4. FOOTER - dark, four columns, social row beneath
   ========================================================================== */
.rh-foot{ background:var(--color-primary-dark); color:#C6B18A; }
.rh-foot__inner{
  max-width:var(--container-max,1280px); margin:0 auto;
  padding:clamp(2.5rem,6vw,4rem) clamp(1.25rem,4vw,2rem) 1.5rem;
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(1.5rem,4vw,3rem);
}
.rh-foot__col summary{ list-style:none; cursor:default; }
.rh-foot__col summary::-webkit-details-marker{ display:none; }
.rh-foot h4{
  color:#FBF6EC; font-family:var(--font-body); font-size:.78rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; margin:0 0 1rem;
}
.rh-foot ul{ list-style:none; margin:0; padding:0; }
.rh-foot li{ margin-bottom:.6rem; }
.rh-foot a{ color:#C6B18A; font-size:.9rem; text-decoration:none; transition:color var(--transition); }
.rh-foot a:hover{ color:var(--color-accent-light); }
.rh-foot__brand p{ font-size:.9rem; color:#AB9877; line-height:1.7; margin:.85rem 0; max-width:26rem; }
.rh-foot__logo{ width:64px; height:64px; border-radius:50%; object-fit:cover; display:block; }
.rh-foot__contact li{ display:flex; gap:.6rem; align-items:flex-start; font-size:.9rem; line-height:1.6; }
.rh-foot__contact .rh-foot__ico{ color:var(--color-accent); flex:0 0 auto; }
.rh-foot__social{
  max-width:var(--container-max,1280px); margin:0 auto;
  padding:1.25rem clamp(1.25rem,4vw,2rem) 1.25rem;
  border-top:1px solid rgba(198,177,138,.18);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.rh-foot__social-icons{ display:flex; gap:.6rem; }
.rh-foot__social-icons a{
  width:38px; height:38px; border-radius:50%; border:1px solid rgba(198,177,138,.3);
  display:flex; align-items:center; justify-content:center; font-size:1rem;
  transition:all var(--transition);
}
.rh-foot__social-icons a:hover{ background:var(--color-accent); color:var(--color-primary-dark); border-color:var(--color-accent); }
.rh-foot__copy{ font-size:.78rem; color:#8C7B5F; margin:0; }
.rh-foot__soon{ color:#6F6146; font-size:.78rem; }

/* Mobile: columns collapse into tap-to-open accordions */
@media (max-width:860px){
  .rh-foot__inner{ grid-template-columns:1fr; gap:0; padding-bottom:.5rem; }
  .rh-foot__brand{ margin-bottom:1.5rem; }
  .rh-foot__col{ border-top:1px solid rgba(198,177,138,.18); }
  .rh-foot__col summary{ cursor:pointer; }
  .rh-foot__col h4{
    margin:0; padding:1rem 0; display:flex;
    align-items:center; justify-content:space-between;
  }
  .rh-foot__col h4::after{
    content:'+'; font-size:1.3rem; color:var(--color-accent); font-weight:400; line-height:1;
  }
  .rh-foot__col[open] h4::after{ content:'\2212'; }
  .rh-foot__col ul{ padding-bottom:1rem; }
  .rh-foot__social{ flex-direction:column; align-items:flex-start; gap:1rem; }
  /* Keep the last footer row clear of the sticky WhatsApp button */
  .rh-foot__social{ padding-bottom:5.5rem; }
}

/* ==========================================================================
   Header icons - search / wishlist / cart
   (search + cart are native Astra header components, styled to match brand;
   wishlist wraps TI Wishlist's own counter shortcode, restyled to match)
   ========================================================================== */
.ast-header-search .astra-search-icon,
.ast-site-header-cart .ast-icon,
.ast-site-header-cart svg{ color:var(--color-primary-dark); }
.ast-site-header-cart .cart-container{ display:flex; align-items:center; }
.ast-site-header-cart .count,
.ast-cart-menu-wrap .count{
  background:var(--color-secondary) !important; color:#fff !important;
  border-color:var(--color-secondary) !important; font-family:var(--font-body);
}

.rh-header-wishlist{ display:inline-flex; align-items:center; }
.rh-header-wishlist .wishlist_products_counter{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:2.4em; height:2.4em; border-radius:50%; color:var(--color-primary-dark);
  text-decoration:none; transition:all var(--transition);
}
.rh-header-wishlist .wishlist_products_counter:hover{ color:var(--color-secondary); background:var(--color-bg-alt); }
/* Hide the plugin's own text label; show a heart glyph instead */
.rh-header-wishlist .wishlist_products_counter_text{
  position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0);
}
.rh-header-wishlist .wishlist_products_counter::before{
  content:'\2661'; font-size:1.3rem; line-height:1;
}
.rh-header-wishlist .wishlist_products_counter.wishlist-counter-with-products::before{ content:'\2665'; color:var(--color-secondary); }
.rh-header-wishlist .wishlist_products_counter_number{
  position:absolute; top:0; right:0; min-width:16px; height:16px; padding:0 3px;
  border-radius:50%; background:var(--color-secondary); color:#fff;
  font-size:.62rem; font-weight:700; line-height:16px; text-align:center;
  font-family:var(--font-body);
}
.rh-header-wishlist .wishlist_products_counter_number:empty{ display:none; }

/* Mobile header: keep the three icons + hamburger from crowding the logo */
@media (max-width:921px){
  .ast-primary-header-bar .ast-header-search,
  .rh-header-wishlist,
  .ast-site-header-cart{ margin-left:.15rem; margin-right:.15rem; }
  .rh-header-wishlist .wishlist_products_counter,
  .ast-site-header-cart{ width:2.1em; height:2.1em; }
}
/* ==========================================================================
   Mini-cart dropdown - Astra's popup ships with no background/shadow of its
   own here, so the hero photo behind it was bleeding through and the cart
   contents were unreadable. Give it a solid card-style background.
   ========================================================================== */
.ast-site-header-cart-data .widget.woocommerce.widget_shopping_cart{
  background: var(--color-bg) !important;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card-hover);
  padding: 1rem 1.1rem;
}
.ast-site-header-cart-data .widget_shopping_cart_content{ background: transparent; }
.ast-site-header-cart-data .woocommerce-mini-cart,
.ast-site-header-cart-data ul.cart_list{ background: transparent; margin: 0; padding: 0; }
.ast-site-header-cart-data .woocommerce-mini-cart li,
.ast-site-header-cart-data ul.cart_list li{
  border-bottom: 1px solid var(--color-border);
  padding: .75rem 0;
  color: var(--color-text);
}
.ast-site-header-cart-data .woocommerce-mini-cart li:first-child{ padding-top: 0; }
.ast-site-header-cart-data .woocommerce-mini-cart li a{ color: var(--color-primary-dark); }
.ast-site-header-cart-data .woocommerce-mini-cart li a.remove{ color: var(--color-danger); }
.ast-site-header-cart-data .woocommerce-mini-cart .total,
.ast-site-header-cart-data .woocommerce-mini-cart .amount{ color: var(--color-secondary); font-weight: 700; }
.ast-site-header-cart-data .woocommerce-mini-cart .buttons,
.ast-site-header-cart-data .woocommerce-mini-cart .wc-forward,
.ast-site-header-cart-data .woocommerce-mini-cart .checkout{
  margin-top: .75rem;
}

/* ==========================================================================
   Mobile mini-cart DRAWER - a separate full-screen slide-in panel Astra uses
   below its header breakpoint (#astra-mobile-cart-drawer), distinct from the
   desktop hover-dropdown fixed above. It shipped fully transparent end to
   end, so the hero photo bled through behind the cart contents. Desktop and
   tablet (the hover-dropdown fixed earlier) are untouched by this block.
   ========================================================================== */
@media (max-width: 921px){
  /* Astra's open animation is transform:translate3d(-100%,0,0), a percentage of the
     drawer's OWN width - but that width also flips (460px desktop -> 100%/80% mobile)
     the instant .active is toggled. The transform's basis stays keyed to the stale
     460px value for the first paint, so the drawer opens already shifted left by the
     wrong amount, clipping product names/prices on that first frame (it silently
     corrects itself a moment later, which is why this only shows up as a screenshot,
     not in static devtools inspection). Replacing the transform slide with a `right`
     slide avoids the self-referential percentage entirely. */
  #astra-mobile-cart-drawer{
    background: var(--color-bg) !important;
    box-shadow: -8px 0 30px rgba(42,27,16,.25);
    left: auto !important;
    right: -100% !important;
    transform: none !important;
    transition: right .25s ease !important;
  }
  #astra-mobile-cart-drawer.active{
    right: 0 !important;
  }
  /* Astra's own .widget_shopping_cart_content wrapper clips overflow:hidden. During
     the open slide this clip box is briefly painted a frame behind the already-
     settled row layout underneath it, visually cropping product names/prices even
     though their real geometry is fully on-screen. The drawer itself and the inner
     <ul> both already scroll/clip on their own, so this middle layer's clip is
     redundant on mobile - drop it. */
  #astra-mobile-cart-drawer .astra-cart-drawer-content .widget_shopping_cart_content{
    overflow: visible !important;
  }
  #astra-mobile-cart-drawer .astra-cart-drawer-content{ background: transparent; }
  #astra-mobile-cart-drawer .widget.woocommerce.widget_shopping_cart{
    background: transparent;
    padding: 0 1.1rem 1.1rem;
  }
  #astra-mobile-cart-drawer .woocommerce-mini-cart,
  #astra-mobile-cart-drawer ul.cart_list{ background: transparent; margin: 0; padding: 0; }
  /* Astra's core CSS reserves padding-left:5em on these <li>s because the product
     thumbnail is `position:absolute; left:0; width:4em` - text is meant to flow in
     the reserved space to the right of it, never underneath it. The rule below used
     to zero that left padding out (padding:.85rem 0), which let the absolutely
     positioned image sit on top of the product name and price text starting at the
     same x=0 origin - visually hiding whichever portion of the text the image's
     58px width happened to cover, showing only the tail end of names/prices. This is
     the actual root cause of the mobile price-clipping bug (not a drawer transition
     timing issue as first suspected) - restore the 5em left padding. */
    #astra-mobile-cart-drawer .woocommerce-mini-cart li,
  #astra-mobile-cart-drawer ul.cart_list li{
    border-bottom: 1px solid var(--color-border);
    padding: .85rem 0 .85rem 5em;
    color: var(--color-text);
  }
  #astra-mobile-cart-drawer .woocommerce-mini-cart li a{ color: var(--color-primary-dark); }
  #astra-mobile-cart-drawer .woocommerce-mini-cart li a.remove{ color: var(--color-danger); }
  #astra-mobile-cart-drawer .woocommerce-mini-cart .total,
  #astra-mobile-cart-drawer .woocommerce-mini-cart .amount{ color: var(--color-secondary); font-weight: 700; }
  #astra-mobile-cart-drawer .astra-cart-drawer-close{ color: var(--color-primary-dark); }
}

/* ==========================================================================
   Mobile expanding search bar - Astra anchors the expanded input to its own
   tiny icon wrapper with a fixed 235px width, which overflows off the left
   edge of narrow phones (the icon sits too close to the left of the header
   icon cluster for that fixed width to fit). Re-anchor it to the full header
   bar instead, as a properly contained overlay. Desktop/tablet untouched.
   ========================================================================== */
@media (max-width: 921px){
  .ast-mobile-header-wrap .ast-search-menu-icon.ast-dropdown-active{
    position: static !important;
  }
  .ast-mobile-header-wrap .ast-search-menu-icon.ast-dropdown-active .search-form,
  .ast-mobile-header-wrap .ast-search-menu-icon.slide-search .search-form{
    position: static !important;
    transform: none !important;
  }
  .ast-mobile-header-wrap .ast-search-menu-icon.ast-dropdown-active .search-field,
  .ast-mobile-header-wrap .ast-dropdown-active.ast-search-menu-icon.slide-search input.search-field{
    position: absolute !important;
    top: 0 !important; bottom: 0 !important; left: 1rem !important; right: 1rem !important;
    width: auto !important; max-width: none !important;
    height: 46px !important; margin: auto 0 !important;
    background: var(--color-bg) !important;
    border: 1px solid var(--color-border) !important;
    border-radius: var(--radius-sm) !important;
    box-shadow: var(--shadow-card-hover) !important;
    padding: 0 3rem 0 1rem !important;
    font-size: .95rem !important;
    z-index: 40 !important;
  }
  .ast-mobile-header-wrap .ast-search-menu-icon.ast-dropdown-active .search-submit{
    position: absolute !important;
    right: 1.6rem !important; top: 0 !important; bottom: 0 !important; margin: auto 0 !important;
    height: 28px !important; width: 28px !important;
    display: flex !important; align-items: center; justify-content: center;
    z-index: 41 !important;
  }
  .ast-mobile-header-wrap .ast-search-menu-icon.ast-dropdown-active .ast-search-icon{
    position: relative !important;
    z-index: 42 !important;
  }
}

/* Sticky WhatsApp must always float above the footer */
.rh-sticky-whatsapp{ z-index:1200 !important; }