/**
 * Ganz Security Portal — design tokens
 *
 * Single source of truth dla designu portalu. Plugin (cbc-plugin) używa
 * tych zmiennych przez `var(--ganz-*)` — gdy theme aktywny tokens
 * przeciekają na plugin, gdy theme nieaktywny plugin ma własne fallbacki.
 *
 * Kolorystyka: navy gradient (login hero), teal accent, white card,
 * dark CTA — zgodnie z mockupem Genstar.
 */

:root {
    /* ─── Colors ──────────────────────────────────────────────────────────── */
    --ganz-color-navy-900:   #0B1B2A;
    --ganz-color-navy-800:   #102942;
    --ganz-color-navy-700:   #1B3A5B;
    --ganz-color-navy-600:   #2A4F75;
    --ganz-color-teal-700:   #0E7490;
    --ganz-color-teal-600:   #0EA5E9;
    --ganz-color-teal-500:   #38BDF8;
    --ganz-color-teal-300:   #7DD3FC;

    --ganz-color-white:      #FFFFFF;
    --ganz-color-slate-50:   #F8FAFC;
    --ganz-color-slate-100:  #F1F5F9;
    --ganz-color-slate-200:  #E2E8F0;
    --ganz-color-slate-300:  #CBD5E1;
    --ganz-color-slate-400:  #94A3B8;
    --ganz-color-slate-500:  #64748B;
    --ganz-color-slate-600:  #475569;
    --ganz-color-slate-700:  #334155;
    --ganz-color-slate-800:  #1E293B;
    --ganz-color-slate-900:  #0F172A;

    --ganz-color-success:    #10B981;
    --ganz-color-warning:    #F59E0B;
    --ganz-color-danger:     #EF4444;
    --ganz-color-info:       #0EA5E9;

    /* ─── Semantic ────────────────────────────────────────────────────────── */
    --ganz-color-primary:        var(--ganz-color-slate-900);
    --ganz-color-primary-hover:  var(--ganz-color-slate-800);
    --ganz-color-accent:         var(--ganz-color-teal-600);
    --ganz-color-bg:             var(--ganz-color-slate-50);
    --ganz-color-surface:        var(--ganz-color-white);
    --ganz-color-text:           var(--ganz-color-slate-900);
    --ganz-color-text-muted:     var(--ganz-color-slate-500);
    --ganz-color-border:         var(--ganz-color-slate-200);
    --ganz-color-input-bg:       var(--ganz-color-white);
    --ganz-color-input-border:   var(--ganz-color-slate-300);
    --ganz-color-input-focus:    var(--ganz-color-teal-600);

    /* ─── Hero gradient (login + landing) ─────────────────────────────────── */
    --ganz-bg-hero:
        radial-gradient(circle at 50% 50%, rgba(56,189,248,0.10), transparent 55%),
        linear-gradient(135deg, var(--ganz-color-navy-900) 0%, var(--ganz-color-navy-700) 60%, var(--ganz-color-teal-700) 100%);

    /* ─── Typography ──────────────────────────────────────────────────────── */
    --ganz-font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', Arial, sans-serif;

    --ganz-fs-12: 0.75rem;
    --ganz-fs-14: 0.875rem;
    --ganz-fs-16: 1rem;
    --ganz-fs-18: 1.125rem;
    --ganz-fs-20: 1.25rem;
    --ganz-fs-24: 1.5rem;
    --ganz-fs-32: 2rem;
    --ganz-fs-40: 2.5rem;

    --ganz-lh-tight:   1.25;
    --ganz-lh-normal:  1.5;
    --ganz-lh-relaxed: 1.625;

    --ganz-fw-normal:   400;
    --ganz-fw-medium:   500;
    --ganz-fw-semibold: 600;
    --ganz-fw-bold:     700;

    /* ─── Spacing scale (4 px grid) ───────────────────────────────────────── */
    --ganz-sp-2:  0.125rem;
    --ganz-sp-4:  0.25rem;
    --ganz-sp-6:  0.375rem;
    --ganz-sp-8:  0.5rem;
    --ganz-sp-12: 0.75rem;
    --ganz-sp-16: 1rem;
    --ganz-sp-20: 1.25rem;
    --ganz-sp-24: 1.5rem;
    --ganz-sp-32: 2rem;
    --ganz-sp-40: 2.5rem;
    --ganz-sp-48: 3rem;
    --ganz-sp-64: 4rem;

    /* ─── Radius ──────────────────────────────────────────────────────────── */
    --ganz-radius-sm:  4px;
    --ganz-radius-md:  6px;
    --ganz-radius-lg:  8px;
    --ganz-radius-xl:  12px;
    --ganz-radius-2xl: 16px;
    --ganz-radius-full: 9999px;

    --ganz-radius-card:  var(--ganz-radius-xl);
    --ganz-radius-input: var(--ganz-radius-lg);

    /* ─── Shadows ─────────────────────────────────────────────────────────── */
    --ganz-shadow-sm:    0 1px 2px rgba(15, 23, 42, 0.06);
    --ganz-shadow-md:    0 4px 12px rgba(15, 23, 42, 0.08);
    --ganz-shadow-lg:    0 8px 24px rgba(15, 23, 42, 0.12);
    --ganz-shadow-card:  0 20px 60px rgba(11, 27, 42, 0.25);

    /* ─── Transitions ─────────────────────────────────────────────────────── */
    --ganz-transition-fast:   120ms ease;
    --ganz-transition-normal: 200ms ease;

    /* ─── Z-index scale ───────────────────────────────────────────────────── */
    --ganz-z-dropdown:   1000;
    --ganz-z-sticky:     1100;
    --ganz-z-overlay:    1200;
    --ganz-z-modal:      1300;
    --ganz-z-tooltip:    1400;

    /* ─── Layout ──────────────────────────────────────────────────────────── */
    --ganz-container-max:   1280px;
    --ganz-container-pad:   var(--ganz-sp-24);
    --ganz-sidebar-width:   240px;
    --ganz-topbar-height:   64px;
}
