/** Shopify CDN: Minification failed

Line 543:0 Unexpected "}"

**/
/* =========================================================
   AH-RIN – Wishlist / Compare / Share + Pearl styling
   For Dawn product cards
   ======================================================= */



/* =========================================================
   1) Wishlist / Compare / Share bar (under image)
   ======================================================= */

/* include .ahrin-wc-buttons so both classes behave identically */
.ahrin-wc-bar,
.ahrin-wc-buttons{
  display:flex;
  gap:var(--arin-gap);
  align-items:center;
  justify-content:flex-start;
  margin:.8rem 0 .9rem;
  position:relative;   /* keeps row above stretched link pseudo */
  z-index:3;
}

.wc-btn{
  inline-size:36px;
  block-size:36px;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:1px solid rgba(17,17,17,.12);
  background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
  cursor:pointer;
  position:relative;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background-color .16s ease, color .16s ease;
  color:var(--arin-ink);
}
.wc-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 14px rgba(0,0,0,.10); }
.wc-btn:active{ transform:translateY(0); }

.wc-btn svg{ width:18px; height:18px; stroke:currentColor; fill:none; }

.wc-btn[aria-pressed="true"],
.wc-btn.is-active{
  background:rgba(197,167,105,.12);
  border-color:rgba(197,167,105,.45);
  color:var(--arin-brand);
}
.wc-btn[aria-pressed="true"] svg{ fill:currentColor; stroke:currentColor; }

/* tooltip sourced from aria-label */
.wc-btn::after{
  content:attr(aria-label);
  position:absolute;
  bottom:100%; left:50%;
  transform:translate(-50%,-6px);
  pointer-events:none;
  background:rgba(17,17,17,.9);
  color:#fff; font-size:12px; line-height:1;
  padding:6px 8px; border-radius:6px;
  opacity:0; white-space:nowrap;
  transition:opacity .12s ease, transform .12s ease;
}
.wc-btn::before{
  content:"";
  position:absolute;
  bottom:calc(100% - 4px); left:50%;
  transform:translateX(-50%) rotate(45deg);
  width:8px; height:8px;
  background:rgba(17,17,17,.9);
  opacity:0; transition:opacity .12s ease;
}
.wc-btn:hover::after, .wc-btn:hover::before{ opacity:1; }

@media (hover:none){ .wc-btn::after,.wc-btn::before{ display:none; } }
@media (max-width:749px){
  .ahrin-wc-bar, .ahrin-wc-buttons{ gap:8px; }
  .wc-btn{ inline-size:34px; block-size:34px; border-radius:8px; }
}

/* =========================================================
   Stretched link behaviour (image/title should be clickable)
   ======================================================= */

/* Default: keep Dawn's stretched link active so the card is clickable */
  /* Let the stretched link sit above the image (but below our WC row/badges) */

/*----
  .card-wrapper .full-unstyled-link::after{
  pointer-events:auto;
  z-index:2;
}
---*/

/* Only while hovering our WC row, prevent the link overlay from stealing clicks */
@supports selector(:has(*)) {
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link::after {
    pointer-events:none;
  }
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link {
    pointer-events:none;
  }
}

/* Ensure our row sits above the stretched link */
.card__information { position: relative; }
.ahrin-wc-bar .wc-btn, .ahrin-wc-buttons .wc-btn{ pointer-events:auto; }

/* =========================================================
   2) Dock (drawer) item layout
   ======================================================= */
.ahrin-dock__content{ padding:20px; }
.dock-section + .dock-section{ margin-top:24px; }
.dock-section h3{ font-size:16px; margin:0 0 12px; }

.dock-list{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.dock-item{
  display:grid;
  grid-template-columns:56px 1fr auto;
  align-items:center;
  gap:12px;
  padding:10px;
  border:1px solid rgba(17,17,17,.08);
  border-radius:10px;
  background:#fff;
}
.dock-thumb{ width:56px; height:56px; border-radius:8px; overflow:hidden; background:#f7f7f7; }
.dock-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.dock-meta{ min-width:0; }
.dock-title{ display:block; color:inherit; text-decoration:none; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dock-price{ font-size:12px; opacity:.7; margin-top:2px; }
.dock-remove{
  inline-size:32px; block-size:32px; border-radius:8px; border:1px solid rgba(17,17,17,.1);
  background:#fff; cursor:pointer;
}
.dock-empty{ opacity:.7; font-size:14px; margin:8px 0 0; }

/* =========================================================
   3) Header heart icon sizing (keeps proportions)
   ======================================================= */
.ahrin-header-wishlist{ display:inline-flex; align-items:center; padding:0 .25rem; }
.ahrin-header-wishlist svg{ width:22px; height:22px; display:block; }
.header__icons .ahrin-header-wishlist{ line-height:1; }

/* =========================================================
   4) Pearl badges on product cards (inside .card__inner)
   ======================================================= */

.card__badge{
  position:absolute;
  top:12px; left:12px;
  right:auto; bottom:auto;
  display:flex; flex-direction:column; gap:10px;
  z-index:5;
  pointer-events:none; /* hover on image still works */
}

.badge.badge--pearl{
  position:relative;
  width:var(--pearl-size);
  height:var(--pearl-size);
  border:0 !important;
  padding:0 !important;
  background:transparent !important;
  border-radius:9999px;
  display:inline-block;
  color:#111; /* used for % text */
  line-height:1;
  text-transform:none;
  overflow:visible;
}

.badge.badge--pearl::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  opacity:var(--pearl-opacity);
  pointer-events:none;
}

/* Map each state to the correct image */
.badge--pearl--soldout::before{ background-image:var(--pearl-soldout-url); }
.badge--pearl--sale::before   { background-image:var(--pearl-sale-url); }
.badge--pearl--new::before    { background-image:var(--pearl-new-url); }

/* %OFF text for sale pearl (centered) */
.badge--pearl--sale .percent{
  position:absolute;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  font-size:12px; font-weight:700; letter-spacing:.3px;
  color:#111; opacity:.95;
  z-index:1;
}

/* Hide visible words for sold out/new (kept for SR) */
.badge--pearl--soldout,
.badge--pearl--new{
  text-indent:-9999px; white-space:nowrap; overflow:hidden;
}

/* If Dawn also renders its default rectangle badge, hide it */
.card__badge .badge:not(.badge--pearl){ display:none; }

/* Safety: ensure card is a positioned ancestor (most Dawn versions already are) */
.card-wrapper .card{ position:relative; }

/* =========================================================
   5) FAB (floating action button) pearl
   ======================================================= */
.ahrin-fab{
  position:fixed;
  right:var(--fab-right,18px);
  bottom:var(--fab-bottom,18px);
  width:56px; height:56px;
  border:0; outline:none;
  border-radius:9999px;
  background:transparent !important;
  box-shadow:0 6px 18px rgba(0,0,0,.18);
  isolation:isolate;
  z-index:9999;
  touch-action: manipulation;            /* NEW: better tap behavior */
  -webkit-tap-highlight-color: transparent; /* NEW: cleaner mobile tap */
}
.ahrin-fab::before{
  content:"";
  position:absolute; inset:0;
  border-radius:inherit;
  background-image:var(--pearl-fab-url);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  opacity:var(--pearl-opacity);
  pointer-events:none;
}
/* Counter badge sits on top */
.ahrin-fab_badge,
.ahrin-fab__badge{
  position:absolute;
  right:-6px; top:-6px;
  min-width:22px; height:22px;
  padding:0 6px; border-radius:9999px;
  background:#111; color:#fff;
  font-size:12px; line-height:22px; text-align:center;
  box-shadow:0 2px 8px rgba(0,0,0,.25);
  z-index:2;
}

/* =========================================================
   6) Full-page Wishlist/Compare simple grid
   ======================================================= */
.ahrin-list-grid{
  display:grid; gap:16px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (min-width: 750px){ .ahrin-list-grid{ grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (min-width: 990px){ .ahrin-list-grid{ grid-template-columns: repeat(4, minmax(0,1fr)); } }

.ahrin-grid-card{
  background:#fff; border:1px solid rgba(0,0,0,.08);
  border-radius:14px; overflow:hidden;
  display:flex; flex-direction:column;
}
.ahrin-grid-card__img img{ width:100%; height:auto; display:block; }
.ahrin-grid-card__body{ padding:12px; display:flex; gap:8px; flex-direction:column; }
.ahrin-grid-card__title{ font-weight:600; text-decoration:none; color:inherit; }
.ahrin-grid-card__price{ display:flex; gap:8px; align-items:baseline; }
.ahrin-grid-card__price s{ opacity:.6; font-size:.9em; }
.ahrin-grid-card__actions{ margin-top:6px; }
.ahrin-remove{
  border:1px solid rgba(0,0,0,.12); background:#fff;
  border-radius:8px; padding:6px 10px; cursor:pointer;
}
.ahrin-list-empty{ opacity:.7; margin-top:20px; }

/* --- Make sure the badge rail overlays the image area --- */
.card__inner { position: relative; }
.card__inner > .card__badge{
  position: absolute !important;
  display: flex !important;
  flex-direction: column;
  gap: 10px;
  top: 12px;
  left: 12px;
  z-index: 25 !important;
  pointer-events: none;
}
.card__inner > .card__badge .badge--pearl { pointer-events: auto; }

/* Kill any default badge background/border Dawn may add */
.card__badge .badge{ background: transparent !important; border: 0 !important; }

/* If your Dawn version hides an empty badge rail, keep it visible when not empty */
.card__badge:not(:empty){ display: flex !important; }

/* == AH-RIN Pearl text + hard reset (no borders/halos) ================== */
:root{
  --pearl-label-color: #111;
  --pearl-label-weight: 700;
}
.card__badge .badge--pearl,
.ahrin-fab{
  background: transparent !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}
.card__badge .badge--pearl{ padding: 0 !important; line-height: 0; font-size: 0; }
.badge--pearl::before{ border-radius: 9999px; }

/* keep the rail above images/hover buttons just in case */
.card__inner{ position: relative; }
.card__inner > .card__badge{ z-index: 25 !important; }

/* SALE: center % + “OFF” */
.badge--pearl--sale .percent{
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  font-weight: var(--pearl-label-weight);
  font-size: 12px; line-height: 1;
  color: var(--pearl-label-color);
  text-indent: 0;
}
.badge--pearl--sale .percent::after{
  content: " OFF";
  font-size: 10px;
  font-weight: var(--pearl-label-weight);
  letter-spacing: .3px;
}

/* NEW / SOLD OUT labels (centered) */
.badge--pearl--new::after,
.badge--pearl--soldout::after{
  content: "";
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%,-50%);
  font-weight: var(--pearl-label-weight);
  line-height: 1;
  color: var(--pearl-label-color);
  letter-spacing: .3px;
}
.badge--pearl--new::after{ content: "NEW"; font-size: 11px; }
.badge--pearl--soldout::after{ content: "SOLD OUT"; font-size: 9.5px; }

/* Hide pearls when the card is text-only (no product image) */
.card--text .card__badge { display: none !important; }

/* keep consistent on all cards */
.card__heading,
.card__heading a { color:inherit; }

/* Nudge the looks via CSS filters (keeps icons exactly where they are) */
.badge--pearl--new::before     { filter: saturate(1.1) hue-rotate(6deg); }
.badge--pearl--soldout::before { filter: grayscale(.25) brightness(.96); }

/* ===== AHRIN — tiny compatibility shim ===== */

/* Fallback visuals for any [data-wc] buttons that DON'T use .wc-btn */
[data-wc]:not(.wc-btn){
  -webkit-appearance:none; appearance:none;
  inline-size:36px; block-size:36px;
  display:inline-grid; place-items:center;
  border-radius:10px;
  border:1px solid rgba(17,17,17,.12);
  background:#fff; color:inherit; line-height:1;
  cursor:pointer; transition:background .2s, border-color .2s, transform .05s;
}
[data-wc]:not(.wc-btn) svg{ width:18px; height:18px; display:block; }
[data-wc]:not(.wc-btn).is-active,
[data-wc]:not(.wc-btn)[aria-pressed="true"]{
  --ahrin-accent: var(--arin-brand, #C5A769);
  background:var(--ahrin-accent);
  border-color:var(--ahrin-accent);
  color:#fff;
}

/* FAB badge truly hides when [hidden] */
.ahrin-fab__badge[hidden]{ display:none !important; }
[data-fab-badge]:not([hidden]){ display:inline-block !important; }

/* Dock polish – safe no-ops if already defined */
.ahrin-dock__panel{ max-width:420px; }
.ahrin-dock__content{ -webkit-overflow-scrolling:touch; }

/* Dock header ghost button when disabled */
.ahrin-ghost-btn[disabled],
.ahrin-ghost-btn[aria-disabled="true"]{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
}


/* === AHRIN: Dock slide/fade animation ====================== */

/* Prevent page scroll while dock is open (JS toggles the class) */
html.dock-open,
body.dock-open { overflow: hidden; }

/* The overlay container */
#ahrin-dock{
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;              /* off when closed */
}

/* Backdrop */
#ahrin-dock::before{
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.38);
  opacity: 0;
  transition: opacity .25s ease;
}

/* Panel (drawer) */
#ahrin-dock .ahrin-dock__panel{
  position: absolute;
  right: 0; top: 0;
  height: 100%;
  width: min(92vw, 420px);           /* responsive but capped */
  background: #fff;
  transform: translateX(100%);       /* start off-screen to the right */
  transition: transform .28s ease;
  box-shadow: -20px 0 40px rgba(0,0,0,.18);
  display: flex;
  flex-direction: column;
}

/* When open (JS sets aria-hidden="false") */
#ahrin-dock[aria-hidden="false"]{
  pointer-events: auto;              /* allow clicks */
}

#ahrin-dock[aria-hidden="false"]::before{ opacity: 1; }
#ahrin-dock[aria-hidden="false"] .ahrin-dock__panel{
  transform: translateX(0);
}

/* --- AHRIN: tiny UI styles for dock header & inline actions --- */

/* Re-usable light button (used by “Clear all”, etc.) */
.ahrin-ghost-btn{
  -webkit-appearance:none; appearance:none;
  border:1px solid rgba(17,17,17,.22);
  background:#fff;
  color:inherit;
  font-size:12px; line-height:1;
  padding:6px 10px;
  border-radius:8px;
  cursor:pointer;
  transition:box-shadow .15s ease, border-color .15s ease, background-color .15s ease;
}
.ahrin-ghost-btn:hover{
  border-color:rgba(17,17,17,.36);
  box-shadow:0 1px 6px rgba(0,0,0,.08);
}
.ahrin-ghost-btn:disabled{ opacity:.6; cursor:not-allowed; }

/* Inline actions container inside each dock line (if present) */
.ahrin-line__actions{ display:flex; align-items:center; gap:8px; margin-left:auto; }

/* “Add” button inside the dock (we target [data-add]) */
[data-add]{
  -webkit-appearance:none; appearance:none;
  border:1px solid rgba(17,17,17,.22);
  background:#111; color:#fff;
  font-size:12px; line-height:1;
  padding:6px 10px;
  border-radius:8px;
  cursor:pointer;
  transition:opacity .15s ease, box-shadow .15s ease, transform .05s ease;
}
[data-add]:hover{ box-shadow:0 1px 8px rgba(0,0,0,.18); }
[data-add]:active{ transform:translateY(1px); }
[data-add]:disabled{ opacity:.6; cursor:not-allowed; }

/* Small busy spinner when JS adds .is-busy on [data-add] */
[data-add].is-busy::after{
  content:"";
  display:inline-block;
  width:14px; height:14px; margin-left:6px;
  vertical-align:-2px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.6);
  border-top-color:transparent;
  animation:ahrin-spin .8s linear infinite;
}

/* Spinner keyframes */
@keyframes ahrin-spin { to { transform: rotate(360deg); } }



/* Backdrop covers the viewport and receives clicks */
#ahrin-dock[aria-hidden="false"]{
  position: fixed;
  inset: 0;
  z-index: 9998;                 /* below FAB (9999) but above page */
  background: rgba(0,0,0,.28);   /* subtle scrim */
}

/* Panel sits above the backdrop */
#ahrin-dock .ahrin-dock__panel{
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: min(420px, 92vw);
  background: #fff;
  z-index: 1;                    /* above scrim surface */
  box-shadow: -12px 0 30px rgba(0,0,0,.18);
}


/* Let long titles wrap to 2 lines inside the dock items */
.dock-title{
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; white-space:normal;
}


/* AHRIN: make the image area clickable again except while hovering our WC row */
/*

.card-wrapper .full-unstyled-link::after{
  pointer-events: auto !important;
  z-index: 2;               /* sits under our WC row (z-index: 3) and below pearls */

}
*/

/* When hovering the wishlist/compare row, temporarily disable stretched link */
@supports selector(:has(*)) {
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link::after { 
    pointer-events: none !important; 
  }
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link { 
    pointer-events: none !important; 
  }
}


/* === AHRIN: restore card image click + keep WC row priority =============== */

/* Make sure the stretched-link overlay exists and can receive clicks */
.card__inner{ position: relative !important; }

.card-wrapper .full-unstyled-link{
  position: static !important;
  display: block !important;
}

.card-wrapper .full-unstyled-link::after{
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;                 /* stretch over the media area */
  pointer-events: auto !important;     /* <<< let clicks reach the link */
  z-index: 2 !important;               /* under pearls (25) & under WC row (3) */
}

/* While hovering our wishlist/compare row, disable the stretched link */
@supports selector(:has(*)){
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link,
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link::after{
    pointer-events: none !important;
  }
}

/* === AHRIN: ensure pearl labels render even if earlier rules hid text ===== */
.badge--pearl--soldout,
.badge--pearl--new{ text-indent: 0 !important; }

.badge--pearl--soldout::after{
  content: "SOLD OUT" !important;
  font-weight: 700; font-size: 9.5px;
}
.badge--pearl--new::after{
  content: "NEW" !important;
  font-weight: 700; font-size: 11px;
}

/* Guarantee the correct pearl images */
.badge--pearl--soldout::before{ background-image: var(--pearl-soldout-url) !important; }
.badge--pearl--new::before   { background-image: var(--pearl-new-url)     !important; }


/* === AH-RIN: FINAL FIX — make product image clickable ================== */
/* Give the overlay a reliable positioning context */
.card-wrapper{ position: relative !important; }

/* Stretch the link over the whole card (above media, below our WC row & pearls) */
.card-wrapper .full-unstyled-link::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  pointer-events:auto !important;   /* LET clicks reach the link */
  z-index:20 !important;            /* above image/hover media */
}

/* Keep our wishlist/compare row and pearls on top of the overlay */
.ahrin-wc-bar,
.ahrin-wc-buttons{ position:relative !important; z-index:30 !important; }
.card__inner > .card__badge{ z-index:40 !important; }

/* While hovering our WC row, temporarily disable the stretched link overlay */
@supports selector(:has(*)){
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link,
  .card-wrapper:has(.ahrin-wc-buttons:hover, .ahrin-wc-bar:hover) .full-unstyled-link::after{
    pointer-events:none !important;
  }
}


/* Lock the page when the dock is open */
html.ahrin-dock-open, body.ahrin-dock-open { overflow: hidden !important; }


/* === AHRIN: nav (menu) counters for Wishlist/Compare === */
.ahrin-navcount{
  display:inline-block;
  vertical-align: text-top;
  margin-left:.4rem;
  min-width:16px; height:16px;
  padding:0 5px;
  border-radius:999px;
  background:#111; color:#fff;
  font:600 11px/16px var(--font-body-family, system-ui);
  text-align:center;
  box-shadow:0 2px 6px rgba(0,0,0,.2);
}

/* AHRIN: lock page scroll when dock is open */
html.dock-open, body.dock-open { overflow: hidden; }

/* Lock page scrolling while the dock is open */
html.dock-open,
body.dock-open { overflow: hidden; }


/* === AHRIN: clear, accessible focus rings =================== */

/* Wishlist / Compare / Share buttons under cards */
.wc-btn:focus-visible,
[data-wc]:not(.wc-btn):focus-visible{
  outline: 2px solid rgba(197,167,105,.9); /* gold */
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(197,167,105,.18);
}

/* “Ghost” buttons we added (Clear all, header links, etc.) */
.ahrin-ghost-btn:focus-visible{
  outline: 2px solid rgba(17,17,17,.85);
  outline-offset: 2px;
}

/* Dock item remove button */
.ahrin-line__rm:focus-visible{
  outline: 2px solid rgba(197,167,105,.9);
  outline-offset: 2px;
}

/* The floating FAB */
.ahrin-fab:focus-visible{
  outline: 3px solid rgba(197,167,105,.95);
  outline-offset: 3px;
}

/* Make sure focus rings only show when keyboard is used */
:focus{ outline: none; }

/* While cart row is updating */
.cart-item.is-busy,
tr.cart-item.is-busy,
[data-cart-line].is-busy { opacity: .6; pointer-events: none; }

@media (max-width: 749px){
  .card__inner > .card__badge{
    top: 8px !important;
    left: 8px !important;
    right: auto !important;
  }
  .badge.badge--pearl{
    width: 48px !important;
    height: 48px !important;
  }
}

/* === AH-RIN: force FAB pearl image on mobile (no tint/filters) =========== */
@media (max-width: 749px){
  .ahrin-fab{ 
    background: transparent !important; 
  }
  .ahrin-fab::before{
    background-image: var(--pearl-fab-url) !important;
    background-size: cover !important;
    background-position: center !important;
    filter: none !important;
    opacity: var(--pearl-opacity) !important; /* keep your chosen global opacity */
  }
}

/* Force pearl art on the W&C FAB only */
.ahrin-fab,
.ahrin-fab::before{
  background-image: var(--pearl-fab-url) !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  background-color: transparent !important;
}

/* Mobile: align FAB height with Brands pearl */
@media (max-width: 749px){
  .ahrin-fab{
    bottom: var(--fab-bottom,18px) !important;
    right:  var(--fab-right,18px) !important;
  }
}









/* 1) Kill any mobile tint/mask and force the pearl art on the W&C FAB */
.ahrin-fab::before{
  /* nuke recolors coming from ahrin-fab.css */
  background: none !important;
  -webkit-mask: none !important;
  mask: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;

  /* enforce our pearl */
  content: "" !important;
  background-image: var(--pearl-fab-url) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  opacity: var(--pearl-opacity) !important;
}

/* 2) Align the W&C pearl baseline on mobile */
@media (max-width: 749px){
  .ahrin-fab{
    bottom: var(--fab-bottom, 18px) !important;
    right:  var(--fab-right, 18px) !important;
  }
}





/* highest specificity fallback */
.ahrin-fab.ahrin-fab::before{
  background-image: var(--pearl-fab-url) !important;
}






@media (max-width: 749px){
  html body .ahrin-fab::before{
    content:""!important;
    background-image: var(--pearl-fab-url) !important;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    -webkit-mask: none !important;
    mask: none !important;
    filter: none !important;
    mix-blend-mode: normal !important;
    opacity: var(--pearl-opacity) !important;
  }
}






/* Force the W&C FAB to use the pearl image with no tint (desktop + mobile) */
[id^="ahrin-fab"], .ahrin-fab{
  background: transparent !important;            /* kill any background fill */
  box-shadow: 0 6px 18px rgba(0,0,0,.18);        /* keep soft drop shadow */
  border: 0 !important;
  border-radius: 9999px;
  position: fixed;                                /* already set, but safe */
}

[id^="ahrin-fab"]::before,
.ahrin-fab::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: var(--pearl-fab-url) !important;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: var(--pearl-opacity) !important;
  pointer-events: none;
}

/* Make sure it sits on the same baseline as the Brands pearl on small screens */
@media (max-width: 749px){
  [id^="ahrin-fab"], .ahrin-fab{ bottom: 18px !important; }
}



/* === AH-RIN: FINAL OVERRIDE — W&C FAB (size, label, color) === */
.ahrin-fab{
  --fab-size: 88px;                 /* desktop size */
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 60;
  width: var(--fab-size);
  height: var(--fab-size);
  border: 0;
  border-radius: 9999px;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0;
  isolation: isolate;
}

/* Use the gold/creamy pearl everywhere (desktop + mobile) */
.ahrin-fab::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background-image: var(--pearl-fab-url) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  opacity: var(--pearl-opacity) !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  pointer-events: none;
}

/* Always draw the label (no data-attribute needed) */
.ahrin-fab::after{
  content: "W&C";
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-weight: 800;
  letter-spacing: .14em;
  font-size: 12px;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.55);
  pointer-events: none;
}

/* Phone size to match the Brands pearl */
@media (max-width: 749px){
  .ahrin-fab{
    --fab-size: 72px;               /* mobile size */
    right: 12px;
    bottom: 12px;
  }
}


@media (max-width: 749px){
  .ahrin-fab::before{
    background-image: var(--arin-fab-img) !important;
    mix-blend-mode: normal !important;
    filter: none !important;
    opacity: var(--pearl-opacity, .70) !important;
  }
}







/* Generic clamp for dock items so images aren't huge */
#ahrin-dock .dock-list{ display:grid; gap:12px; }
#ahrin-dock .dock-item{
  display:grid; grid-template-columns:64px 1fr auto; gap:12px; align-items:center;
}



#ahrin-dock .dock-thumb{ width:64px; height:64px; border-radius:8px; overflow:hidden; background:#f6f6f6; }
#ahrin-dock .dock-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }



/* Safety net if markup differs */
#ahrin-dock .ahrin-dock__panel li img{ width:64px !important; height:64px !important; object-fit:cover !important; }


/* === Size: make Brands pearl match W&C === */
.brand-dock-launcher{
  width: 107px !important;
  height: 107px !important;
  border-radius: 50% !important;
}

@media (max-width: 749px){
  .brand-dock-launcher{
    width: 72px !important;
    height: 72px !important;
  }
}









/* === Dock: tame oversized product images === */
/* Keep this generic + strong so it wins against inline/third-party styles */
#ahrin-dock .ahrin-dock__panel img{
  width: 40% !important;         /* ~40% of the panel; adjust if needed */
  max-width: 160px !important;   /* hard cap so desktops don’t blow up */
  height: auto !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* Optional: give each line a tidy layout when big cards are injected */
#ahrin-dock .ahrin-dock__panel .dock-item,
#ahrin-dock .ahrin-dock__panel .wishlist-item,
#ahrin-dock .ahrin-dock__panel .compare-item{
  display: grid !important;
  grid-template-columns: 120px 1fr auto !important;
  gap: 12px !important;
  align-items: center !important;
}











/* Ensure WC buttons are always above the stretched-link overlay */
.card-wrapper .full-unstyled-link::after { z-index: 2 !important; }
.ahrin-wc-buttons, .ahrin-wc-bar { position: relative; z-index: 3 !important; }
.ahrin-wc-buttons .wc-btn, .ahrin-wc-bar .wc-btn { pointer-events: auto !important; }




/* Wishlist/Compare dedicated pages */
.ahrin-list-grid .ahrin-grid-card__img img,
#arin-wishlist-grid .ahrin-grid-card__img img,
#arin-compare-grid  .ahrin-grid-card__img img{
  max-width: 60% !important;   /* ≈40% smaller */
  height: auto !important;
  margin: 0 auto !important;
  display: block;
}

@media (max-width: 749px){
  .ahrin-list-grid .ahrin-grid-card__img img,
  #arin-wishlist-grid .ahrin-grid-card__img img,
  #arin-compare-grid  .ahrin-grid-card__img img{
    max-width: 55% !important;
  }
}





/* Nav badge bubble (works for adapter + fallback classes) */
.header a .arin-badge,
.header a .arin-nav-count,
.header a .wc-count,
.header a sup.nav-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-left:6px;
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  background:var(--arin-brand, #C5A769);
  color:#fff;
  font-size:11px;
  font-weight:600;
  line-height:18px;
  text-decoration:none;
  pointer-events:none; /* keep hover underline only on the label */
}









/* Toolbar above Wishlist / Compare grids */
.arin-list-toolbar{
  display:flex; gap:12px; flex-wrap:wrap; align-items:center;
  margin: 8px 0 16px;
}

/* Brandy buttons that match your gold + rounded look */
.arin-btn{
  appearance:none; border:1px solid var(--arin-brand, #C5A769);
  background:#fff; color:var(--arin-ink, #111);
  padding:.7rem 1.2rem; border-radius:999px; font-size:1.4rem; line-height:1;
  cursor:pointer; transition:background .15s ease, color .15s ease, transform .05s ease;
}
.arin-btn:hover{ background:var(--arin-brand, #C5A769); color:#fff; }
.arin-btn:active{ transform:translateY(1px); }
.arin-btn[disabled]{ opacity:.5; cursor:not-allowed; }

.arin-btn--primary{ background:var(--arin-brand, #C5A769); color:#fff; }
.arin-btn--primary:hover{ filter:brightness(.95); }

.arin-btn--sm{ font-size:1.3rem; padding:.5rem 1.0rem; }

/* Make sure per-card button lines up nicely on mobile */
#arin-wishlist-grid .arin-add, #arin-compare-grid .arin-add{
  margin-top:8px; display:inline-flex;
}