/* ============================================================
   CPP COURTYARD OVERLAY — cpp_courtyard.css
   v1.0.0 · Built from the client-APPROVED mockup
   ("courtyard site mockup - approved.html": skin C warm-editorial
   tokens + Look-A home/category structure).
   The mockup is the SPEC. Tokens ported verbatim. Deviations are
   logged in BUILD-NOTES.md (DEVIATION LEDGER).
   Loads AFTER all stock styles via layout/theme.liquid hook.
   Kill switch: remove the 2 include lines in theme.liquid.
   ============================================================ */


/* ---------- 1 · Tokens (mockup :root — verbatim) ---------- */
:root{
  --cpc-bg:#f8f5ef; --cpc-surface:#ffffff; --cpc-surface2:#efe9dd;
  --cpc-text:#1e1e24; --cpc-muted:#7a7468; --cpc-line:#e3ddd0;
  --cpc-accent:#2f5bf9; --cpc-gold:#9c7f36;
  --cpc-btn-bg:#1e1e24; --cpc-btn-text:#fdfcf9;
  --cpc-btn-radius:999px; --cpc-card-radius:14px; --cpc-chip-radius:999px;
  --cpc-head-font:'Inter',Helvetica,Arial,sans-serif; --cpc-head-weight:600; --cpc-head-spacing:-0.01em;
  --cpc-header-bg:#f8f5ef; --cpc-announce-bg:#1e1e24; --cpc-announce-text:#f8f5ef;
  --cpc-shadow:0 10px 30px rgba(30,30,36,.08); --cpc-input-bg:#ffffff;
  --cpc-body-font:'Inter',Helvetica,Arial,sans-serif;
}

/* ---------- 2 · Base ---------- */
html,body{overflow-x:clip}
body{font-family:var(--cpc-body-font);background:var(--cpc-bg);color:var(--cpc-text);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--cpc-head-font);font-weight:var(--cpc-head-weight);letter-spacing:var(--cpc-head-spacing);line-height:1.12;color:var(--cpc-text)}
a{color:var(--cpc-text)}
a:hover{color:var(--cpc-accent)}
.content-container{background:transparent}

/* Native buttons -> mockup pill system */
.btn.primary,input.btn.primary,button.btn.primary{
  background:var(--cpc-btn-bg)!important;border:1px solid transparent!important;color:var(--cpc-btn-text)!important;
  border-radius:var(--cpc-btn-radius)!important;padding:13px 28px;font-size:14px;font-weight:600;
  text-transform:none;letter-spacing:0;transition:all .2s;box-shadow:none}
.btn.primary:hover,input.btn.primary:hover,button.btn.primary:hover{background:var(--cpc-accent)!important;color:#fff!important}
.btn.secondary,input.btn.secondary,button.btn.secondary{
  background:var(--cpc-accent)!important;border:1px solid transparent!important;color:#fff!important;
  border-radius:var(--cpc-btn-radius)!important;padding:12px 24px;font-size:14px;font-weight:600;transition:all .2s;box-shadow:none}
.btn.secondary:hover{filter:brightness(1.12)}
.form-control,.form-select{border:1px solid var(--cpc-line);border-radius:10px;background:var(--cpc-input-bg);color:var(--cpc-text)}
.form-control:focus,.form-select:focus{border-color:var(--cpc-accent);box-shadow:0 0 0 3px rgba(47,91,249,.15)}

/* ---------- 3 · Announce bar (injected) ---------- */
.cpc-announce{background:var(--cpc-announce-bg);color:var(--cpc-announce-text);text-align:center;font-size:12.5px;letter-spacing:.04em;padding:9px 16px}

/* ---------- 4 · Topbar (.navbar-container) — slim utility bar ---------- */
/* Light colors scoped to TOP-LEVEL links ONLY (bible 18 faint-dropdown trap) */
.navbar-container{background:var(--cpc-bg);border-bottom:1px solid var(--cpc-line)}
.navbar-container .nav>li.nav-item>a.nav-link{color:var(--cpc-muted);font-size:12.5px;font-weight:500;padding-top:.35rem;padding-bottom:.35rem}
.navbar-container .nav>li.nav-item>a.nav-link:hover{color:var(--cpc-text)}
.navbar-container .dropdown-menu{background:#fff;border:1px solid var(--cpc-line);border-radius:12px;box-shadow:var(--cpc-shadow);padding:6px}
.navbar-container .dropdown-menu .dropdown-item{color:var(--cpc-text);font-size:13px;border-radius:8px;padding:8px 12px}
.navbar-container .dropdown-menu .dropdown-item:hover{background:var(--cpc-surface2);color:var(--cpc-text)}
/* Account-balance link = gold chip (walkthrough anchor) */
.navbar-container a.nav-link[href*="account/balance"],
.navbar-container a.nav-link[href*="balance"]{color:var(--cpc-gold)!important;font-weight:700}
.navbar-container a.nav-link[href*="balance"] span{color:var(--cpc-gold)!important;font-weight:800}

/* ---------- 5 · Header ---------- */
.header-container{background:var(--cpc-header-bg);border-bottom:1px solid var(--cpc-line)!important;transform:translateZ(0)}
.header-container.sticky-header{position:sticky;top:0;z-index:1040;backdrop-filter:blur(10px)}
.header-container .header-navbar{min-height:64px;align-items:center}
.header-container .logo-container img{height:28px!important;max-height:28px!important;width:auto}
/* Category links inline (mockup nav.main) — scoped to .header-container ONLY */
.header-container ul.header-links{flex:1;gap:2px}
.header-container ul.header-links>li.nav-item>a.nav-link{
  font-size:13.5px;font-weight:500;color:var(--cpc-text);opacity:.85;padding:6px 10px;
  border-bottom:2px solid transparent;background:transparent}
.header-container ul.header-links>li.nav-item>a.nav-link:hover{opacity:1;border-bottom-color:var(--cpc-accent);color:var(--cpc-text)}
.header-container .dropdown-menu{background:#fff;border:1px solid var(--cpc-line);border-radius:12px;box-shadow:var(--cpc-shadow);padding:6px;margin-top:6px}
.header-container .dropdown-menu .dropdown-item{color:var(--cpc-text);font-size:13px;border-radius:8px;padding:8px 12px}
.header-container .dropdown-menu .dropdown-item:hover{background:var(--cpc-surface2)}
/* hover/focus-within open (parent links made navigable by JS) */
/* v1.2.14: open state is JS-managed (.cpc-dd-open, 350ms grace on mouseleave); focus-within for keyboard */
.header-container li.nav-item.dropdown.cpc-dd-open>.dropdown-menu,
.header-container li.nav-item.dropdown:focus-within>.dropdown-menu{display:block}
.header-container li.nav-item.dropdown>.dropdown-menu{margin-top:0;padding-top:8px}
.header-container li.nav-item.dropdown>.dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}
/* Header icons right */
.header-container .header-icons{display:flex;gap:14px;align-items:center;margin-left:auto}
.header-container .header-icons .btn,.header-container .header-icons a{opacity:.85;padding:4px}
.header-container .header-icons .btn:hover,.header-container .header-icons a:hover{opacity:1}
.header-container .header-icons svg{width:21px;height:21px}
/* Header icon cluster (built by JS to match mockup: search / account / cart, right-aligned) */
.cpc-hdr-icons{display:flex;align-items:center;gap:16px;margin-left:auto}
.header-container .header-navbar{align-items:center}
.header-container ul.header-links{flex:1 1 auto}
.cpc-hicon{position:relative;display:inline-flex;align-items:center;justify-content:center;background:none;border:none;padding:2px;cursor:pointer;color:var(--cpc-text);opacity:.85;text-decoration:none;line-height:0}
.cpc-hicon:hover{opacity:1;color:var(--cpc-text)}
.cpc-hicon svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.7}
/* topbar: drop the native "$X.XX (N items)" cart text link — cart lives in the header icon now */
.navbar-container li.nav-item.cpc-hide-native-cart{display:none!important}
@media(max-width:991.98px){ .cpc-hdr-icons{gap:12px} }

/* Cart badge (injected by flyout module on every cart link) */
.cpc-badge{position:absolute;top:-7px;right:-9px;background:var(--cpc-accent);color:#fff;font-size:10.5px;font-weight:700;min-width:17px;height:17px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px;line-height:1}
.cpc-badge[data-n="0"]{display:none}
.cpc-cartlink{position:relative;display:inline-flex}

/* MOBILE HEADER — customer fix #1: icons RIGHT-aligned, never centered.
   Budget arithmetic per bible 07: burger(42) + logo + compact icons. */
@media(max-width:991.98px){
  .header-container .header-navbar{display:flex;flex-wrap:nowrap;align-items:center;gap:6px}
  #mobile-slider-button{order:0;margin-right:2px}
  .header-container .logo-container{order:1;margin-right:auto}
  .header-container .logo-container img{height:24px!important;max-height:24px!important}
  .header-container .header-navbar>button[data-bs-target="#search-modal"]{order:2;margin-left:auto}
  .header-container .header-icons{order:3;margin-left:0}
}
@media(max-width:560px){
  .header-container .header-icons{gap:10px}
  .header-container .header-icons .btn span,.header-container .header-icons a span{font-size:0}
}

/* Mobile slider sheet */
.mobile-slider{background:var(--cpc-bg);box-shadow:var(--cpc-shadow)}
.mobile-slider .nav-link{color:var(--cpc-text);font-size:14.5px;font-weight:500;border-bottom:1px solid var(--cpc-line)}
.mobile-slider .nav-link:hover{color:var(--cpc-accent)}
/* Quick-actions bottom bar (native mobile chrome, skinned) */
/* v1.2.16 (client): mobile had cart+profile TWICE (our header icons + the native bottom bar).
   Keep ours. The native bar's icon row is hidden; the bar itself stays ONLY when it carries a
   sticky CTA block (cart: Proceed to Checkout · confirm: Place Order · wishlist buttons). */
.quick-actions-menu>ul.nav{display:none!important}
.quick-actions-menu:not(:has(>.bg-white)){display:none!important}
/* v1.2.17: reserve the tour launcher's footprint beside mobile checkout actions.
   Keep its fixed position and preserve the native buttons and forms. */
@media(max-width:991.98px){
  body:has(.cpct-launch) .quick-actions-menu>.bg-white :is(#qa-checkout-button,.place-order-btn){width:calc(100% - 54px)!important}
}

.quick-actions-menu{background:var(--cpc-surface);border-top:1px solid var(--cpc-line)}
.quick-actions-menu .nav-link,.quick-actions-menu .btn{color:var(--cpc-text);font-size:11.5px}
.quick-actions-menu svg{stroke:var(--cpc-text)}

/* ---------- 6 · Search modal ---------- */
#search-modal .modal-content{border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);background:var(--cpc-bg)}
#search-modal .form-control{border-radius:999px 0 0 999px;padding:12px 18px}
#search-modal .search-btn{border-radius:0 999px 999px 0;background:var(--cpc-btn-bg);color:var(--cpc-btn-text);border:none}

/* ---------- 7 · HOME (Look A structure, approved) ---------- */
.cpc-hero{position:relative;height:76vh;min-height:520px;background:var(--cpc-surface) center/cover no-repeat}
.cpc-hero .cpc-hero-inner{position:absolute;left:0;right:0;bottom:0;max-width:1220px;margin:0 auto;padding:0 24px 56px}
.cpc-hero h1{font-size:52px;color:#1e1e24;margin-bottom:14px;max-width:12ch}
.cpc-hero p{font-size:16.5px;color:#3c3c40;max-width:40ch;margin-bottom:26px;line-height:1.55}
.cpc-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--cpc-btn-bg);color:var(--cpc-btn-text);border-radius:var(--cpc-btn-radius);padding:14px 30px;font-size:14px;font-weight:600;transition:all .2s;border:1px solid transparent;text-decoration:none;cursor:pointer}
.cpc-btn:hover{background:var(--cpc-accent);color:#fff;text-decoration:none}
.cpc-btn.cpc-accent{background:var(--cpc-accent);color:#fff}
.cpc-btn.cpc-accent:hover{filter:brightness(1.12)}
.cpc-btn.cpc-ghost{background:transparent;color:var(--cpc-text);border-color:var(--cpc-text)}
.cpc-btn.cpc-ghost:hover{background:var(--cpc-text);color:var(--cpc-bg)}
/* mobile hero legibility — customer fix #2: paper scrim behind the headline */
@media(max-width:960px){
  .cpc-hero{height:60vh}
  .cpc-hero h1{font-size:36px}
  .cpc-hero::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;
    background:linear-gradient(180deg,rgba(248,245,239,0) 0%,rgba(248,245,239,.82) 55%,rgba(248,245,239,.95) 100%);pointer-events:none}
  .cpc-hero .cpc-hero-inner{z-index:1;padding-bottom:36px}
}
.cpc-wrap{max-width:1220px;margin:0 auto;padding:0 24px}
.cpc-sect{padding:64px 0}
.cpc-sect-head{display:flex;align-items:end;justify-content:space-between;margin-bottom:28px;gap:20px}
.cpc-sect-head h2{font-size:30px;margin:0}
.cpc-sect-head a{font-size:13.5px;font-weight:600;color:var(--cpc-accent);white-space:nowrap;text-decoration:none}
.cpc-strip{padding:56px 0 8px}
.cpc-scrollrow{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.cpc-scard{cursor:pointer;text-decoration:none;display:block}
.cpc-scard .cpc-im{background:var(--cpc-surface);aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:16px;overflow:hidden;border-radius:14px;border:1px solid var(--cpc-line)}
.cpc-scard img{height:100%;width:100%;object-fit:cover;transition:transform .3s;border-radius:8px}
.cpc-scard:hover img{transform:scale(1.04)}
.cpc-scard .cpc-t{font-size:13.5px;font-weight:600;margin-top:10px;color:var(--cpc-text)}
.cpc-scard .cpc-s{font-size:12px;color:var(--cpc-muted)}
.cpc-banner{position:relative;min-height:420px;background:var(--cpc-surface) center/cover no-repeat;margin-top:64px;display:flex;align-items:center}
.cpc-banner .cpc-banner-inner{max-width:1220px;margin:0 auto;padding:56px 24px;width:100%}
.cpc-banner h2{font-size:38px;color:#1e1e24;margin-bottom:10px;max-width:14ch}
.cpc-banner p{color:#3c3c40;font-size:15px;margin-bottom:24px;max-width:36ch}
.cpc-valueline{display:flex;justify-content:center;gap:56px;padding:26px 24px;border-top:1px solid var(--cpc-line);border-bottom:1px solid var(--cpc-line);flex-wrap:wrap}
.cpc-valueline span{font-size:13px;color:var(--cpc-muted)}
.cpc-valueline b{color:var(--cpc-text);font-weight:600}
@media(max-width:960px){
  .cpc-scrollrow{grid-template-columns:repeat(2,1fr)}
  .cpc-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(248,245,239,.15),rgba(248,245,239,.72));pointer-events:none}
  .cpc-banner .cpc-banner-inner{position:relative;z-index:1}
}

/* ---------- 8 · Product grid + cards ---------- */
/* grid fix per bible 18 — .product-list is NOT a bootstrap row */
.product-list{display:grid!important;grid-template-columns:repeat(4,1fr);gap:22px;float:none!important;margin:0!important;width:auto!important;align-items:start}
.product-list::before,.product-list::after{display:none!important}
.product-list .product,.product-list .product-thumbnail-container{width:auto!important;margin:0!important;float:none!important;padding:0!important}
@media(max-width:960px){.product-list{grid-template-columns:repeat(2,1fr)!important;gap:14px}}
/* card (mockup .pcard, home/featured chrome) */
.product-thumbnail{position:relative;display:flex;flex-direction:column;background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);overflow:hidden;box-shadow:var(--cpc-shadow);transition:transform .2s}
.product-thumbnail .thumbnail-img-container{position:relative;overflow:hidden;aspect-ratio:1;background:var(--cpc-surface);display:flex;align-items:center;justify-content:center}
.product-thumbnail .thumbnail-img-container a{display:flex;width:100%;height:100%;align-items:center;justify-content:center}
.product-thumbnail .thumbnail-img-container img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.product-thumbnail:hover .thumbnail-img-container img{transform:scale(1.04)}
.product-thumbnail .thumbnail-description-container{padding:14px 16px 18px!important;display:flex;flex-direction:column;gap:5px;flex:1}
.product-thumbnail .thumbnail-description-container a{text-decoration:none}
.product-thumbnail .card-title{font-family:var(--cpc-body-font);font-size:14px;font-weight:500!important;line-height:1.4;color:var(--cpc-text);margin:0}
.product-thumbnail .card-text{font-size:14.5px;font-weight:700;color:var(--cpc-text);margin:4px 0 0}
.product-thumbnail .card-text del{font-weight:400;color:var(--cpc-muted)}
.cpc-brandline{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cpc-gold);font-weight:600}
.cpc-colorline{font-size:12px;color:var(--cpc-muted)}
/* category pages: flat cards, rounded bordered image well (approved override) */
body.cpc-list .product-thumbnail{background:transparent;border:none;box-shadow:none;border-radius:0;overflow:visible}
body.cpc-list .product-thumbnail .thumbnail-img-container{border-radius:14px;border:1px solid var(--cpc-line);overflow:hidden;background:var(--cpc-surface)}
body.cpc-list .product-thumbnail .thumbnail-description-container{padding:12px 2px 6px!important}
body.cpc-list .cpc-brandline{display:none}
/* NEW label -> compact chip (bible 18 full-cover trap; keep small so it never blankets the photo) */
.new-item-label{position:absolute!important;width:auto!important;max-width:calc(100% - 20px)!important;height:auto!important;top:10px!important;left:10px!important;right:auto!important;bottom:auto!important;
  background:var(--cpc-surface2)!important;color:var(--cpc-gold)!important;font-size:10px;font-weight:700;letter-spacing:.08em;
  padding:4px 9px!important;border-radius:var(--cpc-chip-radius);text-transform:uppercase;line-height:1.1;z-index:2;white-space:nowrap;box-shadow:0 1px 4px rgba(30,30,36,.12)}
/* v1.2.7: once the tiles module moves the label into the meta block it is a static .tag chip (mockup token) — never on the photo */
.thumbnail-description-container .new-item-label.cpc-newtag{position:static!important;display:inline-block;width:auto!important;max-width:none!important;margin:0 0 6px;top:auto!important;left:auto!important;box-shadow:none;font-size:11px}
body.cpc-list .thumbnail-description-container .cpc-newtag{margin-top:2px}
/* image sits centered in the well so the NEW chip corners empty space, not the subject */
.product-thumbnail .thumbnail-img-container img{object-position:center center}
.discount-container{position:absolute;top:10px;right:10px;background:var(--cpc-accent);color:#fff;border-radius:var(--cpc-chip-radius);font-size:11px;font-weight:700;padding:4px 9px;z-index:2}
/* Quick add (mockup) */
.cpc-quickadd{position:absolute;left:50%;bottom:12px;transform:translateX(-50%) translateY(6px);opacity:0;transition:all .2s;
  background:var(--cpc-btn-bg);color:var(--cpc-btn-text);border:none;border-radius:var(--cpc-btn-radius);padding:9px 18px;font-size:12.5px;font-weight:600;white-space:nowrap;z-index:3;cursor:pointer}
.product-thumbnail:hover .cpc-quickadd{opacity:1;transform:translateX(-50%)}
.cpc-quickadd:hover{background:var(--cpc-accent);color:#fff}
@media(hover:none){.cpc-quickadd{display:none}}
/* tile carousel + colorway micro-thumbs */
.cpc-cnav{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.92);border:1px solid var(--cpc-line);color:var(--cpc-text);font-size:15px;line-height:1;display:flex;align-items:center;justify-content:center;z-index:3;opacity:0;transition:opacity .2s;cursor:pointer}
.cpc-cnav.cpc-prev{left:10px}.cpc-cnav.cpc-next{right:10px}
.product-thumbnail:hover .cpc-cnav{opacity:1}
.cpc-cdots{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);display:flex;gap:5px;z-index:2}
.cpc-cdots span{width:6px;height:6px;border-radius:50%;background:rgba(30,30,36,.25)}
.cpc-cdots span.on{background:var(--cpc-accent)}
.cpc-vrow{display:flex;gap:6px;margin-top:8px;align-items:center}
.cpc-vthumb{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--cpc-line);overflow:hidden;cursor:pointer;padding:0;background:var(--cpc-surface);flex:none}
.cpc-vthumb img{width:100%;height:100%;object-fit:cover}
.cpc-vthumb.on{border-color:var(--cpc-text)}
.cpc-vname{font-size:11.5px;color:var(--cpc-muted);margin-left:4px}

/* ---------- 9 · Category page ---------- */
nav[aria-label="breadcrumb"]{float:none!important;clear:both;position:static;width:100%}
.breadcrumb{background:transparent;font-size:12.5px;color:var(--cpc-muted);padding:24px 0 8px;margin:0;display:flex;flex-wrap:wrap;align-items:center;column-gap:6px;list-style:none}
.breadcrumb-item{display:inline-flex;align-items:center}
.breadcrumb-item+.breadcrumb-item::before{content:"/";padding:0 2px;color:var(--cpc-muted)}
body.cpc-list h1{float:none!important;clear:both;display:block;position:static}
.breadcrumb-item a{color:var(--cpc-muted);text-decoration:none}
.breadcrumb-item.active{color:var(--cpc-text);font-weight:500}
body.cpc-list h1{font-size:38px;margin:10px 0 8px}
.sort-form .form-select,.form-select.sort-select{border:1px solid var(--cpc-line);border-radius:var(--cpc-chip-radius);background-color:var(--cpc-surface);padding:8px 34px 8px 14px;font-size:13px;width:auto}
/* Filter rail (native #filter-container restyled to mockup fgroup2) */
#filter-container{border:none;background:transparent}
#filter-container .accordion-item{border:none;border-top:1px solid var(--cpc-line);background:transparent;border-radius:0}
#filter-container .accordion-button{background:transparent;color:var(--cpc-text);font-size:13px;font-weight:700;padding:18px 0 12px;box-shadow:none}
#filter-container .accordion-button::after{filter:grayscale(1);opacity:.55;scale:.8}
#filter-container .accordion-body{padding:0 0 18px}
#filter-container .form-check{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--cpc-muted);padding:5px 0;margin:0;border:none}
#filter-container .form-check:hover{color:var(--cpc-text)}
#filter-container .form-check-input{width:15px;height:15px;border:1.5px solid var(--cpc-muted);border-radius:3px;margin:0;flex:none;background-color:transparent}
#filter-container .form-check-input:checked{background-color:var(--cpc-accent);border-color:var(--cpc-accent)}
#filter-container .form-check-label{color:inherit;display:flex;align-items:center;gap:8px;width:100%}
#filter-container .badge{background:var(--cpc-surface2)!important;color:var(--cpc-muted)!important;border-radius:99px;font-weight:600;margin-left:auto}
/* wrapper chrome strip (bible 18: hide the bordered wrapper chain look) */
#filter-container .accordion-body>div{border:none!important;padding:0!important;background:transparent!important}
/* selected facet chips row */
.cpc-facetbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.cpc-facetbar .cpc-fchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--cpc-accent);border-radius:var(--cpc-chip-radius);padding:7px 14px;font-size:12.5px;font-weight:500;background:var(--cpc-surface);color:var(--cpc-accent);cursor:pointer}
/* MOBILE FILTER SHEET — customer fix #3: robust filtering on mobile */
.cpc-filterbtn{display:none;align-items:center;gap:8px;border:1px solid var(--cpc-line);border-radius:var(--cpc-chip-radius);padding:9px 18px;font-size:13px;font-weight:600;background:var(--cpc-surface);color:var(--cpc-text);cursor:pointer}
.cpc-filterbtn .cpc-fcount{background:var(--cpc-accent);color:#fff;border-radius:99px;font-size:10.5px;min-width:17px;height:17px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.cpc-filterbtn .cpc-fcount:empty{display:none}
@media(max-width:991.98px){.cpc-filterbtn{display:inline-flex}}
.cpc-sheet-overlay{position:fixed;inset:0;background:rgba(30,30,36,.45);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;z-index:1046}
.cpc-sheet-overlay.cpc-open{opacity:1;visibility:visible}
.cpc-sheet{position:fixed;top:0;left:0;bottom:0;width:340px;max-width:88vw;z-index:1047;background:var(--cpc-bg);display:flex;flex-direction:column;transform:translateX(-103%);transition:transform .3s cubic-bezier(.22,.8,.3,1);box-shadow:0 0 50px rgba(30,30,36,.28)}
.cpc-sheet-overlay.cpc-open .cpc-sheet{transform:translateX(0)}
.cpc-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--cpc-line)}
.cpc-sheet-head .cpc-sheet-title{font-family:var(--cpc-head-font);font-size:18px;font-weight:600}
.cpc-sheet-x{background:none;border:none;width:32px;height:32px;border-radius:50%;font-size:19px;color:var(--cpc-text);cursor:pointer}
.cpc-sheet-body{flex:1;overflow-y:auto;padding:4px 18px 18px}
.cpc-sheet-body .accordion-item{border:none!important;border-top:1px solid var(--cpc-line)!important;background:transparent!important;border-radius:0!important}
.cpc-sheet-body .accordion-button,.cpc-sheet-body .accordion-header button{background:transparent!important;color:var(--cpc-text)!important;font-family:var(--cpc-body-font);font-weight:700;font-size:13px;padding:16px 0 10px;box-shadow:none!important;text-decoration:none}
.cpc-sheet-body .accordion-body{padding:0 0 16px}
.cpc-sheet-body .form-check{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--cpc-muted);padding:7px 0;margin:0;border:none}
.cpc-sheet-body .form-check-input:checked{background-color:var(--cpc-accent);border-color:var(--cpc-accent)}
.cpc-sheet-body .badge{background:var(--cpc-surface2)!important;color:var(--cpc-muted)!important;border-radius:99px;margin-left:auto}
.cpc-sheet-body .accordion-body>div{border:none!important;padding:0!important;background:transparent!important}
.cpc-sheet-foot{padding:14px 18px;border-top:1px solid var(--cpc-line);display:flex;gap:10px}
.cpc-sheet-foot .cpc-btn{flex:1;padding:12px 10px}
/* color swatch + size chips (facet overlay; proxies native inputs) */
.cpc-swatchrow{display:flex;gap:8px;flex-wrap:wrap;padding:4px 0}
.cpc-swdot{width:22px;height:22px;border-radius:50%;border:2px solid var(--cpc-line);cursor:pointer;padding:0;background-clip:padding-box}
.cpc-swdot.on{box-shadow:0 0 0 2px var(--cpc-bg),0 0 0 4px var(--cpc-accent)}
.cpc-sizerow-f{display:flex;gap:7px;flex-wrap:wrap;padding:4px 0}
.cpc-szb{border:1px solid var(--cpc-line);min-width:38px;height:34px;display:inline-flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:600;border-radius:8px;padding:0 8px;background:var(--cpc-surface);color:var(--cpc-text);cursor:pointer}
.cpc-szb:hover,.cpc-szb.on{border-color:var(--cpc-text);background:var(--cpc-text);color:var(--cpc-bg)}

/* ---------- 10 · PDP ---------- */
body.cpc-pdp .product-left-section,body.cpc-pdp .product-right-section{transform:translateZ(0);isolation:isolate}
/* gallery stage + thumbs */
.product-left-section .product-primary-image,.product-left-section #product-image-gallery{background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);overflow:hidden}
.product-left-section ul.images{display:flex;gap:10px;list-style:none;padding:10px 0 0;margin:0;flex-wrap:wrap}
.product-left-section ul.images li.image{width:84px;height:84px;border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);overflow:hidden;cursor:pointer;background:var(--cpc-surface)}
.product-left-section ul.images li.image img{width:100%;height:100%;object-fit:cover}
/* buy column card (mockup skin-c .pdp-info) */
.product-right-section .product-info{background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:30px}
.product-right-section .product-header h1,.product-right-section h1{font-size:30px;margin:12px 0 14px}
.product-right-section .product-price,.product-right-section .price{font-size:24px;font-weight:800;color:var(--cpc-text)}
#stock{font-size:13px;color:var(--cpc-muted);display:flex;align-items:center;gap:7px}
#stock:empty{display:none}
#stock:not(:empty)::before{content:"";width:8px;height:8px;border-radius:50%;background:#3dba63;flex:none;display:inline-block}
/* option chips */
.cpc-optlabel{font-size:13px;font-weight:600;margin:16px 0 9px;display:flex;gap:8px;color:var(--cpc-text)}
.cpc-optlabel span{color:var(--cpc-muted);font-weight:500}
.cpc-chips{display:flex;gap:8px;flex-wrap:wrap}
.cpc-chips .cpc-szb{min-width:46px;height:42px;border-radius:var(--cpc-btn-radius)}
.cpc-swatch{width:30px;height:30px;border-radius:50%;cursor:pointer;border:2px solid var(--cpc-line);padding:0;overflow:hidden;background-clip:padding-box}
.cpc-swatch img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.cpc-swatch.on{box-shadow:0 0 0 2px var(--cpc-bg),0 0 0 4px var(--cpc-text)}
/* recoverable hide — display:none still submits form values; remove the class to restore */
.cpc-hidden-native{display:none!important}
/* qty stepper (bible 06: >=76px, spinners hidden, clamp in JS) */
.cpc-qty{display:inline-flex;align-items:center;border:1px solid var(--cpc-line);border-radius:var(--cpc-btn-radius);background:var(--cpc-surface);overflow:hidden}
.cpc-qty button{width:40px;height:48px;font-size:17px;color:var(--cpc-text);background:transparent;border:none;cursor:pointer}
.cpc-qty button:hover{background:var(--cpc-surface2)}
.cpc-qty input,.cpc-qty input.form-control{width:76px!important;max-width:none!important;text-align:center;border:none!important;background:transparent!important;font-weight:600;height:48px;color:var(--cpc-text);-moz-appearance:textfield;box-shadow:none!important}
.cpc-qty input::-webkit-outer-spin-button,.cpc-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.product-quantity>div{flex:0 0 auto;width:auto!important}
#quantity{max-width:none!important}
/* buy row */
.cpc-buyrow{display:flex;gap:12px;margin:22px 0 12px;align-items:stretch}
.cpc-buyrow input.btn.primary.add-to-cart,.cpc-buyrow .add-to-cart{flex:1;background:var(--cpc-accent)!important;color:#fff!important;border-radius:var(--cpc-btn-radius)!important;font-size:14px;font-weight:600;min-height:48px}
.cpc-buyrow input.btn.primary.add-to-cart:hover{filter:brightness(1.12)}
input.btn.primary.add-to-cart{background:var(--cpc-accent)!important;border-radius:var(--cpc-btn-radius)!important;text-transform:none!important;letter-spacing:0!important}
/* trust row (approved claims only) */
.cpc-trust{display:flex;gap:18px;margin:20px 0 6px;padding:14px 0;border-top:1px solid var(--cpc-line);flex-wrap:wrap}
.cpc-trust span{font-size:12.5px;color:var(--cpc-muted)}
/* description accordions (native tabs restyled) */
.cpc-acc{border-bottom:1px solid var(--cpc-line)}
.cpc-acc>summary,.cpc-acc .cpc-acc-sum{list-style:none;display:flex;justify-content:space-between;align-items:center;padding:17px 2px;font-weight:600;font-size:14.5px;cursor:pointer;color:var(--cpc-text)}
.cpc-acc>summary::-webkit-details-marker{display:none}
.cpc-acc>summary::after{content:"+";font-size:18px;font-weight:400;color:var(--cpc-muted)}
.cpc-acc[open]>summary::after{content:"\2212"}
.cpc-acc .cpc-acc-body{font-size:13.5px;color:var(--cpc-muted);line-height:1.65;padding:0 2px 18px}
.cpc-acc .cpc-acc-body p{color:var(--cpc-muted)}
/* related products */
.cpc-pdp-related h2{font-size:30px}
/* PDP mobile */
@media(max-width:960px){
  .product-right-section .product-info{padding:20px}
  .product-right-section{margin-top:18px}
}

/* ---------- 11 · Cart page ---------- */
body.cpc-cart h1{font-size:34px;margin-bottom:18px}
body.cpc-cart .table{border-collapse:separate;border-spacing:0}
body.cpc-cart .table thead th{border-bottom:1px solid var(--cpc-line)!important;font-family:var(--cpc-body-font);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--cpc-muted);font-weight:600}
body.cpc-cart tr.cart-item{border-bottom:1px solid var(--cpc-line)}
body.cpc-cart tr.cart-item td{padding:20px 8px;vertical-align:middle}
body.cpc-cart .item-image img.cart-product-img{width:96px;height:96px;object-fit:cover;background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius)}
body.cpc-cart .item-description p.fw-bold{font-size:14px;font-weight:500!important;line-height:1.4;margin-bottom:4px}
body.cpc-cart .item-description{font-size:12.5px;color:var(--cpc-muted)}
body.cpc-cart input[name^="line_items"]{border:1px solid var(--cpc-line);border-radius:10px;background:var(--cpc-surface);text-align:center;min-width:64px;height:40px}
body.cpc-cart tfoot td{border:none}
body.cpc-cart tfoot td.fw-bolder.text-end{font-size:16.5px}
body.cpc-cart input[name="checkout"]{background:var(--cpc-accent)!important;border-radius:var(--cpc-btn-radius)!important;color:#fff!important;font-size:14px!important;text-transform:none!important;font-weight:600!important;padding:13px 34px}
body.cpc-cart input[name="checkout"]:hover{filter:brightness(1.12)}
body.cpc-cart .remove-item,body.cpc-cart a[data-method="delete"]{font-size:12px;color:var(--cpc-muted);text-decoration:underline}

/* ---------- 12 · Cart flyout (La Colombe port, Courtyard skin) ---------- */
.cpc-cart-overlay{position:fixed;inset:0;background:rgba(30,30,36,.45);backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;z-index:1048}
.cpc-cart-overlay.cpc-open{opacity:1;visibility:visible}
.cpc-cart-panel{position:fixed;top:0;right:0;bottom:0;width:400px;max-width:94vw;z-index:1049;background:var(--cpc-bg);display:flex;flex-direction:column;box-shadow:0 0 50px rgba(30,30,36,.28);transform:translateX(103%);transition:transform .3s cubic-bezier(.22,.8,.3,1);font-family:var(--cpc-body-font)}
.cpc-cart-overlay.cpc-open .cpc-cart-panel{transform:translateX(0)}
.cpc-cart-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--cpc-line);background:var(--cpc-surface)}
.cpc-cart-title{font-family:var(--cpc-head-font);font-size:18px;font-weight:600;color:var(--cpc-text);display:flex;align-items:center;gap:9px}
.cpc-cart-count{background:var(--cpc-accent);color:#fff;font-size:11px;font-weight:700;min-width:22px;height:22px;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;padding:0 7px}
.cpc-cart-x{background:transparent;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;color:var(--cpc-text);font-size:19px}
.cpc-cart-x:hover{background:var(--cpc-surface2)}
.cpc-cart-body{flex:1 1 auto;overflow-y:auto;padding:6px 18px}
.cpc-cart-body.cpc-busy{opacity:.5;pointer-events:none}
.cpc-cart-item{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--cpc-line)}
.cpc-cart-item:last-child{border-bottom:none}
.cpc-cart-thumb{width:62px;height:62px;border-radius:10px;object-fit:cover;background:var(--cpc-surface);border:1px solid var(--cpc-line);flex:0 0 auto}
.cpc-cart-info{flex:1 1 auto;min-width:0}
.cpc-cart-name{font-size:13.5px;font-weight:600;color:var(--cpc-text);line-height:1.25;margin:0 0 2px}
.cpc-cart-opts{font-size:11.5px;color:var(--cpc-muted);margin:0 0 7px}
.cpc-cart-row2{display:flex;align-items:center;justify-content:space-between;gap:8px}
.cpc-qty-s{display:inline-flex;align-items:center;border:1px solid var(--cpc-line);border-radius:99px;overflow:hidden;background:var(--cpc-surface)}
.cpc-qty-s button{width:27px;height:27px;border:none;background:transparent;color:var(--cpc-text);font-size:14px;font-weight:700;cursor:pointer}
.cpc-qty-s button:hover{background:var(--cpc-surface2)}
.cpc-qty-s span{min-width:26px;text-align:center;font-size:13px;font-weight:700}
.cpc-cart-price{font-size:14.5px;font-weight:700;color:var(--cpc-text);white-space:nowrap}
.cpc-cart-price:empty{display:none}
.cpc-cart-remove{background:none;border:none;color:var(--cpc-muted);cursor:pointer;font-size:11.5px;padding:3px 0;margin-top:5px}
.cpc-cart-remove:hover{color:#e0483e}
.cpc-cart-foot{flex:0 0 auto;padding:14px 18px 18px;border-top:1px solid var(--cpc-line);background:var(--cpc-surface);display:none}
.cpc-cart-clearrow{display:flex;justify-content:flex-end;margin-bottom:6px}
.cpc-cart-clear{background:none;border:none;color:var(--cpc-muted);cursor:pointer;font-size:11.5px}
.cpc-cart-clear:hover{color:#e0483e}
.cpc-cart-subrow{display:flex;justify-content:space-between;font-size:13.5px;margin-bottom:5px;color:var(--cpc-muted)}
.cpc-cart-subrow .cpc-v{font-weight:700;font-size:16px;color:var(--cpc-text)}
.cpc-cart-note{font-size:10.5px;color:var(--cpc-muted);margin:8px 0 12px;line-height:1.5}
.cpc-cart-btns{display:flex;flex-direction:column;gap:8px}
.cpc-cart-btns .cpc-btn{width:100%}
.cpc-cart-empty{text-align:center;color:var(--cpc-muted);padding:50px 10px;font-size:14px}
.cpc-cart-loading{text-align:center;padding:44px 16px;color:var(--cpc-muted);font-size:13.5px}
.cpc-spinner{width:28px;height:28px;border:3px solid var(--cpc-line);border-top-color:var(--cpc-accent);border-radius:50%;margin:0 auto 10px;animation:cpcSpin .7s linear infinite}
@keyframes cpcSpin{to{transform:rotate(360deg)}}
@media(max-width:760px){
  .cpc-cart-panel{top:auto;left:0;right:0;bottom:0;width:100%;max-height:88vh;border-radius:16px 16px 0 0;transform:translateY(103%)}
  .cpc-cart-overlay.cpc-open .cpc-cart-panel{transform:translateY(0)}
}

/* ---------- 13 · Checkout skin (CSS-only, scoped by body class; real Default checkout DOM) ---------- */
body.cpc-checkout{background:var(--cpc-bg)}
body.cpc-checkout .content-page h1{font-family:var(--cpc-head-font);font-size:30px;font-weight:500;color:var(--cpc-text)}
/* step tracker */
body.cpc-checkout .checkout-steps{background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:20px 24px;margin-bottom:26px}
/* step bubbles: identical fixed circles; current step = accent (native marks it .secondary) */
body.cpc-checkout .checkout-steps .btn{width:26px!important;height:26px!important;min-width:0!important;padding:0!important;display:inline-flex;align-items:center;justify-content:center;border-radius:50%!important;font-size:12px!important;line-height:1!important;box-shadow:none!important;border:none!important;text-transform:none!important;letter-spacing:0!important;filter:none!important}
body.cpc-checkout .checkout-steps .btn.btn-dark{background:var(--cpc-btn-bg)!important;color:var(--cpc-btn-text)!important}
body.cpc-checkout .checkout-steps .btn.secondary{background:var(--cpc-accent)!important;color:#fff!important}
body.cpc-checkout .checkout-steps .checkout-step-count{position:static!important;margin:0!important;padding:0!important;background:transparent!important;color:inherit!important;border:none!important;width:auto!important;height:auto!important;min-width:0!important;display:inline!important}
body.cpc-checkout .checkout-steps .text-center>div:first-child{font-size:12px;color:var(--cpc-muted);margin-bottom:6px}
/* form column labels + inputs */
body.cpc-checkout .content-page label{font-size:13px;font-weight:600;color:var(--cpc-text)}
body.cpc-checkout .content-page .form-control,body.cpc-checkout .content-page .form-select{border:1px solid var(--cpc-line);border-radius:10px;background:var(--cpc-input-bg);padding:12px 14px;font-size:14px;color:var(--cpc-text)}
body.cpc-checkout .content-page .form-control:focus,body.cpc-checkout .content-page .form-select:focus{border-color:var(--cpc-accent);box-shadow:0 0 0 3px rgba(47,91,249,.15)}
body.cpc-checkout .content-page h2,body.cpc-checkout .content-page h3,body.cpc-checkout .content-page h4{font-family:var(--cpc-head-font);font-weight:500;color:var(--cpc-text)}
/* summary column: stock uses .border.p-3 cards in the col-lg-4 rail */
body.cpc-checkout .col-lg-4 .border{background:var(--cpc-surface)!important;border:1px solid var(--cpc-line)!important;border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:20px!important}
/* delivery / payment method rows annotated by JS -> mockup pill-card look */
body.cpc-checkout .cpc-shipopt{display:flex;align-items:center;gap:12px;border:1px solid var(--cpc-line);border-radius:12px;padding:14px 16px;font-size:13.5px;margin-bottom:10px;cursor:pointer;background:var(--cpc-surface)}
body.cpc-checkout .cpc-shipopt.cpc-on{border-color:var(--cpc-accent);box-shadow:inset 0 0 0 1px var(--cpc-accent)}
body.cpc-checkout input[type="radio"],body.cpc-checkout input[type="checkbox"]{accent-color:var(--cpc-accent)}
/* all checkout buttons -> pill; primary = accent (Pay/Continue/Place order) */
body.cpc-checkout .btn.primary,body.cpc-checkout input.btn.primary,body.cpc-checkout .place-order-btn{background:var(--cpc-accent)!important;border-radius:var(--cpc-btn-radius)!important;color:#fff!important;text-transform:none!important;letter-spacing:0!important;font-weight:600!important;padding:13px 30px}
body.cpc-checkout .btn.secondary{background:var(--cpc-btn-bg)!important;border-radius:var(--cpc-btn-radius)!important;color:var(--cpc-btn-text)!important}
/* account-balance line in summary (walkthrough anchor) tinted gold */
body.cpc-checkout .col-lg-4 [href*="balance"],body.cpc-checkout .account-balance{color:var(--cpc-gold)!important;font-weight:700}
/* ---- CHECKOUT FORGE (mockup cards) ---- */
body.cpc-checkout .cpc-co-card{background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:24px;margin-bottom:26px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
body.cpc-checkout .cpc-co-card>h2,body.cpc-checkout .cpc-co-card>h3,body.cpc-checkout .cpc-co-card>h4{grid-column:1/-1;margin:0 0 6px!important;font-size:20px}
body.cpc-checkout .cpc-co-card>*{grid-column:1/-1;min-width:0}
body.cpc-checkout .cpc-co-card>.mb-3{margin:0!important}
body.cpc-checkout .cpc-co-card>.mb-3.cpc-half{grid-column:auto/span 1}
@media(max-width:760px){body.cpc-checkout .cpc-co-card{grid-template-columns:1fr}body.cpc-checkout .cpc-co-card>.mb-3.cpc-half{grid-column:1/-1}}
body.cpc-checkout .cpc-lbl-off{display:none!important}
body.cpc-checkout .checkout-steps{padding:14px 20px;margin-bottom:22px}
body.cpc-checkout .checkout-steps .text-center{font-size:12px}
/* summary item rows w/ thumbs + qty badge */
.cpc-co-item{display:flex;align-items:center;gap:12px;padding:8px 0}
.cpc-co-thumb{position:relative;flex:none;width:64px;height:64px;border:1px solid var(--cpc-line);border-radius:12px;background:var(--cpc-surface2);overflow:hidden;display:inline-block}
.cpc-co-thumb img{width:100%;height:100%;object-fit:cover}
.cpc-co-qty{position:absolute;top:2px;right:2px;background:rgba(30,30,36,.78);color:#fff;font-size:10.5px;font-weight:700;min-width:18px;height:18px;border-radius:100px;display:flex;align-items:center;justify-content:center}
body.cpc-checkout .col-lg-4 .border h1,body.cpc-checkout .col-lg-4 .border h2,body.cpc-checkout .col-lg-4 .border h3,body.cpc-checkout .col-lg-4 .border h4{font-size:17px;margin-bottom:12px}
body.cpc-checkout .col-lg-4 .btn{border-radius:var(--cpc-btn-radius)!important}

/* ---------- 14 · Login card (La Colombe W10 port, Courtyard skin) ---------- */
.cpc-login-wrap{max-width:560px;margin:48px auto 72px;padding:0 18px}
.cpc-login-tabs{display:flex;gap:8px;margin-bottom:14px;justify-content:center}
.cpc-login-tabs .cpc-lt{font-weight:700;color:var(--cpc-muted);text-decoration:none;padding:8px 18px;border-radius:99px;border:1.5px solid var(--cpc-line);background:var(--cpc-surface);font-size:13.5px}
.cpc-login-tabs .cpc-lt-on{background:var(--cpc-btn-bg);border-color:var(--cpc-btn-bg);color:var(--cpc-btn-text)}
.cpc-login-card{background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:34px 34px 28px;border-top:3px solid var(--cpc-gold)}
.cpc-login-eyebrow{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--cpc-gold);margin-bottom:10px;text-align:center}
.cpc-login-title{font-family:var(--cpc-head-font);color:var(--cpc-text);font-size:30px;margin:2px 0 4px;text-align:center;font-weight:500}
.cpc-login-sub{color:var(--cpc-muted);font-size:14px;text-align:center;margin:0 0 22px}
.cpc-login-card label{display:block;font-weight:600;color:var(--cpc-text);font-size:13px;margin-bottom:6px}
.cpc-login-card .form-control{width:100%;border:1.5px solid var(--cpc-line);border-radius:10px;padding:11px 13px;background:var(--cpc-input-bg)}
.cpc-login-card .form-control:focus{border-color:var(--cpc-accent);box-shadow:0 0 0 3px rgba(47,91,249,.15);outline:none}
.cpc-login-card input[type="submit"],.cpc-login-card .btn_sign{width:100%;background:var(--cpc-btn-bg)!important;color:var(--cpc-btn-text)!important;border:none!important;border-radius:var(--cpc-btn-radius)!important;padding:13px 20px;font-size:14px;font-weight:600;margin-top:8px;cursor:pointer;transition:all .2s}
.cpc-login-card input[type="submit"]:hover{background:var(--cpc-accent)!important;color:#fff!important}
.cpc-login-card .password-div{position:relative}
.cpc-login-card .password-div .fa-eye{position:absolute;right:14px;top:41px;color:var(--cpc-muted);cursor:pointer}
.cpc-login-links{text-align:center;margin-top:18px;display:flex;flex-direction:column;gap:8px}
.cpc-login-links a,.cpc-login-card .forgot-link,.cpc-login-card .resend-link{color:var(--cpc-gold);font-weight:600;font-size:13.5px;text-decoration:none}
.cpc-login-links a:hover{text-decoration:underline}
/* the native warning toast on permissions_denied stays visible but on-brand */
.notification-container .toast.notif-warning{background:var(--cpc-surface2);color:var(--cpc-text);border:1px solid var(--cpc-line);border-radius:12px}

/* ---------- 15 · Account pages (light skin; balance page = walkthrough stop) ---------- */
body.cpc-account .content-page h1{font-size:34px}
body.cpc-account .card,body.cpc-account .table{background:var(--cpc-surface);border-color:var(--cpc-line)}
body.cpc-account .table thead th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--cpc-muted);border-bottom:1px solid var(--cpc-line)}

/* ---------- 16 · Footer (classic footer regridded to mockup) ---------- */
.footer-container{background:var(--cpc-surface2)!important;border-top:1px solid var(--cpc-line);margin-top:40px;color:var(--cpc-muted)}
.footer-container h4,.footer-container h5{font-family:var(--cpc-body-font);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cpc-muted);margin-bottom:14px;font-weight:700}
.footer-container p{font-size:13px;color:var(--cpc-muted);line-height:1.6}
.footer-container a,.footer-container .nav-link{color:var(--cpc-text);font-size:13.5px;opacity:.85;padding:5px 0}
.footer-container a:hover,.footer-container .nav-link:hover{opacity:1;color:var(--cpc-accent)}
.footer-container .footer-logo{max-height:24px;width:auto}
.footer-container .nav.flex-column{float:none!important}
/* social icons — fix jumbled/overlapping FOLLOW US cluster */
.footer-container .social-media{display:flex!important;flex-direction:row!important;flex-wrap:wrap;gap:16px;align-items:center;float:none!important;padding:0;margin:0;list-style:none}
.footer-container .social-media .nav-item{margin:0;padding:0}
.footer-container .social-media .nav-link{padding:0!important;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px}
.footer-container .social-media .nav-link svg{width:18px;height:18px}
.footer-container .social-media .nav-link:hover{opacity:1;color:var(--cpc-accent)}

/* hide stock top notification bar (placeholder text) — cpc-announce replaces it */
.top-navbar-notification-container{display:none!important}
@media(min-width:992px){
  .footer-container .row{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;float:none}
  .footer-container .row>div{width:auto!important;float:none!important}
}
.cpc-foot-base{border-top:1px solid var(--cpc-line);padding:18px 24px;text-align:center;font-size:12px;color:var(--cpc-muted)}

/* ---------- 16b · v1.2 CARDFORGE (PDP 9-slot recomposition) ---------- */
.cpc-tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;padding:4px 9px;border-radius:var(--cpc-chip-radius);background:var(--cpc-surface2);color:var(--cpc-gold);text-transform:uppercase;margin-bottom:10px}
.cpc-shipline{font-size:13px;color:var(--cpc-muted);margin:6px 0 20px;display:flex;align-items:center;gap:7px}
.cpc-shipline::before{content:"";width:8px;height:8px;border-radius:50%;background:#3dba63;flex:none}
.product-right-section .product-title h2{font-family:var(--cpc-head-font);font-weight:500;font-size:30px;letter-spacing:-.01em;color:var(--cpc-text);margin:0 0 6px}
.product-right-section .product-price .current-price{font-size:24px;font-weight:800;color:var(--cpc-text)}
.cpc-price-total{font-size:14px;font-weight:600;color:var(--cpc-muted)}
.cpc-hint{font-style:normal;color:var(--cpc-gold);font-weight:600;font-size:12px}
/* unknown color name -> neutral split swatch (bible 18); real name stays on hover title */
.cpc-swdot-unknown,.cpc-swatch.cpc-swdot-unknown{background:linear-gradient(135deg,#efe9dd 50%,#b7bcc6 50%)!important;border-color:#c9c2b4!important}
.cpc-blankline{font-size:12px;color:var(--cpc-muted);display:inline-block;margin-top:8px}
.cpc-overview-styled{font-size:13.5px;color:var(--cpc-muted);line-height:1.65}
.cpc-buyrow .add-to-cart-area{flex:1;display:flex}
.cpc-buyrow .add-to-cart-area input,.cpc-buyrow .add-to-cart-area button{flex:1;width:100%}
.cpc-accs{margin-top:18px}
/* native leftovers on PDP */
.cpc-pdp .review-social-share-wrapper{display:none!important}
.cpc-pdp .product-summary.cpc-hidden-native{display:none!important}

/* ---------- 16c · v1.2 CATEGORY AISLES (PLP) ---------- */
.cpc-plp-head{padding:4px 0 6px}
.cpc-plp-head h1{font-size:38px;margin:0 0 6px}
.cpc-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 0 22px}
.cpc-toolbar .products-result-verbiage{margin:0;font-size:13px;color:var(--cpc-muted)}
.cpc-tb-spacer{flex:1}
.cpc-toolbar .sort-form .form-select{border-radius:var(--cpc-chip-radius);background-color:var(--cpc-surface)}
/* rail: 230px per mockup (native cols are md-4/md-8 or lg-3/lg-9) */
@media(min-width:992px){
  body.cpc-list .content-page .row>[class*="col-"]:first-child,
  body.cpc-list .row>.col-md-4.px-0{flex:0 0 250px;max-width:250px}
  body.cpc-list .content-page .row>[class*="col-"]:last-child,
  body.cpc-list .row>.col-md-8.px-0{flex:1;max-width:calc(100% - 250px)}
}
/* rail groups: fgroup2 look on the real accordion DOM */
#filter-container .accordion-header .accordion-button{background:transparent!important;color:var(--cpc-text)!important;font-family:var(--cpc-body-font);font-size:13px;font-weight:700;padding:16px 0 10px;box-shadow:none!important}
#filter-container .accordion-header .accordion-button::after{opacity:.55;scale:.8}
#filter-container>*{border:none!important;border-top:1px solid var(--cpc-line)!important;background:transparent!important}
#filter-container .accordion-body{padding:0 0 16px!important}
#filter-container .accordion-body .border-bottom{border:none!important;padding:4px 0!important;background:transparent!important}
#filter-container .form-check-label{color:var(--cpc-muted);font-size:13.5px}
#filter-container .form-check:hover .form-check-label{color:var(--cpc-text)}
#filter-container .badge{background:var(--cpc-surface2)!important;color:var(--cpc-muted)!important;border-radius:99px;font-weight:600}
/* rail search input */
body.cpc-list input[placeholder*="Search Product"],body.cpc-list .col-md-4 input[type="text"]{border:1px solid var(--cpc-line);border-radius:var(--cpc-chip-radius);background:var(--cpc-surface);padding:8px 14px;font-size:13px}
/* grid: 4-col; card meta left-aligned (kill stock centering) */
body.cpc-list .product-list{grid-template-columns:repeat(4,1fr)}
@media(max-width:960px){body.cpc-list .product-list{grid-template-columns:repeat(2,1fr)!important}}
.product-thumbnail .thumbnail-description-container,.product-thumbnail .thumbnail-description-container a{text-align:left!important}
.product-thumbnail .card-title{text-align:left}

/* ---------- 16d · v1.2 CART PAGE recomposition ---------- */
.cpc-quiet-link.cpc-quiet-link{background:transparent!important;border:none!important;color:var(--cpc-muted)!important;font-size:13px!important;text-decoration:underline!important;padding:6px 8px!important;border-radius:0!important;box-shadow:none!important;text-transform:none!important;font-weight:500!important}
.cpc-quiet-link.cpc-quiet-link:hover{color:var(--cpc-accent)!important}
body.cpc-cart .cpc-qty-cart{background:var(--cpc-surface)}
body.cpc-cart .cpc-qty-cart button{height:36px;width:32px;font-size:15px}
body.cpc-cart .cpc-qty-cart input{height:36px!important;width:44px!important;min-width:0!important}
/* cart = mockup 2-col. REAL DOM (live-extracted): form > [hidden inputs, div(h1+ctas),
   div.shopping-cart > (table + .zip-input)]. Grid goes on .shopping-cart; display:contents
   lifts the table's sections into it; nothing leaves the form. */
@media(min-width:992px){
  body.cpc-cart .shopping-cart{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:44px;align-items:start}
  body.cpc-cart .shopping-cart>.table{display:contents}
  body.cpc-cart .shopping-cart .table thead{display:none}
  body.cpc-cart .shopping-cart .table tbody{display:block;grid-column:1;grid-row:1}
  body.cpc-cart tfoot.cpc-cart-summary{grid-column:2;grid-row:1;position:sticky;top:96px}
  body.cpc-cart .shopping-cart .zip-input{grid-column:1;grid-row:2}
}
body.cpc-cart .table thead{display:none}
body.cpc-cart tbody tr.cart-item{display:grid;grid-template-columns:minmax(0,1.6fr) auto auto auto;gap:18px;align-items:center;padding:20px 0;border-bottom:1px solid var(--cpc-line)}
body.cpc-cart tbody tr.cart-item td:last-child{font-weight:700;font-size:15px}
body.cpc-cart tbody tr.cart-item td{display:block;border:none!important;padding:0!important}
body.cpc-cart tbody tr.cart-item td.d-flex{display:flex!important;gap:16px;align-items:flex-start}
body.cpc-cart tfoot.cpc-cart-summary{display:block;background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:var(--cpc-card-radius);box-shadow:var(--cpc-shadow);padding:22px;width:100%}
/* !important required: native rows carry bootstrap .d-none/.d-lg-table-row utilities
   (both !important) which otherwise beat the flex layout — live-extracted 2026-08-27 */
body.cpc-cart tfoot.cpc-cart-summary tr{display:flex!important;justify-content:space-between;align-items:center;border:none;gap:10px;flex-wrap:nowrap}
body.cpc-cart tfoot.cpc-cart-summary tr td{flex:0 0 auto;white-space:nowrap;text-align:right}
body.cpc-cart tfoot.cpc-cart-summary tr td:nth-last-child(2){flex:1 1 auto;text-align:left}
body.cpc-cart .cpc-sum-sub td{color:var(--cpc-muted);font-weight:500;font-size:14px}
body.cpc-cart .cpc-sum-sub td.fw-bolder{color:var(--cpc-text);font-weight:700!important;font-size:14px!important}
body.cpc-cart tfoot.cpc-cart-summary td{display:block;border:none!important;padding:6px 0!important;font-size:14px}
body.cpc-cart tfoot.cpc-cart-summary td:empty{display:none}
body.cpc-cart tfoot.cpc-cart-summary input[name="checkout"]{width:100%;margin-top:12px}
/* order-summary rows (mockup card) */
.cpc-sum-head{font-family:var(--cpc-head-font);font-size:19px;font-weight:500;color:var(--cpc-text);margin:0 0 12px}
.cpc-sum-row{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:14px;color:var(--cpc-muted);padding:6px 0}
.cpc-sum-row b{color:var(--cpc-text);font-weight:600;font-size:13px}
.cpc-sum-row.cpc-sum-total{border-top:1px solid var(--cpc-line);margin-top:10px;padding-top:14px;font-size:16px;color:var(--cpc-text);font-weight:700}
.cpc-sum-row.cpc-sum-total b{font-size:16.5px;font-weight:800}
body.cpc-cart .cpc-sum-sub td{color:var(--cpc-muted);font-weight:500}
body.cpc-cart .cpc-sum-sub td.fw-bolder{color:var(--cpc-text);font-weight:700!important}
/* gallery chevrons off */
.product-left-section [class*="carousel-control"],.product-left-section .jcarousel-prev,.product-left-section .jcarousel-next{display:none!important}

/* ---------- 16e · Places autocomplete dropdown (LC port, Courtyard tokens) ---------- */
.cpc-ac-host{position:relative}
.cpc-ac{position:absolute;top:calc(100% + 4px);left:0;right:0;background:var(--cpc-surface);border:1px solid var(--cpc-line);border-radius:12px;box-shadow:var(--cpc-shadow);z-index:1045;display:none;overflow:hidden;padding:4px}
.cpc-ac.cpc-x{display:block}
.cpc-ac-item{display:block;width:100%;text-align:left;background:none;border:none;padding:10px 12px;border-radius:8px;font-size:13.5px;color:var(--cpc-text);cursor:pointer}
.cpc-ac-item:hover,.cpc-ac-item.cpc-hi{background:var(--cpc-surface2)}

/* ---------- 17 · Safety / misc ---------- */
button.cpc-injected{appearance:none}
.cpc-reveal{opacity:1!important;transform:none!important}
@media (prefers-reduced-motion:reduce){
  .cpc-cart-panel,.cpc-sheet,.product-thumbnail,.cpc-hero,.cpc-scard img{transition:none!important;animation:none!important}
}

/* ---------- 17 · PDP lightbox (replaces stock bs5-lightbox iframe path — v1.2.7) ---------- */
.cpc-lb{position:fixed;inset:0;z-index:6000;background:rgba(30,30,36,.9);display:none;align-items:center;justify-content:center;padding:24px}
.cpc-lb.cpc-open{display:flex}
body.cpc-lb-lock{overflow:hidden}
.cpc-lb-fig{margin:0;display:flex;flex-direction:column;align-items:center;gap:10px;max-width:min(92vw,1100px);max-height:90vh}
.cpc-lb-fig img{max-width:100%;max-height:82vh;object-fit:contain;background:#fff;border-radius:14px;box-shadow:0 30px 90px rgba(0,0,0,.45)}
.cpc-lb-cap{color:#fdfcf9;font-family:'Inter',system-ui,sans-serif;font-size:12px;letter-spacing:.12em;opacity:.8}
.cpc-lb-x{position:absolute;top:18px;right:22px;width:42px;height:42px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(30,30,36,.6);color:#fff;font-size:26px;line-height:1;cursor:pointer}
.cpc-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(30,30,36,.6);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.cpc-lb-prev{left:22px}.cpc-lb-next{right:22px}
.cpc-lb.cpc-lb-single .cpc-lb-nav{display:none}
.cpc-lb-x:hover,.cpc-lb-nav:hover{background:var(--cpc-accent);border-color:var(--cpc-accent)}
.product-left-section a[data-cpc-lb]{cursor:zoom-in}
@media(max-width:640px){.cpc-lb{padding:10px}.cpc-lb-nav{width:38px;height:38px;font-size:24px}.cpc-lb-prev{left:8px}.cpc-lb-next{right:8px}.cpc-lb-x{top:10px;right:10px}}

/* Product-card prerequisites only; retain all existing dimensions and colors. */
form[data-cpc-option-flow] .cpc-color-first,
form[data-cpc-option-flow] .cpc-color-first > .product-options {
  display: contents;
}
form[data-cpc-option-flow] .cpc-option-locked,
form[data-cpc-option-flow] .logo-location-thumb:disabled {
  opacity: .4;
  filter: grayscale(1);
  cursor: not-allowed;
}
form[data-cpc-option-flow] .cpc-option-locked .cpc-option-locked,
form[data-cpc-option-flow] .cpc-option-locked .logo-location-thumb:disabled {
  opacity: 1;
}

/* Logo artwork containing white needs a contrasting tile background. */
body.cpc-pdp #edit_website_product .logo-location-thumb {
  background-color: #fff;
}
body.cpc-pdp #edit_website_product .logo-location-thumb[data-name*="white" i] {
  background-color: #d3d3d3;
}

/* Logo artwork stays at full contrast; unavailable choices are hidden below. */
body.cpc-pdp #edit_website_product .product-logos-container .select-area.cpc-option-locked,
body.cpc-pdp #edit_website_product .logo-location-thumb:disabled {
  opacity: 1;
  filter: none;
}
body.cpc-pdp #edit_website_product .logo-location-thumb {
  position: relative;
}
body.cpc-pdp #edit_website_product .logo-location-thumb:disabled::after { content: none; }


/* v1.2.13: fit catalog cards inside the available grid width. */
body.cpc-list .product-list{grid-template-columns:repeat(4,minmax(0,1fr))!important}
body.cpc-list .product-list>.product-thumbnail{width:auto!important;min-width:0;margin-left:0!important;margin-right:0!important}
body.cpc-list .product-list>.product-thumbnail .thumbnail-img-container{width:min(202px,100%);min-width:0;min-height:0;height:auto}
body.cpc-list .product-list>.product-thumbnail .thumbnail-img-container a{min-width:0;min-height:0}
body.cpc-list .product-list>.product-thumbnail .thumbnail-img-container img{min-width:0;min-height:0;max-height:100%}
body.cpc-list .product-list>.product-thumbnail .cpc-vrow{flex-wrap:wrap}
body.cpc-list .product-list>.product-thumbnail .cpc-vname{min-width:0;overflow-wrap:anywhere}
@media(max-width:960px){body.cpc-list .product-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* v1.2.14: non-permitted logos are hidden outright (client) */
body.cpc-pdp #edit_website_product .logo-location-thumb.cpc-logo-hidden{display:none!important}

/* v1.2.18: mobile header order, tile swipe affordance and PDP choice placement. */
@media(max-width:991.98px){
  .header-container .cpc-hdr-icons{order:3;margin-left:0;gap:8px;flex:none}
  .header-container .header-navbar>.logo-container{min-width:0;flex:0 1 auto}
  .header-container .header-navbar>.logo-container img{max-width:100%;object-fit:contain}
  .product-list .thumbnail-img-container{touch-action:pan-y pinch-zoom}
  .product-list .thumbnail-img-container img{user-select:none;-webkit-user-drag:none}
  .product-wrapper>.cpc-mobile-pdp-heading{width:100%;flex:0 0 100%;margin:0 0 14px}
  .cpc-mobile-pdp-heading .product-title h2{font-family:var(--cpc-head-font);font-weight:500;font-size:30px;letter-spacing:-.01em;color:var(--cpc-text);margin:0 0 6px}
  .cpc-mobile-pdp-heading .product-price{font-size:24px;font-weight:800;color:var(--cpc-text)}
  .cpc-mobile-pdp-heading .cpc-shipline{margin-bottom:0}
  .product-right-section .product-info>.product-overview{margin-top:24px}
}

/* v1.2.19: centered mobile logo and uncropped homepage imagery. */
@media(max-width:991.98px){
  .header-container .header-navbar>.logo-container{position:absolute;left:50%;transform:translateX(-50%);margin:0;max-width:calc(100% - 190px)}
  .header-container .header-navbar>.logo-container img{display:block;max-width:100%;height:24px!important;object-fit:contain}
}

:is(#cpcFeat,.featured-products .product-list){width:100%;max-width:100%;grid-template-columns:repeat(4,minmax(0,1fr))!important}
:is(#cpcFeat,.featured-products .product-list)>.product-thumbnail{width:auto!important;min-width:0;margin-left:0!important;margin-right:0!important}
@media(max-width:960px){
  :is(#cpcFeat,.featured-products .product-list).product-list{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  :is(#cpcFeat,.featured-products .product-list).product-list>.product-thumbnail{width:auto!important;min-width:0;margin-left:0!important;margin-right:0!important}
  :is(#cpcFeat,.featured-products .product-list) .thumbnail-img-container{width:100%;min-width:0;min-height:0;height:auto;aspect-ratio:1}
  :is(#cpcFeat,.featured-products .product-list) .thumbnail-img-container a{min-width:0;min-height:0;width:100%;height:100%}
  :is(#cpcFeat,.featured-products .product-list) .thumbnail-img-container img{min-width:0;min-height:0;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;transform:none}
  :is(#cpcFeat,.featured-products .product-list) .cpc-vrow{flex-wrap:wrap}
  :is(#cpcFeat,.featured-products .product-list) .cpc-vname{min-width:0;overflow-wrap:anywhere}
  .cpc-scard img{object-fit:contain;transform:none}
  .cpc-hero,.cpc-banner{height:auto;min-height:0;display:block;background-size:100% auto;background-position:center top;padding-top:66.666667%}
  .cpc-hero::after,.cpc-banner::after{display:none}
  .cpc-hero .cpc-hero-inner,.cpc-banner .cpc-banner-inner{position:relative;inset:auto;padding:24px;background:var(--cpc-bg)}
}

/* v1.2.20: match mobile homepage section gutters to the catalog's 14px inset. */
@media(max-width:960px){
  .cpc-wrap.cpc-strip,
  .cpc-wrap.cpc-sect{padding-left:14px;padding-right:14px}
}

/* v1.2.21: client branding. Marketing headlines only use Anton. */
body,input,select,textarea,button{font-family:var(--cpc-body-font)}
h1,h2,h3,h4,h5,h6{font-family:var(--cpc-body-font)}
.cpc-hero h1,.cpc-sect-head h2,.cpc-banner h2{
  font-family:'Anton',Impact,sans-serif;font-weight:400;letter-spacing:0;
  text-transform:uppercase;line-height:1.1;
}
.cpc-hero h1{max-width:none}
.featured-products>h1{display:none}
.featured-products{overflow:visible!important}
.new-item-label{box-shadow:none!important}
@media(max-width:960px){
 .zoomContainer{display:none!important}
 .cpc-hero .cpc-hero-inner{padding:24px 14px 32px}
}

/* v1.2.27: equal Bestsellers cards, including rows with longer names or more colors. */
:is(#cpcFeat,.featured-products .product-list){align-items:stretch;grid-auto-rows:1fr}
:is(#cpcFeat,.featured-products .product-list)>.product-thumbnail{height:100%;box-sizing:border-box}
:is(#cpcFeat,.featured-products .product-list) .thumbnail-img-container{flex:none;width:100%;min-width:0;min-height:0;height:auto;aspect-ratio:1}
:is(#cpcFeat,.featured-products .product-list) .thumbnail-img-container img{min-width:0;min-height:0;width:100%;height:100%;object-fit:contain}
:is(#cpcFeat,.featured-products .product-list) .cpc-colorline{margin-top:auto}

/* 2026-09-30: full-width desktop hero with capped height; full artwork on mobile. */
@media(min-width:961px){
  .cpc-hero{width:100%;max-width:none;margin:0;height:min(44vw,560px);min-height:0;background-size:cover;background-position:center}
}
@media(max-width:960px){
  .cpc-hero{padding-top:43.93358876%;background-size:100% auto}
}