/* =============================================================================
   Design tokens
   -----------------------------------------------------------------------------
   The app's own stylesheets carried ~400 raw hex literals across 24 files, so
   there was no single place to change a colour and no way to tell an intentional
   shade from a typo. These are the recurring values, named.

   Every use site is written as `var(--dz-x, #literal)`: the original hex stays
   as the fallback, so this file is additive and a load failure changes nothing.

   Three palettes coexist here because three things drew them: the Velzon
   template (Bootstrap's scale), the Tailwind-derived greens and greys used by
   the polling UI, and the indigo/violet brand gradient. They are named by
   origin rather than merged, because merging them is a design decision.
   ========================================================================== */

:root {
    /* --- Neutral ------------------------------------------------------- */
    --dz-white: #ffffff;
    --dz-black: #000000;

    /* --- Grey: Tailwind-derived (polling + interaction UI) -------------- */
    --dz-gray-100: #f3f4f6;
    --dz-gray-200: #e5e7eb;
    --dz-gray-300: #d1d5db;
    --dz-gray-500: #6b7280;
    --dz-gray-700: #374151;
    --dz-gray-800: #1f2937;

    /* --- Grey: slate (cards, surfaces) --------------------------------- */
    --dz-slate-50: #f8fafc;
    --dz-slate-100: #f1f5f9;
    --dz-slate-200: #e2e8f0;
    --dz-slate-300: #cbd5e1;
    --dz-slate-900: #0f172a;

    /* --- Grey: Bootstrap (template surfaces) --------------------------- */
    --dz-bs-gray-100: #f8f9fa;
    --dz-bs-gray-200: #e9ecef;
    --dz-bs-gray-300: #dee2e6;
    --dz-bs-gray-600: #6c757d;

    /* --- Brand --------------------------------------------------------- */
    --dz-brand-indigo: #6366f1;
    --dz-brand-indigo-50: #eef2ff;
    --dz-brand-gradient-from: #667eea;
    --dz-brand-gradient-to: #764ba2;

    /* --- Semantic ------------------------------------------------------ */
    --dz-success: #10b981;
    --dz-success-strong: #059669;
    --dz-success-bs: #198754;

    --dz-info: #3b82f6;
    --dz-info-bs: #007bff;

    --dz-warning: #f59e0b;
    --dz-warning-surface: #fef3c7;
    --dz-warning-surface-bs: #fff3cd;

    --dz-danger: #ef4444;


    /* --- Semantic surfaces / borders / deep text -----------------------
       The tints these alerts, badges and progress bars are built from. Kept
       per-family so a status colour can be restyled in one edit. */
    --dz-gray-50: #f9fafb;
    --dz-brand-indigo-600: #4f46e5;

    --dz-success-surface: #d1fae5;
    --dz-success-surface-bs: #d1e7dd;
    --dz-success-border: #a7f3d0;
    --dz-success-deep: #047857;

    --dz-info-surface: #dbeafe;
    --dz-info-border: #bfdbfe;
    --dz-info-deep: #1e40af;
    --dz-info-bs-dark: #0056b3;

    --dz-warning-border: #fde68a;
    --dz-warning-deep: #92400e;

    --dz-danger-bs: #dc3545;
    --dz-danger-strong: #dc2626;
    --dz-danger-surface: #fee2e2;
    --dz-danger-surface-bs: #f8d7da;
    --dz-danger-border: #fecaca;
    --dz-danger-deep-bs: #842029;

    /* --- Layering ------------------------------------------------------
       One scale, so the next overlay does not need another arbitrary number.
       Values are chosen to sit around Bootstrap's own tiers (modal 1055,
       backdrop 1050, toast 1090) rather than fight them. */
    --dz-z-sticky: 1020;
    --dz-z-backdrop: 1050;
    --dz-z-modal: 1055;
    --dz-z-popover: 1070;
    --dz-z-toast: 1090;
    /* Above the Zoom Meeting SDK client, which renders its own chrome high in
       the stack inside #zmmtg-root. */
    --dz-z-over-zoom: 10050;

    /* The live-interaction overlays (teacher FAB, poll panels, arrival alert)
       form their own stack that deliberately sits ABOVE Bootstrap's modal, so
       a poll can appear over an open dialog. The numbers are kept as they were
       -- naming them is the point, renumbering them would reorder the UI. */
    --dz-z-interaction-base: 1998;
    --dz-z-interaction-panel: 1999;
    --dz-z-interaction-alert: 2000;
    --dz-z-interaction-top: 2001;

    /* Full-screen blockers that must beat everything above. */
    --dz-z-preloader: 9999;
}