/* =========================================================================
   Объект — colors & type tokens
   Используется и для веба, и как источник истины для Flutter ThemeData.
   ========================================================================= */

/* ------ Inter (загружаем self-hosted из ./fonts/) ------ */
/* В прототипах ОК подменить на Google Fonts; для продакшна — self-host. */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

:root {
  /* ===== Brand ===== */
  --primary:        #2D6FF2;   /* Объект Blue — основной */
  --primary-hover:  #2560D8;
  --primary-press:  #1E52BE;
  --primary-50:     #EBF1FE;   /* для подсветок и fill-light состояний */
  --primary-100:    #D6E2FD;
  --primary-fg:     #FFFFFF;   /* текст на primary */

  /* ===== Семантика типов расходов (критична — описывает домен) ===== */
  --exp-card:       #22C55E;   /* 🟢 оплата картой / "принят" */
  --exp-card-50:    #DCFCE7;
  --exp-debt:       #F97316;   /* 🟠 отсрочка / долг */
  --exp-debt-50:    #FFEDD5;
  --exp-cash:       #EAB308;   /* 🟡 свои деньги (подотчёт) / "требует уточнения" */
  --exp-cash-50:    #FEF9C3;
  --exp-doc:        #3B82F6;   /* 🔵 документ поставщика (счёт/накладная/акт) */
  --exp-doc-50:     #DBEAFE;
  --exp-person:     #A855F7;   /* 🟣 оплата физлицу (СМЗ/ИП) */
  --exp-person-50:  #F3E8FF;
  --exp-manual:     #6B7280;   /* ⚪ ручной текстовый расход */
  --exp-manual-50:  #F3F4F6;
  --exp-error:      #EF4444;   /* 🔴 "отклонён" / ошибка */
  --exp-error-50:   #FEE2E2;

  /* ===== Нейтрали (slate scale) ===== */
  --slate-50:  #F8FAFC;
  --slate-100: #F1F5F9;
  --slate-200: #E2E8F0;
  --slate-300: #CBD5E1;
  --slate-400: #94A3B8;
  --slate-500: #64748B;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-800: #1E293B;
  --slate-900: #0F172A;

  /* ===== Семантика поверхностей (light theme) ===== */
  --bg:             #FFFFFF;        /* page background */
  --surface:        #FFFFFF;        /* card/sheet background */
  --surface-2:      var(--slate-50);/* приглушённая поверхность (input bg, hover) */
  --surface-hover:  var(--slate-100);
  --surface-press:  var(--slate-200);
  --border:         var(--slate-200);
  --border-strong:  var(--slate-300);
  --divider:        var(--slate-100);

  /* ===== Текст ===== */
  --fg:             var(--slate-900); /* основной текст */
  --fg-2:           var(--slate-600); /* вторичный — meta, подписи */
  --fg-3:           var(--slate-400); /* подсказки, плейсхолдеры */
  --fg-on-primary:  #FFFFFF;
  --fg-link:        var(--primary);

  /* ===== Тени ===== */
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.10);
  --shadow-lg: 0 16px 48px rgba(15, 23, 42, 0.16);

  /* ===== Радиусы ===== */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-bubble: 18px;     /* пузырь сообщения в чате */
  --radius-pill: 999px;

  /* ===== Сетка / spacing (4px grid) ===== */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;

  /* ===== Типографика ===== */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text',
               'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-num:  'Inter', ui-rounded, -apple-system, sans-serif;
  --tnum: "tnum" 1, "lnum" 1;   /* для сумм */

  /* размер */
  --t-xs: 11px;     /* мелкая мета (timestamp под сообщением) */
  --t-sm: 13px;     /* secondary, subtitle */
  --t-md: 15px;     /* основной body */
  --t-lg: 17px;     /* заголовки строк, ListItem title */
  --t-xl: 20px;     /* раздел в детализации */
  --t-2xl: 24px;    /* page heading в вебе, сумма в детализации */
  --t-3xl: 28px;    /* крупная сумма в детализации */
  --t-display: 34px;/* единичные крупные числа на дашборде */

  /* высота строки */
  --lh-tight: 1.2;
  --lh-normal: 1.4;
  --lh-relaxed: 1.55;

  /* easing */
  --ease-in:  cubic-bezier(0.4, 0, 1, 1);
  --ease-out: cubic-bezier(0.2, 0, 0, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  /* z-index */
  --z-sticky: 10;
  --z-drawer: 40;
  --z-modal: 50;
  --z-toast: 60;
}

/* =========== Тёмная тема =========== */
[data-theme="dark"], .theme-dark {
  --bg:            var(--slate-900);
  --surface:       var(--slate-800);
  --surface-2:     #16213A;
  --surface-hover: var(--slate-700);
  --surface-press: #0B1424;
  --border:        var(--slate-700);
  --border-strong: var(--slate-600);
  --divider:       var(--slate-800);

  --fg:           #F8FAFC;
  --fg-2:         var(--slate-400);
  --fg-3:         var(--slate-500);

  --primary:        #4D87F5;   /* slightly lifted */
  --primary-hover:  #639BFC;
  --primary-press:  #3D72D8;
  --primary-50:     rgba(77, 135, 245, 0.14);
  --primary-100:    rgba(77, 135, 245, 0.22);

  /* семантика — те же hex, но fill-50 на тёмном делается через rgba */
  --exp-card-50:    rgba(34, 197, 94, 0.16);
  --exp-debt-50:    rgba(249, 115, 22, 0.16);
  --exp-cash-50:    rgba(234, 179, 8, 0.18);
  --exp-doc-50:     rgba(59, 130, 246, 0.18);
  --exp-person-50:  rgba(168, 85, 247, 0.18);
  --exp-manual-50:  rgba(107, 114, 128, 0.20);
  --exp-error-50:   rgba(239, 68, 68, 0.18);

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.5);
  --shadow-lg: 0 16px 48px rgba(0,0,0,0.6);
}

/* =========== Базовая типографика =========== */
html, body {
  font-family: var(--font-sans);
  color: var(--fg);
  background: var(--bg);
  font-size: var(--t-md);
  line-height: var(--lh-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Семантические текстовые роли */
.text-display   { font-size: var(--t-display); font-weight: 700; line-height: var(--lh-tight); letter-spacing: -0.02em; }
.text-h1, h1    { font-size: var(--t-2xl); font-weight: 600; line-height: var(--lh-tight); letter-spacing: -0.01em; }
.text-h2, h2    { font-size: var(--t-xl); font-weight: 600; line-height: var(--lh-tight); }
.text-h3, h3    { font-size: var(--t-lg); font-weight: 600; line-height: var(--lh-tight); }
.text-body      { font-size: var(--t-md); font-weight: 400; line-height: var(--lh-normal); }
.text-body-strong { font-size: var(--t-md); font-weight: 500; line-height: var(--lh-normal); }
.text-meta      { font-size: var(--t-sm); font-weight: 400; line-height: var(--lh-normal); color: var(--fg-2); }
.text-caption   { font-size: var(--t-xs); font-weight: 400; line-height: var(--lh-normal); color: var(--fg-2); }

/* Денежные суммы — табличные цифры */
.num, .amount {
  font-family: var(--font-num);
  font-feature-settings: var(--tnum);
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: -0.005em;
}
.amount-xl { font-size: var(--t-3xl); font-weight: 700; }
.amount-lg { font-size: var(--t-2xl); font-weight: 700; }
.amount-md { font-size: var(--t-lg); font-weight: 600; }
.amount-sm { font-size: var(--t-md); font-weight: 600; }

/* Утилиты ссылок */
a { color: var(--fg-link); text-decoration: none; }
a:hover { text-decoration: underline; }