/* Правки поверх стилей прототипа. Каждая — под конкретный найденный баг. */

/* 1. Удаление декора на мобильном.
   В прототипе правила писались как [style*="position:fixed"] — без пробела.
   Браузер сериализует инлайн-стили С пробелом ("position: fixed"), поэтому
   ни один селектор не совпадал и все 15 fixed-слоёв + 50 SVG продолжали
   рендериться на телефоне. Здесь селекторы под реальную сериализацию. */
@media (max-width: 820px) {
  div[style*="position: fixed"][style*="pointer-events: none"] { display: none !important; }
  svg[style*="position: fixed"] { display: none !important; }
  main svg[style*="pointer-events: none"],
  section svg[style*="pointer-events: none"] { display: none !important; }
  header { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  button, .btn, a[data-book] { min-height: 44px; }
}

/* 2. Двухколоночные блоки, которым забыли проставить класс-хук .r-2col:
   на узких экранах они оставались 1fr + minmax(220px,300px) и держали
   страницу шириной 1152px. */
@media (max-width: 920px) {
  div[style*="minmax(220px, 300px)"],
  div[style*="minmax(220px,300px)"] { grid-template-columns: minmax(0, 1fr) !important; }
}

/* 3. Страховка от горизонтального скролла: декоративные SVG намеренно
   вылезают за края, но прокручивать страницу вбок они не должны. */
html, body { overflow-x: hidden; max-width: 100%; }

/* Панели аккордеонов: в разметке они есть всегда (нужно для SEO и для того,
   чтобы текст не терялся), скрыты до клика. */
.acc-panel[hidden] { display: none; }

/* 4. Липкая CTA-панель. В прототипе её показывал JS по состоянию isMobile,
   в снимке она уже отрендерена — без этого правила висела на весь экран
   и на десктопе. Оставляем только мобильным. */
[data-mobile-cta] { display: none !important; }
@media (max-width: 820px) {
  [data-mobile-cta] { display: flex !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  body { padding-bottom: 76px; } /* чтобы панель не перекрывала подвал */
}

/* Ссылки, сделанные из кнопок, не должны наследовать подчёркивание темы */
a[data-book], a[href^="/"], a[href^="tel:"] { text-decoration: none; }

/* 5. Окно записи на телефоне: три кнопки формата не помещались в ряд —
   надписи налезали друг на друга, слово разрезалось рамкой, а крестик
   закрывал подпись. Ставим кнопки в столбик и отодвигаем от крестика. */
@media (max-width: 460px) {
  [role="dialog"] > div { padding: 46px 20px 30px !important; }
  [role="dialog"] [data-format] {
    flex: 1 1 100% !important;
    min-height: 52px;
    font-size: 16px !important;
    padding: 13px 10px !important;
  }
  [role="dialog"] [data-format]:first-of-type { margin-top: 4px; }
  /* контейнер кнопок формата — в колонку */
  [role="dialog"] div:has(> [data-format]) { flex-direction: column !important; }
}

/* 6. Мелкие ссылки: телефон и мессенджеры в подвале были высотой 19px —
   пальцем не попасть. Даём им нормальную высоту, не трогая вид. */
footer a,
footer button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
/* пункты внутри строк подвала не должны разъезжать вёрстку */
footer a { line-height: 1.4; }

/* 7. Окно увеличения на телефоне. Отступы прототипа (28px снаружи + 16px
   внутри) съедали 88px из 375 — длинная переписка ужималась почти вдвое
   и не читалась. На узких экранах отдаём картинке всю ширину. */
@media (max-width: 640px) {
  [data-lb-overlay] { padding: 8px !important; }
  [data-lb-box] { padding: 10px !important; max-width: 100% !important; }
  [data-lb-box] > div:first-child { margin-bottom: 8px !important; }
  [data-lb-box] > div:last-child { max-height: calc(100vh - 90px) !important; }
}

/* 8. Остатки коричневой темы прототипа.
   Сайт перекрашен из коричневого в синий + слоновая кость правилами в конце
   base.css: они ловят инлайновые стили по ИСХОДНОМУ коричневому цвету
   ([style*="#332A20"] и т.п.). Несколько мест мимо этих правил прошли —
   и коричневый вылезал поверх синего.

   Палитра сайта, к которой всё приводится:
     #162A44 — фон страницы (полуночный синий)
     #16324F — поверхность карточек (прусский синий)
     #102439 — самый тёмный, подвал
     #E8DFC8 — слоновая кость (кнопки), текст на ней #162A44
     #FBF6EA — светлый текст
*/

/* 8а. Фон страницы. В base.css у html и body осталось rgb(41,34,25) —
   исходный коричневый прототипа. Он виден везде, где секция не закрывает
   его целиком, и особенно под затемнением, когда открыт попап. */
html, body { background: #162A44 !important; }

/* 8б. Секция «Не обязательно ждать...» на главной залита градиентом из двух
   коричневых. Правило в base.css ловит только градиенты со словом «180deg»,
   а здесь его нет — секция так и осталась коричневой. */
section[style*="linear-gradient(rgb(52, 43, 33), rgb(41, 34, 25))"] {
  background: linear-gradient(#15304B, #162A44) !important;
}

/* 8в. Липкая полоса записи на телефоне. */
[data-mobile-cta][style*="rgba(41, 34, 25"] { background: rgba(22, 42, 68, 0.94) !important; }

/* 8г. Кнопки слоновой кости. base.css перекрасил заливку, текст и рамку, но
   не тень: внутри снизу оставалась коричневая подсветка rgba(122,80,28,.35),
   из-за неё низ кнопки отдавал в рыжий. */
.gold-btn {
  box-shadow: rgba(255, 255, 255, 0.75) 0 1px 0 inset,
              rgba(120, 132, 156, 0.22) 0 -10px 18px inset,
              rgba(0, 0, 0, 0.35) 0 10px 26px !important;
}

/* 8д. Выделение текста мышью и рамка фокуса были золотисто-коричневыми. */
::selection { background: #E8DFC8; color: #162A44; }
input:focus, select:focus, button:focus-visible { outline-color: var(--ac, #FBF6EA); }

/* 9. Подчёркивание активного пункта меню.
   У ссылки на текущую страницу цвет рамки задан отдельно от цвета текста:
   border-color: ... rgb(201,165,103). Перекраска в base.css меняет только
   color, поэтому текст стал светлым, а полоска под ним осталась золотой.
   Привязываем полоску к цвету самого текста — тогда она следует за темой. */
header a[style*="rgb(201, 165, 103)"],
header button[style*="rgb(201, 165, 103)"] { border-bottom-color: currentColor !important; }