/* Arctic Store — токены оформления v0.2 (+ мягкая кнопка).
   ЕДИНСТВЕННОЕ место, где задаются цвета, шрифты, размеры и ширины.
   Всё остальное (arctic-base, arctic-pages, потом PDP/корзина/главная) только читает эти значения.
   Мобильный брейкпоинт магазина: 780px (в @media переменные не работают, значение держим общим). */
:root {
  /* шрифты */
  --arctic-font-heading: Georgia, 'Times New Roman', serif;
  --arctic-font-body: Arial, Helvetica, sans-serif;   /* текст служебных CMS-страниц */
  --arctic-font-text: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;   /* основной шрифт витрины (как был по умолчанию в теме Magento) */

  /* цвета текста */
  --arctic-ink: #26221e;
  --arctic-text: #3c3732;
  --arctic-muted: #6f675e;

  /* ссылки по умолчанию (глобальное правило a{} в теме читает этот токен) */
  --arctic-link: #000;

  /* золото и коричневый (акценты, ссылки) */
  --arctic-gold: #8b6824;          /* золото для текста: контраст на белом ≥ 5:1 */
  --arctic-gold-bright: #b8860b;   /* яркое золото: линии, иконки, активный пункт меню */
  --arctic-gold-light: #d4af37;    /* светлое золото: стрелки и акценты на тёмном фоне (витрины) */
  --arctic-ivory: #f7f2e8;         /* слоновая кость: текст на тёмном фоне (витрины) */
  --arctic-black: #050505;         /* глубокий чёрный: фон подписей витрин */
  --arctic-brown: #664b28;
  --arctic-brown-dark: #49351c;
  --arctic-brown-border: #a88a58;
  --arctic-focus: #98764b;

  /* поверхности и линии */
  --arctic-surface: #ffffff;
  --arctic-paper: #fbf8f2;
  --arctic-paper-hover: #f1e9db;
  --arctic-line: #e4d9c7;
  --arctic-line-soft: #efe8dc;
  --arctic-accent-line: #c7af85;

  /* размеры */
  --arctic-font-size-body: 17px;
  --arctic-font-size-body-mobile: 16px;
  --arctic-h1-size: clamp(32px, 4.4vw, 46px);
  --arctic-h2-size: clamp(24px, 2.6vw, 30px);
  --arctic-h1-wrap: balance;     /* перенос строк в H1: ровно, без висящего слова */
  --arctic-h3-size: 21px;
  --arctic-radius: 3px;
  --arctic-measure: 780px;         /* ширина читаемого текста */
  --arctic-measure-wide: 1040px;   /* ширина широких страниц (баннер, галерея) */
  --arctic-page-max: 1280px;       /* .page-main и шапка: внешняя ширина (как у Magento) */
  --arctic-page-pad: 20px;         /* боковое поле .page-main и шапки */
  --arctic-font-size-small: 13px;  /* мелкие служебные подписи (Advanced Search и т.п.) */
  --arctic-cart-badge-bg: #26221e;    /* счётчик товаров у значка корзины: фон (раньше оранжевый из базовой темы Magento) */
  --arctic-cart-badge-text: #ffffff;  /* счётчик у корзины: цифра */
  --arctic-desc-h2-size: var(--arctic-h2-size);  /* подзаголовки H2 в описании категории (раньше 26px / 600 из custom.css) */
  /* шкала интерфейса: подписи полей = --arctic-font-size-small (13), текст чекбоксов и подсказок = field (14), меню/ссылки/кнопки = ui (15), поля ввода = input (16, меньше нельзя: iOS увеличивает страницу) */
  --arctic-font-size-field: 14px;
  --arctic-font-size-ui: 15px;
  --arctic-font-size-input: 16px;
  --arctic-font-size-text: 16px; /* обычный текст страниц кабинета, входа, регистрации (абзацы, пояснения) */
  /* плашка под ценой на карточке товара (.arctic-value-note): зелёная рамка и текст, светлый фон. Раньше цвета были вписаны в шаблон final_price.phtml */
  --arctic-green: #275d3a;
  --arctic-note-bg: var(--arctic-paper);
  --arctic-note-border: var(--arctic-green);
  --arctic-note-text: var(--arctic-green);
  /* основная кнопка (корзина, мини-корзина, checkout, кабинет, вход, регистрация): классика, белая с чёрной рамкой; при наведении наоборот. Значения только здесь */
  --arctic-btn-bg: var(--arctic-surface);
  --arctic-btn-text: var(--arctic-ink);
  --arctic-btn-border-color: var(--arctic-ink);
  --arctic-btn-border: 1px solid var(--arctic-btn-border-color);
  --arctic-btn-bg-hover: var(--arctic-ink);
  --arctic-btn-text-hover: var(--arctic-surface);
  --arctic-btn-weight: 600;
  --arctic-btn-spacing: .015em;
  --arctic-btn-radius: 0;
  --arctic-btn-pad: 11px 26px;
  --arctic-btn-size: var(--arctic-font-size-ui);      /* размер текста всех кнопок */
  --arctic-btn-size-sm: var(--arctic-font-size-field); /* малые кнопки (Update, Continue Shopping, Change options, Read More) */
  --arctic-btn-pad-sm: 9px 16px;
  /* мягкая кнопка (служебные страницы, Contact): тёплое наведение вместо чернения, плавный переход */
  --arctic-btn-hover-soft-bg: var(--arctic-paper-hover);
  --arctic-btn-motion: .28s cubic-bezier(.4, 0, .2, 1);
  --arctic-btn-weight-soft: var(--arctic-weight-medium);
  /* главная кнопка страницы (Add to Cart, Checkout, Place Order, Sign In, Send): чёрная заливка; при наведении наоборот.
     Остальные кнопки (токены --arctic-btn-* выше): белые с чёрной рамкой */
  --arctic-btn-primary-bg: var(--arctic-ink);
  --arctic-btn-primary-text: var(--arctic-surface);
  --arctic-btn-primary-border: 1px solid var(--arctic-btn-primary-bg);
  --arctic-btn-primary-bg-hover: var(--arctic-surface);
  --arctic-btn-primary-text-hover: var(--arctic-ink);
  --arctic-container: 1240px;      /* рабочая ширина сайта = .page-main (1280px минус поля 2x20px); шапка, контент, футер */

  /* ===== v20: палитра и шкалы для перевода файлов темы на токены (этап 4). Пока их никто не читает, внешний вид не меняется ===== */
  /* тёплые нейтральные: от почти чёрного текста до светлых фонов (главная и витрины уже на этих значениях) */
  --arctic-neutral-900: #292725;
  --arctic-neutral-800: #363129;
  --arctic-neutral-700: #444444;
  --arctic-neutral-600: #56514a;
  --arctic-neutral-500: #716f6a;
  --arctic-neutral-400: #8c8982;
  --arctic-neutral-300: #c9c7c3;
  --arctic-neutral-200: #e4dfd7;   /* линии и рамки на главной */
  --arctic-neutral-100: #f8f6f2;   /* светлый фон секций на главной */
  --arctic-neutral-50: #faf9f7;
  /* золото и коричневый: оттенки, которые реально есть в файлах темы */
  --arctic-gold-copper: #b68b32;   /* рамки и акценты (карточки, корзина) */
  --arctic-gold-sand: #b7a07c;     /* песочное золото: разделители и тонкие рамки на главной */
  --arctic-gold-deep: #73551d;     /* тёмное золото для текста на светлом */
  --arctic-gold-dark: #9b7424;
  --arctic-brown-soft: #765d37;
  --arctic-brown-text: #624f33;
  --arctic-brown-mid: #876d47;
  --arctic-sand-line: #d1bea0;
  --arctic-green-soft: #e8f0e9;    /* светло-зелёный фон подтверждений */
  --arctic-green-mid: #416347;
  /* шкала размеров шрифта (дополняет small 13 / field 14 / ui 15 / input 16 / text 16 / body 17) */
  --arctic-font-size-2xs: 11px;
  --arctic-font-size-xs: 12px;
  --arctic-font-size-lg: 18px;
  --arctic-font-size-xl: 22px;
  --arctic-font-size-2xl: 26px;
  /* радиусы и веса */
  --arctic-radius-sm: 2px;
  --arctic-radius-md: 4px;
  --arctic-weight-regular: 400;
  --arctic-weight-medium: 500;
  --arctic-weight-semibold: 600;
  --arctic-weight-bold: 700;

  /* ===== v22: цены (карточки каталога и страница товара). Пропорция старой цены к текущей: карточка 12/15 = 0,8, страница товара 18/30 = 0,6 ===== */
  --arctic-price-color: var(--arctic-ink);
  --arctic-price-old-color: var(--arctic-neutral-500);   /* и текст, и линия перечёркивания */
  --arctic-price-weight: var(--arctic-weight-medium);
  --arctic-price-old-weight: var(--arctic-weight-regular);
  --arctic-price-line: 1px;
  --arctic-price-gap: 8px;                                /* зазор между текущей и старой ценой в карточке */
  --arctic-price-size-card: var(--arctic-font-size-ui);          /* 15 */
  --arctic-price-old-size-card: var(--arctic-font-size-xs);      /* 12 */
  --arctic-price-size-card-mobile: var(--arctic-font-size-field);      /* 14 */
  --arctic-price-old-size-card-mobile: var(--arctic-font-size-2xs);    /* 11 */
  --arctic-price-size-pdp: 30px;
  --arctic-price-old-size-pdp: var(--arctic-font-size-lg);       /* 18 */
  --arctic-price-size-pdp-mobile: 25px;
  --arctic-price-old-size-pdp-mobile: var(--arctic-font-size-input);   /* 16 */
  /* ===== v23: цены в строках (корзина, мини-корзина, оформление заказа, «You May Also Like») и итоги. Цвет всегда --arctic-price-color: золото зарезервировано для акцентов и настоящей экономии ===== */
  --arctic-price-size-row: var(--arctic-font-size-field);        /* 14 */
  --arctic-price-weight-row: var(--arctic-weight-semibold);
  --arctic-price-size-total: var(--arctic-font-size-text);       /* 16 */
  --arctic-price-weight-total: var(--arctic-weight-semibold);

  /* ===== v06: рамка фото покупателей и блок отзывов Yotpo на карточке товара ===== */
  --arctic-photo-frame-bg: transparent;     /* фон рамки фото покупателей (раньше --arctic-paper, бежевый) */
  --arctic-section-gap: 56px;               /* отступ сверху у блоков под описанием: отзывы Yotpo */
  --arctic-section-pad: 28px;               /* отступ от линии блока до заголовка */
  --arctic-reviews-head-gap: 16px;          /* заголовок «Customer Reviews» -> сводка */
  --arctic-reviews-gap: 16px;               /* зазоры внутри сводки и под ней */
  --arctic-reviews-score-size: 52px;        /* крупная оценка */
  --arctic-reviews-side: 220px;             /* ширина левой колонки со сводкой (на десктопе) */
  --arctic-reviews-col-gap: 40px;           /* зазор между сводкой и списком отзывов */
  --arctic-reviews-item-gap: 20px;          /* отступы внутри отзыва до линии-разделителя */
  --arctic-reviews-item-line: 1px solid var(--arctic-line-soft);
  --arctic-reviews-measure: 62ch;           /* ширина текста отзыва */
  --arctic-reviews-badge-gap: 10px;         /* зазор между именем и значком Verified Buyer */
  --arctic-reviews-item-gap-m: 14px;        /* отступ между отзывами на телефоне */
  --arctic-reviews-stack-gap: 6px;          /* зазор между звёздами, заголовком и текстом отзыва на телефоне */
  --arctic-reviews-summary-gap-m: 12px;     /* зазор в сводке (оценка, кнопка) на телефоне */
  --arctic-reviews-width: 100%;             /* ширина блока отзывов внутри секции (Yotpo по умолчанию 90%) */
  --arctic-reviews-score-display: none;     /* большая цифра оценки в сводке отзывов: none скрывает, block показывает */
}

/* ===== v11: ритм секций PDP (описание, фото покупателей, отзывы) ===== */
:root { --arctic-block-gap: 24px; }  /* внутренний отступ блока «Product details» на телефоне */
@media (max-width: 780px) {
  :root {
    --arctic-section-gap: 40px;
    --arctic-section-pad: 24px;
    --arctic-block-gap: 20px;
  }
}