/**
 * F2P Design Tokens — НЕ МЕНЯТЬ ИМЕНА ПЕРЕМЕННЫХ
 * @intent: Единый источник токенов Make Task07/15 для витрины.
 * @see: Design system brief 2026; Figma Make KG1ISsnSHrA5vLUPpao3Vf
 */
:root {
  /* Brand */
  --f2p-brand: #184E3B;
  --f2p-brand2: #123D2E;
  --f2p-brand3: #0D3024;
  --f2p-brand-s: #EEF5F1;
  --f2p-brand-s2: #D5E8DF;

  /* Accent */
  --f2p-accent: #F68B1F;
  --f2p-accent-hover: #E07B0F;
  --f2p-accent-s: #FFF4E8;

  /* Text */
  --f2p-text: #1D2923;
  --f2p-text2: #66736D;
  --f2p-text3: #98A39E;

  /* Surface */
  --f2p-bg: #F6F8F7;
  --f2p-card: #FFFFFF;
  --f2p-border: #E2E8E5;
  --f2p-muted: #E2E8E5;

  /* Status */
  --f2p-success: #168A52;
  --f2p-success-s: #ECFDF5;
  --f2p-error: #D92D20;
  --f2p-error-s: #FFF1F2;

  /* Badge colors — по категории */
  --badge-marketing: #B45309;
  --badge-marketing-bg: #FEF3C7;
  --badge-marketing-border: #FCD34D;

  --badge-sale: #F68B1F;
  --badge-sale-bg: #FFF4E8;
  --badge-sale-border: #FCD34D;

  --badge-new: #7C3AED;
  --badge-new-bg: #F5F3FF;
  --badge-new-border: #DDD6FE;

  --badge-bogo: #0D9488;
  --badge-bogo-bg: #F0FDFA;
  --badge-bogo-border: #99F6E4;

  --badge-farm: #184E3B;
  --badge-farm-bg: #EEF5F1;
  --badge-farm-border: #D5E8DF;

  --badge-organic: #4D7C0F;
  --badge-organic-bg: #F7FEE7;
  --badge-organic-border: #BEF264;

  --badge-eco: #0D9488;
  --badge-eco-bg: #F0FDFA;
  --badge-eco-border: #99F6E4;

  --badge-quality: #0369A1;
  --badge-quality-bg: #F0F9FF;
  --badge-quality-border: #BAE6FD;

  --badge-premium: #92400E;
  --badge-premium-bg: #FEF3C7;
  --badge-premium-border: #FCD34D;

  --badge-dietary: #168A52;
  --badge-dietary-bg: #ECFDF5;
  --badge-dietary-border: #6EE7B7;

  --badge-seasonal: #92400E;
  --badge-seasonal-bg: #FEF3C7;
  --badge-seasonal-border: #FDE68A;

  --badge-winter: #0369A1;
  --badge-winter-bg: #F0F9FF;
  --badge-winter-border: #BAE6FD;

  --badge-spring: #E11D48;
  --badge-spring-bg: #FFF1F2;
  --badge-spring-border: #FECDD3;

  --badge-summer: #D97706;
  --badge-summer-bg: #FFFBEB;
  --badge-summer-border: #FDE68A;

  /* Radius */
  --f2p-radius-sm: 8px;
  --f2p-radius-md: 12px;
  --f2p-radius-lg: 16px;
  --f2p-radius-xl: 20px;

  /* Shadows */
  --f2p-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
  --f2p-shadow-hover: 0 4px 12px rgba(24, 78, 59, 0.12);

  /* @reason: Aliases for older Make CSS that used --color-* names */
  --color-brand-primary: var(--f2p-brand);
  --color-brand-primary-hover: var(--f2p-brand2);
  --color-brand-deep: var(--f2p-brand3);
  --color-brand-soft: var(--f2p-brand-s);
  --color-brand-border: var(--f2p-brand-s2);
  --color-accent: var(--f2p-accent);
  --color-accent-hover: var(--f2p-accent-hover);
  --color-accent-soft: var(--f2p-accent-s);
  --color-text-primary: var(--f2p-text);
  --color-text-secondary: var(--f2p-text2);
  --color-text-muted: var(--f2p-text3);
  --color-bg-page: var(--f2p-bg);
  --color-bg-card: var(--f2p-card);
  --color-border-default: var(--f2p-border);
}