/* KHub design tokens — copied verbatim from 17-DESIGN-SYSTEM.md §4.
   Components use ONLY these variables. No magic hex/px values in components. */

:root {
  /* --- Акцент --- */
  --accent-50:  #EEF0FF;
  --accent-100: #E0E3FF;
  --accent-500: #4F46E5;
  --accent-600: #4338CA;
  --accent-700: #3730A3;

  /* --- Нейтральные поверхности --- */
  --bg:            #F6F7F9;
  --surface:       #FFFFFF;
  --surface-2:     #F1F3F6;
  --surface-hover: #F7F8FA;
  --border:        #E3E7ED;
  --border-strong: #CBD2DC;

  /* --- Текст --- */
  --text:        #111827;
  --text-muted:  #5B6472;
  --text-subtle: #8A94A3;
  --text-invert: #FFFFFF;

  /* --- Семантика --- */
  --success: #15803D;  --success-bg: #EAF7EE;
  --warning: #B45309;  --warning-bg: #FEF4E6;
  --danger:  #B91C1C;  --danger-bg:  #FDECEC;
  --info:    #0369A1;  --info-bg:    #E8F4FB;

  /* --- Типографика --- */
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, "Cascadia Code", "JetBrains Mono", Consolas, monospace;

  --fs-xs:   12px;  --lh-xs:   16px;
  --fs-sm:   13px;  --lh-sm:   18px;
  --fs-base: 14px;  --lh-base: 20px;
  --fs-md:   16px;  --lh-md:   24px;
  --fs-lg:   18px;  --lh-lg:   26px;
  --fs-xl:   24px;  --lh-xl:   32px;
  --fs-2xl:  32px;  --lh-2xl:  40px;

  --fw-regular: 400;
  --fw-medium:  500;
  --fw-semibold: 600;

  /* --- Отступы (сетка 4px) --- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px;

  /* --- Радиусы --- */
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-full: 999px;

  /* --- Тени: мягкие, цветные, не чёрные --- */
  --shadow-sm: 0 1px 2px rgba(16, 24, 40, .05);
  --shadow-md: 0 4px 12px rgba(16, 24, 40, .08);
  --shadow-lg: 0 12px 32px rgba(16, 24, 40, .12);

  /* --- Motion --- */
  --ease: cubic-bezier(.2, 0, 0, 1);
  --dur-fast: 120ms;
  --dur-base: 180ms;
  --dur-slow: 240ms;

  /* --- Layout --- */
  --sidebar-w: 240px;
  --topbar-h: 56px;
  --content-max: 1440px;
  --control-h: 38px;
  --row-h: 44px;
}

[data-theme="dark"] {
  --accent-50:  #1B1B3A;
  --accent-100: #23234A;
  --accent-500: #818CF8;
  --accent-600: #6366F1;
  --accent-700: #A5B4FC;

  --bg:            #0B0D12;
  --surface:       #14171F;
  --surface-2:     #1B1F2A;
  --surface-hover: #1A1E28;
  --border:        #262B37;
  --border-strong: #3A4150;

  --text:        #E7EAF0;
  --text-muted:  #9BA4B4;
  --text-subtle: #6B7484;
  --text-invert: #0B0D12;

  --success: #4ADE80;  --success-bg: #10251A;
  --warning: #FBBF24;  --warning-bg: #2A2010;
  --danger:  #F87171;  --danger-bg:  #2A1414;
  --info:    #38BDF8;  --info-bg:    #0E2230;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, .45);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, .55);
}
