﻿/* ========================================
   High Contrast Theme
   WCAG AAA accessibility-focused
   Maximum contrast, sharp edges, no subtlety
   ======================================== */

[data-theme="high-contrast"] {
    --sidebar-bg: #000000;
    --sidebar-header-bg: #111111;
    --topbar-bg: #111111;
    --content-bg: #0a0a0a;
    --page-bg: #000000;

    --card-bg: #0a0a0a;
    --card-header-bg: #111111;
    --card-border: #ffffff;

    --table-bg: #0a0a0a;
    --table-header-bg: #111111;
    --table-border: #ffffff;
    --table-hover-bg: #1a1a1a;
    --table-stripe-bg: #050505;

    --text-primary: #ffffff;
    --text-secondary: #ffffff;
    --text-muted: #cccccc;
    --text-inverse: #000000;

    --border-color: #ffffff;
    --border-light: #ffffff;
    --sidebar-header-border: #ffffff;
    --topbar-border: #ffffff;

    --scrollbar-thumb: #ffffff;
    --scrollbar-thumb-hover: #ffff00;

    --sidebar-text: #ffffff;
    --sidebar-text-hover: #ffff00;
    --sidebar-active-bg: rgba(255, 255, 0, 0.15);
    --sidebar-active-text: #ffff00;
    --sidebar-active-border: #ffff00;
    --nav-group-bg: transparent;
    --nav-group-border: transparent;
    --nav-group-hover-bg: rgba(255, 255, 0, 0.08);

    --topbar-text: #ffffff;
    --topbar-text-active: #ffff00;

    --btn-primary-bg: #ffff00;
    --btn-primary-bg-hover: #00ffff;
    --btn-primary-text: #000000;
    --btn-secondary-bg: #1a1a1a;
    --btn-secondary-bg-hover: #333333;
    --btn-secondary-text: #ffffff;
    --btn-secondary-border: #ffffff;
    --btn-outline-border: #ffffff;
    --btn-outline-text: #ffffff;

    --input-bg: #0a0a0a;
    --input-border: #ffffff;
    --input-text: #ffffff;
    --input-placeholder: #999999;
    --input-focus-border: #ffff00;
    --input-disabled-bg: #111111;

    --dropdown-bg: #0a0a0a;
    --dropdown-border: #ffffff;
    --dropdown-text: #ffffff;
    --dropdown-hover-bg: #1a1a1a;
    --dropdown-hover-text: #ffff00;

    --modal-bg: #0a0a0a;
    --modal-header-bg: #111111;
    --modal-border: #ffffff;
    --modal-backdrop: rgba(0, 0, 0, 0.95);

    --alert-info-bg: rgba(0, 255, 255, 0.1);
    --alert-info-border: #00ffff;
    --alert-info-text: #00ffff;
    --alert-success-bg: rgba(0, 255, 0, 0.1);
    --alert-success-border: #00ff00;
    --alert-success-text: #00ff00;
    --alert-warning-bg: rgba(255, 255, 0, 0.1);
    --alert-warning-border: #ffff00;
    --alert-warning-text: #ffff00;
    --alert-danger-bg: rgba(255, 0, 0, 0.1);
    --alert-danger-border: #ff0000;
    --alert-danger-text: #ff0000;

    --success-color: #00ff00;
    --success-hover: #00cc00;
    --warning-color: #ffff00;
    --warning-hover: #cccc00;
    --danger-color: #ff0000;
    --danger-hover: #cc0000;

    --progress-bg: #1a1a1a;

    --avatar-bg: #ffff00;
    --logo-filter: invert(100%) sepia(0%) saturate(0%) brightness(100%);
    --shadow: 0 0 0 2px #ffffff;
    --link-color: #00ffff;
    --link-hover-color: #ffff00;

    /* ── canonical --tl-* contract bridge ─────────────────────────────
       ACCESSIBILITY theme: every text-on-surface pairing is pushed to
       maximum contrast (AAA / 7:1+). White (#fff) on the near-black
       surfaces (#000 / #0a0a0a / #111) yields ~19–21:1. The signature
       accent is bright yellow (#ffff00); black (#000) text on it = ~19.5:1.
       --tl-bg-base is the SOLID darkest colour (#000), never transparent. */
    --tl-bg-base:        #000000;                       /* solid darkest canvas (= --page-bg) */
    --tl-bg-elevated:    var(--card-bg);                /* #0a0a0a — white text ≈ 20:1 */
    --tl-bg-elevated-2:  var(--card-header-bg, var(--card-bg));   /* #111111 — white ≈ 18.9:1 */
    --tl-bg-elevated-3:  var(--btn-secondary-bg, var(--card-bg)); /* #1a1a1a — white ≈ 16:1 */
    --tl-bg-hover:       var(--table-hover-bg, var(--card-bg));   /* #1a1a1a */
    --tl-bg-input:       var(--input-bg, var(--card-bg));         /* #0a0a0a */

    --tl-text-primary:   var(--text-primary);           /* #ffffff */
    --tl-text-secondary: var(--text-secondary, var(--text-primary)); /* #ffffff */
    --tl-text-muted:     var(--text-muted, var(--text-secondary));   /* #cccccc — on #0a0a0a ≈ 14:1 */
    --tl-text-subtle:    var(--input-placeholder, var(--text-muted)); /* #999999 — on #0a0a0a ≈ 7.5:1 (AAA) */
    --tl-text-inverse:   var(--text-inverse, #000000);  /* #000000 — reads on yellow accent ≈ 19.5:1 */

    --tl-accent-primary:        var(--warning-color, #ffff00);       /* bright yellow signature accent */
    --tl-accent-primary-light:  var(--btn-primary-bg-hover, #00ffff); /* cyan (hover) */
    --tl-accent-primary-dark:   var(--warning-hover, #cccc00);

    --tl-border-default: var(--border-color, var(--card-border));   /* #ffffff */
    --tl-border-subtle:  var(--card-border, var(--border-color));   /* #ffffff */
    --tl-border-strong:  var(--border-light, var(--input-border, var(--border-color))); /* #ffffff */
    --tl-border-focus:   var(--input-focus-border, var(--warning-color)); /* #ffff00 */

    --tl-card-bg:        var(--card-bg);                 /* #0a0a0a */
    --tl-card-border:    var(--card-border, var(--border-color)); /* #ffffff */
    --tl-card-header-bg: var(--card-header-bg, var(--card-bg));   /* #111111 */

    --tl-button-primary-bg:     var(--btn-primary-bg, #ffff00);   /* yellow fill */
    --tl-button-primary-text:   var(--btn-primary-text, #000000); /* black label on yellow ≈ 19.5:1 */
    --tl-button-secondary-bg:   var(--btn-secondary-bg, var(--card-header-bg)); /* #1a1a1a */
    --tl-button-secondary-text: var(--btn-secondary-text, var(--text-primary)); /* #ffffff on #1a1a1a ≈ 16:1 */

    --tl-success: var(--success-color, #00ff00);
    --tl-error:   var(--danger-color, #ff0000);
    --tl-warning: var(--warning-color, #ffff00);
    --tl-info:    var(--alert-info-text, var(--link-color, #00ffff));
    --tl-error-bg:     var(--alert-danger-bg, rgba(255,0,0,.1));
    --tl-error-border: var(--alert-danger-border, var(--danger-color, #ff0000));

    --tl-shadow-sm: var(--shadow, 0 0 0 1px #ffffff);
    --tl-shadow-md: var(--shadow, 0 0 0 2px #ffffff);
    --tl-shadow-lg: var(--shadow, 0 0 0 3px #ffffff);
}

/* High contrast theme extras */
[data-theme="high-contrast"] {
    --focus-ring-color: #ffff00;
    --scrollbar-track: #000000;
    --border-radius-card: 0;
}

[data-theme="high-contrast"] ::selection {
    background-color: #ffff00;
    color: #000000;
}

/* Force button hover colours â€” override Bootstrap internals */
[data-theme="high-contrast"] .btn-primary:hover,
[data-theme="high-contrast"] .btn-primary:focus {
    background: #00ffff !important;
    background-color: #00ffff !important;
    border-color: #00ffff !important;
    color: #000000 !important;
}

[data-theme="high-contrast"] .btn-secondary:hover,
[data-theme="high-contrast"] .btn-secondary:focus {
    background: #333333 !important;
    background-color: #333333 !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

/* Sharp corners - crisp edges for maximum clarity */
[data-theme="high-contrast"] .btn,
[data-theme="high-contrast"] .form-control,
[data-theme="high-contrast"] .form-select,
[data-theme="high-contrast"] .input-group-text,
[data-theme="high-contrast"] .dropdown-menu,
[data-theme="high-contrast"] .modal-content,
[data-theme="high-contrast"] .card,
[data-theme="high-contrast"] .content-card,
[data-theme="high-contrast"] .content-section,
[data-theme="high-contrast"] .stat-card,
[data-theme="high-contrast"] .collapsible-section,
[data-theme="high-contrast"] .alert,
[data-theme="high-contrast"] .badge,
[data-theme="high-contrast"] .progress,
[data-theme="high-contrast"] .progress-bar,
[data-theme="high-contrast"] .list-group-item,
[data-theme="high-contrast"] .accordion-item,
[data-theme="high-contrast"] .accordion-button,
[data-theme="high-contrast"] .nav-tabs .nav-link,
[data-theme="high-contrast"] .nav-pills .nav-link,
[data-theme="high-contrast"] .page-link,
[data-theme="high-contrast"] .toast,
[data-theme="high-contrast"] .popover,
[data-theme="high-contrast"] .tooltip-inner,
[data-theme="high-contrast"] .form-check-input {
    border-radius: 0 !important;
}

[data-theme="high-contrast"] ::-webkit-scrollbar-thumb {
    border-radius: 0;
}

