/* eApteka design tokens — single source for the landing page and the Phoenix app (via tailwind.theme.js). */
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@700;800&family=Inter:wght@400;500;600;700&display=swap");

:root {
  /* Brand */
  --ea-amber-50: #FFFBEB;
  --ea-amber-100: #FEF3C7;
  --ea-amber-300: #FCD34D;
  --ea-amber-500: #FBBF24; /* brand yellow: backgrounds, primary buttons, capsule half */
  --ea-amber-700: #B45309; /* amber for text and links on white (contrast 5:1) */
  --ea-graphite-900: #1F2937; /* brand dark: text, capsule, secondary buttons */
  --ea-graphite-700: #374151;
  --ea-graphite-500: #6B7280; /* secondary text on white (4.8:1) */
  --ea-graphite-300: #D1D5DB; /* borders */
  --ea-graphite-200: #E5E7EB;
  --ea-graphite-100: #F3F4F6; /* surfaces */
  --ea-white: #FFFFFF;

  /* Semantic */
  --ea-success: #15803D;
  --ea-success-bg: #DCFCE7;
  --ea-danger: #B91C1C;
  --ea-danger-bg: #FEE2E2;
  --ea-info: #1D4ED8;
  --ea-info-bg: #DBEAFE;
  --ea-warning: var(--ea-amber-700);
  --ea-warning-bg: var(--ea-amber-100);

  /* Type */
  --ea-font-display: "Manrope", system-ui, sans-serif;
  --ea-font-body: "Inter", system-ui, sans-serif;
  --ea-text-display: 800 48px/56px var(--ea-font-display);
  --ea-text-h1: 800 36px/44px var(--ea-font-display);
  --ea-text-h2: 800 28px/36px var(--ea-font-display);
  --ea-text-h3: 700 22px/30px var(--ea-font-display);
  --ea-text-body-lg: 400 18px/28px var(--ea-font-body);
  --ea-text-body: 400 16px/24px var(--ea-font-body);
  --ea-text-small: 400 14px/20px var(--ea-font-body);
  --ea-text-caption: 500 12px/16px var(--ea-font-body);

  /* Space (4px grid), radius, shadow */
  --ea-space-1: 4px;  --ea-space-2: 8px;  --ea-space-3: 12px; --ea-space-4: 16px;
  --ea-space-5: 20px; --ea-space-6: 24px; --ea-space-8: 32px; --ea-space-10: 40px;
  --ea-space-12: 48px; --ea-space-16: 64px;
  --ea-radius-sm: 8px; --ea-radius-md: 12px; --ea-radius-lg: 16px; --ea-radius-xl: 24px; --ea-radius-pill: 999px;
  --ea-shadow-sm: 0 1px 2px rgba(17, 24, 39, 0.06);
  --ea-shadow-md: 0 4px 12px rgba(17, 24, 39, 0.08);
  --ea-shadow-lg: 0 12px 32px rgba(17, 24, 39, 0.12);

  /* Controls: touch targets are at least 44px */
  --ea-control-h: 48px;
  --ea-control-h-sm: 40px;
}

/* Buttons */
.ea-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--ea-space-2);
  min-height: var(--ea-control-h); padding: 0 var(--ea-space-6);
  border-radius: var(--ea-radius-md); border: 1px solid transparent;
  font: 600 16px/1 var(--ea-font-body); text-decoration: none; cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease;
}
.ea-btn--primary { background: var(--ea-amber-500); color: var(--ea-graphite-900); }
.ea-btn--primary:hover { background: var(--ea-amber-300); }
.ea-btn--dark { background: var(--ea-graphite-900); color: var(--ea-white); }
.ea-btn--dark:hover { background: var(--ea-graphite-700); }
.ea-btn--ghost { background: transparent; color: var(--ea-graphite-900); border-color: var(--ea-graphite-300); }
.ea-btn--ghost:hover { border-color: var(--ea-graphite-900); }
.ea-btn:focus-visible { outline: 3px solid var(--ea-graphite-900); outline-offset: 2px; }

/* Status badges: one color per meaning, the same in every role */
.ea-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 var(--ea-space-2);
  border-radius: var(--ea-radius-pill); font: var(--ea-text-caption); }
.ea-badge--wait    { background: var(--ea-warning-bg); color: var(--ea-warning); } /* Ждёт оплаты, Ждёт аптеку */
.ea-badge--work    { background: var(--ea-info-bg);    color: var(--ea-info); }    /* Оплачен, В сборке, Принят аптекой, Собран */
.ea-badge--move    { background: var(--ea-graphite-900); color: var(--ea-amber-500); } /* Забран курьером, В пути */
.ea-badge--done    { background: var(--ea-success-bg); color: var(--ea-success); } /* Доставлен */
.ea-badge--stop    { background: var(--ea-danger-bg);  color: var(--ea-danger); }  /* Отменён, Отказ аптеки */
.ea-badge--urgent  { background: var(--ea-amber-500);  color: var(--ea-graphite-900); } /* Срочно */