/* Poco's paint for delivery on the ordering pages, and trattoria's.
   Trattoria rides poco's skin and only points --poco-green-ink at its own
   accent, which nothing here reads, so it has no delivery file of its own.
   templates/poco/_ordering.blade.php and
   templates/trattoria/_ordering.blade.php push this sheet after their
   ordering skins, and only while the site offers delivery. Plan Task 9 adds
   checkout's delivery paint to this file. */

.ord-body .ord-fulfil-option{font-family:var(--font-heading);font-weight:800}
.ord-body .ord-fulfil-switch{background:var(--surface-2);border-color:var(--border)}
.ord-body .ord-fulfil-terms{color:var(--ink-muted)}

/* The pane is a box whose children carry their own inline padding. */
.ord-cart-pane .ord-fulfil-pane{padding:.9rem 1rem;border-bottom:1px solid var(--border)}
.ord-cart-pane .ord-fee{padding:.75rem 1rem;border-bottom:1px solid var(--border)}
.ord-body .ord-checkout-summary .ord-fee{border-top-color:var(--poco-hair)}

/* The strip above the menu is the same box. It goes where this template's
   pane becomes a column, at 1200 rather than 1400 (menu-skin.css). The bar
   goes at 1200 too, so the toast returns to the shared offset there. */
.ord-body .ord-fulfil-strip{background:var(--surface);border:1px solid var(--border);border-radius:4px}
@media (min-width:1200px){
  .ord-body .ord-fulfil-strip{display:none}
  .ord-body:has(.ord-checkout-bar) .ord-toast{bottom:calc(6.5rem + env(safe-area-inset-bottom))}
}

/* The dark phone bar: canvas ink on it, the track a shade off the bar. */
.ord-checkout-bar .ord-fulfil-switch{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.28)}
.ord-checkout-bar .ord-fulfil-option{color:var(--canvas)}
.ord-checkout-bar .ord-fulfil-option[aria-pressed="true"]{background:var(--c-primary);color:var(--c-primary-ink)}
.ord-checkout-bar .ord-fulfil-option:disabled{color:var(--canvas);opacity:.7}
.ord-checkout-bar .ord-fulfil-option:focus-visible{outline-color:var(--canvas)}
.ord-checkout-bar .ord-fee-status{color:var(--canvas)}
.ord-checkout-bar .ord-free-meter{background:rgba(255,255,255,.18)}

/* Checkout's place rows in the heading face, like the total under them. */
.ord-body .ord-place-row{font-family:var(--font-heading);font-weight:800;font-size:.875rem}
.ord-body .ord-place-vat{color:var(--ink-muted)}

/* ---------- checkout: pickup or delivery (plan Task 9) ----------
   The cards and the address card in the boxes this skin draws (a white or
   warm surface, a hairline, 4px corners), the titles in the heading face,
   every link in the green ink, which trattoria points at its own accent. */
.ord-body .checkout-fulfil-card{background:var(--surface);border:1px solid var(--ink-muted);border-radius:4px}
.ord-body .checkout-fulfil-card:has(.checkout-fulfil-input:checked){border-color:var(--poco-green-ink);box-shadow:inset 0 0 0 1px var(--poco-green-ink);background:color-mix(in srgb,var(--c-primary) 8%,var(--surface))}
.ord-body .checkout-fulfil-card:has(.checkout-fulfil-input:disabled){background:var(--surface-2)}
.ord-body .checkout-fulfil-input{accent-color:var(--poco-green-ink)}
.ord-body .checkout-fulfil-icon{background:var(--surface-2);color:var(--poco-green-ink)}
.ord-body .checkout-fulfil-title{font-family:var(--font-heading);font-weight:900;text-transform:uppercase;letter-spacing:.02em}
.ord-body .checkout-fulfil-meta{color:var(--ink-muted)}
.ord-body .checkout-delivery-list{background:var(--surface);border-color:var(--ink-muted);border-radius:4px;box-shadow:0 10px 28px rgba(35,32,28,.16)}
.ord-body .checkout-delivery-list li{border-radius:2px}
.ord-body .checkout-delivery-list li[aria-selected="true"],.ord-body .checkout-delivery-list li:hover{background:color-mix(in srgb,var(--c-primary) 16%,var(--surface))}
.ord-body .checkout-delivery-list li.is-map{border-top-color:var(--border)}
.ord-body .checkout-delivery-option-icon{background:var(--surface-2);color:var(--poco-green-ink)}
.ord-body .checkout-delivery-option-label{font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-delivery-option-meta{color:var(--ink-muted)}
.ord-body .checkout-delivery-locate{color:var(--poco-green-ink)}
.ord-body .checkout-delivery-locate:hover{background:var(--surface-2)}
.ord-body .checkout-delivery-or{color:var(--ink-muted)}
.ord-body .checkout-delivery-or::before,.ord-body .checkout-delivery-or::after{background:var(--border)}
.ord-body .checkout-form .checkout-delivery-pick{border:1px solid var(--ink-muted);border-radius:4px;background:var(--surface);color:var(--poco-green-ink);font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-form .checkout-delivery-pick:hover{border-color:var(--poco-green-ink)}
.ord-body .checkout-form .checkout-delivery-link{color:var(--poco-green-ink);font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-delivery-card{background:var(--surface-2);border:1px solid var(--border);border-radius:4px;color:var(--ink)}
.ord-body .checkout-delivery-card > svg{color:var(--poco-green-ink)}
.ord-body .checkout-delivery-card-label{font-family:var(--font-heading);font-weight:900}
.ord-body .checkout-delivery-preview{border-color:var(--border);border-radius:4px}
/* The pin in the site's accent colour (spec 6.2). */
.ord-body .checkout-delivery-pin{color:var(--poco-green-ink)}
.ord-body .checkout-delivery-entrance{color:var(--poco-green-ink);font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-delivery-entrance-done{color:var(--poco-green-ink);font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-delivery-sheet{background:var(--surface);color:var(--ink)}
.ord-body .checkout-delivery-sheet-head,.ord-body .checkout-delivery-sheet-card{border-color:var(--border)}
.ord-body .checkout-delivery-sheet-back{background:var(--surface-2);color:var(--ink)}
.ord-body .checkout-delivery-sheet-heading,.ord-body .checkout-delivery-sheet-title{font-family:var(--font-heading);font-weight:900}
.ord-body .checkout-delivery-sheet-sub{color:var(--ink-muted)}
.ord-body .checkout-delivery-sheet-reset{color:var(--poco-green-ink)}
.ord-body .checkout-delivery-credit{color:var(--ink-muted)}
.ord-body .checkout-delivery-area{font-family:var(--font-heading);font-weight:800}
.ord-body .checkout-delivery-ring{stroke:var(--ink)}
.ord-body .checkout-delivery-shop{background:var(--poco-green-ink)}
