/* ==========================================================================
   mpbot — Operations Hub design system
   tokens.css — единый источник правды для всех UI-токенов.
   ========================================================================== */

:root {
    /* ---------- surfaces ---------- */
    --bg-app:        #F8F9FB;
    --bg-card:       #FFFFFF;
    --bg-sidebar:    #111827;
    --bg-hover:      #F3F4F6;
    --bg-subtle:     #F9FAFB;
    --bg-overlay:    rgba(15, 23, 42, 0.48);

    /* ---------- brand / accent (Marketplace Kari pink) ---------- */
    --accent:        #E91E8C;
    --accent-hover:  #C71776;
    --accent-soft:   #FDE6F1;
    --accent-ring:   rgba(233, 30, 140, 0.22);
    --accent-fg:     #FFFFFF;

    /* ---------- statuses ---------- */
    --status-progress: #3B82F6;
    --status-progress-soft: #DBEAFE;
    --status-done:     #10B981;
    --status-done-soft: #D1FAE5;
    --status-review:   #F59E0B;
    --status-review-soft: #FEF3C7;
    --status-overdue:  #EF4444;
    --status-overdue-soft: #FEE2E2;
    --status-archive:  #9CA3AF;
    --status-archive-soft: #F3F4F6;

    /* ---------- text ---------- */
    --text-1:        #0F172A;
    --text-2:        #475569;
    --text-3:        #94A3B8;
    --text-on-accent: #FFFFFF;
    --text-on-dark:   #F9FAFB;
    --text-on-dark-2: #9CA3AF;

    /* ---------- borders ---------- */
    --border:        #E5E7EB;
    --border-hover:  #D1D5DB;
    --border-strong: #9CA3AF;
    --border-input:  #D1D5DB;
    --border-input-focus: var(--accent);

    /* ---------- radii ---------- */
    --radius-sm:  6px;
    --radius-md:  8px;
    --radius-lg:  12px;
    --radius-xl:  16px;
    --radius-pill: 9999px;

    /* ---------- shadows ---------- */
    --shadow-1: 0 1px 2px rgba(15, 23, 42, 0.04);
    --shadow-2: 0 4px 12px rgba(15, 23, 42, 0.08);
    --shadow-3: 0 12px 32px rgba(15, 23, 42, 0.12);
    --shadow-focus: 0 0 0 3px var(--accent-ring);

    /* ---------- typography ---------- */
    --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text',
                 'Geist', 'Segoe UI', system-ui, sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

    --text-xs:    11px;
    --text-sm:    13px;
    --text-base:  15px;
    --text-md:    16px;
    --text-lg:    17px;
    --text-xl:    22px;
    --text-2xl:   28px;
    --text-3xl:   36px;

    --leading-tight:  1.25;
    --leading-snug:   1.4;
    --leading-normal: 1.55;
    --leading-loose:  1.7;

    --weight-regular:  400;
    --weight-medium:   500;
    --weight-semibold: 600;
    --weight-bold:     700;

    /* ---------- spacing ---------- */
    --space-1:  4px;
    --space-2:  8px;
    --space-3:  12px;
    --space-4:  16px;
    --space-5:  20px;
    --space-6:  24px;
    --space-7:  28px;
    --space-8:  32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;

    /* ---------- layout sizes ---------- */
    --sidebar-w:        220px;
    --sidebar-w-mobile: 0;
    --topbar-h:         56px;
    --bottomnav-h:      64px;
    --content-max:      1440px;

    /* ---------- motion ---------- */
    --transition-fast:   120ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-base:   180ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow:   260ms cubic-bezier(0.16, 1, 0.3, 1);

    /* ---------- z-index scale ---------- */
    --z-sidebar:     20;
    --z-topbar:      30;
    --z-dropdown:    40;
    --z-modal:       50;
    --z-toast:       60;
    --z-tooltip:     70;
}

/* ==========================================================================
   DARK THEME — премиальный neutral graphite (Linear/Vercel-style).
   Брендовый акцент #E91E8C сохраняется, soft-варианты — полупрозрачные.
   Границы намеренно нейтральные (без насыщенности) для «дорогого» вида.
   ========================================================================== */
:root[data-theme="dark"] {
    /* surfaces */
    --bg-app:        #0B0C0F;
    --bg-card:       #14151A;
    --bg-sidebar:    #08090B;
    --bg-hover:      #1C1D23;
    --bg-subtle:     #14151A;
    --bg-overlay:    rgba(0, 0, 0, 0.6);

    /* text */
    --text-1:        #ECEDF1;
    --text-2:        #A0A5B5;
    --text-3:        #6B7185;
    --text-on-dark:  #F9FAFB;
    --text-on-dark-2: #A0A5B5;

    /* borders — нейтральные (низкая насыщенность для премиум-вида) */
    --border:        #24262D;
    --border-hover:  #34363F;
    --border-strong: #4A4D57;
    --border-input:  #34363F;

    /* accent — оставляем яркий магента, поправляем soft-фон под dark */
    --accent-soft:   rgba(233, 30, 140, 0.14);
    --accent-ring:   rgba(233, 30, 140, 0.30);

    /* статусы softs — полупрозрачные на тёмном */
    --status-progress-soft: rgba(59, 130, 246, 0.16);
    --status-done-soft:     rgba(16, 185, 129, 0.16);
    --status-review-soft:   rgba(245, 158, 11, 0.16);
    --status-overdue-soft:  rgba(239, 68, 68, 0.16);
    --status-archive-soft:  rgba(156, 163, 175, 0.14);

    /* тени почти отключены — на тёмном работают плохо */
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.35);
    --shadow-2: 0 4px 14px rgba(0, 0, 0, 0.45);
    --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.65);
}