/*
 * Site themes — the marketplace cart /cart (views/cart/index.php + the coupon box from
 * views/checkout/_zvs_coupon.php) on a themed request (themes/_base/app.php key "cart").
 *
 * The page keeps its layout and words; app.css already re-points its Tailwind greys/whites. This file
 * re-points what app.css cannot see: the brand colour the view prints as inline hex (buttons, links),
 * the coupon box's own <style>, the "Updating cart…" veil and status words (red "Remove", green
 * "Free") that sit straight on the surface.
 *
 * Rules
 *   - Token-only: never a [data-zin-mode] or prefers-color-scheme selector (Auto swaps the tokens).
 *   - Scoped body.zt-app-cart + the page's own container (.max-w-7xl / #loadingOverlay), so the shared
 *     header (nav) and the themed footer (.zt-site-footer) stay chrome.css's job.
 *   - Status words keep their hue; color-mix() with --z-text darkens them on a light page and lifts
 *     them on a dark one (browsers without color-mix keep the legacy colour).
 *   - !important only where the view paints with an inline style attribute or a utility wins.
 * Loaded only on themed requests (zin_theme_app_head); the legacy cart never sees this file.
 */

/* ---- Brand colour printed as inline hex ------------------------------------------------ */
body.zt-app-cart .max-w-7xl :is([style*="background-color:"], .zvs-coupon-btn[style*="background:"]) {
    background: var(--z-accent) !important;
    color: var(--z-accent-ink) !important;
}
body.zt-app-cart .max-w-7xl a[style^="color:"] { color: var(--z-accent-text) !important; }

/* ---- Items ----------------------------------------------------------------------------- */
/* Product names read as text (as on the legacy page), not as accent links. */
body.zt-app-cart li[data-cart-key] h3 a:not([class]) { color: inherit; }
body.zt-app-cart li[data-cart-key] h3 a:not([class]):hover { color: var(--z-accent-text); }
body.zt-app-cart li[data-cart-key] input[type="number"] { background-color: transparent !important; }

/* Status words straight on the surface: same hue, legible in light and dark. */
body.zt-app-cart li[data-cart-key] :is(.text-red-600, .hover\:text-red-500) {
    color: #dc2626;
    color: color-mix(in srgb, #dc2626 70%, var(--z-text)) !important;
}
body.zt-app-cart .max-w-7xl dd:is(.text-green-600, .text-green-700) {
    color: #16a34a;
    color: color-mix(in srgb, #16a34a 70%, var(--z-text)) !important;
}
body.zt-app-cart .max-w-7xl .fa-lock.text-green-600 { color: color-mix(in srgb, #16a34a 70%, var(--z-text)) !important; }

/* ---- Coupon box + shipping notes (views/checkout/_zvs_coupon.php) ----------------------- */
body.zt-app-cart .zvs-coupon-label { color: var(--z-text); }
body.zt-app-cart .zvs-coupon-input:focus { border-color: var(--z-accent) !important; box-shadow: 0 0 0 3px var(--z-accent-soft); }
body.zt-app-cart .zvs-coupon-msg.is-ok { color: color-mix(in srgb, #15803d 70%, var(--z-text)); }
body.zt-app-cart .zvs-coupon-msg.is-err { color: color-mix(in srgb, #b91c1c 70%, var(--z-text)); }
body.zt-app-cart .zvs-ship-notes li { color: var(--z-muted); }
body.zt-app-cart .zvs-ship-notes li.is-free { color: color-mix(in srgb, #15803d 70%, var(--z-text)); }

/* ---- Focus ring offset + the "Updating cart…" overlay ---------------------------------- */
body.zt-app-cart .max-w-7xl .focus\:ring-offset-gray-50:focus { --tw-ring-offset-color: var(--z-surface); }
/* app.css paints .bg-gray-600 as solid "ink"; this overlay is a see-through veil (bg-opacity-50). */
body.zt-app-cart #loadingOverlay { background-color: color-mix(in srgb, var(--z-bg) 60%, transparent) !important; color: var(--z-text) !important; }
