/* ============================================================================
   АгроМест — дизайн-токены (единый источник правды)
   ----------------------------------------------------------------------------
   Эти переменные используются и в дизайн-системе, и в прототипе.
   ============================================================================ */

:root {
  /* ---------- Цвета: акцент (зелёный) ---------- */
  --green-50:  #EAF7F0;
  --green-100: #D4EFE0;
  --green-200: #AAE0C3;
  --green-300: #7CCFA3;
  --green-400: #4FBD81;
  --green-500: #27AE60;   /* акцентный зелёный */
  --green-600: #219653;   /* hover */
  --green-700: #1B7D45;   /* active / текст (контраст) */
  --green-800: #166339;
  --green-900: #114D2C;

  /* ---------- Цвета: нейтральные (тёмный #151515, тёплый фон) ---------- */
  --gray-0:   #FFFFFF;
  --gray-50:  #F6F4EF;   /* фон страницы */
  --gray-100: #F0ECE4;
  --gray-200: #E7E2D8;
  --gray-300: #D6D1C6;
  --gray-400: #A8A49A;
  --gray-500: #807C73;
  --gray-600: #5E5B54;
  --gray-700: #403E39;
  --gray-800: #2B2B28;
  --gray-900: #151515;   /* второй цвет — основной тёмный */

  /* ---------- Семантические ---------- */
  --success: #27AE60;
  --success-bg: #EAF7F0;
  --warning: #D97706;
  --warning-bg: #FFF4E3;
  --danger:  #F55F39;   /* ошибка */
  --danger-bg:  #FDEEE8;
  --info:    #2563EB;
  --info-bg: #EFF6FF;

  /* ---------- Каналы связи ---------- */
  --telegram:  #0088CC;
  --telegram-bg: #E8F5FC;
  --viber:     #7C3AED;
  --viber-bg:  #F1EBFD;
  --whatsapp:  #25D366;
  --whatsapp-bg:#EAFBF0;
  --phone:     var(--green-700);
  --phone-bg:  var(--green-50);

  /* ---------- Семантические токены поверхности ---------- */
  --bg-page:       var(--gray-50);   /* #F6F4EF */
  --surface:       #FFFFFF;          /* карточки и панели */
  --surface-warm:  #FAF8F5;          /* второй фон */
  --surface-2:     var(--gray-100);
  --border:        var(--gray-200);
  --border-strong: var(--gray-300);
  --text-primary:  var(--gray-900);  /* #151515 */
  --text-secondary:var(--gray-600);
  --text-tertiary: var(--gray-500);
  --text-disabled: var(--gray-400);
  --text-on-brand: var(--gray-0);

  --brand:        var(--green-500);  /* #27AE60 */
  --brand-hover:  var(--green-600);
  --brand-active: var(--green-700);
  --brand-soft:   var(--green-50);
  --brand-strong: var(--green-700);  /* тёмно-зелёный для текста/ссылок */
  --focus-ring:   rgba(39, 174, 96, 0.35);

  /* ---------- Типографика ---------- */
  --font-display: "Geologica", system-ui, -apple-system, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;
  --font-sans:    "Geologica", system-ui, -apple-system, "Segoe UI", Roboto,
                  "Helvetica Neue", Arial, sans-serif;

  --text-xs:   12px;
  --text-sm:   14px;
  --text-base: 16px;
  --text-lg:   18px;
  --text-xl:   22px;
  --text-2xl:  26px;
  --text-3xl:  32px;
  --text-4xl:  40px;

  --leading-tight: 1.15;
  --leading-snug:  1.3;
  --leading-base:  1.55;

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

  /* ---------- Spacing (4px baseline) ---------- */
  --sp-1:  4px;
  --sp-2:  8px;
  --sp-3:  12px;
  --sp-4:  16px;
  --sp-5:  20px;
  --sp-6:  24px;
  --sp-7:  32px;
  --sp-8:  40px;
  --sp-9:  48px;
  --sp-10: 64px;
  --sp-11: 80px;
  --sp-12: 96px;

  /* ---------- Радиусы ---------- */
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   18px;
  --r-xl:   24px;
  --r-full: 999px;

  /* ---------- Тени (мягкие, тёплые) ---------- */
  --shadow-xs: 0 1px 2px rgba(43, 43, 40, 0.05);
  --shadow-sm: 0 1px 2px rgba(43, 43, 40, 0.04), 0 2px 8px -2px rgba(43, 43, 40, 0.06);
  --shadow-md: 0 2px 4px rgba(43, 43, 40, 0.04), 0 10px 24px -8px rgba(43, 43, 40, 0.12);
  --shadow-lg: 0 4px 8px rgba(43, 43, 40, 0.04), 0 24px 48px -16px rgba(43, 43, 40, 0.20);
  --shadow-brand: 0 8px 20px -8px rgba(39, 174, 96, 0.60);

  /* ---------- Градиенты ---------- */
  --grad-brand: linear-gradient(135deg, var(--green-400) 0%, var(--green-500) 45%, var(--green-700) 100%);
  --grad-hero:  linear-gradient(135deg, var(--green-800) 0%, var(--green-700) 50%, var(--green-600) 100%);
  --grad-thumb: linear-gradient(160deg, var(--green-50), var(--green-100));

  /* ---------- Grid и контейнеры ---------- */
  --container-max: 1200px;
  --container-gutter: 24px;
  --grid-cols: 12;

  /* ---------- Touch target ---------- */
  --touch-min: 44px;

  /* ---------- Прочее ---------- */
  --header-h: 72px;
  --tabbar-h: 64px;
  --transition: 180ms cubic-bezier(.2, .7, .3, 1);
  --surface-glass: rgba(250, 248, 245, 0.82);
}