/*
 * Custom CSS for Nexus Cart Orderform
 * Drop this into: /templates/nexus_cart/css/custom.css
 *
 * The cart runs in a Shadow DOM, so all overrides live in :host / :root.
 * Colour tokens here inherit from the main nexus custom.css via CSS variables.
 */

:host, :root {
    /* ── Primary (dark navy) ───────────────── */
    --vl-primary:          #1a1a2e;
    --vl-primary-lifted:   #16213e;
    --vl-primary-accented: #0f3460;

    /* ── Secondary ─────────────────────────── */
    --vl-secondary:          #64748b;
    --vl-secondary-lifted:   #475569;
    --vl-secondary-accented: #334155;

    /* ── Semantic ──────────────────────────── */
    --vl-success:          #16a34a;
    --vl-success-lifted:   #15803d;
    --vl-success-accented: #166534;
    --vl-info:             #2563eb;
    --vl-info-lifted:      #1d4ed8;
    --vl-info-accented:    #1e40af;
    --vl-notice:           #7c3aed;
    --vl-notice-lifted:    #6d28d9;
    --vl-notice-accented:  #5b21b6;
    --vl-warning:          #d97706;
    --vl-warning-lifted:   #b45309;
    --vl-warning-accented: #92400e;
    --vl-error:            #dc2626;
    --vl-error-lifted:     #b91c1c;
    --vl-error-accented:   #991b1b;
    --vl-grayscale:          #0f172a;
    --vl-grayscale-lifted:   #1e293b;
    --vl-grayscale-accented: #334155;
    --vl-neutral:          #64748b;
    --vl-neutral-lifted:   #475569;
    --vl-neutral-accented: #334155;

    /* ── Text ──────────────────────────────── */
    --vl-text-inverted:  #ffffff;
    --vl-text-muted:     #94a3b8;
    --vl-text-lifted:    #64748b;
    --vl-text-accented:  #475569;
    --vl-text:           #0f172a;

    /* ── Borders ───────────────────────────── */
    --vl-border-muted:    #f1f5f9;
    --vl-border:          #e2e8f0;
    --vl-border-lifted:   #cbd5e1;
    --vl-border-accented: #94a3b8;

    /* ── Backgrounds ───────────────────────── */
    --vl-bg:          #ffffff;
    --vl-bg-muted:    #f8fafc;
    --vl-bg-lifted:   #f1f5f9;
    --vl-bg-accented: #e8eef6;
    --vl-bg-inverted: #0f172a;

    /* ── Font sizes ────────────────────────── */
    --vl-text-xs: 0.625rem;
    --vl-text-sm: 0.75rem;
    --vl-text-md: 0.875rem;
    --vl-text-lg: 1rem;

    /* ── Spacing / outline ─────────────────── */
    --vl-outline-sm: 1px;
    --vl-outline-md: 2px;
    --vl-outline-lg: 3px;

    /* ── Rounding ──────────────────────────── */
    --vl-rounding-sm: 0.375rem;
    --vl-rounding-md: 0.625rem;
    --vl-rounding-lg: 1rem;

    /* ── Misc ──────────────────────────────── */
    --vl-letter-spacing:    0em;
    --vl-disabled-opacity:  25%;
}