/*
Theme Name: Wicked by Hariks
Theme URI: https://wickedbyhariks.com
Author: Wicked by Hariks
Author URI: https://wickedbyhariks.com
Description: Luxury jewellery theme for Wicked by Hariks — 18k gold-plated titanium steel necklaces, cuff bangles, bangles and jewellery sets. WooCommerce-ready with a brand-matched shop, product pages, cart and checkout.
Version: 1.3.11
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wicked-by-hariks
Tags: woocommerce, ecommerce, jewellery, luxury, custom-colors, custom-menu, featured-images
WC requires at least: 6.0
WC tested up to: 9.0
*/

:root {
  /* Neutral palette — light brown, dark brown, near-black (per client brief / business card) */
  --cream: #F1E9DC;        /* lightest brown — page background */
  --cream-light: #F8F2E5;  /* paper / cards */
  --cream-deep: #E3D4BE;   /* light brown accent */
  --sand: #CBB492;         /* warm tan */
  --taupe: #A98F70;        /* mid light brown */
  --mocha: #7A5C42;        /* medium brown */
  --cocoa: #4E3724;        /* dark brown */
  --cocoa-deep: #2E2014;   /* very dark brown */
  --ink: #14100C;          /* near-black */
  --gold: #8A6F4D;         /* bronze-brown accent (replaces yellow gold) */
  --rose: #C4AC91;         /* warm beige (replaces pink) */
  --rose-deep: #8A6F4D;    /* dark tan (replaces dusty pink) */
  --line: rgba(46, 32, 20, 0.14);
}
html { scroll-behavior: smooth; }
body {
  font-family: 'DM Sans', sans-serif;
  background: var(--cream);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.font-display { font-family: 'Fraunces', serif; font-optical-sizing: auto; }
.font-script { font-family: 'Italianno', cursive; }
.text-cream { color: var(--cream); }
.text-cream-light { color: var(--cream-light); }
.text-mocha { color: var(--mocha); }
.text-cocoa { color: var(--cocoa); }
.text-cocoa-deep { color: var(--cocoa-deep); }
.text-ink { color: var(--ink); }
.text-taupe { color: var(--taupe); }
.text-gold { color: var(--gold); }
.text-rose { color: var(--rose); }
.text-rose-deep { color: var(--rose-deep); }
.bg-cream { background-color: var(--cream); }
.bg-cream-light { background-color: var(--cream-light); }
.bg-cream-deep { background-color: var(--cream-deep); }
.bg-sand { background-color: var(--sand); }
.bg-mocha { background-color: var(--mocha); }
.bg-cocoa { background-color: var(--cocoa); }
.bg-cocoa-deep { background-color: var(--cocoa-deep); }
.bg-ink { background-color: var(--ink); }
.bg-gold { background-color: var(--gold); }
.bg-rose { background-color: var(--rose); }
.border-line { border-color: var(--line); }
.border-gold { border-color: var(--gold); }

/* Premium header — strong opacity + scroll shadow so it stays legible over every section, including the dark footer */
.site-header {
  background-color: rgba(246, 239, 227, 0.96);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  backdrop-filter: saturate(140%) blur(14px);
  transition: box-shadow .4s ease, background-color .4s ease, border-color .4s ease;
}
.site-header.scrolled {
  background-color: rgba(250, 245, 236, 0.98);
  box-shadow: 0 14px 38px -22px rgba(60, 42, 32, 0.35);
  border-bottom-color: rgba(60, 42, 32, 0.08);
}

/* Paper grain texture overlay */
.grain::before {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.2 0 0 0 0 0.13 0 0 0 0 0.08 0 0 0 0.5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)' opacity='0.5'/></svg>");
  pointer-events: none;
  opacity: 0.18;
  mix-blend-mode: multiply;
  z-index: 1;
}

/* Smooth reveal on scroll */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity 1.1s cubic-bezier(.2,.8,.2,1), transform 1.1s cubic-bezier(.2,.8,.2,1); }
.reveal.in { opacity: 1; transform: translateY(0); }

/* Hero ken-burns */
@keyframes kenburns {
  0%   { transform: scale(1.0) translate(0,0); }
  50%  { transform: scale(1.08) translate(-1%, -1%); }
  100% { transform: scale(1.0) translate(0,0); }
}
.kenburns { animation: kenburns 22s ease-in-out infinite; }

/* Marquee */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee { animation: marquee 38s linear infinite; }

/* Instagram auto-scroll marquee (self-contained — no Tailwind dependency) */
.ig-marquee { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent); }
.ig-track { display: flex; width: max-content; animation: marquee 60s linear infinite; will-change: transform; }
.ig-marquee:hover .ig-track { animation-play-state: paused; }
.ig-tile { flex: 0 0 auto; width: 240px; aspect-ratio: 1 / 1; margin-right: 12px; position: relative; display: block; overflow: hidden; border-radius: 2px; background: var(--cream-deep); }
.ig-tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .7s cubic-bezier(.2,.8,.2,1); }
.ig-tile:hover img { transform: scale(1.08); }
.ig-tile .ig-veil { position: absolute; inset: 0; background: rgba(46,32,20,0); transition: background .3s ease; }
.ig-tile:hover .ig-veil { background: rgba(46,32,20,.22); }
@media (max-width: 640px) { .ig-tile { width: 44vw; } }
@media (prefers-reduced-motion: reduce) { .ig-track { animation: none; } .ig-marquee { overflow-x: auto; } }

/* Cart drawer slide */
.drawer { transform: translateX(100%); transition: transform .55s cubic-bezier(.2,.8,.2,1); }
.drawer.open { transform: translateX(0); }
.scrim { opacity: 0; pointer-events: none; transition: opacity .35s ease; }
.scrim.open { opacity: 1; pointer-events: auto; }

/* Product card hover — premium lift + soft shadow + gold price emphasis */
.product-card { transition: transform .55s cubic-bezier(.2,.8,.2,1); }
.product-card .img-wrap {
  overflow: hidden; position: relative;
  box-shadow: 0 2px 14px -10px rgba(60, 42, 32, 0.25);
  transition: box-shadow .55s cubic-bezier(.2,.8,.2,1);
}
.product-card:hover .img-wrap { box-shadow: 0 26px 50px -22px rgba(60, 42, 32, 0.45); }
.product-card img { transition: transform .9s cubic-bezier(.2,.8,.2,1), filter .6s ease; }
.product-card:hover img { transform: scale(1.06); filter: saturate(1.05) brightness(1.03); }
.wbh-card-actions { position:absolute; bottom:12px; left:12px; right:12px; display:grid; grid-template-columns:minmax(0,1fr) 44px; gap:8px; z-index:2; }
.product-card .wbh-card-details, .product-card .wbh-card-cart { box-sizing:border-box; display:flex; align-items:center; justify-content:center; min-height:44px; border:1px solid rgba(248,242,229,.65); border-radius:5px; text-decoration:none; transition:background .2s ease, color .2s ease; }
.product-card .wbh-card-details { background:rgba(248,242,229,.96); color:var(--cocoa-deep); font-size:10px; font-weight:500; letter-spacing:.16em; text-transform:uppercase; padding:8px; }
.product-card .wbh-card-cart { background:var(--cocoa-deep); color:var(--cream-light); border-color:var(--cocoa-deep); }
.product-card .wbh-card-details:hover { background:var(--cream); }
.product-card .wbh-card-cart:hover { background:var(--mocha); border-color:var(--mocha); }
.wbh-card-cart :is(i, svg) { width:19px; height:19px; flex:0 0 19px; }
.wbh-card-cart.loading { opacity:.6; pointer-events:none; }
.wbh-card-actions .added_to_cart { display:none; }
.wbh-card-swatches { position:absolute; top:12px; right:12px; z-index:2; display:flex; flex-wrap:wrap; gap:2px; max-width:calc(100% - 24px); padding:4px; border:1px solid var(--line); border-radius:999px; background:rgba(248,242,229,.97); box-shadow:0 3px 12px rgba(60,42,32,.1); }
.wbh-card-swatch { box-sizing:border-box; display:flex; align-items:center; justify-content:center; width:34px; height:34px; border:1px solid transparent; border-radius:50%; cursor:pointer; }
.wbh-card-swatch > span { display:block; width:21px; height:21px; border-radius:50%; border:1px solid rgba(60,42,32,.18); }
.wbh-card-swatch[aria-pressed="true"] { border-color:var(--cocoa-deep); }
.wbh-card-swatch:hover { background:var(--cream); }
.wbh-card-actions a:focus-visible, .wbh-card-swatch:focus-visible { outline:2px solid var(--cocoa-deep); outline-offset:3px; }
@media (max-width:479px) { .wbh-card-actions { bottom:8px; left:8px; right:8px; gap:6px; } .product-card .wbh-card-details { font-size:9px; letter-spacing:.08em; padding:5px; } .wbh-card-swatches { top:8px; right:8px; max-width:calc(100% - 16px); } }
.product-card .price { font-variant-numeric: tabular-nums; }

/* Buttons — premium, consistent across all sections */
.btn-primary {
  position: relative; overflow: hidden;
  background: var(--cocoa-deep); color: var(--cream-light);
  transition: background .3s ease, transform .2s ease, box-shadow .3s ease;
  box-shadow: 0 10px 24px -14px rgba(60, 42, 32, 0.55);
}
.btn-primary:hover { background: var(--ink); box-shadow: 0 16px 30px -16px rgba(42, 31, 24, 0.65); color: var(--cream-light); }
.btn-primary:active { transform: scale(.98); }
.btn-ghost {
  background: transparent; color: var(--cocoa-deep);
  border: 1px solid var(--cocoa-deep);
  transition: background .3s ease, color .3s ease, box-shadow .3s ease, transform .2s ease;
}
.btn-ghost:hover { background: var(--cocoa-deep); color: var(--cream-light); box-shadow: 0 14px 26px -16px rgba(60, 42, 32, 0.5); }
.btn-ghost:active { transform: scale(.98); }
.btn-gold {
  background: var(--gold); color: var(--cocoa-deep);
  transition: background .3s ease, transform .2s ease, box-shadow .3s ease;
  box-shadow: 0 10px 24px -14px rgba(201, 168, 118, 0.7);
}
.btn-gold:hover { background: var(--cream-light); box-shadow: 0 16px 30px -16px rgba(60, 42, 32, 0.45); }

/* Social icon — premium ring + gold fill */
.social-icon {
  width: 42px; height: 42px; border-radius: 9999px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(246, 239, 227, 0.22);
  color: var(--cream-light);
  transition: all .35s ease;
}
.social-icon svg { width: 18px; height: 18px; display: block; }
.social-icon i { display: inline-flex; }
.social-icon:hover {
  background: var(--gold); border-color: var(--gold); color: var(--cocoa-deep);
  transform: translateY(-2px);
  box-shadow: 0 10px 22px -12px rgba(201, 168, 118, 0.7);
}

/* Underline link */
.ulink { position: relative; }
.ulink::after {
  content:''; position:absolute; left:0; bottom:-3px; width:100%; height:1px;
  background: currentColor; transform: scaleX(0); transform-origin: right;
  transition: transform .5s cubic-bezier(.2,.8,.2,1);
}
.ulink:hover::after { transform: scaleX(1); transform-origin: left; }

/* Nav link */
.navlink { position: relative; }
.navlink::after {
  content:''; position:absolute; left:50%; bottom:-6px; width:6px; height:1px;
  background: var(--cocoa-deep); transform: translateX(-50%) scaleX(0);
  transition: transform .4s ease;
}
.navlink:hover::after { transform: translateX(-50%) scaleX(1); }

/* Cart badge bounce */
@keyframes bump { 0%{transform:scale(1)} 30%{transform:scale(1.35)} 60%{transform:scale(.92)} 100%{transform:scale(1)} }
.bump { animation: bump .5s ease; }

/* Hide scrollbar but allow scroll */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Logo styling */
.logo-i { display: inline-block; transform: translateY(-2px); color: var(--rose-deep); font-style: italic; }
.brand-logo .wbh-logo { display:block; width: 58px; height: 58px; transition: transform .35s ease, filter .35s ease; filter: drop-shadow(0 4px 10px rgba(60,42,32,0.18)); }
@media (min-width: 1024px) { .brand-logo .wbh-logo { width: 68px; height: 68px; } }
.brand-logo:hover .wbh-logo { transform: scale(1.05) rotate(-2deg); }

/* Footer logo */
.brand-logo-footer .wbh-logo { display:block; width: 108px; height: 108px; filter: drop-shadow(0 8px 18px rgba(0,0,0,0.45)); }

/* Mobile menu */
.navlink-mobile { padding: 8px 0; border-bottom: 1px solid var(--line); }
.navlink-mobile:last-child { border-bottom: 0; }

/* Custom checkbox-style category pill */
.pill {
  border: 1px solid var(--line);
  background: var(--cream-light);
  transition: all .25s ease;
  cursor: pointer;
}
.pill.active, .pill:hover { background: var(--cocoa-deep); color: var(--cream-light); border-color: var(--cocoa-deep); }

/* Section divider ornament */
.ornament { display:flex; align-items:center; justify-content:center; gap: 14px; color: var(--taupe); }
.ornament .line { width: 60px; height: 1px; background: var(--taupe); opacity: .5; }

/* Image frame with offset border */
.frame-offset { position: relative; }
.frame-offset::after {
  content:''; position:absolute; inset: 14px -14px -14px 14px;
  border: 1px solid var(--taupe); z-index: -1; pointer-events: none;
}

/* Tilted polaroid effect */
.tilt-l { transform: rotate(-2.5deg); }
.tilt-r { transform: rotate(2deg); }

/* Toast */
.toast {
  position: fixed; bottom: 24px; left: 50%; transform: translateX(-50%) translateY(20px);
  background: var(--cocoa-deep); color: var(--cream-light);
  padding: 14px 22px; border-radius: 4px; font-size: 14px; letter-spacing: 0.02em;
  z-index: 200;
  transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .35s ease, visibility 0s linear .35s;
  box-shadow: 0 18px 40px rgba(60,42,32,0.25);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  min-width: 1px;
  white-space: nowrap;
}
.toast:empty { display: none; }
.toast.show {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: transform .5s cubic-bezier(.2,.8,.2,1), opacity .35s ease, visibility 0s linear 0s;
}

/* Hero image fade-in mask */
.hero-img { position: relative; }
.hero-img::after {
  content:''; position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(60,42,32,0.05) 0%, rgba(60,42,32,0.32) 100%);
  pointer-events: none;
}

/* Decorative number */
.deco-num { font-family: 'Fraunces', serif; font-weight: 300; font-style: italic; color: var(--taupe); opacity: .7; }

/* Product card "Quick view" button — strong contrast on any image background */
.quick-btn {
  width: 100%;
  display: block;
  text-align: center;
  background: rgba(248, 242, 229, 0.96);  /* cream-light @ 96% */
  color: var(--cocoa-deep);
  padding: 11px 12px;
  font-size: 11px;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  font-weight: 600;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(46, 32, 20, 0.08);
  transition: background-color .25s ease, color .25s ease, transform .25s ease;
  cursor: pointer;
}
.quick-btn:hover {
  background: var(--cocoa-deep);
  color: var(--cream-light);
  transform: translateY(-1px);
}

/* Collection-card veil — strong dark gradient at bottom so cream text stays legible on light images */
.collection-veil {
  background:
    linear-gradient(to top, rgba(42,31,24,0.92) 0%, rgba(42,31,24,0.78) 22%, rgba(42,31,24,0.35) 50%, rgba(42,31,24,0) 78%);
  pointer-events: none;
}
.collection-card-text { text-shadow: 0 2px 16px rgba(0,0,0,0.55), 0 1px 2px rgba(0,0,0,0.4); }

/* ============================================================
   WooCommerce — brand-matched overrides
   ============================================================ */

/* Container used by woocommerce.php + shop/single wrappers */
.wbh-woo-wrap { max-width: 1380px; margin: 0 auto; padding: 3rem 1.5rem 6rem; }
@media (min-width:1024px){ .wbh-woo-wrap { padding: 4rem 2.5rem 7rem; } }

.woocommerce .wbh-page-head { margin-bottom: 2.5rem; }
.woocommerce .wbh-page-head h1 {
  font-family: 'Fraunces', serif; font-weight: 300;
  font-size: clamp(2.25rem, 5vw, 3.5rem); color: var(--cocoa-deep); line-height: 1.05;
}

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews, p.no-comments {
  background: var(--cream-light); border-top: 3px solid var(--gold);
  color: var(--cocoa-deep); border-radius: 2px;
  box-shadow: 0 12px 30px -20px rgba(60,42,32,.4);
}
.woocommerce-message a.button, .woocommerce-info a.button { background: var(--cocoa-deep); color: var(--cream-light); }

/* Shop archive grid uses our brand cards (content-product.php). Keep WooCommerce's list reset tidy */
.woocommerce ul.products, .woocommerce-page ul.products { display: grid; gap: 1.5rem 1.5rem; margin: 0; padding: 0; }
/* WooCommerce adds clearfix ::before/::after on ul.products — in a CSS grid these
   become grid items and occupy the first cells, pushing product #1 into column 2.
   Remove them so products fill from the first column. */
.woocommerce ul.products::before, .woocommerce ul.products::after,
.woocommerce-page ul.products::before, .woocommerce-page ul.products::after { content: none !important; display: none !important; }
@media (min-width:640px){ .woocommerce ul.products { grid-template-columns: repeat(2,1fr); } }
@media (min-width:1024px){ .woocommerce ul.products { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 3rem 1.5rem; } }
.woocommerce ul.products li.product { margin: 0 !important; width: auto !important; float: none !important; }
.woocommerce ul.products li.product::before { display:none; }

/* Brand buttons applied to WooCommerce buttons */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce #respond input#submit,
.woocommerce #place_order {
  background: var(--cocoa-deep); color: var(--cream-light);
  border-radius: 2px; font-size: 12px; letter-spacing: .18em; text-transform: uppercase;
  font-weight: 600; padding: .9em 1.6em; transition: background .3s ease, box-shadow .3s ease;
  box-shadow: 0 10px 24px -14px rgba(60,42,32,.55);
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover,
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce #place_order:hover {
  background: var(--ink); color: var(--cream-light);
}
.woocommerce a.button.wbh-gold, .woocommerce button.wbh-gold { background: var(--gold); color: var(--cocoa-deep); }

/* Price colour */
.woocommerce .price, .woocommerce div.product p.price, .woocommerce div.product span.price {
  color: var(--cocoa-deep); font-family: 'Fraunces', serif;
}
.woocommerce div.product p.price { font-size: 1.9rem; }
.woocommerce .price del { color: var(--taupe); opacity:.7; }
.woocommerce .price ins { text-decoration: none; }

/* Single product layout */
.woocommerce div.product { display: grid; gap: 2.5rem; }
@media (min-width:1024px){ .woocommerce div.product { grid-template-columns: 1fr 1fr; gap: 4rem; align-items: start; } }
.woocommerce div.product div.images { margin: 0; }
.woocommerce div.product div.images img { border-radius: 2px; box-shadow: 0 30px 80px -20px rgba(60,42,32,.35); }
.woocommerce div.product .product_title {
  font-family: 'Fraunces', serif; font-weight: 300; color: var(--cocoa-deep);
  font-size: clamp(2rem,4vw,3rem); line-height: 1.1; margin-top:.4rem;
}
.woocommerce div.product .woocommerce-product-details__short-description { color: var(--cocoa); font-weight: 300; font-size: 1.05rem; line-height: 1.7; }
.woocommerce div.product form.cart { margin-top: 1.5rem; display:flex; gap: 1rem; align-items:center; flex-wrap: wrap; }
.woocommerce div.product form.cart .quantity input.qty {
  height: 3rem; width: 4.5rem; border:1px solid var(--line); background: var(--cream-light);
  color: var(--cocoa-deep); text-align:center; font-family:'Fraunces',serif; font-size:1.1rem;
}
.woocommerce div.product form.cart .button { flex: 1 1 auto; padding: 1em 1.6em; }
.woocommerce .woocommerce-tabs ul.tabs { padding: 0; }
.woocommerce .woocommerce-tabs ul.tabs li { background: var(--cream-light); border-color: var(--line); border-radius: 2px 2px 0 0; }
.woocommerce .woocommerce-tabs ul.tabs li.active { background: transparent; border-bottom-color: transparent; }
.woocommerce div.product .woocommerce-tabs .panel h2 { font-family:'Fraunces',serif; font-weight:400; color:var(--cocoa-deep); }
.woocommerce span.onsale {
  background: var(--gold); color: var(--cocoa-deep); border-radius: 9999px;
  font-size: 11px; letter-spacing:.1em; text-transform: uppercase; min-height:auto; min-width:auto; padding:.4em .9em; line-height:1;
}
.woocommerce .star-rating span::before, .woocommerce p.stars a::before { color: var(--gold); }

/* Cart + checkout tables */
.woocommerce table.shop_table { border-color: var(--line); border-radius: 2px; background: var(--cream-light); }
.woocommerce table.shop_table th { color: var(--cocoa-deep); font-family:'Fraunces',serif; font-weight:500; }
.woocommerce-cart table.cart img { width: 72px; border-radius: 2px; }
.woocommerce .cart-collaterals .cart_totals, .woocommerce-checkout #order_review, .woocommerce-checkout #order_review_heading { }
.woocommerce #payment, .woocommerce-cart .cart-collaterals .cart_totals > h2 { }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea,
.woocommerce-checkout .input-text, .select2-container .select2-selection {
  border:1px solid var(--line); background: var(--cream-light); color: var(--cocoa-deep);
  border-radius: 4px; padding: .7em .9em;
}
.woocommerce .woocommerce-breadcrumb { color: var(--mocha); font-size:12px; letter-spacing:.14em; text-transform:uppercase; margin-bottom:1.5rem; }
.woocommerce .woocommerce-breadcrumb a { color: var(--mocha); }
.woocommerce .woocommerce-breadcrumb a:hover { color: var(--cocoa-deep); }

/* Mini cart inside the drawer */
.wbh-minicart .woocommerce-mini-cart__empty-message { color: var(--mocha); text-align:center; padding: 2rem 0; }
.wbh-minicart ul.cart_list { list-style:none; margin:0; padding:0; }
.wbh-minicart ul.cart_list li { display:flex; gap: .9rem; padding: 1rem 0; border-bottom:1px solid var(--line); position:relative; }
.wbh-minicart ul.cart_list li img { width: 64px !important; height:auto; float:none !important; border-radius:2px; }
.wbh-minicart ul.cart_list li a { color: var(--cocoa-deep); font-family:'Fraunces',serif; text-decoration:none; }
.wbh-minicart ul.cart_list li a.remove { position:absolute; top:1rem; right:0; color: var(--mocha) !important; font-size:1.1rem; }
.wbh-minicart .woocommerce-mini-cart__total { display:flex; justify-content:space-between; padding: 1rem 0; font-family:'Fraunces',serif; color:var(--cocoa-deep); font-size:1.1rem; border-bottom:1px solid var(--line); margin-bottom:1rem; }
.wbh-minicart .woocommerce-mini-cart__buttons { display:flex; flex-direction:column; gap:.6rem; }
.wbh-minicart .woocommerce-mini-cart__buttons .button { width:100%; text-align:center; }
.wbh-minicart .woocommerce-mini-cart__buttons .checkout { background: var(--gold); color: var(--cocoa-deep); }

/* Related products heading */
.woocommerce .related > h2, .woocommerce .upsells > h2 {
  font-family:'Fraunces',serif; font-weight:300; color:var(--cocoa-deep); font-size:2rem; margin-bottom:1.5rem;
}

/* Shop archive header title */
.woocommerce-products-header__title, .woocommerce .page-title {
  font-family:'Fraunces',serif; font-weight:300; color:var(--cocoa-deep);
  font-size: clamp(2.25rem,5vw,3.5rem); line-height:1.05; margin-bottom:.5rem;
}
.woocommerce .term-description, .woocommerce-products-header + .woocommerce-result-count,
.woocommerce .woocommerce-result-count { color: var(--mocha); font-weight:300; }
.woocommerce .woocommerce-ordering select {
  border:1px solid var(--line); background:var(--cream-light); color:var(--cocoa-deep);
  padding:.6em .8em; border-radius:4px;
}

/* Pagination (blog + shop) */
.woocommerce nav.woocommerce-pagination ul, .wp-block-query-pagination, .navigation .nav-links {
  display:flex; gap:.5rem; justify-content:center; border:0;
}
.woocommerce nav.woocommerce-pagination ul li { border:0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span,
.navigation .nav-links a, .navigation .nav-links span {
  display:inline-flex; align-items:center; justify-content:center; min-width:2.6rem; height:2.6rem;
  padding:0 .6rem; border:1px solid var(--line); background:var(--cream-light); color:var(--cocoa-deep);
  border-radius:2px; text-decoration:none; font-size:.9rem;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.navigation .nav-links span.current { background:var(--cocoa-deep); color:var(--cream-light); border-color:var(--cocoa-deep); }

/* Shop filter hide helper — independent of Tailwind load order, no !important
   so it never fights responsive show utilities like "hidden lg:flex". */
.wbh-hide { display: none; }

/* -------------------------------------------------------------------------
 * Single product — redesigned layout (chips + At a glance / Description /
 * Please note boxes), matching the brand product page. Self-contained CSS
 * (no reliance on compiled-Tailwind arbitrary classes).
 * ---------------------------------------------------------------------- */

/* Buy-box (summary) as a card, to match the product page */
.woocommerce div.product .summary.entry-summary {
	background: var(--cream-light);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 1.75rem;
}
@media (min-width:640px){ .woocommerce div.product .summary.entry-summary { padding: 2rem; } }

/* Spec chips under the short description */
.wbh-chips { display:flex; flex-wrap:wrap; gap:8px; margin:1.25rem 0 0; }
.wbh-chip { display:inline-flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--cream); padding:5px 11px; border-radius:9999px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--mocha); }
.wbh-chip :is(i, svg) { width:14px; height:14px; color:var(--gold); flex-shrink:0; }
.wbh-free-gift { display:flex; align-items:center; gap:9px; margin:1.25rem 0; padding:10px 12px; border:1px solid var(--line); border-radius:6px; background:var(--cream); color:var(--cocoa); font-size:12px; line-height:1.6; }
.wbh-free-gift :is(i, svg) { display:block; width:17px; height:17px; flex:0 0 17px; color:var(--gold); stroke-width:1.6; }

/* Necklace description follows the price; every specification gets an icon pill. */
.wbh-necklace-summary { margin:1rem 0 1.75rem; }
.wbh-necklace-description { color:var(--cocoa); font-size:15px; line-height:1.8; }
.wbh-necklace-description > :first-child { margin-top:0; }
.wbh-necklace-description > :last-child { margin-bottom:0; }
.wbh-necklace-features { margin-top:1.5rem; }
.wbh-necklace-features-label { margin:0 0 .75rem; color:var(--mocha); font-size:10px; font-weight:500; letter-spacing:.18em; text-transform:uppercase; }
.woocommerce div.product .wbh-necklace-pills { display:flex; flex-wrap:wrap; gap:9px; list-style:none; margin:0; padding:0; }
.woocommerce div.product .wbh-necklace-pill { display:inline-flex; align-items:center; gap:8px; max-width:100%; margin:0; padding:9px 12px; border:1px solid var(--line); border-radius:999px; background:var(--cream); color:var(--cocoa-deep); font-size:12px; font-weight:400; line-height:1.5; }
.wbh-necklace-pill :is(i, svg) { display:block; width:17px; height:17px; flex:0 0 17px; color:var(--gold); stroke-width:1.6; }
.wbh-necklace-pill > span { min-width:0; overflow-wrap:anywhere; }
.wbh-necklace-purchase-note { margin:1rem 0 0; color:var(--mocha); font-size:12px; line-height:1.65; }
@media (max-width:479px) {
  .woocommerce div.product .wbh-necklace-pills { gap:8px; }
  .woocommerce div.product .wbh-necklace-pill { padding:8px 10px; }
}

/* Details grid: At a glance (left) + Description / Please note (right) */
.wbh-details { display:grid; gap:2rem; margin-top:3rem; }
@media (min-width:1024px){ .wbh-details { grid-template-columns:340px 1fr; align-items:start; } }
.wbh-glance, .wbh-box { background:var(--cream-light); border:1px solid var(--line); border-radius:14px; padding:1.5rem; }
@media (min-width:640px){ .wbh-box { padding:2rem; } }
.wbh-box + .wbh-box { margin-top:1.5rem; }
.wbh-glance-label { font-size:10px; letter-spacing:.3em; text-transform:uppercase; color:var(--mocha); margin-bottom:.5rem; }
.wbh-box-label { font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--mocha); margin-bottom:1rem; display:flex; align-items:center; gap:.5rem; }
.wbh-box-label :is(i, svg) { width:14px; height:14px; color:var(--gold); flex-shrink:0; }
.wbh-glance-label { display:flex; align-items:center; gap:.5rem; }
.wbh-glance-label :is(i, svg) { width:14px; height:14px; color:var(--gold); flex-shrink:0; }
.wbh-spec-with-icon { display:flex; align-items:flex-start; gap:12px; min-width:0; }
.wbh-spec-with-icon :is(i, svg) { width:19px; height:19px; flex:0 0 19px; color:var(--gold); stroke-width:1.5; margin-top:1px; }
.wbh-spec-with-icon > span { min-width:0; overflow-wrap:anywhere; }
.wbh-spec-row { display:flex; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid var(--line); }
.wbh-spec-row:last-child { border-bottom:0; }
.wbh-spec-k { color:var(--mocha); font-size:12px; letter-spacing:.14em; text-transform:uppercase; }
.wbh-spec-v { color:var(--cocoa-deep); font-size:14px; text-align:right; font-weight:500; }
.wbh-spec-full { color:var(--cocoa); font-size:14px; }
.wbh-box p { color:var(--cocoa); line-height:1.75; font-weight:300; }
.wbh-box.wbh-desc p { font-size:1.125rem; }

/* Fix: WooCommerce's default .images/.summary width:48% + float shrinks them to
   half of their grid column. Force them to fill their 2-col grid cells. */
.woocommerce div.product div.images,
.woocommerce div.product div.summary.entry-summary,
.woocommerce div.product div.summary {
	width: 100% !important;
	float: none !important;
	margin: 0;
}
.woocommerce div.product div.images img { width: 100%; height: auto; }

/* Fix: everything after the image+summary (details boxes, related products,
   upsells, tabs, notices) must span the full width of the 2-col product grid
   instead of being placed as half-width grid items. */
.woocommerce div.product > *:not(.images):not(.summary) {
	grid-column: 1 / -1;
}
.woocommerce div.product .related.products,
.woocommerce div.product .up-sells { margin-top: 3rem; }

/* Related products — minimal "More <Category>" grid (matches brand product page) */
.wbh-related { margin-top: 3.5rem; }
.wbh-related-head { display:flex; align-items:center; gap:14px; margin-bottom:2rem; color:var(--taupe); }
.wbh-related-line { width:60px; height:1px; background:var(--taupe); opacity:.5; }
.wbh-related-title { font-size:12px; letter-spacing:.3em; text-transform:uppercase; }
.wbh-related-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:2rem 1.5rem; }
@media (min-width:1024px){ .wbh-related-grid { grid-template-columns:repeat(4,1fr); gap:2.5rem 1.75rem; } }
.wbh-related-card { display:block; }
.wbh-related-imgwrap { aspect-ratio:4/5; background:var(--cream-deep); border-radius:2px; overflow:hidden; box-shadow:0 2px 14px -10px rgba(60,42,32,.25); transition:box-shadow .55s cubic-bezier(.2,.8,.2,1); }
.wbh-related-card:hover .wbh-related-imgwrap { box-shadow:0 26px 50px -22px rgba(60,42,32,.45); }
.wbh-related-imgwrap img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .9s cubic-bezier(.2,.8,.2,1); }
.wbh-related-card:hover .wbh-related-imgwrap img { transform:scale(1.06); }
.wbh-related-name { font-family:'Fraunces',serif; font-weight:400; color:var(--cocoa-deep); font-size:1.15rem; line-height:1.3; margin-top:1rem; }
.wbh-related-price { font-family:'Fraunces',serif; color:var(--cocoa-deep); font-size:1.15rem; margin-top:.5rem; }

/* Header cart button + count badge (explicit positioning — not Tailwind-dependent) */
.wbh-cart-btn { position: relative; display: inline-flex; align-items: center; }
.site-header .wbh-cart-count {
	position: absolute; top: -7px; right: -9px;
	min-width: 18px; height: 18px; padding: 0 4px;
	background: var(--cocoa-deep); color: var(--cream-light);
	font-size: 10px; font-weight: 600; line-height: 1;
	border-radius: 9999px;
	display: flex; align-items: center; justify-content: center;
	font-variant-numeric: tabular-nums;
}
