/* ==========================================================================
   pages/checkout.css — /checkout, /checkout/return, /receipts, /enrolments
   and the local payment sandbox. Quiet: hairlines, tabular figures, the total
   right-aligned under a rule, one action (P3 §5).
   ========================================================================== */
.checkout{ padding-block:var(--space-10) var(--space-16); }
.checkout__wrap{ max-width:640px; }
.checkout__kicker{ font-size:var(--text-sm); color:var(--text-3); }
.checkout__title{ font-size:var(--text-2xl); margin-top:var(--space-1); }
.checkout__meta{ margin-top:var(--space-2); color:var(--text-2); font-size:var(--text-sm); }
.checkout__lead{ margin-top:var(--space-4); color:var(--text-1); font-size:var(--text-md); }
.checkout__alert{ margin-top:var(--space-5); max-width:none; }
.checkout__hold{ margin-top:var(--space-6); padding:var(--space-3) 0; border-top:1px solid var(--border-strong); font-size:var(--text-sm); color:var(--text-2); }
.checkout__hold b{ color:var(--warning); font-weight:var(--weight-medium); }
.checkout__hold b[data-expired]{ color:var(--live); }

.lines{ margin:var(--space-4) 0 0; border-top:1px solid var(--border-strong); }
.lines__row{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:var(--space-6); padding:var(--space-3) 0; border-bottom:1px solid var(--border); align-items:baseline; }
.lines__row dt{ color:var(--text-1); }
.lines__row dd{ margin:0; text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; color:var(--text-1); }
.lines__sub{ display:block; font-size:var(--text-sm); color:var(--text-3); margin-top:2px; white-space:normal; }
.lines__row--total{ border-top:1px solid var(--border-strong); border-bottom:0; margin-top:var(--space-1); padding-top:var(--space-4); }
.lines__row--total dt{ font-weight:var(--weight-medium); }
.lines__row--total dd .price{ font-size:var(--text-xl); font-weight:var(--weight-semibold); color:var(--text-strong); }
.lines--facts dd{ text-align:left; white-space:normal; }
.lines--facts .lines__row{ grid-template-columns:120px minmax(0,1fr); }
.lines--facts .lines__row dt{ color:var(--text-3); font-size:var(--text-sm); }
.lines + .lines{ margin-top:var(--space-8); }
.tnum{ font-variant-numeric:tabular-nums; }

.checkout__pay{ margin-top:var(--space-6); display:flex; flex-direction:column; gap:var(--space-3); }
.checkout__btn{ height:52px; font-size:var(--text-md); }
.checkout__note{ font-size:var(--text-sm); color:var(--text-3); margin-top:var(--space-3); }
.checkout__note a{ color:var(--text-2); text-decoration:underline; }
.checkout__state{ margin-top:var(--space-6); display:flex; flex-direction:column; gap:var(--space-3); align-items:flex-start; }
.checkout__state-title{ font-size:var(--text-lg); font-weight:var(--weight-semibold); }
.checkout__actions{ margin-top:var(--space-6); display:flex; gap:var(--space-2); flex-wrap:wrap; align-items:center; }
.checkout__sim{ margin-top:var(--space-6); display:flex; gap:var(--space-2); flex-wrap:wrap; }

/* /enrolments rows */
.enrol .head{ margin-bottom:var(--space-6); }
.enrol__body{ grid-template-columns:minmax(0,1fr) auto; }
.enrol__end{ gap:var(--space-3); }
.enrol__end form{ display:inline; }

/* Receipt: print clean. tokens.css already swaps every token for the paper palette in print;
   the literals below are that same paper (white, black ink, grey rules), not a theme. */
@media print{
  .nav,.footer,.signal,.receipt__actions,.skip-link{ display:none !important; }
  body{ background:#fff; color:#000; }
  .checkout{ padding:0; }
  .lines__row,.lines,.lines__row--total,.checkout__hold{ border-color:#999; }
  .lines__row dt,.lines__row dd,.checkout__title,.lines__row--total dd .price,.checkout__kicker,.checkout__meta,.lines__sub,.checkout__note,.checkout__note a{ color:#000; }
  .badge{ border:1px solid #000; color:#000; background:none; }
}
@media (max-width:640px){
  .checkout{ padding-block:var(--space-6) var(--space-12); }
  .enrol__body{ grid-template-columns:minmax(0,1fr); }
  .enrol__end{ justify-content:space-between; }
  .lines--facts .lines__row{ grid-template-columns:minmax(0,1fr); gap:var(--space-1); }
}