/* ============================================================
   GRAVIUS — Cart / request builder (scoped to body.cartpage)
   An editorial "request builder", not a store checkout. Every
   rule is prefixed with body.cartpage so it cannot affect
   Product, Account, Admin, auth or legal pages. Item, summary,
   empty and notice markup is emitted by assets/shop.js — those
   class names are restyled here, never renamed. Mono is reserved
   for prices, quantities and technical values.
   ============================================================ */

body.cartpage .crt-wrap{ width:100%; max-width:1160px; margin:0 auto; padding-inline:clamp(18px,4vw,40px); }

/* ---------- Intro (breadcrumb, title, lead — no eyebrow pill, no step bar) ---------- */
body.cartpage .crt-intro{ padding:clamp(96px,12vw,140px) 0 clamp(24px,3vw,36px); }
body.cartpage .crt-crumb{ display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:.7rem;
  letter-spacing:.1em; text-transform:uppercase; color:var(--silver); padding:clamp(96px,12vw,140px) 0 0; }
body.cartpage .crt-crumb + .crt-intro{ padding-top:clamp(18px,2vw,26px); }
body.cartpage .crt-crumb a{ color:var(--silver); text-decoration:none; }
body.cartpage .crt-crumb a:hover{ color:var(--mark); }
body.cartpage .crt-crumb .sep{ opacity:.5; }
body.cartpage .crt-title{ font-family:var(--font-display); font-weight:420; line-height:1; letter-spacing:-.02em;
  font-size:clamp(2.2rem,5.5vw,3.6rem); color:var(--mark); margin:0; }
body.cartpage .crt-lead{ font-size:clamp(1rem,1.4vw,1.14rem); line-height:1.6; color:var(--silver); margin:18px 0 0; max-width:58ch; }

/* ---------- Two-column layout: products (wide) + request (narrow, sticky) ---------- */
body.cartpage .crt-layout{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(340px,430px);
  gap:clamp(30px,5vw,64px); align-items:start; padding-bottom:clamp(56px,9vw,110px); }

/* Kill the old card treatment on the wrapper panels */
body.cartpage .crt-items, body.cartpage .crt-side{ background:none!important; border:0!important; border-radius:0!important; padding:0!important; }
body.cartpage .crt-side{ position:sticky; top:96px; }

/* ---------- Left: selected products ---------- */
body.cartpage .crt-items__head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
  padding-bottom:16px; border-bottom:1px solid var(--line); margin-bottom:4px; }
body.cartpage .crt-items__head h2{ font-family:var(--font-display); font-weight:420; font-size:clamp(1.3rem,2.4vw,1.7rem);
  color:var(--mark); margin:0; letter-spacing:-.01em; }
/* "Clear request" stays secondary — must not compete with Submit */
body.cartpage .crt-clear{ background:transparent!important; border:0!important; box-shadow:none!important; padding:6px 2px!important;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--steel)!important;
  cursor:pointer; transition:color .2s var(--ease); }
body.cartpage .crt-clear:hover{ color:var(--mark)!important; transform:none!important; }

/* Item rows — editorial list, fine dividers, no card-in-card */
body.cartpage [data-shop-cart-items]{ display:block; }
body.cartpage .cart-item{ display:flex; gap:clamp(14px,2vw,20px); align-items:flex-start;
  background:none!important; border:0!important; border-radius:0!important;
  border-bottom:1px solid var(--line)!important; padding:22px 0!important; }
body.cartpage [data-shop-cart-items] .cart-item:last-child{ border-bottom:0!important; }
body.cartpage .cart-item-media{ width:60px; height:60px; flex:none; border-radius:10px; border:1px solid var(--line-2); }
body.cartpage .cart-item-content{ flex:1 1 auto; min-width:0; }
body.cartpage .cart-item-content h3{ font-family:var(--font-sans); font-weight:600; font-size:1.05rem; color:var(--mark); margin:0; line-height:1.3; }
body.cartpage .cart-item-meta{ font-family:var(--font-mono); font-size:.85rem; color:var(--accent); margin:6px 0 0; }
body.cartpage .cart-item-content dl{ margin:12px 0 0; display:flex; flex-direction:column; gap:4px; }
body.cartpage .cart-item-content dl > div{ display:flex; gap:12px; font-size:.86rem; line-height:1.45; }
body.cartpage .cart-item-content dt{ flex:0 0 auto; min-width:96px; color:var(--steel); margin:0;
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; padding-top:1px; }
body.cartpage .cart-item-content dd{ margin:0; color:var(--silver); overflow-wrap:anywhere; }
body.cartpage .cart-item-actions{ flex:none; }
body.cartpage .cart-item-actions .button{ background:transparent!important; border:0!important; box-shadow:none!important;
  padding:4px 2px!important; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--steel)!important; cursor:pointer; transition:color .2s var(--ease); min-height:32px; }
body.cartpage .cart-item-actions .button:hover{ color:var(--mark)!important; transform:none!important; }

/* Disabled-product notice — visible but restrained (no loud card) */
body.cartpage .cart-disabled-notice{ background:none!important; border:0!important; border-left:2px solid var(--accent)!important;
  border-radius:0!important; padding:10px 0 10px 14px!important; margin:0 0 6px!important;
  font-size:.88rem; line-height:1.5; color:var(--silver)!important; font-family:var(--font-sans)!important; }

/* ---------- Right: summary + request form ---------- */
body.cartpage [data-shop-cart-summary]{ background:none!important; border:0!important; border-radius:0!important;
  padding:0 0 clamp(24px,3vw,32px)!important; margin:0 0 clamp(24px,3vw,32px)!important; border-bottom:1px solid var(--line)!important; }
body.cartpage [data-shop-cart-summary]:empty{ display:none; }
body.cartpage [data-shop-cart-summary] h2{ font-family:var(--font-display); font-weight:420; font-size:1.3rem;
  color:var(--mark); margin:0 0 14px; letter-spacing:-.01em; }
body.cartpage .summary-row{ display:flex; justify-content:space-between; align-items:baseline; gap:16px;
  padding:10px 0; border-bottom:1px solid var(--line); color:var(--silver); font-size:.95rem; }
body.cartpage .summary-row span{ flex:none; }
body.cartpage .summary-row b{ font-family:var(--font-mono); font-weight:500; color:var(--mark); text-align:right; overflow-wrap:anywhere; }
body.cartpage .summary-row.strong{ color:var(--mark); }
body.cartpage .summary-row.strong b{ color:var(--accent); font-size:1.05rem; }

/* Form as a spaced sequence — section headings, not containers */
body.cartpage .crt-form__title{ font-family:var(--font-display); font-weight:420; font-size:1.3rem; color:var(--mark);
  margin:0 0 6px; letter-spacing:-.01em; }
body.cartpage .crt-group{ padding:clamp(20px,3vw,28px) 0 4px; border-top:1px solid var(--line); }
body.cartpage .crt-group:first-of-type{ border-top:0; padding-top:14px; }
body.cartpage .crt-group__title{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--silver); margin:0 0 14px; }
body.cartpage .crt-form .field{ margin-bottom:14px; }
body.cartpage .crt-form .hint{ margin:2px 0 12px; }

/* Custom file selector — the native input is preserved and stays keyboard/
   screen-reader accessible (visually hidden, not display:none). A <label> acts
   as the visible button; filenames or a translated empty message render below. */
body.cartpage .crt-file-input{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap; border:0; }
body.cartpage .crt-file-btn{ display:inline-flex; align-items:center; align-self:flex-start; cursor:pointer;
  font-family:var(--font-sans)!important; color:var(--mark)!important; text-transform:none; letter-spacing:normal;
  font-size:.9rem; font-weight:500; padding:10px 18px; border:1px solid var(--line-strong); border-radius:10px;
  background:rgba(255,255,255,.02); transition:border-color .2s var(--ease), background .2s var(--ease); }
body.cartpage .crt-file-btn:hover{ border-color:var(--mark); background:rgba(255,255,255,.05); }
/* Visible focus ring on the custom button while the hidden input has focus */
body.cartpage .crt-file-input:focus + .crt-file-btn,
body.cartpage .crt-file-input:focus-visible + .crt-file-btn{ outline:2px solid var(--cool); outline-offset:3px; border-color:var(--mark); }
body.cartpage .crt-file-names{ margin:10px 0 0; font-family:var(--font-sans); font-size:.85rem; color:var(--steel);
  display:flex; flex-direction:column; gap:4px; min-width:0; max-width:100%; }
body.cartpage .crt-file-names.has-files{ color:var(--silver); }
/* Wrap long filenames so multiple long names never cause horizontal overflow */
body.cartpage .crt-file-name{ min-width:0; max-width:100%; overflow-wrap:anywhere; word-break:break-word; line-height:1.4; }
body.cartpage .crt-file-name::before{ content:"— "; color:var(--accent); }

/* Legal confirmation — fully readable, never hidden */
body.cartpage .legal-note{ color:var(--silver)!important; font-size:.9rem; line-height:1.55; margin:0 0 14px; }
body.cartpage .legal-check{ display:flex; gap:12px; align-items:flex-start; color:var(--silver); font-size:.92rem; line-height:1.5; cursor:pointer; }
body.cartpage .legal-check input{ width:18px!important; height:18px; margin-top:2px; flex:0 0 auto; accent-color:var(--accent); }
/* Override the global uppercase-mono `label` rule for the long consent sentences.
   These are full sentences inside <label> elements, so they must read as normal
   sentence-case body text, not as short technical field labels. */
body.cartpage .legal-check span{ font-family:var(--font-sans); text-transform:none; letter-spacing:normal;
  font-weight:400; font-size:.92rem; line-height:1.55; color:var(--silver); }
body.cartpage .legal-mini-grid{ display:flex; flex-wrap:wrap; gap:8px 20px; margin:16px 0 0; }
body.cartpage .legal-mini-grid a{ background:none!important; border:0!important; box-shadow:none!important; padding:0 0 2px!important;
  font-size:.86rem; color:var(--silver)!important; border-bottom:1px solid var(--line-strong)!important; border-radius:0!important;
  transition:color .2s var(--ease), border-color .2s var(--ease); }
body.cartpage .legal-mini-grid a:hover{ color:var(--mark)!important; border-color:var(--mark)!important; transform:none!important; }

/* Optional media permissions — plain rows, subordinate to required fields */
body.cartpage .media-consent{ margin:0; border:0; background:none; padding:0; }
body.cartpage .media-consent legend{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--faint); padding:0; margin:0 0 4px; }
body.cartpage .media-consent__opt{ display:flex; gap:12px; align-items:flex-start; padding:14px 0; cursor:pointer; border-top:1px solid var(--line); }
body.cartpage .media-consent__opt input[type=checkbox]{ margin-top:3px; flex:0 0 auto; width:18px; height:18px; accent-color:var(--accent); }
body.cartpage .media-consent__body{ display:flex; flex-direction:column; gap:5px; min-width:0; }
/* Normal sentence-case sans typography — override the inherited uppercase-mono `label` rule */
body.cartpage .media-consent__label{ font-family:var(--font-sans); text-transform:none; letter-spacing:normal;
  font-weight:400; font-size:.9rem; line-height:1.5; color:var(--silver); overflow-wrap:anywhere; }
body.cartpage .media-consent__help{ font-family:var(--font-sans); text-transform:none; letter-spacing:normal;
  font-weight:400; font-size:.82rem; line-height:1.55; color:var(--steel); overflow-wrap:anywhere; }

/* Submit + status */
body.cartpage .crt-form .btn-full{ margin-top:clamp(24px,3vw,32px); }
body.cartpage [data-shop-cart-status]{ margin-top:14px; font-size:.9rem; line-height:1.5; min-height:0; overflow-wrap:anywhere; }
body.cartpage [data-shop-cart-status]:empty{ margin-top:0; }

/* ---------- Empty state (composed; hides the request form, no dead space) ---------- */
body.cartpage .crt-layout:has(.cart-empty){ grid-template-columns:1fr; max-width:620px; margin-inline:auto; }
body.cartpage .crt-layout:has(.cart-empty) .crt-side{ display:none; }
body.cartpage .crt-layout:has(.cart-empty) .crt-items__head{ display:none; }
body.cartpage .cart-empty{ text-align:center; padding:clamp(30px,6vw,60px) 0; border:0!important; border-radius:0!important;
  display:flex; flex-direction:column; align-items:center; gap:20px; }
body.cartpage .cart-empty p{ margin:0; color:var(--silver); font-size:1.05rem; line-height:1.6; max-width:44ch; }
body.cartpage .cart-empty .button{ margin:0; }

/* ---------- Responsive ---------- */
@media (max-width:860px){
  body.cartpage .crt-layout{ grid-template-columns:1fr; gap:clamp(28px,6vw,44px); }
  body.cartpage .crt-side{ position:static; top:auto; }
}
@media (max-width:480px){
  body.cartpage .cart-item{ flex-wrap:wrap; }
  body.cartpage .cart-item-content{ flex:1 1 60%; }
  body.cartpage .cart-item-actions{ flex-basis:100%; margin-top:2px; }
  body.cartpage .cart-item-content dt{ min-width:84px; }
  /* Adequate tap targets for Remove / Clear on touch */
  body.cartpage .cart-item-actions .button, body.cartpage .crt-clear{ min-height:44px; display:inline-flex; align-items:center; padding-right:2px!important; padding-left:2px!important; }
}
