/* Celine Claire commerce pages — cart, checkout, account, order received.
   Loaded only on those screens. Tokens come from drawer.css. */

body.cc-cx{background:var(--ccx-paper);color:var(--ccx-ink)}
body.cc-cx .entry-content,
body.cc-cx .site-main{max-width:none;margin:0;padding:0}

/* the theme's own page title never competes with our single H1 */
body.cc-cx .entry-header,
body.cc-cx .page-header,
body.cc-cx h1.entry-title,
body.cc-cx .elementor-page-title{display:none!important}

body.cc-cx .woocommerce{font-family:var(--ccx-body)}

/* WooCommerce notices, kept near the action they belong to */
body.cc-cx .woocommerce-notices-wrapper{max-width:1240px;margin:0 auto;padding:0 24px}
body.cc-cx .woocommerce-message,
body.cc-cx .woocommerce-info,
body.cc-cx .woocommerce-error{
  background:var(--ccx-ivory);border:1px solid var(--ccx-rule);border-left:2px solid var(--ccx-sage);
  border-radius:2px;color:var(--ccx-ink);font-size:14.5px;line-height:1.55;
  padding:14px 18px 14px 46px;margin:14px 0;list-style:none;
}
/* WooCommerce sets its own icon glyph on the notice with position:absolute;
   the extra left padding above is the room it needs, and this pins it there
   instead of letting it land on top of the first word. */
body.cc-cx .woocommerce-message::before,
body.cc-cx .woocommerce-info::before,
body.cc-cx .woocommerce-error::before{
  left:18px;top:15px;color:var(--ccx-sage);font-size:15px;line-height:1;
}
body.cc-cx .woocommerce-error::before{color:var(--ccx-danger)}
body.cc-cx .woocommerce-error li,
body.cc-cx .woocommerce-message li,
body.cc-cx .woocommerce-info li{margin:0;padding:0;list-style:none}
body.cc-cx .woocommerce-error{border-left-color:var(--ccx-danger);background:rgba(176,74,42,.06)}
body.cc-cx .woocommerce-message a.button,
body.cc-cx .woocommerce-info a.button{
  background:transparent;border:1px solid var(--ccx-ink);color:var(--ccx-ink);
  font-family:var(--ccx-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  padding:9px 16px;border-radius:2px;margin-left:12px;
}

/* ================================================================= cart */
.cc-cart{max-width:1240px;margin:0 auto;padding:34px 24px 72px}
.cc-cart__crumbs{font-size:13px;color:var(--ccx-muted);display:flex;gap:8px;align-items:center;margin-bottom:22px}
.cc-cart__crumbs a{color:var(--ccx-muted);text-decoration:none}
.cc-cart__crumbs a:hover{color:var(--ccx-ink);text-decoration:underline}

.cc-cart__head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:30px}
.cc-cart__h1{
  margin:0;font-family:var(--ccx-disp);font-weight:400;font-size:clamp(44px,6vw,72px);
  line-height:.98;letter-spacing:-.01em;color:var(--ccx-ink);
}
.cc-cart__count{margin:10px 0 0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ccx-muted)}
.cc-cart__say{margin:0 0 8px;font-family:var(--ccx-disp);font-style:italic;font-size:22px;line-height:1.25;color:var(--ccx-muted);text-align:right;max-width:20ch}

.cc-cart__grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:56px;align-items:start}
.cc-cart__side{position:sticky;top:24px}

.cc-cart__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--ccx-rule)}
.cc-cart__item{display:flex;gap:26px;padding:30px 0;border-bottom:1px solid var(--ccx-rule)}
.cc-cart__thumb{flex:0 0 132px;width:132px}
.cc-cart__thumb img{width:100%;height:auto;display:block;border-radius:2px;background:var(--ccx-ivory)}
.cc-cart__body{flex:1 1 auto;min-width:0}
.cc-cart__topline{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.cc-cart__name{margin:0;font-family:var(--ccx-body);font-size:19px;font-weight:500;line-height:1.3}
.cc-cart__name a{color:var(--ccx-ink);text-decoration:none}
.cc-cart__name a:hover,.cc-cart__name a:focus-visible{text-decoration:underline}
.cc-cart__price{margin:0;font-size:19px;font-variant-numeric:tabular-nums;white-space:nowrap}
.cc-cart__var{margin:6px 0 0;font-size:13px;color:var(--ccx-muted)}
.cc-cart__var p{margin:0}
.cc-cart__blurb{margin:8px 0 0;font-size:14px;line-height:1.5;color:var(--ccx-muted);max-width:46ch}
.cc-cart__ctl{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:18px}
.cc-cart__acts{margin:0;display:flex;align-items:center;gap:10px;font-size:14px}
.cc-cart__rm,.cc-cart__save{
  background:none;border:0;padding:2px;cursor:pointer;font-family:var(--ccx-body);font-size:14px;
  color:var(--ccx-muted);text-decoration:underline;text-underline-offset:3px;
}
.cc-cart__rm:hover{color:var(--ccx-danger)}
.cc-cart__save:hover{color:var(--ccx-ink)}
.cc-cart__sep{color:var(--ccx-rule-strong)}
.cc-cart__single{margin:0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ccx-muted)}

.cc-cart__formacts{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:22px 0 0}
/* Discount code — shown open, not behind a toggle. See the shared panel
   treatment further down; cart and checkout use the same one. */
.cc-cart__coupon{font-size:14px;flex:1 1 340px}
.cc-cart__coupon-in{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin-top:14px}
.cc-cart__coupon-in .input-text{
  min-height:48px;padding:12px 14px;border:1px solid var(--ccx-rule);border-radius:2px;
  background:#fff;font-family:var(--ccx-body);font-size:15px;color:var(--ccx-ink);min-width:180px;
}
.cc-cart__coupon-in .input-text:focus{outline:2px solid var(--ccx-ink);outline-offset:1px}
.cc-cart__update{background:none;border:0;cursor:pointer;padding:4px 2px}

/* summary card */
.cc-sumcard{border:1px solid var(--ccx-rule-strong);border-radius:2px;background:#fff;padding:26px 26px 24px}
.cc-sumcard__ship{display:flex;align-items:center;gap:10px;margin:0 0 18px;padding:0 0 18px;border-bottom:1px solid var(--ccx-rule);font-size:15px}
.cc-sumcard__ship .cc-ic{color:var(--ccx-ink)}
.cc-sumcard__acts{margin-top:20px;display:flex;flex-direction:column;gap:12px}
.cc-sumcard__acts .checkout-button,
.cc-sumcard__acts .cc-btn{width:100%}
.cc-sumcard .cc-sum__shipdetail:empty{display:none}

/* --- No stock WooCommerce purple anywhere in the scoped experience. ---------
   WooCommerce ships `.woocommerce a.button.alt{background-color:#a46497}` with
   high specificity, so these overrides are deliberately forceful and scoped to
   our commerce screens only. */
body.cc-cx .woocommerce a.button.alt,
body.cc-cx .woocommerce button.button.alt,
body.cc-cx .woocommerce input.button.alt,
body.cc-cx .woocommerce #respond input#submit.alt,
body.cc-cx a.checkout-button.button.alt,
body.cc-cx #place_order,
body.cc-cx button#place_order{
  background-color:var(--ccx-ink)!important;
  background-image:none!important;
  color:var(--ccx-ivory)!important;
  -webkit-text-fill-color:var(--ccx-ivory)!important;
  border-color:var(--ccx-ink)!important;
  text-shadow:none!important;
}
body.cc-cx .woocommerce a.button.alt:hover,
body.cc-cx .woocommerce button.button.alt:hover,
body.cc-cx .woocommerce input.button.alt:hover,
body.cc-cx a.checkout-button.button.alt:hover,
body.cc-cx #place_order:hover,
body.cc-cx button#place_order:hover{
  background-color:var(--ccx-amber)!important;
  color:var(--ccx-ink)!important;
  -webkit-text-fill-color:var(--ccx-ink)!important;
  border-color:var(--ccx-amber)!important;
}
body.cc-cx .woocommerce a.button,
body.cc-cx .woocommerce button.button,
body.cc-cx .woocommerce input.button{
  background-color:transparent;color:var(--ccx-ink);border:1px solid var(--ccx-ink);
  border-radius:2px;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:500;min-height:44px;
}

/* WooCommerce's own proceed-to-checkout button, wearing our primary style */
body.cc-cx .wc-proceed-to-checkout{padding:0;margin:0}
body.cc-cx a.checkout-button{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;
  min-height:52px;padding:15px 26px;margin:0;
  background:var(--ccx-ink);color:var(--ccx-ivory);-webkit-text-fill-color:var(--ccx-ivory);
  border:1px solid var(--ccx-ink);border-radius:2px;
  font-family:var(--ccx-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  text-decoration:none;transition:background var(--ccx-dur) ease,color var(--ccx-dur) ease;
}
body.cc-cx a.checkout-button:hover,body.cc-cx a.checkout-button:focus-visible{
  background:var(--ccx-amber);color:var(--ccx-ink);-webkit-text-fill-color:var(--ccx-ink);border-color:var(--ccx-amber);
}
body.cc-cx a.checkout-button:focus-visible{outline:2px solid var(--ccx-ink);outline-offset:3px}

.cc-trust--stack{flex-direction:column;gap:14px;margin-top:22px}
.cc-trust--stack .cc-trust__i{align-items:flex-start;gap:11px;font-size:13px}
.cc-trust--stack .cc-trust__i .cc-ic{margin-top:2px;color:var(--ccx-ink)}
.cc-trust--stack strong{display:block;font-weight:500;color:var(--ccx-ink);font-size:13.5px}
.cc-trust--stack em{display:block;font-style:normal;color:var(--ccx-muted);font-size:12.5px;margin-top:2px}

/* empty state */
.cc-empty{max-width:640px;margin:0 auto;padding:90px 0 110px;text-align:center}
.cc-empty__h{margin:0;font-family:var(--ccx-disp);font-weight:400;font-size:clamp(36px,5vw,54px);line-height:1.02;color:var(--ccx-ink)}
.cc-empty__p{margin:16px 0 0;font-size:16px;line-height:1.6;color:var(--ccx-muted)}
.cc-empty__acts{margin-top:30px;display:flex;flex-direction:column;align-items:center;gap:14px}

/* cross-sells */
.cc-xsell{margin-top:64px;padding-top:44px;border-top:1px solid var(--ccx-rule);display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:48px;align-items:start}
.cc-xsell__eye{margin:0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--ccx-muted)}
.cc-xsell__h{margin:12px 0 0;font-family:var(--ccx-disp);font-weight:400;font-size:clamp(32px,4vw,46px);line-height:1.02;color:var(--ccx-ink)}
.cc-xsell__p{margin:14px 0 0;font-size:15px;line-height:1.55;color:var(--ccx-muted);max-width:34ch}
.cc-xsell__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:32px}
.cc-xsell__img{display:block;background:var(--ccx-ivory);border-radius:2px}
.cc-xsell__img img{width:100%;height:auto;display:block;border-radius:2px}
.cc-xsell__n{margin:16px 0 0;font-size:16px;font-weight:500;line-height:1.35}
.cc-xsell__n a{color:var(--ccx-ink);text-decoration:none}
.cc-xsell__n a:hover{text-decoration:underline}
.cc-xsell__pr{margin:6px 0 0;font-size:15px;color:var(--ccx-ink)}
.cc-xsell__pr del{color:var(--ccx-muted);margin-right:6px}
.cc-xsell__meta .cc-xsell__add,
.cc-xsell__meta a.button{
  display:inline-flex;align-items:center;justify-content:center;margin-top:14px;min-height:44px;padding:12px 20px;
  background:transparent;border:1px solid var(--ccx-ink);color:var(--ccx-ink);-webkit-text-fill-color:var(--ccx-ink);
  border-radius:2px;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
}
.cc-xsell__meta a.button:hover{background:var(--ccx-ink);color:var(--ccx-ivory);-webkit-text-fill-color:var(--ccx-ivory)}

@media(max-width:1080px){
  .cc-cart__grid{grid-template-columns:minmax(0,1fr) 340px;gap:36px}
  .cc-xsell{grid-template-columns:1fr;gap:28px}
}
@media(max-width:900px){
  .cc-cart{padding:24px 18px 56px}
  .cc-cart__grid{grid-template-columns:1fr;gap:34px}
  .cc-cart__side{position:static}
  .cc-cart__say{text-align:left;max-width:none;margin-top:6px}
  .cc-cart__thumb{flex:0 0 92px;width:92px}
  .cc-cart__item{gap:16px;padding:22px 0}
  .cc-cart__name,.cc-cart__price{font-size:16px}
  .cc-cart__topline{flex-direction:column;gap:4px}
  .cc-cart__price{align-self:flex-start}
  .cc-cart__h1{font-size:clamp(38px,11vw,52px)}
}
@media(max-width:420px){
  .cc-cart{padding:20px 14px 48px}
  .cc-cart__ctl{gap:14px}
  .cc-cart__coupon-in{flex-direction:column;align-items:stretch}
  .cc-cart__coupon-in .cc-btn{width:100%}
}

@media (prefers-reduced-motion: reduce){
  body.cc-cx *{transition:none!important;animation:none!important}
}

/* ============================================================= checkout */
/* Distraction-reduced header: the normal site header/nav is hidden here only. */
body.cc-cx-checkout [data-elementor-type="header"],
body.cc-cx-checkout header#masthead,
body.cc-cx-checkout .cc-hdr,
body.cc-cx-checkout .site-header{display:none!important}

.cc-co-head{border-bottom:1px solid var(--ccx-rule);background:var(--ccx-paper)}
.cc-co-head__in{
  max-width:1400px;margin:0 auto;padding:20px 28px;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;
}
.cc-co-head__tag{
  margin:0;font-family:var(--ccx-mono);font-size:10px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--ccx-muted);line-height:1.8;
}
.cc-co-head__logo{justify-self:center;line-height:0}
.cc-co-head__logo img{width:auto;height:52px;max-width:220px;object-fit:contain;display:block}
.cc-co-head__back{
  justify-self:end;display:inline-flex;align-items:center;gap:8px;min-height:44px;
  font-size:14px;color:var(--ccx-ink);text-decoration:underline;text-underline-offset:4px;
}
.cc-co-head__back .cc-ic{transform:rotate(180deg)}
.cc-co-head__back:hover{text-decoration-color:var(--ccx-amber)}

.cc-co{max-width:1400px;margin:0 auto;padding:36px 28px 80px}
.cc-co__grid{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:64px;align-items:start}
.cc-co__eye{margin:0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ccx-muted)}
.cc-co__h1{margin:10px 0 0;font-family:var(--ccx-disp);font-weight:400;font-size:clamp(42px,5.4vw,66px);line-height:.98;letter-spacing:-.01em}
.cc-co__signin{margin:10px 0 0;font-size:15px;color:var(--ccx-muted)}
.cc-co__signin a{color:var(--ccx-ink);text-decoration:underline;text-underline-offset:4px}

.cc-co__step{margin-top:38px}
.cc-co__steph{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-family:var(--ccx-body);font-size:20px;font-weight:500;color:var(--ccx-ink)}
.cc-co__num{
  display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  background:var(--ccx-amber);color:var(--ccx-ink);border-radius:999px;
  font-family:var(--ccx-mono);font-size:12px;font-weight:600;flex:0 0 auto;
}
.cc-co__pending{margin:0;font-size:14px;color:var(--ccx-muted)}

/* native WooCommerce fields, wearing the house style */
body.cc-cx .woocommerce form .form-row{padding:0;margin:0 0 16px;display:block}
body.cc-cx .woocommerce form .form-row label,
body.cc-cx .cc-co-label{
  display:block;font-family:var(--ccx-mono);font-size:10.5px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ccx-muted);margin-bottom:7px;font-weight:500;
}
body.cc-cx .woocommerce form .form-row label .required{color:var(--ccx-danger);text-decoration:none;margin-left:3px}
body.cc-cx .woocommerce form .form-row .optional{color:var(--ccx-muted);text-transform:none;letter-spacing:0}
body.cc-cx .woocommerce form .form-row input.input-text,
body.cc-cx .woocommerce form .form-row textarea,
body.cc-cx .woocommerce form .form-row select,
body.cc-cx .woocommerce .select2-container .select2-selection--single{
  width:100%;min-height:50px;padding:13px 14px;background:#fff;color:var(--ccx-ink);
  border:1px solid var(--ccx-rule);border-radius:2px;font-family:var(--ccx-body);font-size:15.5px;box-shadow:none;
}
body.cc-cx .woocommerce form .form-row textarea{min-height:110px;line-height:1.5}
body.cc-cx .woocommerce form .form-row input.input-text:focus,
body.cc-cx .woocommerce form .form-row textarea:focus,
body.cc-cx .woocommerce form .form-row select:focus{outline:2px solid var(--ccx-ink);outline-offset:1px;border-color:var(--ccx-ink)}
body.cc-cx .woocommerce .select2-container--focus .select2-selection--single{outline:2px solid var(--ccx-ink);outline-offset:1px}
body.cc-cx .woocommerce .select2-container .select2-selection--single .select2-selection__rendered{line-height:24px;padding:0;color:var(--ccx-ink)}
body.cc-cx .woocommerce .select2-container .select2-selection--single .select2-selection__arrow{top:12px;right:8px}
body.cc-cx .woocommerce form .form-row.woocommerce-invalid input.input-text,
body.cc-cx .woocommerce form .form-row.woocommerce-invalid select{border-color:var(--ccx-danger)}
body.cc-cx .woocommerce form .form-row .woocommerce-input-wrapper > span.description{display:block;margin-top:6px;font-size:13px;color:var(--ccx-danger)}

/* two-up rows, as in the reference */
.cc-co__stepbody .form-row-first,.cc-co__stepbody .form-row-last{width:calc(50% - 8px);display:inline-block;vertical-align:top}
.cc-co__stepbody .form-row-first{margin-right:16px}
@media(max-width:640px){
  .cc-co__stepbody .form-row-first,.cc-co__stepbody .form-row-last{width:100%;margin-right:0}
}

.cc-co-consent{margin:14px 0 4px}
.cc-co-consent label{display:flex;gap:11px;align-items:flex-start;font-family:var(--ccx-body);font-size:14px;
  letter-spacing:0;text-transform:none;color:var(--ccx-ink);line-height:1.5;cursor:pointer}
.cc-co-consent input[type=checkbox]{margin-top:2px;width:17px;height:17px;flex:0 0 auto;accent-color:var(--ccx-ink)}

.cc-co__shipmethods ul,
body.cc-cx ul#shipping_method{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
body.cc-cx ul#shipping_method li{margin:0;padding:0}
body.cc-cx ul#shipping_method label{
  display:flex;align-items:center;gap:12px;padding:15px 18px;border:1px solid var(--ccx-rule);
  border-radius:2px;background:var(--ccx-ivory);font-family:var(--ccx-body);font-size:15px;
  letter-spacing:0;text-transform:none;color:var(--ccx-ink);margin:0;cursor:pointer;min-height:52px;
}
body.cc-cx ul#shipping_method input[type=radio]{width:18px;height:18px;accent-color:var(--ccx-ink);flex:0 0 auto}
.cc-co__shipmethods .woocommerce-shipping-destination{margin-top:10px;font-size:13px;color:var(--ccx-muted)}

.cc-co__notes{margin-top:30px;font-size:15px}
.cc-co__notes summary{cursor:pointer;list-style:none;color:var(--ccx-ink);display:inline-flex;align-items:center;gap:8px;min-height:44px}
.cc-co__notes summary::-webkit-details-marker{display:none}
.cc-co__terms{margin-top:22px}

/* order summary card */
.cc-co__side{position:sticky;top:24px}

/* The sticky summary never actually stuck: a sitewide
   `html, body{overflow-x:hidden !important}` makes the used overflow-y compute to
   `auto`, which turns BODY into a scroll container - and position:sticky then
   resolves against that scrollport instead of the viewport, so the card just
   scrolled away with the page.

   `clip` clips identically but does NOT create a scroll container, so overflow-y
   stays `visible` and sticky works again. Only BODY needs it; HTML can keep
   `hidden`, because HTML is the document scroller and sticky resolves against it
   correctly. Scoped to checkout and to desktop, where the summary is sticky at
   all - on a phone it is static and sits below the fields.

   The height cap is the other half of "keep the button handy": a long order
   could otherwise make the card taller than the viewport and push Place order
   off the bottom, where sticky can never bring it back. */
@media(min-width:901px){
  body.woocommerce-checkout{overflow-x:clip !important;overflow-y:visible !important}
  .cc-co__side{max-height:calc(100vh - 48px);overflow-y:auto;overscroll-behavior:contain}
}
.cc-co__card{background:var(--ccx-ivory);border:1px solid var(--ccx-rule);border-radius:2px;padding:26px}
.cc-co__card.is-updating{opacity:.7;transition:opacity 120ms ease}
.cc-co__cardh{margin:0 0 18px;font-family:var(--ccx-disp);font-weight:400;font-size:30px;line-height:1.1}
.cc-co__cardn{font-family:var(--ccx-body);font-size:16px;color:var(--ccx-muted);margin-left:6px}
body.cc-cx .woocommerce-checkout-review-order-table{width:100%;border:0;border-collapse:collapse;margin:0}
body.cc-cx .woocommerce-checkout-review-order-table thead{display:none}
body.cc-cx .woocommerce-checkout-review-order-table th,
body.cc-cx .woocommerce-checkout-review-order-table td{
  border:0;padding:10px 0;font-size:14.5px;color:var(--ccx-ink);vertical-align:top;background:transparent;
}
body.cc-cx .woocommerce-checkout-review-order-table tbody tr{border-bottom:1px solid var(--ccx-rule)}
body.cc-cx .woocommerce-checkout-review-order-table .product-name{font-weight:500;line-height:1.4}
body.cc-cx .woocommerce-checkout-review-order-table .product-quantity{color:var(--ccx-muted);font-weight:400}
body.cc-cx .woocommerce-checkout-review-order-table .product-total,
body.cc-cx .woocommerce-checkout-review-order-table td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
body.cc-cx .woocommerce-checkout-review-order-table tfoot th{font-weight:400;color:var(--ccx-muted)}
body.cc-cx .woocommerce-checkout-review-order-table tfoot tr.order-total th,
body.cc-cx .woocommerce-checkout-review-order-table tfoot tr.order-total td{
  border-top:1px solid var(--ccx-rule);padding-top:16px;font-size:19px;color:var(--ccx-ink);
}
body.cc-cx .woocommerce-checkout-review-order-table tfoot tr.order-total th{font-family:var(--ccx-disp);font-size:26px;font-style:italic}

/* payment area, including the honest staging empty state */
body.cc-cx #payment{background:transparent;border-radius:0}
body.cc-cx #payment ul.payment_methods{border:0;padding:0;margin:0;list-style:none}
body.cc-cx #payment ul.payment_methods li{margin:0 0 10px}
body.cc-cx #payment ul.payment_methods label{
  display:flex;align-items:center;gap:12px;padding:15px 18px;border:1px solid var(--ccx-rule);
  border-radius:2px;background:#fff;font-family:var(--ccx-body);font-size:15px;letter-spacing:0;
  text-transform:none;color:var(--ccx-ink);margin:0;min-height:52px;
}
body.cc-cx #payment .woocommerce-notice,
body.cc-cx #payment .woocommerce-info{margin:0}
body.cc-cx #payment div.form-row.place-order{padding:0;margin:0}
body.cc-cx #payment .payment_box{background:var(--ccx-ivory);border-radius:2px;padding:14px 16px;font-size:14px}
body.cc-cx #payment .payment_box::before{display:none}

.cc-co__placeslot{margin-top:18px}
body.cc-cx #place_order{
  width:100%;min-height:56px;padding:16px 26px;border-radius:2px;
  font-family:var(--ccx-mono);font-size:12.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  cursor:pointer;
}
body.cc-cx #place_order[disabled],body.cc-cx #place_order[aria-busy="true"]{opacity:.6;cursor:progress}
body.cc-cx #place_order:focus-visible{outline:2px solid var(--ccx-ink);outline-offset:3px}

.cc-co__secure{display:flex;align-items:flex-start;gap:11px;margin:18px 0 0;font-size:13px}
.cc-co__secure strong{display:block;font-weight:500;font-size:13.5px;color:var(--ccx-ink)}
.cc-co__secure em{display:block;font-style:normal;color:var(--ccx-muted);font-size:12.5px;margin-top:2px}
.cc-trust--row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px;border-top:1px solid var(--ccx-rule);padding-top:18px}
.cc-trust--row .cc-trust__i{align-items:flex-start;gap:9px;font-size:12px}
.cc-trust--row strong{display:block;font-weight:500;color:var(--ccx-ink);font-size:12.5px}
.cc-trust--row strong a{color:var(--ccx-ink);text-decoration:underline;text-underline-offset:3px}
.cc-trust--row em{display:block;font-style:normal;color:var(--ccx-muted);font-size:11.5px;margin-top:2px}

body.cc-cx .woocommerce-terms-and-conditions-wrapper{font-size:14px}
body.cc-cx .woocommerce-privacy-policy-text p{font-size:13.5px;color:var(--ccx-muted);line-height:1.55}
body.cc-cx .woocommerce-form__label-for-checkbox{display:flex;gap:11px;align-items:flex-start;font-family:var(--ccx-body);
  font-size:14px;letter-spacing:0;text-transform:none;color:var(--ccx-ink);line-height:1.5}
body.cc-cx .woocommerce-form__input-checkbox{width:17px;height:17px;margin-top:2px;accent-color:var(--ccx-ink);flex:0 0 auto}

@media(max-width:1100px){
  .cc-co__grid{grid-template-columns:minmax(0,1fr) 360px;gap:40px}
}
@media(max-width:900px){
  .cc-co{padding:26px 18px 64px}
  .cc-co__grid{grid-template-columns:1fr;gap:34px}
  /* The summary and Place order used to sit ABOVE the fields here (order:-1).
     On a phone that meant filling the whole form and then scrolling back up to
     pay. Leave them in source order so the page reads top to bottom: fields,
     express wallet (moved down by checkout.js), summary, Place order. */
  .cc-co__side{position:static;order:0}
  .cc-co__main #wc-square-digital-wallet{padding-top:0;margin-top:8px}
  .cc-co-head__in{grid-template-columns:1fr auto;gap:14px;padding:16px 18px}
  .cc-co-head__tag{display:none}
  .cc-co-head__logo{justify-self:start}
  .cc-co-head__logo img{height:42px}
}

/* ============================================================== account */
body.cc-cx.woocommerce-account .woocommerce{
  max-width:1320px;margin:0 auto;padding:0 28px 80px;
  display:grid;grid-template-columns:250px minmax(0,1fr);gap:52px;align-items:start;
}
.cc-ac__hero{
  grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end;
  padding:44px 0 40px;border-bottom:1px solid var(--ccx-rule);margin-bottom:12px;
}
.cc-ac__eye{margin:0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ccx-muted)}
.cc-ac__h1{margin:14px 0 0;font-family:var(--ccx-disp);font-weight:400;font-size:clamp(40px,5.6vw,68px);line-height:.98;letter-spacing:-.01em}
.cc-ac__sub{margin:14px 0 0;font-size:16px;color:var(--ccx-muted);max-width:52ch;line-height:1.55}
.cc-ac__say{margin:0;font-family:var(--ccx-disp);font-style:italic;font-size:22px;line-height:1.35;color:var(--ccx-muted);text-align:right}

.cc-ac__nav ul{list-style:none;margin:0;padding:0}
.cc-ac__nav li{margin:0}
.cc-ac__nav li a{
  display:flex;align-items:center;gap:12px;padding:13px 16px;min-height:46px;
  color:var(--ccx-muted);text-decoration:none;font-size:15px;
  border-left:2px solid transparent;transition:color var(--ccx-dur) ease,border-color var(--ccx-dur) ease;
}
.cc-ac__nav li a:hover{color:var(--ccx-ink)}
.cc-ac__nav li a:focus-visible{outline:2px solid var(--ccx-ink);outline-offset:-2px}
.cc-ac__nav li.is-active a{color:var(--ccx-ink);border-left-color:var(--ccx-amber);font-weight:500}
.cc-ac__ic{flex:0 0 auto}
.cc-ac__navfoot{margin-top:38px;padding-top:26px;border-top:1px solid var(--ccx-rule)}
.cc-ac__navsay{margin:0;font-family:var(--ccx-disp);font-style:italic;font-size:19px;color:var(--ccx-ink);line-height:1.3}
.cc-ac__navbrand{margin:22px 0 0}
.cc-ac__navbrand span{display:block;font-family:var(--ccx-disp);font-size:15px;color:var(--ccx-ink)}
.cc-ac__navbrand em{display:block;font-style:normal;font-family:var(--ccx-mono);font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ccx-muted);margin-top:5px}

body.cc-cx .woocommerce-MyAccount-content{padding:0;margin:0}
.cc-ac__cards{display:flex;flex-direction:column;gap:22px}
.cc-ac__card{border:1px solid var(--ccx-rule);border-radius:2px;background:#fff;padding:26px 28px}
.cc-ac__cardhead{display:flex;align-items:baseline;justify-content:space-between;gap:18px;flex-wrap:wrap}
.cc-ac__cardh{margin:0;font-family:var(--ccx-disp);font-weight:400;font-size:28px;line-height:1.1}
.cc-ac__cardp{margin:10px 0 0;font-size:15px;color:var(--ccx-muted);line-height:1.55}
.cc-ac__more{display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--ccx-ink);
  text-decoration:underline;text-underline-offset:4px;min-height:44px}
.cc-ac__more:hover{text-decoration-color:var(--ccx-amber)}
.cc-ac__helplinks{display:flex;gap:26px;flex-wrap:wrap;margin:12px 0 0}

.cc-ac__order{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:16px 26px;align-items:center;margin-top:20px;
  border:1px solid var(--ccx-rule);border-radius:2px;padding:20px 22px}
.cc-ac__ordermeta{grid-column:1;grid-row:1}
.cc-ac__ordernum{margin:0;font-size:16px;font-weight:500}
.cc-ac__orderdate{margin:4px 0 0;font-size:13.5px;color:var(--ccx-muted)}
.cc-ac__total{margin:12px 0 0;font-size:17px;font-variant-numeric:tabular-nums}
.cc-ac__count{margin:3px 0 0;font-size:13.5px;color:var(--ccx-muted)}
.cc-ac__status{
  grid-column:1;grid-row:2;justify-self:start;margin:0;padding:5px 12px;border-radius:2px;
  background:var(--ccx-sand);color:var(--ccx-ink);
  font-family:var(--ccx-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
}
.cc-ac__status--processing{background:rgba(201,150,46,.22)}
.cc-ac__status--completed{background:rgba(124,143,114,.22)}
.cc-ac__status--cancelled,.cc-ac__status--failed{background:rgba(176,74,42,.14);color:var(--ccx-danger)}
.cc-ac__thumbs{grid-column:2;grid-row:1/3;list-style:none;display:flex;gap:12px;margin:0;padding:0;flex-wrap:wrap;align-self:center}
.cc-ac__thumbs li{width:66px}
.cc-ac__thumbs img{width:100%;height:auto;display:block;border-radius:2px;background:var(--ccx-ivory)}
.cc-ac__view{grid-column:3;grid-row:1/3;justify-self:end;align-self:center}
.cc-ac__badge{display:inline-block;margin:18px 0 10px;padding:5px 12px;background:var(--ccx-sand);border-radius:2px;
  font-family:var(--ccx-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ccx-ink)}
.cc-ac__addr{margin:0;font-style:normal;font-size:15px;line-height:1.65;color:var(--ccx-ink)}
.cc-ac__note{margin:14px 0 12px;font-size:14px;color:var(--ccx-danger)}
.cc-ac__empty{margin-top:18px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.cc-ac__empty p{margin:0;font-size:15px;color:var(--ccx-muted)}

/* account tables + forms keep WooCommerce behaviour, house styling */
body.cc-cx .woocommerce-MyAccount-content table.shop_table{border:1px solid var(--ccx-rule);border-radius:2px;border-collapse:collapse;width:100%;background:#fff}
body.cc-cx .woocommerce-MyAccount-content table.shop_table th,
body.cc-cx .woocommerce-MyAccount-content table.shop_table td{border:0;border-bottom:1px solid var(--ccx-rule);padding:14px 16px;font-size:14.5px}
body.cc-cx .woocommerce-MyAccount-content table.shop_table thead th{
  font-family:var(--ccx-mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ccx-muted);font-weight:500}
body.cc-cx .woocommerce-MyAccount-content h2,
body.cc-cx .woocommerce-MyAccount-content h3{font-family:var(--ccx-disp);font-weight:400;font-size:26px;margin:0 0 14px}

/* Stock WooCommerce auth forms that we do NOT own: the "returning customer"
   form on checkout and the order-received login gate. The My Account templates
   carry .cc-auth__form and are styled by the signed-out block at the end of
   this file, so they are excluded here rather than fighting it. */
body.cc-cx .woocommerce form.login:not(.cc-auth__form),
body.cc-cx .woocommerce form.register:not(.cc-auth__form),
body.cc-cx .woocommerce form.lost_reset_password:not(.cc-auth__form){
  border:1px solid var(--ccx-rule);border-radius:2px;background:#fff;padding:30px 30px 26px;margin:26px 0 0;max-width:520px;
}
body.cc-cx .woocommerce form.login:not(.cc-auth__form) .button,
body.cc-cx .woocommerce form.register:not(.cc-auth__form) .button,
body.cc-cx .woocommerce form.lost_reset_password:not(.cc-auth__form) .button{
  width:100%;background-color:var(--ccx-ink)!important;color:var(--ccx-ivory)!important;
  -webkit-text-fill-color:var(--ccx-ivory)!important;border-color:var(--ccx-ink)!important;min-height:50px;
}
body.cc-cx .woocommerce-LostPassword{margin-top:14px;font-size:14px}

@media(max-width:900px){
  body.cc-cx.woocommerce-account .woocommerce{grid-template-columns:1fr;gap:28px;padding:0 18px 64px}
  .cc-ac__hero{grid-template-columns:1fr;gap:14px;padding:30px 0 26px}
  .cc-ac__say{text-align:left}
  .cc-ac__nav{border:1px solid var(--ccx-rule);border-radius:2px;padding:6px}
  .cc-ac__nav ul{display:flex;flex-wrap:wrap;gap:4px}
  .cc-ac__nav li a{border-left:0;border-bottom:2px solid transparent;padding:11px 13px}
  .cc-ac__nav li.is-active a{border-left:0;border-bottom-color:var(--ccx-amber)}
  .cc-ac__navfoot{display:none}
  .cc-ac__order{grid-template-columns:1fr;gap:14px}
  .cc-ac__thumbs,.cc-ac__view,.cc-ac__status{grid-column:1;grid-row:auto;justify-self:start}
  .cc-ac__card{padding:22px 20px}
  .cc-trust--row{grid-template-columns:1fr}
}

/* ------- checkout refinements ------------------------------------------ */
/* The numbered step headings already name these groups; WooCommerce's own
   "Billing details" / "Ship to a different address?" headings would repeat them. */
body.cc-cx-checkout .woocommerce-billing-fields > h3,
body.cc-cx-checkout .woocommerce-additional-fields > h3{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.cc-cx-checkout #ship-to-different-address{margin:22px 0 12px}
body.cc-cx-checkout #ship-to-different-address .woocommerce-form__label-for-checkbox span{
  font-family:var(--ccx-body);font-size:15px;letter-spacing:0;text-transform:none;color:var(--ccx-ink);font-weight:500}

.cc-co__shipsingle{margin:0;padding:15px 18px;border:1px solid var(--ccx-rule);border-radius:2px;
  background:var(--ccx-ivory);font-size:15px;color:var(--ccx-ink);min-height:52px;display:flex;align-items:center}

/* Everything WooCommerce prints on woocommerce_before_checkout_form — notices
   and the coupon disclosure — now sits inside the page frame, aligned with the
   main column rather than running edge to edge. */
.cc-co__pre{max-width:calc(100% - 430px - 64px);margin:0 0 20px}
@media(max-width:1080px){.cc-co__pre{max-width:none}}
body.cc-cx-checkout .cc-co__pre .woocommerce-notices-wrapper{max-width:none;padding:0;margin:0}

/* quiet coupon disclosure at the top of checkout */
body.cc-cx-checkout .woocommerce-form-coupon-toggle .woocommerce-info{
  background:transparent;border:0;border-left:2px solid var(--ccx-rule);padding:8px 0 8px 14px;
  font-size:14px;color:var(--ccx-muted);margin:0 0 18px}
/* This one is a quiet one-line disclosure, not an alert, so WooCommerce's
   absolutely-positioned notice glyph is dropped rather than padded around —
   it was landing on top of the first letter. */
body.cc-cx-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before{content:none;display:none}
body.cc-cx-checkout .woocommerce-form-coupon-toggle .woocommerce-info a{color:var(--ccx-ink);text-decoration:underline;text-underline-offset:3px}
body.cc-cx-checkout form.checkout_coupon{padding-bottom:6px}
.cc-co__couponp{margin:0 0 16px;font-size:14px;line-height:1.55;color:var(--ccx-muted);max-width:56ch}
.cc-co__couponrow{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
body.cc-cx .cc-co__couponfield{flex:0 0 auto;width:300px;max-width:100%;min-width:0;margin:0 0 16px}
body.cc-cx .cc-co__couponbtn{flex:0 0 auto;margin:0 0 16px}
body.cc-cx .cc-co__couponfield input.input-text{text-transform:uppercase;letter-spacing:.06em}
body.cc-cx .cc-co__couponapply{
  display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:14px 26px;border-radius:2px;
  background-color:var(--ccx-ink)!important;color:var(--ccx-ivory)!important;
  -webkit-text-fill-color:var(--ccx-ivory)!important;border:1px solid var(--ccx-ink)!important;cursor:pointer;
  font-family:var(--ccx-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  transition:background-color var(--ccx-dur) ease,color var(--ccx-dur) ease,border-color var(--ccx-dur) ease;
}
body.cc-cx .cc-co__couponapply:hover,
body.cc-cx .cc-co__couponapply:focus-visible{
  background-color:var(--ccx-yellow)!important;color:var(--ccx-ink)!important;
  -webkit-text-fill-color:var(--ccx-ink)!important;border-color:var(--ccx-yellow)!important;
}
@media(max-width:520px){
  .cc-co__couponrow{flex-direction:column;align-items:stretch}
  body.cc-cx .cc-co__couponfield{width:100%}
  body.cc-cx .cc-co__couponapply{width:100%}
  .cc-cart__coupon-in .input-text{width:100%}
}

/* Placeholders are hints, never the label — they must read as secondary. */
body.cc-cx .woocommerce input::placeholder,
body.cc-cx .woocommerce textarea::placeholder{color:var(--ccx-muted);opacity:1}

/* the honest staging state when no gateway is connected yet */
body.cc-cx #payment .woocommerce-notice--info,
body.cc-cx #payment > .woocommerce-info{
  background:var(--ccx-ivory);border:1px solid var(--ccx-rule);border-left:2px solid var(--ccx-amber);
  border-radius:2px;padding:16px 18px;font-size:14.5px;color:var(--ccx-ink);line-height:1.55}

/* order-received / thank-you inherits the same ground */
body.cc-cx .woocommerce-order{max-width:1240px;margin:0 auto;padding:34px 24px 72px}

/* ====================================================== account: signed out
   Logged out WooCommerce renders no account navigation, so the two-column
   account grid collapses to a single full-width column here and the auth
   templates carry the page's only H1. */
body.cc-cx.woocommerce-account:not(.logged-in) .woocommerce{
  display:block;max-width:1180px;padding-bottom:88px;
}

.cc-auth{
  padding:48px 0 0;
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);
  gap:64px;align-items:start;
}
.cc-auth--two{grid-template-columns:minmax(0,1fr)}
.cc-auth__intro{max-width:52ch;padding-top:6px}
.cc-auth__eye{margin:0;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--ccx-muted)}
.cc-auth__h1{
  margin:14px 0 0;font-family:var(--ccx-disp);font-weight:400;
  font-size:clamp(40px,5.6vw,68px);line-height:.98;letter-spacing:-.01em;color:var(--ccx-ink);
}
.cc-auth__lede{margin:16px 0 0;font-size:16px;line-height:1.6;color:var(--ccx-muted)}
.cc-auth__list{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.cc-auth__list li{
  position:relative;padding-left:22px;font-size:15px;line-height:1.55;color:var(--ccx-muted);
}
.cc-auth__list li::before{
  content:"";position:absolute;left:0;top:.62em;width:10px;height:2px;background:var(--ccx-yellow);
}

.cc-auth__cards{
  margin:0;display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start;
}
.cc-auth--two .cc-auth__cards{
  grid-column:1/-1;margin-top:36px;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
}

.cc-auth__card{
  background:var(--ccx-white);border:1px solid var(--ccx-rule);border-radius:2px;padding:30px 30px 26px;
}
.cc-auth__cardh{
  margin:0 0 20px;font-family:var(--ccx-disp);font-weight:400;font-size:26px;line-height:1.15;color:var(--ccx-ink);
}
.cc-auth__msg{margin:0 0 12px;font-size:15px;line-height:1.6;color:var(--ccx-ink);max-width:58ch}

body.cc-cx .cc-auth__form .form-row{margin:0 0 18px}
body.cc-cx .cc-auth__form .password-input{display:block;position:relative}
body.cc-cx .cc-auth__form .password-input input{width:100%}

.cc-auth__row{
  display:flex!important;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:0 0 22px!important;
}
body.cc-cx .woocommerce .cc-auth__form .cc-auth__remember,
.cc-auth__remember{
  display:inline-flex!important;align-items:center;gap:9px;margin:0;cursor:pointer;
  font-family:var(--ccx-body);font-size:14px;font-weight:400;line-height:1.4;
  letter-spacing:0;text-transform:none;color:var(--ccx-muted);
}
body.cc-cx .woocommerce .cc-auth__form .cc-auth__remember span{
  font-family:var(--ccx-body);font-size:14px;letter-spacing:0;text-transform:none;
}
.cc-auth__remember input{width:16px;height:16px;margin:0;accent-color:var(--ccx-ink)}

.cc-auth__actions{
  display:flex!important;align-items:center;gap:18px;flex-wrap:wrap;margin:0!important;
}

/* Never the stock pink: every auth link is ink with a yellow hover rule. */
body.cc-cx .cc-auth a,
body.cc-cx .cc-auth__link{
  color:var(--ccx-ink);text-decoration:underline;text-decoration-color:rgba(27,26,23,.28);
  text-underline-offset:4px;font-size:14.5px;
}
body.cc-cx .cc-auth a:hover,
body.cc-cx .cc-auth__link:hover{text-decoration-color:var(--ccx-yellow)}
body.cc-cx .cc-auth a:focus-visible,
body.cc-cx .cc-auth button:focus-visible{outline:2px solid var(--ccx-ink);outline-offset:3px}

/* The theme ships a global `*{background:transparent!important}` reset, so the
   solid fill has to be declared !important to survive it. */
body.cc-cx .cc-auth .cc-auth__btn,
body.cc-cx .cc-auth a.cc-auth__btn{
  display:inline-flex;align-items:center;justify-content:center;width:auto;flex:0 0 auto;
  min-height:52px;padding:15px 30px;border-radius:2px;text-decoration:none;cursor:pointer;
  background-color:var(--ccx-ink)!important;color:var(--ccx-ivory)!important;
  -webkit-text-fill-color:var(--ccx-ivory)!important;
  border:1px solid var(--ccx-ink)!important;
  font-family:var(--ccx-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  transition:background-color var(--ccx-dur) ease,color var(--ccx-dur) ease,border-color var(--ccx-dur) ease;
}
body.cc-cx .cc-auth .cc-auth__btn:hover,
body.cc-cx .cc-auth .cc-auth__btn:focus-visible,
body.cc-cx .cc-auth a.cc-auth__btn:hover,
body.cc-cx .cc-auth a.cc-auth__btn:focus-visible{
  background-color:var(--ccx-yellow)!important;color:var(--ccx-ink)!important;
  -webkit-text-fill-color:var(--ccx-ink)!important;border-color:var(--ccx-yellow)!important;
}
body.cc-cx .cc-auth .cc-auth__btn:active{transform:scale(.985)}

.cc-auth__fine{margin:16px 0 0;font-size:13px;line-height:1.6;color:var(--ccx-muted);max-width:62ch}
.cc-auth__fine--aside{margin-top:4px}

@media(max-width:1020px){
  .cc-auth,.cc-auth--two{grid-template-columns:minmax(0,1fr);gap:32px}
  .cc-auth__cards{max-width:560px}
  .cc-auth--two .cc-auth__cards{max-width:none;margin-top:0}
}
@media(max-width:640px){
  .cc-auth{padding-top:32px}
  .cc-auth__cards{margin-top:26px}
  .cc-auth__card{padding:24px 20px 22px}
  .cc-auth__actions,.cc-auth__row{gap:12px}
  body.cc-cx .cc-auth .cc-auth__btn,
  body.cc-cx .cc-auth a.cc-auth__btn{width:100%}
}

/* ================================================= account: stock resets
   WooCommerce ships `.woocommerce-MyAccount-navigation{float:left;width:30%}`
   and `.woocommerce-MyAccount-content{float:right;width:68%}`. Inside our CSS
   grid the float is ignored but the percentage widths are not, so the rail
   collapsed to 30% of 250px and the content to 68% of its column. The grid
   owns the track sizes; these elements fill the track they are given. */
body.cc-cx .woocommerce-MyAccount-navigation,
body.cc-cx .woocommerce-MyAccount-content{float:none;width:100%}
.cc-ac__nav li a span{white-space:nowrap}

/* No stock pink anywhere in the account content — order numbers, order-again,
   address edit links and WooCommerce's own inline links all read as ink. */
body.cc-cx .woocommerce-MyAccount-content a:not(.button):not(.cc-ac__btn),
body.cc-cx .woocommerce-orders-table a:not(.button),
body.cc-cx .woocommerce-order-details a:not(.button),
body.cc-cx .woocommerce-customer-details a:not(.button){
  color:var(--ccx-ink);text-decoration:underline;
  text-decoration-color:var(--ccx-rule-strong);text-underline-offset:4px;
}
body.cc-cx .woocommerce-MyAccount-content a:not(.button):not(.cc-ac__btn):hover,
body.cc-cx .woocommerce-orders-table a:not(.button):hover,
body.cc-cx .woocommerce-order-details a:not(.button):hover,
body.cc-cx .woocommerce-customer-details a:not(.button):hover{
  text-decoration-color:var(--ccx-yellow);
}

/* The one primary action per account screen — Save changes, Save address —
   reads as solid ink. !important is required for the same reason as the auth
   buttons: the theme ships a global `*{background:transparent!important}`. */
body.cc-cx .woocommerce-MyAccount-content form button[type="submit"],
body.cc-cx .woocommerce-MyAccount-content form input[type="submit"]{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:52px;padding:15px 30px;border-radius:2px;cursor:pointer;
  background-color:var(--ccx-ink)!important;color:var(--ccx-ivory)!important;
  -webkit-text-fill-color:var(--ccx-ivory)!important;
  border:1px solid var(--ccx-ink)!important;
  font-family:var(--ccx-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;
  transition:background-color var(--ccx-dur) ease,color var(--ccx-dur) ease,border-color var(--ccx-dur) ease;
}
body.cc-cx .woocommerce-MyAccount-content form button[type="submit"]:hover,
body.cc-cx .woocommerce-MyAccount-content form button[type="submit"]:focus-visible,
body.cc-cx .woocommerce-MyAccount-content form input[type="submit"]:hover,
body.cc-cx .woocommerce-MyAccount-content form input[type="submit"]:focus-visible{
  background-color:var(--ccx-yellow)!important;color:var(--ccx-ink)!important;
  -webkit-text-fill-color:var(--ccx-ink)!important;border-color:var(--ccx-yellow)!important;
}
body.cc-cx .woocommerce-MyAccount-content form button[type="submit"]:active{transform:scale(.985)}
body.cc-cx .woocommerce-MyAccount-content form button[type="submit"]:focus-visible,
body.cc-cx .woocommerce-MyAccount-content form input[type="submit"]:focus-visible{
  outline:2px solid var(--ccx-ink);outline-offset:3px;
}

/* The password-change fieldset is a real group, not a decorative box. */
body.cc-cx .woocommerce-MyAccount-content fieldset{
  border:1px solid var(--ccx-rule);border-radius:2px;padding:22px 24px 6px;margin:26px 0 24px;
}
body.cc-cx .woocommerce-MyAccount-content fieldset legend{
  padding:0 8px;font-family:var(--ccx-mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ccx-muted);
}

/* The cart region while it re-reads itself after a drawer edit. */
.cc-cart.is-syncing{opacity:.6;transition:opacity 120ms ease}
@media (prefers-reduced-motion: reduce){.cc-cart.is-syncing{transition:none}}

/* ---------------------------------------------------------------------------
   Discount code panel — cart and checkout.

   Both used to hide the field behind one line of grey text (a <details> on the
   cart, WooCommerce's "Enter it here" toggle on checkout). A shopper holding a
   code had to go looking for it, and the commonest result of that is an
   abandoned basket or a support email.

   Open by default, with a dashed hairline that reads as a voucher and sets the
   panel apart from the solid-ruled cards around it — no new colour, no new
   type, just the tokens the rest of the theme already uses.
   --------------------------------------------------------------------------- */
/* WooCommerce's own checkout.js calls .hide() on this form during init, because
   it expects the "Enter it here" toggle to reveal it. The toggle is gone, so the
   rule has to out-rank that inline style - an !important declaration beats a
   non-important inline one. */
body.cc-cx-checkout form.checkout_coupon{display:block!important}

.cc-cart__coupon,
body.cc-cx-checkout form.checkout_coupon{
  background:var(--ccx-paper);
  border:1px dashed var(--ccx-rule);
  border-radius:2px;
  padding:20px 22px;
  margin:0 0 22px;
}

.cc-cart__coupon-eye,
.cc-co__couponeyebrow{
  margin:0 0 5px;
  font-family:var(--ccx-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ccx-muted);
}

.cc-cart__coupon-h,
.cc-co__couponh{
  margin:0 0 6px;
  font-family:var(--ccx-disp);font-style:italic;font-weight:400;
  font-size:24px;line-height:1.15;color:var(--ccx-ink);
}

/* the cart's Apply sits next to a shorter field, so it gets the same weight as
   the checkout one rather than the quieter ghost treatment */
.cc-cart__coupon-in .cc-btn--ghost{
  min-height:48px;border-radius:2px;
  border:1px solid var(--ccx-ink);background:var(--ccx-ink);
  /* .cc-btn--ghost sets -webkit-text-fill-color to ink, and that beats `color`
     for rendering - without overriding it too the label is ink on ink and the
     button reads as a blank block. */
  color:var(--ccx-ivory);-webkit-text-fill-color:var(--ccx-ivory);
  font-family:var(--ccx-mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  padding:12px 24px;cursor:pointer;
  transition:background-color var(--ccx-dur) ease,color var(--ccx-dur) ease,border-color var(--ccx-dur) ease;
}
.cc-cart__coupon-in .cc-btn--ghost:hover,
.cc-cart__coupon-in .cc-btn--ghost:focus-visible{
  background:var(--ccx-yellow);border-color:var(--ccx-yellow);
  color:var(--ccx-ink);-webkit-text-fill-color:var(--ccx-ink);
}

/* A discount code is short - a field as wide as the panel looks unresolved.
   Sized with `width`, not `flex-basis`: these rows turn into COLUMNS on small
   screens, where a flex-basis sizes the HEIGHT instead and leaves a 300px-tall
   input with a hole above the Apply button. `width` means the same thing in
   both directions. */
.cc-cart__coupon-in .input-text{flex:0 0 auto;width:300px;max-width:100%}

@media(max-width:520px){
  .cc-cart__coupon,
  body.cc-cx-checkout form.checkout_coupon{padding:18px}
  .cc-cart__coupon-h,
  .cc-co__couponh{font-size:21px}
}

/* The cart row stacks at a wider breakpoint than the checkout one, so the field
   has to go full width from there, not from 520px. */
@media(max-width:820px){
  .cc-cart__coupon-in .input-text{width:100%}
}