/* Вид витрины: «блоки 4 + контраст 2», выбор Павла 19.09.2026.
 *
 * Зачем отдельный файл. Цвета и тени дизайн-макет пишет прямо в стиль
 * каждого элемента (сотни мест в generated/, их переписывает конвейер при
 * каждом экспорте). Поэтому вид меняется здесь, слоем поверх: правила ловят
 * приём макета по тексту инлайн-стиля ([style*=...]) и перекрывают его с
 * !important. Шаблоны и custom.css не трогаются. Убрать слой - убрать одну
 * строку подключения в base.html, сайт вернётся к макету как был.
 *
 * Что было не так (скриншот Павла 18.09, корзина): почти белые карточки
 * #FFF8FB на розовом #FFEBF2 отделялись только размытой тенью, а поля были
 * вдавлены тем же розовым - поле промокода не читалось как поле. Плюс
 * контраст: белое на кнопке #EE7598 давало 2,75, серые подписи 3,94.
 *
 * Образец утверждён: Рабочие временые файлы/Марусяпуся-варианты-блоков.html,
 * вариант 4; цвета текста - Марусяпуся-варианты-контраста.html, вариант 2.
 */

/* ── 1. Карточки: чисто белые, мягкая тень вместо «выпуклой» пары ─────────
 * Выпуклую тень макета опознаём по светлой встречной половине
 * rgba(255,255,255,.9): она есть у всех карточек и нет у вдавленных полей. */
[style*="background:#FFF8FB"] {
  background: #FFFFFF !important;
}
[style*="rgba(255,255,255,.9)"]:not([style*="inset"]) {
  box-shadow: 0 8px 24px rgba(160, 70, 105, .12) !important;
}
/* Маленькие кнопки-кружки (−, +, закрыть): одна короткая тень. */
[style*="box-shadow:3px 3px 8px rgba(206,140,166"] {
  box-shadow: 0 2px 6px rgba(160, 70, 105, .16) !important;
}

/* ── 2. Поля и всё «вдавленное»: розовая подложка без тени ───────────────
 * Рамки нет, пока поле не в фокусе; в фокусе - рамка акцента. Рамка
 * рисуется внутренней тенью, а не border: border добавил бы полтора пикселя
 * к размеру и сдвинул бы вёрстку макета. */
[style*="box-shadow:inset"] {
  background: #FBE3EB !important;
  box-shadow: inset 0 0 0 1.5px transparent !important;
}
[style*="box-shadow:inset"]:focus,
[style*="box-shadow:inset"]:focus-within {
  box-shadow: inset 0 0 0 1.5px #C9436E !important;
}
/* Рамка ошибки у поля оформления (checkout.html: «0 0 0 2px #C9436E»)
 * должна остаться видна - иначе покупатель не поймёт, какое поле исправить. */
[style*="0 0 0 2px #C9436E"] {
  box-shadow: inset 0 0 0 2px #C9436E !important;
}

/* Стиль, выставленный скриптом витрины (element.style), браузер хранит в
 * развёрнутом виде: «background: rgb(255, 248, 251); box-shadow: rgba(...)
 * 5px 5px 12px inset». Сжатые шаблоны выше его не ловят - ловим отдельно. */
[style*="background: rgb(255, 248, 251)"] {
  background: #FFFFFF !important;
}
[style*="rgba(206, 140, 166"][style*="inset"] {
  background: #FBE3EB !important;
  box-shadow: inset 0 0 0 1.5px transparent !important;
}
[style*="rgba(206, 140, 166"][style*="inset"]:focus-within {
  box-shadow: inset 0 0 0 1.5px #C9436E !important;
}

/* Поиск в шапке лежит прямо на розовом фоне страницы, а не на белой
 * карточке: розовая подложка на розовом пропала бы. Он белый с рамкой. */
div[style]:has(> input[placeholder*="Карта желаний"]) {
  background: #FFFFFF !important;
  box-shadow: inset 0 0 0 1.5px #EDB9CB, 0 4px 14px rgba(160, 70, 105, .08) !important;
}
div[style]:has(> input[placeholder*="Карта желаний"]):focus-within {
  box-shadow: inset 0 0 0 1.5px #C9436E, 0 4px 14px rgba(160, 70, 105, .08) !important;
}

/* ── 3. Контраст текста (WCAG, норма 4,5 для обычного текста) ────────────
 * Серые подписи #8A7079 -> #6E5761 (было 3,94 на фоне, стало 5,76).
 * Акцент #C9436E как ЦВЕТ ТЕКСТА -> #B63A63 (было 4,45, стало 5,32).
 * Розовый #EE7598 как цвет мелкого текста -> тот же тёмный акцент (было 2,63).
 * Ловим только свойство color, а не background- и border-color: инлайн-стиль
 * макета сжат, свойство начинается с «;» или стоит первым. Буквицы остаются
 * розовыми: они крупные, и Павел просил их не трогать. */
[style*=";color:#8A7079"], [style^="color:#8A7079"] {
  color: #6E5761 !important;
}
[style*=";color:#C9436E"], [style^="color:#C9436E"] {
  color: #B63A63 !important;
}
[style*=";color:#EE7598"]:not([style*="Marusya Initial"]),
[style^="color:#EE7598"]:not([style*="Marusya Initial"]) {
  color: #B63A63 !important;
}

/* ── 4. Кнопки: светло-розовый #EE7598 -> второй розовый палитры #C9436E ──
 * Белые буквы на #EE7598 давали 2,75, на #C9436E - 4,65. Новых цветов нет,
 * #C9436E уже стоит на сайте в акцентах. */
[style*="background:#EE7598"] {
  background: #C9436E !important;
}

/* ── 5. Кабинет покупателя: у него свои переменные, а не инлайн ───────── */
:root {
  --acc-surface: #FFFFFF;
  --acc-accent: #C9436E;
  --acc-muted: #6E5761;
  --acc-shadow: 0 8px 24px rgba(160, 70, 105, .12);
  --acc-shadow-sm: 0 8px 24px rgba(160, 70, 105, .12);
  --acc-shadow-up: 0 12px 30px rgba(160, 70, 105, .18);
  --acc-inset: inset 0 0 0 1.5px transparent;
  --acc-inset-sm: inset 0 0 0 1.5px transparent;

}

/* Отзывы: их токены повторяют СТАРУЮ палитру кабинета (#FFF8FB и выпуклые
 * тени), и карточка «Мои отзывы» сливалась с розовым фоном - границ не
 * видно (Павел 21.09.2026). Меняем здесь, а не в reviews.css: тот уезжает
 * в библиотеку модуля и вид конкретного сайта задавать не должен.
 *
 * ⚠ Селектор ДВОЙНОЙ намеренно. `reviews.css` подключается страницей
 * отзывов в `head_extra`, то есть ПОСЛЕ этого слоя, и при равном весе
 * побеждал бы он. `:root:root` весит больше и от порядка не зависит. */
:root:root {
  --rv-surface: #FFFFFF;
  --rv-shadow: 0 8px 24px rgba(160, 70, 105, .12);
  --rv-shadow-sm: 0 8px 24px rgba(160, 70, 105, .12);
  --rv-shadow-up: 0 12px 30px rgba(160, 70, 105, .18);
  --rv-muted: #6E5761;
}

/* ── 6. Полосы прокрутки: тонкие, в розовом сайта (Павел 19.09.2026) ─────
 * Серая системная полоса выбивалась из вида: страница, лента фото пункта
 * выдачи, список пунктов. Firefox и новый Chrome берут scrollbar-*, старый
 * Chrome и Safari - ::-webkit-scrollbar. */
/* Цвет и толщина - как у ленты миниатюр товара (custom.css), эталон на
   нашем же сайте. */
* {
  scrollbar-width: thin;
  scrollbar-color: rgba(201, 67, 110, .35) transparent;
}
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(201, 67, 110, .35); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: rgba(201, 67, 110, .6); }


/* ── 7. «Купить сейчас» на карточке товара (Павел 19.09.2026) ─────────────
 * Вторичная к «В корзину»: белая, обводка и текст акцентом. Гарнитура,
 * кегль и разрядка как у главной кнопки полосы (custom.css, .buybar__btn),
 * разрядка в пикселях. Кнопку создаёт storefront.js под рядом покупки. */
.buy-now {
  display: block;
  width: 100%;
  box-sizing: border-box;
  min-height: 50px;
  margin: 12px 0 0;
  padding: 14px 20px;
  border: 1.5px solid #C9436E;
  border-radius: 999px;
  background: #FFFFFF;
  color: #B63A63;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .9px;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .16s, color .16s;
}
/* На ПК главная «В корзину» набрана моноширинным 12 обычного веса (замер на
 * боевом 19.09: PT Mono 12px, 400, разрядка 0.6px, высота 53). Вторичная не
 * должна быть крупнее и жирнее главной над ней. */
.dc-desktop .buy-now {
  min-height: 53px;
  font-family: 'PT Mono', monospace;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .6px;
}
.buy-now:hover:not(:disabled) {
  background: #C9436E;
  color: #FFFFFF;
}
.buy-now:focus-visible {
  outline: 2px solid #C9436E;
  outline-offset: 3px;
}
.buy-now:disabled {
  opacity: .45;
  cursor: default;
}

/* ── 8. Окно «Ozon не может доставить» на оформлении (Павел 19.09.2026) ───
 * Образец - окно правил отзывов (reviews.css, .rv__modal): тот же родной
 * <dialog>, подложка, скругление, крестик-кружок. Окно создаёт storefront.js.
 * Шрифт задан явно: окно рисуется в body, мимо артборда со своим шрифтом. */
.co-modal {
  width: min(460px, calc(100vw - 32px));
  box-sizing: border-box;
  padding: 22px 26px 26px;
  border: 0;
  border-radius: 28px;
  background: #FFFFFF;
  color: #2E1D25;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 16px;
  box-shadow: 0 30px 60px rgba(120, 60, 85, .35);
}
.co-modal::backdrop { background: rgba(60, 25, 40, .45); }
.co-modal__head {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.co-modal__title {
  flex: 1 1 auto;
  margin: 6px 0 0;
  font-family: 'Montserrat', -apple-system, 'Segoe UI', sans-serif;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.25;
}
.co-modal__x {
  flex: none;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 50%;
  background: #FFEBF2;
  color: #2E1D25;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.co-modal__x:hover { background: #C9436E; color: #FFFFFF; }
.co-modal__x:focus-visible,
.co-modal__btn:focus-visible { outline: 2px solid #C9436E; outline-offset: 3px; }
.co-modal__text {
  margin: 14px 0 22px;
  line-height: 1.5;
  color: #6E5761;
}
.co-modal__btn {
  display: block;
  width: 100%;
  min-height: 50px;
  border: 0;
  border-radius: 999px;
  background: #C9436E;
  color: #FFFFFF;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .9px;
  text-transform: uppercase;
  cursor: pointer;
}

/* Строка расчёта доставки при отказе Ozon - акцентом, как ошибки полей. */
[data-role="ozon-quote"][data-bad] { color: #B03A60 !important; font-weight: 700 !important; }