:root {
    /* LuminaPOS brand — taken from docs/LuminaPOS-System-Introduction-EN.pdf */
    --lp-crimson: #C21E56;
    --lp-crimson-deep: #8E1440;
    --lp-crimson-tint: #F7E4EB;
    --lp-teal: #0E6E5C;
    --lp-teal-soft: #E2F0EC;
    --lp-amber: #8A5309; /* darkened from the doc's #A9660B, which fails AA on its own tint */
    --lp-amber-soft: #F6EEDF;
    --lp-blue: #2F5EA8;
    --lp-blue-soft: #E7EDF7;

    /* Vivid accents. Art only — gradients, glows and glyph strokes. Never
       body text: several of these fail AA against white. */
    --lp-pink: #FF2E7E;
    --lp-violet: #7C3AED;
    --lp-indigo: #4F46E5;
    --lp-cyan: #06B6D4;
    --lp-mint: #10B981;
    --lp-gold: #F59E0B;

    --platform-bg: #F5F4F7;
    --platform-surface: #FFFFFF;
    --platform-surface-alt: #FAF9FB;
    --platform-ink: #1C1620;
    --platform-muted: #5F5867;
    --platform-muted-soft: #8C8493; /* 3.6:1 on white — decorative or large text only */
    --platform-border: #DEDAE3;
    --platform-border-soft: #E9E6EE;
    --platform-accent: var(--lp-crimson);
    --platform-accent-hover: var(--lp-crimson-deep);
    --platform-accent-soft: rgba(194, 30, 86, 0.1);
    --platform-error: #B3261E; /* pushed orange so it never reads as the crimson brand */
    --platform-error-soft: #FBEAE7;
    --platform-success: var(--lp-teal);
    --platform-success-soft: var(--lp-teal-soft);

    --rxd-auth-bg: var(--platform-bg);
    --rxd-auth-surface: var(--platform-surface);
    --rxd-auth-text: var(--platform-ink);
    --rxd-auth-text-soft: var(--platform-muted);
    --rxd-auth-text-muted: var(--platform-muted);
    --rxd-auth-border: var(--platform-border);
    --rxd-auth-accent: var(--platform-accent);
    --rxd-auth-accent-hover: var(--platform-accent-hover);
    --rxd-auth-accent-soft: var(--platform-accent-soft);
    /* Success must stay teal: aliasing it to the accent would make every success
       chip in RxD.Auth crimson-on-pink, indistinguishable from an error. */
    --rxd-auth-success: var(--platform-success);
    --rxd-auth-success-soft: var(--platform-success-soft);
    --rxd-auth-error: var(--platform-error);
    --rxd-auth-error-soft: var(--platform-error-soft);
    --rxd-auth-font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --rxd-auth-font-heading: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

    /* Tenant dashboard (tenant-components.css) consumes --brand-* tokens. Alias
       them to the platform palette so /tenant on this host is LuminaPOS-branded. */
    --brand-canvas: var(--platform-bg);
    --brand-canvas-deep: var(--platform-surface-alt);
    --brand-surface: var(--platform-surface);
    --brand-ink: var(--platform-ink);
    --brand-ink-soft: var(--platform-muted);
    --brand-muted: var(--platform-muted);
    --brand-line: var(--platform-border);
    --brand-accent: var(--platform-accent);
    --brand-accent-hover: var(--platform-accent-hover);
    --brand-accent-soft: var(--platform-accent-soft);
    --brand-accent-tint: var(--lp-crimson-tint);
    --brand-highlight: var(--lp-pink);
    --brand-secondary: var(--platform-success);
    --brand-secondary-soft: var(--platform-success-soft);
    --brand-gold: var(--lp-gold);
    --brand-gold-ink: var(--lp-amber);
    --brand-gold-soft: var(--lp-amber-soft);
    --brand-error: var(--platform-error);
    --brand-error-soft: var(--platform-error-soft);
    --brand-success-soft: var(--platform-success-soft);
    --brand-waiting: var(--lp-amber);
    --brand-waiting-soft: var(--lp-amber-soft);
    --brand-live: var(--lp-teal);
    --brand-live-soft: var(--lp-teal-soft);
    --font-display: var(--rxd-auth-font-heading);
    --font-body: var(--rxd-auth-font-body);
    --step--1: 0.85rem;
    --step-0: 1rem;
    --step-1: 1.25rem;
    --step-2: 1.6rem;
    --step-3: 2rem;
    --radius-sm: 0.375rem;
    --radius-md: 0.625rem;
    --radius-lg: 1rem;
    --shadow-1: 0 1px 2px rgba(28, 22, 32, 0.06), 0 4px 16px rgba(28, 22, 32, 0.05);
    --shadow-2: 0 2px 6px rgba(28, 22, 32, 0.07), 0 16px 40px rgba(28, 22, 32, 0.08);
}

html, body {
    font-family: var(--rxd-auth-font-body);
    color: var(--platform-ink);
    background: var(--platform-bg);
}

a, .btn-link {
    color: var(--platform-accent);
}

.btn-primary {
    --bs-btn-bg: var(--platform-accent);
    --bs-btn-border-color: var(--platform-accent);
    --bs-btn-hover-bg: var(--platform-accent-hover);
    --bs-btn-hover-border-color: var(--platform-accent-hover);
    --bs-btn-active-bg: var(--platform-accent-hover);
}

/* Bootstrap's stock green/red clashes next to teal + crimson.
   Tenants.razor uses btn-outline-success / btn-outline-danger. */
.btn-outline-success {
    --bs-btn-color: var(--platform-success);
    --bs-btn-border-color: var(--platform-success);
    --bs-btn-hover-bg: var(--platform-success);
    --bs-btn-hover-border-color: var(--platform-success);
}

.btn-outline-danger {
    --bs-btn-color: var(--platform-error);
    --bs-btn-border-color: var(--platform-error);
    --bs-btn-hover-bg: var(--platform-error);
    --bs-btn-hover-border-color: var(--platform-error);
}

:focus-visible {
    outline: 2px solid var(--platform-accent);
    outline-offset: 2px;
}

::selection {
    background: var(--lp-crimson-tint);
    color: var(--lp-crimson-deep);
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

#blazor-error-ui .dismiss {
    cursor: pointer;
    position: absolute;
    right: 0.75rem;
    top: 0.5rem;
}

/* Language switcher (portal nav) — shared with marketing.css naming */
.lp-lang {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-right: 0.5rem;
}

.lp-lang-opt {
    color: var(--platform-muted);
    text-decoration: none;
    padding: 0.2rem 0.15rem;
}

.lp-lang-opt:hover {
    color: var(--platform-ink);
}

.lp-lang-opt.is-active {
    color: var(--platform-accent);
}

.lp-lang-sep {
    color: var(--platform-border);
    user-select: none;
}

.portal-nav-panel .lp-lang {
    margin: 0.35rem 0.5rem 0.5rem;
}