/* Ollee — дизайн-токены. Палитра и шрифт из SPEC.md §3.5, DESIGN.md. */

:root {
  /* Палитра бренда (сайт ollee-beauty.com) */
  --color-primary: #19205d;
  --color-accent: #66a1bf;
  --color-accent-dark: #3f85a8;
  --color-accent-mid: #5695b5;
  --color-bg-1: #f2f6f8;
  --color-bg-2: #dfeaee;
  --color-bg-3: #eaf2f4;
  --color-white: #ffffff;

  --color-text: var(--color-primary);
  --color-text-muted: #7c839c;
  --color-danger: #c0392b;
  --color-old-price: #a3aabd;
  --color-border: #e3eaee;

  /* Шрифт: Monti (сайт клиента) недоступен вне Tilda — берём Manrope, см. DEVIATIONS.md */
  --font-family: "Manrope", "Onest", -apple-system, sans-serif;

  /* Скругления и тени по референсу стиля: крупный радиус, тень почти незаметная */
  --radius-s: 12px;
  --radius-m: 18px;
  --radius-l: 24px;
  --radius-pill: 999px;

  --shadow-card: 0 2px 10px rgba(25, 32, 93, 0.05);
  --shadow-raised: 0 6px 24px rgba(25, 32, 93, 0.1);

  --space-xs: 4px;
  --space-s: 8px;
  --space-m: 12px;
  --space-l: 16px;
  --space-xl: 24px;

  --tabbar-height: 68px;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  background: var(--color-bg-1);
  color: var(--color-text);
  font-family: var(--font-family);
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: -0.01em;
  -webkit-font-smoothing: antialiased;
}

/* Окно мини-аппа не должно ездить (26.10.2026): на iOS документ целиком
   тянулся резинкой, а свайп вниз от верха страницы сворачивал магазин даже
   при disableVerticalSwipes. Поэтому сам документ не прокручивается вовсе,
   а прокрутка страницы живёт внутри body: он прибит к окну и скроллится сам,
   overscroll-behavior не отдаёт оттяжку наружу. Фиксированные таб-бар,
   панель «В корзину» и кнопка полного экрана считаются от окна, как раньше;
   sticky-итог корзины — от body, который теперь и есть прокрутка. */
html {
  height: 100%;
  overflow: hidden;
  overscroll-behavior: none;
}

body {
  position: fixed;
  inset: 0;
  /* Полноэкранный режим Telegram (Bot API 8.0): сверху статус-бар и кнопки
     Telegram «Закрыть»/«⋯» поверх страницы — область прокрутки начинается
     под ними, чтобы текст не уезжал под кнопки. Вне полного экрана Telegram
     отдаёт эти отступы нулями. */
  top: calc(var(--tg-safe-area-inset-top, 0px) + var(--tg-content-safe-area-inset-top, 0px));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

/* Место под фиксированный таб-бар — распоркой в конце страницы, а не
   нижним отступом body: отступ прокручиваемого контейнера сдвигал бы
   sticky-итог корзины выше таб-бара. */
body::after {
  content: "";
  display: block;
  height: calc(var(--tabbar-height) + var(--space-xl));
}

img {
  max-width: 100%;
  display: block;
}

/* Атрибут hidden должен побеждать display у компонентов (.cart-summary__row,
   .banner-carousel и т.п.) — иначе скрытые строки продолжают рисоваться. */
[hidden] {
  display: none !important;
}

button {
  font-family: inherit;
  letter-spacing: inherit;
}

a {
  color: var(--color-accent-dark);
}