/* ============================================================
   theme.css — ЦВЕТА И ТЕМЫ приложения «Джангитау».
   Здесь меняются все цвета. Больше нигде цвета не прописаны «жёстко».

   Как переключить палитру на цвета логотипа (красный):
   в js/data/config.js поставьте  brand: 'logo'  (по умолчанию 'telegram').
   ============================================================ */

:root {
  /* Акцент по требованию: фирменный голубой Telegram */
  --accent: #2AABEE;
  --accent-text: #ffffff;               /* цвет текста на акцентной кнопке */
  --accent-soft: rgba(42, 171, 238, .14);/* лёгкая подложка под акцентом */

  /* Светлая тема (по умолчанию) */
  --bg: #ffffff;        /* верхние панели, листы */
  --bg2: #eff1f5;       /* фон страницы (светло-серый, как в Telegram) */
  --card: #ffffff;      /* карточки */
  --text: #0f1419;
  --hint: #66727f;      /* второстепенный текст (контраст не ниже 4.5:1) */
  --line: rgba(0, 0, 0, .08);

  /* Служебные цвета */
  --ok: #2b9a4a;
  --warn: #c98a0b;
  --danger: #e0443e;
  --gold: #e3a93c;      /* золотой акцент (звёзды, рамки) */

  --radius: 16px;
  --radius-sm: 12px;
  --shadow: 0 2px 10px rgba(16, 24, 40, .07);
  --shadow-lg: 0 8px 28px rgba(16, 24, 40, .16);
}

/* Тёмная тема: включается, когда Telegram или система просит тёмную */
[data-theme="dark"] {
  --bg: #17212b;
  --bg2: #0e1621;
  --card: #1f2c3a;
  --text: #f4f6f8;
  --hint: #8d9aa7;
  --line: rgba(255, 255, 255, .1);
  --accent-soft: rgba(42, 171, 238, .22);
  --shadow: 0 2px 12px rgba(0, 0, 0, .35);
  --shadow-lg: 0 8px 28px rgba(0, 0, 0, .5);
}

/* ============================================================
   ПАЛИТРА ПРОЕКТА «ДЖАНГИТАУ» (brand: 'logo' в config.js).
   Целиком из логотипа хозяина и фасада: красный чохи, серо-зелёный гор,
   тёплый кремовый фон, золото. Цвета фона и текста НЕ берутся из темы
   Telegram (см. js/telegram.js), чтобы приложение выглядело «нашим».
   ============================================================ */
[data-brand="logo"] {
  --accent: #c4283a;                       /* красный чохи */
  --accent-text: #ffffff;
  --accent-soft: rgba(196, 40, 58, .12);
  --sage: #6e8f84;                         /* серо-зелёный гор */
  --gold: #d9a441;                         /* золото (звёзды, рамки) */
  --bg: #fffaf2;                           /* шапки, нижнее меню, шторки */
  --bg2: #f5ede0;                          /* фон страницы: тёплый крем */
  --card: #fffdf8;                         /* карточки */
  --text: #2b1b17;                         /* тёмно-коричневый текст */
  --hint: #75665d;                         /* второстепенный текст */
  --line: rgba(80, 40, 25, .12);
  --shadow: 0 2px 10px rgba(90, 50, 30, .09);
  --shadow-lg: 0 8px 28px rgba(90, 50, 30, .18);
}
[data-brand="logo"][data-theme="dark"] {
  --accent: #e5485b;
  --accent-soft: rgba(229, 72, 91, .2);
  --sage: #8fb0a4;
  --bg: #251c1a;
  --bg2: #181210;                          /* тёмный фон с тёплым оттенком */
  --card: #2e2321;
  --text: #f6ebdd;
  --hint: #ab998d;
  --line: rgba(255, 235, 215, .12);
  --shadow: 0 2px 12px rgba(0, 0, 0, .4);
  --shadow-lg: 0 8px 28px rgba(0, 0, 0, .55);
}

/* Заголовки в «винном» серифном начертании (только в палитре проекта) */
[data-brand="logo"] .scr-head h1,
[data-brand="logo"] .hello h1,
[data-brand="logo"] .cat-title,
[data-brand="logo"] .hero h2,
[data-brand="logo"] .venue h3,
[data-brand="logo"] .success h2,
[data-brand="logo"] .dish-sheet h2 {
  font-family: Georgia, "Times New Roman", "Noto Serif", serif;
  letter-spacing: -.2px;
}