/* ============================================================================
   AMI Global Theme — Design Tokens
   Loaded app-wide; overridden at runtime by ami-theme-engine.js
   ========================================================================== */

:root {
    /* Brand ramp (Emerald default) */
    --ami-brand-50:  #ecfdf5;
    --ami-brand-100: #d1fae5;
    --ami-brand-200: #a7f3d0;
    --ami-brand-300: #6ee7b7;
    --ami-brand-400: #34d399;
    --ami-brand-500: #10b981;
    --ami-brand-600: #059669;
    --ami-brand-700: #047857;
    --ami-brand-800: #065f46;
    --ami-brand-900: #064e3b;
    --ami-brand-950: #022c22;
    --ami-brand-rgb: 5, 150, 105;
    --ami-brand-deep-rgb: 6, 78, 59;

    /* Accent */
    --ami-accent: #0f9b8e;
    --ami-accent-rgb: 15, 155, 142;

    /* Semantic */
    --ami-success: #059669;
    --ami-warning: #d97706;
    --ami-danger:  #e11d48;
    --ami-info:    var(--ami-accent);
    --ami-neutral: #5b6b66;

    /* Surfaces — light */
    --ami-canvas:       #eef5f2;
    --ami-surface:      #ffffff;
    --ami-surface-2:    #f5faf7;
    --ami-surface-3:    #eaf3ee;
    --ami-glass:        rgba(255, 255, 255, 0.72);
    --ami-glass-strong: rgba(255, 255, 255, 0.88);

    /* Lines */
    --ami-border:        rgba(6, 78, 59, 0.10);
    --ami-border-strong: rgba(6, 78, 59, 0.18);
    --ami-divider:       rgba(6, 78, 59, 0.07);
    /* Brand-tinted accent lines (tabs, focus rings, active indicators) */
    --ami-line-accent:   rgba(var(--ami-brand-rgb), 0.22);
    --ami-line-focus:    rgba(var(--ami-brand-rgb), 0.55);
    --ami-line-focus-ring: rgba(var(--ami-brand-rgb), 0.15);

    /* Typography — light */
    --ami-text:       #0b2a22;
    --ami-text-2:     #35544b;
    --ami-text-muted: #6b8279;
    --ami-text-faint: #93a8a0;
    --ami-on-brand:   #ffffff;

    /* Gradients */
    --ami-grad-brand: linear-gradient(135deg, var(--ami-brand-800) 0%, var(--ami-brand-600) 42%, var(--ami-brand-400) 100%);
    --ami-grad-sidebar: linear-gradient(180deg, var(--ami-brand-800) 0%, var(--ami-brand-700) 38%, var(--ami-brand-600) 72%, var(--ami-brand-400) 100%);
    --ami-grad-hero: linear-gradient(135deg, var(--ami-brand-950) 0%, var(--ami-brand-800) 18%, var(--ami-brand-700) 42%, var(--ami-brand-600) 68%, var(--ami-brand-400) 100%);

    /* Shadows */
    --ami-sh-xs: 0 1px 2px rgba(var(--ami-brand-deep-rgb), 0.06);
    --ami-sh-sm: 0 1px 2px rgba(var(--ami-brand-deep-rgb), 0.05), 0 2px 8px rgba(var(--ami-brand-deep-rgb), 0.05);
    --ami-sh-md: 0 1px 2px rgba(var(--ami-brand-deep-rgb), 0.05), 0 6px 16px -4px rgba(var(--ami-brand-deep-rgb), 0.10), 0 12px 32px -12px rgba(var(--ami-brand-deep-rgb), 0.12);
    --ami-sh-lg: 0 2px 4px rgba(var(--ami-brand-deep-rgb), 0.05), 0 12px 28px -8px rgba(var(--ami-brand-deep-rgb), 0.14), 0 28px 64px -20px rgba(var(--ami-brand-deep-rgb), 0.20);
    --ami-sh-brand: 0 8px 24px -8px rgba(var(--ami-brand-rgb), 0.45), 0 2px 6px rgba(var(--ami-brand-rgb), 0.22);

    /* Radii & motion */
    --ami-r-sm: 8px;
    --ami-r-md: 14px;
    --ami-r-lg: 22px;
    --ami-r-pill: 999px;
    --ami-ease: cubic-bezier(0.32, 0.72, 0, 1);
    --ami-fast: 0.16s;
    --ami-base: 0.28s;

    /* ── Layout aliases (professional-layout.css) ── */
    --primary-color:       var(--ami-brand-600);
    --primary-dark:        var(--ami-brand-700);
    --primary-deep:        var(--ami-brand-800);
    --primary-light:       var(--ami-brand-400);
    --sidebar-bg:          var(--ami-brand-700);
    --sidebar-gradient:    var(--ami-grad-sidebar);
    --sidebar-section-color: var(--ami-brand-200);
    --header-bg:           var(--ami-surface);
    --header-text:         var(--ami-text-2);
    --header-icon:         var(--ami-text-muted);
    --header-icon-hover:   var(--ami-brand-600);
    --footer-text:         var(--ami-text-muted);
    --footer-accent:       var(--ami-brand-600);
    --footer-link:         var(--ami-brand-600);
    --footer-bg:           var(--ami-surface);
    --footer-border:       var(--ami-border);

    /* ── Dashboard aliases (committee-overview-pro / ultra) ── */
    --dk-primary:       var(--ami-brand-600);
    --dk-primary-dark:  var(--ami-brand-700);
    --dk-primary-light: var(--ami-brand-100);
    --dk-accent:        var(--ami-accent);
    --dk-success:       var(--ami-success);
    --dk-warning:       var(--ami-warning);
    --dk-danger:        var(--ami-danger);
    --dk-info:          var(--ami-info);
    --dk-neutral:       var(--ami-neutral);
    --dk-bg:            var(--ami-canvas);
    --dk-surface:       var(--ami-surface);
    --dk-surface-2:     var(--ami-surface-2);
    --dk-border:        var(--ami-border);
    --dk-text:          var(--ami-text);
    --dk-text-muted:    var(--ami-text-muted);
    --dk-shadow:        var(--ami-sh-md);
    --dk-shadow-lg:     var(--ami-sh-lg);

    --cx-50:  var(--ami-brand-50);
    --cx-100: var(--ami-brand-100);
    --cx-200: var(--ami-brand-200);
    --cx-300: var(--ami-brand-300);
    --cx-400: var(--ami-brand-400);
    --cx-500: var(--ami-brand-500);
    --cx-600: var(--ami-brand-600);
    --cx-700: var(--ami-brand-700);
    --cx-800: var(--ami-brand-800);
    --cx-900: var(--ami-brand-900);
    --cx-950: var(--ami-brand-950);
    --cx-rgb: var(--ami-brand-rgb);
    --cx-rgb-deep: var(--ami-brand-deep-rgb);
    --cx-accent: var(--ami-accent);
    --cx-accent-rgb: var(--ami-accent-rgb);
    --cx-canvas: var(--ami-canvas);
    --cx-surface: var(--ami-surface);
    --cx-surface-2: var(--ami-surface-2);
    --cx-border: var(--ami-border);
    --cx-text: var(--ami-text);
    --cx-text-muted: var(--ami-text-muted);
    --cx-grad-brand: var(--ami-grad-brand);
}

/* ── Dark mode token overrides ── */
html[data-bs-theme="dark"],
body.dark-mode,
body.s-dark {
    --ami-canvas:       #0f172a;
    --ami-surface:      #1e293b;
    --ami-surface-2:    #334155;
    --ami-surface-3:    #1e293b;
    --ami-glass:        rgba(30, 41, 59, 0.82);
    --ami-glass-strong: rgba(30, 41, 59, 0.92);
    --ami-border:        rgba(148, 163, 184, 0.14);
    --ami-border-strong: rgba(148, 163, 184, 0.22);
    --ami-divider:       rgba(148, 163, 184, 0.08);
    --ami-line-accent:   rgba(var(--ami-brand-rgb), 0.28);
    --ami-line-focus:    rgba(var(--ami-brand-rgb), 0.55);
    --ami-line-focus-ring: rgba(var(--ami-brand-rgb), 0.15);

    --md-v2-border: var(--ami-border);
    --md-v2-border-accent: var(--ami-line-accent);
    --dk-border: var(--ami-border);
    --cx-border: var(--ami-border);
    --footer-border: var(--ami-border);
    --ami-text:       #f1f5f9;
    --ami-text-2:     #cbd5e1;
    --ami-text-muted: #94a3b8;
    --ami-text-faint: #64748b;
    --ami-grad-sidebar: linear-gradient(180deg, var(--ami-brand-950) 0%, var(--ami-brand-800) 40%, var(--ami-brand-700) 75%, var(--ami-brand-800) 100%);
    --ami-sh-md: 0 10px 32px rgba(0, 0, 0, 0.35);
    --ami-sh-lg: 0 22px 60px rgba(0, 0, 0, 0.42);

    --header-bg:         var(--ami-surface);
    --header-text:       var(--ami-text);
    --header-icon:       var(--ami-text-muted);
    --header-icon-hover: var(--ami-brand-300);
    --footer-bg:         var(--ami-surface);
    --footer-text:       var(--ami-text-muted);
    --footer-accent:     var(--ami-brand-300);
    --footer-link:       var(--ami-brand-300);
    --footer-border:     var(--ami-border);
    --sidebar-section-color: var(--ami-brand-300);

    --dk-primary-light: rgba(var(--ami-brand-rgb), 0.2);
}
