/* ============================================================
   Стилизация cookie-баннера под дизайн-систему dikovina.design
   Токены и компоненты сняты 1:1 с боевого CSS сайта (Webflow):
     :root{ --green:#4C5456 ; --gold:#B6B0A2 }
     .cookie-wrap — баннер: фон --green, обводка #B6B0A2 12% (#b6b0a21f),
                    текст по центру, max-width 30rem, padding 2rem, снизу.
     .main-btn/.small-btn/.loadmore — кнопки: прозрачные, обводка 1px --gold,
                    пилюля (border-radius 31.875rem), шрифт Tt Ricordi Allegria,
                    часть UPPERCASE, текст --gold. Карточки — БЕЗ скруглений (radius 0).
     Шрифт заголовков/кнопок — Tt Ricordi Allegria (serif), текст — Inter.

   Отступления от боевого CSS (осознанные):
     • цвет ТЕКСТА кнопок и основного абзаца — светлый #E2DDD2 (а не --gold),
       чтобы пройти контраст WCAG AA на тёмном фоне (gold #B6B0A2 даёт лишь 3.6:1).
       Фирменная обводка/форма/шрифт кнопок сохранены.
     • «Принять все» и «Отклонить все» ОДИНАКОВЫ (равный вес — 152-ФЗ,
       держится механизмом библиотеки: equalWeightButtons:true).

   Подключать ПОСЛЕ cookieconsent.css. Библиотечные файлы не трогаем —
   переопределяем переменные --cc-* и отдельные селекторы.
   ============================================================ */

/* Фирменный шрифт сайта — локально (тот же файл, что на dikovina.design). */
@font-face {
  font-family: 'Tt Ricordi Allegria';
  src: url('lib/fonts/TT_Ricordi_Allegria_Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

#cc-main {
  /* --- Типографика --- */
  --cc-font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* --- Базовые цвета (--green / --gold с сайта) --- */
  --cc-bg: #4c5456;                              /* --green */
  --cc-primary-color: #e2ddd2;                   /* заголовки/основной текст — светлый тёплый (AA) */
  --cc-secondary-color: #e2ddd2;                 /* пояснит. текст и описания категорий — светлый (AA):
                                                    5.7:1 на панели, 4.9:1 на блоках (gold давал лишь 3.6:1) */
  --cc-link-color: #b6b0a2;                      /* ссылки — фирменный --gold, подчёркнуты */

  /* --- Кнопки = КОНТУРНЫЕ пилюли (фирменный стиль: прозрачные, обводка 1px --gold,
         на hover заливаются --gold). «Принять»/«Отклонить» одинаковы (равный вес 152-ФЗ). --- */
  --cc-btn-primary-bg: transparent;
  --cc-btn-primary-color: #e2ddd2;
  --cc-btn-primary-border-color: #b6b0a2;
  --cc-btn-primary-hover-bg: #b6b0a2;
  --cc-btn-primary-hover-color: #2e3335;
  --cc-btn-primary-hover-border-color: #b6b0a2;

  --cc-btn-secondary-bg: transparent;            /* идентична primary — равный вес 152-ФЗ */
  --cc-btn-secondary-color: #e2ddd2;
  --cc-btn-secondary-border-color: #b6b0a2;
  --cc-btn-secondary-hover-bg: #b6b0a2;
  --cc-btn-secondary-hover-color: #2e3335;
  --cc-btn-secondary-hover-border-color: #b6b0a2;

  /* --- Радиусы: карточки БЕЗ скруглений (стиль сайта), кнопки — пилюли --- */
  --cc-btn-border-radius: 100px;
  --cc-modal-border-radius: 0px;
  --cc-pm-toggle-border-radius: 100px;           /* switch-тумблер скруглён */

  /* --- Switch-тумблер: ВКЛ = gold трек + тёмный бегунок; ВЫКЛ = серый трек + светлый бегунок --- */
  --cc-toggle-on-bg: #b6b0a2;
  --cc-toggle-off-bg: #717877;
  --cc-toggle-on-knob-bg: #2e3335;
  --cc-toggle-off-knob-bg: #e2ddd2;
  --cc-toggle-readonly-bg: #5c6466;
  --cc-toggle-readonly-knob-bg: #9aa0a0;
  --cc-toggle-readonly-knob-icon-color: #4c5456;

  /* --- Блоки категорий: слегка отличны от панели, БЕЗ обводки (по правке клиента) --- */
  --cc-cookie-category-block-bg: #565e60;
  --cc-cookie-category-block-hover-bg: #5e6668;
  --cc-cookie-category-block-border: transparent;
  --cc-cookie-category-block-hover-border: transparent;
  --cc-cookie-category-expanded-block-bg: #424a4c;

  /* --- Прочее --- */
  --cc-separator-border-color: rgba(182, 176, 162, 0.18);
  --cc-overlay-bg: rgba(30, 34, 35, 0.6);
}

/* === Кнопки-действия: контурная пилюля, шрифт Tt Ricordi Allegria, UPPERCASE === */
#cc-main .cm__btn,
#cc-main .pm__btn {
  font-family: 'Tt Ricordi Allegria', 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  text-transform: uppercase;
  font-weight: 400;
  letter-spacing: 0;
  font-size: 16px;
  line-height: 1.1;
  min-height: 50px;
  border: 1px solid var(--cc-btn-primary-border-color);   /* фирменная обводка 1px --gold */
  border-radius: 100px;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* === «Настройки cookies» — оформлена как inline-ссылка «Политике использования cookie»:
       sentence case, gold, без жирности и без постоянной линии; подчёркивание на hover. === */
#cc-main .cm__btn[data-role="show"] {
  display: block;
  align-self: center;
  width: auto;
  background: transparent;
  border: none;
  border-radius: 0;
  min-height: auto;
  margin-top: 4px;
  padding: 6px;
  font-family: var(--cc-font-family);            /* Inter, как ссылка на Политику */
  text-transform: none;                          /* sentence case — «Настройки cookies» */
  font-size: 14px;
  font-weight: 500;                              /* как .cc__link, без bold */
  letter-spacing: 0;
  line-height: 1.2;
  text-align: center;
  color: #b6b0a2;                                /* gold — как ссылка */
  text-decoration: none;                         /* в покое — без подчёркивания */
  transition: color 0.2s ease;
}
#cc-main .cm__btn[data-role="show"]:hover {
  background: transparent;
  color: #e2ddd2;
  text-decoration: underline;                    /* подчёркивание появляется на hover */
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

/* === Заголовки — фирменный serif Tt Ricordi Allegria, UPPERCASE ===
   Файл шрифта лежит локально (lib/fonts/), fallback — изящный serif. */
#cc-main .cm__title,
#cc-main .pm__title {
  font-family: 'Tt Ricordi Allegria', 'Cormorant Garamond', 'Times New Roman', Georgia, serif;
  font-weight: 400;
  font-size: 23px;
  line-height: 1.12;
  letter-spacing: -0.01em;                        /* у бренда трекинг отрицательный */
  text-transform: uppercase;
  color: #e2ddd2;
}

/* === Баннер согласия: текст по центру, шире и с большим воздухом (как .cookie-wrap) === */
#cc-main .cm {
  max-width: 30rem;
}
#cc-main .cm__body {
  padding: 1.75rem;
}
#cc-main .cm__title,
#cc-main .cm__desc {
  text-align: center;
}

/* Ссылки на Политику cookie (gold, осветление на hover) */
#cc-main .cc__link,
#cc-main a {
  color: #b6b0a2;
  font-weight: 500;
  text-decoration: none;                          /* в покое без подчёркивания */
  text-underline-offset: 2px;
}
#cc-main .cc__link:hover,
#cc-main a:hover {
  color: #e2ddd2;
  text-decoration: underline;                     /* подчёркивание на hover */
}

/* Карточка/панель: фон --green, тонкий бежевый хайрлайн 12% (#b6b0a21f), углы острые.
   Тень НЕ используем — на сайте окна без тени (по правке клиента). */
#cc-main .cm--box,
#cc-main .pm--box {
  border: 1px solid rgba(182, 176, 162, 0.12);
  box-shadow: none;
}

/* Кнопка закрытия панели (×): крестик в тонком gold-круге (вариант для системных UI);
   крестик белый, hover — обводка ярче + лёгкое затемнение крестика. */
#cc-main .pm__close-btn {
  background: transparent;
  border: 1px solid rgba(182, 176, 162, 0.4);    /* тонкий круг (gold) */
}
#cc-main .pm__close-btn svg {
  stroke: #ffffff;                                /* крестик белый */
  transition: opacity 0.15s ease;
}
#cc-main .pm__close-btn:hover {
  background: transparent;                        /* без серой заливки */
  border-color: #b6b0a2;                          /* обводка ярче (gold) */
}
#cc-main .pm__close-btn:hover svg {
  stroke: #ffffff;                                /* остаётся белым */
  opacity: 0.7;                                   /* лёгкая реакция */
}

/* Шеврон раскрытия категории — в цвет текста (без серого кружка) */
#cc-main .pm__section--expandable .pm__section-arrow {
  background: transparent;
}
#cc-main .pm__section--expandable .pm__section-arrow svg {
  stroke: #e2ddd2;
}

/* === Блоки категорий: МЕНЬШЕ скругление и БЕЗ обводки (по правкам клиента).
   Библиотека вешает на блоки радиус кнопок-пилюль (--cc-btn-border-radius=100px) —
   переопределяем на небольшой; обводку desc-wrapper убираем. === */
#cc-main .pm__section,
#cc-main .pm__section--toggle,
#cc-main .pm__section-title,
#cc-main .pm__section--toggle .pm__section-desc-wrapper {
  border-radius: 6px;
}
#cc-main .pm__section--toggle .pm__section-desc-wrapper {
  border: none;
}
/* Раскрытый блок (.is-expanded): библиотека переназначает border-цвет категории
   на светлый — принудительно убираем любую обводку у раскрытого блока и внутр. разделителей. */
#cc-main .pm__section--toggle.is-expanded .pm__section-title,
#cc-main .pm__section--toggle.is-expanded .pm__section-desc-wrapper,
#cc-main .pm__section-desc-wrapper > :not(:last-child) {
  border-color: transparent;
}

/* === Заголовки категорий — БЕЗ жирности, UPPERCASE (как nav-лейблы сайта).
   Повышенная специфичность, чтобы перебить библиотечный font-weight:600. === */
#cc-main .pm__section-title,
#cc-main .pm__section--toggle .pm__section-title {
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
