/* ============================================================
   Kendo swatch — Microsoft Fluent 2 "Teams High Contrast"
   ------------------------------------------------------------
   Accessibility-focused swatch matching Microsoft Teams' High
   Contrast theme. Meets WCAG 2.1 AAA (21:1 contrast) with the
   classic Windows high-contrast palette:
     background:       pure black   (#000000)
     foreground:       pure white   (#FFFFFF)
     accent / primary: bright cyan  (#1AEBFF)
     hyperlink / warn: bright yellow (#FFFF01)
     destructive:      bright pink  (#FF5788)
     borders:          solid white  (#FFFFFF) — never partial alpha

   Layer on top of `kendo-theme-default/all.css`.

   Source palette: Fluent 2 Web — High Contrast + Windows
   Settings → Ease of Access → High Contrast theme ("Aquatic").
   https://fluent2.microsoft.design/color
   ============================================================ */

:root {
    color-scheme: dark;

    /* ── Surfaces (pure black canvas) ─────────────────────────── */
    --kendo-color-app-surface:    #000000;
    --kendo-color-on-app-surface: #ffffff;
    --kendo-color-subtle:         #ffffff;
    --kendo-color-surface:        #000000;
    --kendo-color-surface-alt:    #000000;
    --kendo-color-on-surface:     #ffffff;
    --kendo-color-on-surface-alt: #ffffff;

    /* ── Borders (always solid white — no transparency) ───────── */
    --kendo-color-border:     #ffffff;
    --kendo-color-border-alt: #ffffff;

    /* ── Base (inputs / neutral buttons) ─────────────────────── */
    --kendo-color-base:               #000000;
    --kendo-color-base-hover:         #1aebff;
    --kendo-color-base-active:        #ffff01;
    --kendo-color-base-subtle:        #000000;
    --kendo-color-base-subtle-hover:  #1aebff;
    --kendo-color-base-subtle-active: #ffff01;
    --kendo-color-base-emphasis:      #ffffff;
    --kendo-color-base-on-subtle:     #ffffff;
    --kendo-color-on-base:            #ffffff;
    --kendo-color-base-on-surface:    #ffffff;

    /* ── Primary (bright cyan accent) ─────────────────────────── */
    --kendo-color-primary:               #1aebff;
    --kendo-color-primary-hover:         #ffff01;
    --kendo-color-primary-active:        #ffff01;
    --kendo-color-primary-subtle:        #000000;
    --kendo-color-primary-subtle-hover:  #1aebff;
    --kendo-color-primary-subtle-active: #ffff01;
    --kendo-color-primary-emphasis:      #1aebff;
    --kendo-color-primary-on-subtle:     #1aebff;
    --kendo-color-on-primary:            #000000;
    --kendo-color-primary-on-surface:    #1aebff;

    /* ── Secondary (black on white inversion) ────────────────── */
    --kendo-color-secondary:               #000000;
    --kendo-color-secondary-hover:         #1aebff;
    --kendo-color-secondary-active:        #ffff01;
    --kendo-color-secondary-subtle:        #000000;
    --kendo-color-secondary-subtle-hover:  #1aebff;
    --kendo-color-secondary-subtle-active: #ffff01;
    --kendo-color-secondary-emphasis:      #ffffff;
    --kendo-color-secondary-on-subtle:     #ffffff;
    --kendo-color-on-secondary:            #ffffff;
    --kendo-color-secondary-on-surface:    #ffffff;

    /* ── Info (same bright cyan as primary — WCAG contrast) ──── */
    --kendo-color-info:               #1aebff;
    --kendo-color-info-hover:         #ffff01;
    --kendo-color-info-active:        #ffff01;
    --kendo-color-info-subtle:        #000000;
    --kendo-color-info-subtle-hover:  #1aebff;
    --kendo-color-info-subtle-active: #ffff01;
    --kendo-color-info-emphasis:      #1aebff;
    --kendo-color-info-on-subtle:     #1aebff;
    --kendo-color-on-info:            #000000;
    --kendo-color-info-on-surface:    #1aebff;

    /* ── Success (bright cyan — differentiated by icon) ───────── */
    --kendo-color-success:               #3ff23f;
    --kendo-color-success-hover:         #ffff01;
    --kendo-color-success-active:        #ffff01;
    --kendo-color-success-subtle:        #000000;
    --kendo-color-success-subtle-hover:  #3ff23f;
    --kendo-color-success-subtle-active: #ffff01;
    --kendo-color-success-emphasis:      #3ff23f;
    --kendo-color-success-on-subtle:     #3ff23f;
    --kendo-color-on-success:            #000000;
    --kendo-color-success-on-surface:    #3ff23f;

    /* ── Warning (bright yellow) ──────────────────────────────── */
    --kendo-color-warning:               #ffff01;
    --kendo-color-warning-hover:         #1aebff;
    --kendo-color-warning-active:        #1aebff;
    --kendo-color-warning-subtle:        #000000;
    --kendo-color-warning-subtle-hover:  #ffff01;
    --kendo-color-warning-subtle-active: #1aebff;
    --kendo-color-warning-emphasis:      #ffff01;
    --kendo-color-warning-on-subtle:     #ffff01;
    --kendo-color-on-warning:            #000000;
    --kendo-color-warning-on-surface:    #ffff01;

    /* ── Error (bright pink — must be visually distinct) ─────── */
    --kendo-color-error:               #ff5788;
    --kendo-color-error-hover:         #ffff01;
    --kendo-color-error-active:        #ffff01;
    --kendo-color-error-subtle:        #000000;
    --kendo-color-error-subtle-hover:  #ff5788;
    --kendo-color-error-subtle-active: #ffff01;
    --kendo-color-error-emphasis:      #ff5788;
    --kendo-color-error-on-subtle:     #ff5788;
    --kendo-color-on-error:            #000000;
    --kendo-color-error-on-surface:    #ff5788;

    /* ── Elevations disabled — high contrast relies on 1px white
         borders, not shadow, for elevation cues. ────────────── */
    --kendo-elevation-1: 0 0 0 1px #ffffff;
    --kendo-elevation-2: 0 0 0 1px #ffffff;
    --kendo-elevation-3: 0 0 0 1px #ffffff;
    --kendo-elevation-4: 0 0 0 1px #ffffff;

    /* ── AppBar ──────────────────────────────────────────────── */
    --kendo-appbar-bg:     #000000;
    --kendo-appbar-text:   #ffffff;
    --kendo-appbar-border: #ffffff;
}

/* Body: pure black canvas, pure white text. */
body {
    background-color: #000000;
    color: #ffffff;
}

/* AppBar: solid black with a 1px white bottom border (not alpha). */
.k-appbar {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-bottom: 1px solid #ffffff !important;
    /* Kendo Default adds elevation-4 drop shadow. High-contrast mode must use
       solid outlines only — never alpha shadows — so suppress the default. */
    box-shadow: none !important;
}

/* High contrast convention: all focus rings are bright yellow and
   thick enough to be visible against any accent color. */
:focus-visible {
    outline: 3px solid #ffff01 !important;
    outline-offset: 2px;
}

/* Keyboard hyperlinks must remain yellow per Windows HC conventions. */
a, a:visited {
    color: #ffff01 !important;
}
a:hover, a:focus {
    color: #ffffff !important;
    background-color: #000000;
}