/*
 * Точечные правки поверх темы regular (аудит дизайна 2026-10-22).
 * Подключается последним в elements/head.php; удалить строку подключения = полный откат.
 */

/* ---------- Цвет: оранжевый, на котором читается текст ----------
   #fd7702 остаётся акцентом (лого, иконки, рамки). Для текста и заливок
   под белым текстом — #c94a06: 4.7:1 на белом, 4.5:1 на #fafafa (WCAG AA). */
:root,
[data-bs-theme="light"] {
  --kr-accent: #fd7702;
  --kr-primary: #c94a06;
  --kr-primary-hover: #a83d04;
  --bs-primary-rgb: 201, 74, 6;
  --bs-link-color: #c94a06;
  --bs-link-color-rgb: 201, 74, 6;
  --bs-link-hover-color: #a83d04;
}

html[data-bs-theme="dark"] {
  --kr-primary: #c94a06;
  --kr-primary-hover: #a83d04;
  /* на тёмном фоне яркий оранжевый сам по себе даёт 5.7:1 */
  --bs-primary-rgb: 253, 138, 42;
  --bs-link-color: #fd8a2a;
  --bs-link-color-rgb: 253, 138, 42;
}

.btn-primary {
  --bs-btn-bg: var(--kr-primary);
  --bs-btn-border-color: var(--kr-primary);
  --bs-btn-hover-bg: var(--kr-primary-hover);
  --bs-btn-hover-border-color: var(--kr-primary-hover);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--kr-primary-hover);
  --bs-btn-active-border-color: var(--kr-primary-hover);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--kr-primary);
  --bs-btn-disabled-border-color: var(--kr-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--kr-primary);
  --bs-btn-border-color: var(--kr-primary);
  --bs-btn-hover-bg: var(--kr-primary);
  --bs-btn-hover-border-color: var(--kr-primary);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--kr-primary-hover);
  --bs-btn-active-border-color: var(--kr-primary-hover);
  --bs-btn-disabled-color: var(--kr-primary);
  --bs-btn-disabled-border-color: var(--kr-primary);
}

html[data-bs-theme="dark"] .btn-outline-primary {
  --bs-btn-color: #fd8a2a;
  --bs-btn-border-color: #fd8a2a;
}

/* Оранжевая секция «Что мы предлагаем»: белый текст на #ff9800 давал 2.3:1 */
section.what-we-offer {
  background-image: linear-gradient(310deg, #9a3a06 0%, #b94606 100%);
}

/* ---------- Типографика ---------- */
h1, h2, h3, .h1, .h2, .h3,
.text-3xl, .text-4xl {
  text-wrap: balance;
}

p, li, .accordion-body {
  text-wrap: pretty;
}

/* ---------- Поверхности браузера ---------- */
::selection {
  background: rgba(253, 119, 2, 0.28);
}

:focus-visible {
  outline: 2px solid var(--kr-accent);
  outline-offset: 2px;
}

.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible {
  outline: 2px solid var(--kr-accent);
  outline-offset: 2px;
  box-shadow: none;
}

/* ---------- Шапка ----------
   На 1200–1399px длинные пункты («Обратная связь», «Отследить заказ»)
   ломались на две строки и кнопка становилась двухэтажной. */
@media (min-width: 1200px) {
  .header-menu .navbar-nav {
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 14px !important;
  }

  .header-menu .navbar-nav > .nav-item > a,
  .header-menu .navbar-nav > .nav-item > .btn {
    white-space: nowrap;
  }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
  .header-menu .navbar-nav {
    column-gap: 6px !important;
  }

  .header-menu .navbar-nav > .nav-item > a {
    padding-left: 0.6rem !important;
    padding-right: 0.6rem !important;
  }
}

/* Шапка абсолютная и на xl занимает две строки — заголовок страницы
   оформления заказа заезжал под меню. */
@media (min-width: 1200px) {
  .order-hero {
    padding-top: 9.5rem !important;
  }
}

/* ---------- Cookie-плашка ----------
   Была «по центру» с translate(-50%, -50%) — висела посреди экрана
   поверх списка услуг и формы заказа. Теперь прижата к низу. */
#cookie-popup.cookie-popup {
  bottom: 16px;
  padding: 16px 20px;
  background-color: rgba(24, 24, 27, 0.94);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
  font-size: 14px;
  line-height: 1.45;
}

#cookie-popup.cookie-popup.center {
  transform: translateX(-50%);
}

#cookie-popup.cookie-popup.left,
#cookie-popup.cookie-popup.right {
  transform: none;
}

#cookie-popup .popup-content p {
  margin-bottom: 0;
}

#cookie-popup .button-container {
  display: flex;
  gap: 8px;
  justify-content: center;
  margin-top: 12px;
}

#cookie-popup .button-container .btn {
  min-height: 44px;
}

@media (max-width: 575.98px) {
  #cookie-popup.cookie-popup,
  #cookie-popup.cookie-popup.center,
  #cookie-popup.cookie-popup.left,
  #cookie-popup.cookie-popup.right {
    left: 12px;
    right: 12px;
    bottom: 12px;
    width: auto;
    min-width: 0;
    max-width: none;
    transform: none;
    padding: 12px 14px;
    font-size: 13px;
    text-align: left;
  }

  #cookie-popup .button-container {
    justify-content: stretch;
  }

  #cookie-popup .button-container .btn {
    flex: 1 1 auto;
    padding-left: 10px;
    padding-right: 10px;
  }
}

/* ---------- Карточки пакетов ---------- */
/* стрелки карусели на мобильном прилипали к краю экрана и обрезались */
@media (max-width: 599.98px) {
  .package-category-carousel .owl-nav button.owl-prev,
  .package-category-carousel .owl-nav button.owl-next {
    min-width: 44px;
    min-height: 44px;
  }
}

/* ---------- Формы заказа и отслеживания ---------- */
.order-form .form-control,
.order-form .form-select,
.track-order-form .form-control {
  min-height: 48px;
}

/* виджет reCAPTCHA фиксированной ширины 304px — не даём ему вылезать */
.order-form .g-recaptcha,
.track-order-form .g-recaptcha {
  max-width: 100%;
  overflow: hidden;
}

@media (max-width: 359.98px) {
  .order-form .g-recaptcha,
  .track-order-form .g-recaptcha {
    transform: scale(0.88);
    transform-origin: 0 0;
  }
}

/* ---------- Движение ----------
   AOS прячет блоки до прокрутки; при «уменьшить движение» показываем сразу. */
@media (prefers-reduced-motion: reduce) {
  [data-aos] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ---------- Остатки контраста ---------- */
.accordion {
  --bs-accordion-active-color: var(--kr-primary);
}

html[data-bs-theme="dark"] .accordion {
  --bs-accordion-active-color: #fd8a2a;
}

.section-header .above-heading {
  color: var(--kr-primary);
}

/* «Экономия N%» у пакета: зелёный #10b981 давал 2.4:1 */
.package-category-carousel .item-price .text-success {
  color: #047857 !important;
}

html[data-bs-theme="dark"] .package-category-carousel .item-price .text-success {
  color: #34d399 !important;
}

/* бейдж над карточкой пакета («Топ продаж!») — фон задаётся в админке */
.package-category-carousel .text-title .bg-danger {
  background-color: #c81e3c !important;
  background-image: none !important;
}

.dropdown-menu {
  --bs-dropdown-link-active-bg: var(--kr-primary);
}

/* ---------- Страница услуги на мобильном: пакеты выше SEO-текста ----------
   Порядок в DOM не меняется (для поисковиков текст остаётся на месте),
   меняется только визуальный: hero → пакеты → описание → остальное. */
@media (max-width: 767.98px) {
  .content-section-layout:has(> .category-description) {
    display: flex;
    flex-direction: column;
  }

  .content-section-layout:has(> .category-description) > * {
    order: 3;
    min-width: 0;
  }

  .content-section-layout:has(> .category-description) > .header-top {
    order: 0;
  }

  .content-section-layout:has(> .category-description) > .package-list {
    order: 1;
  }

  .content-section-layout:has(> .category-description) > .category-description {
    order: 2;
  }
}

/* ---------- Подвал ---------- */
.footer .nav .nav-link {
  padding-left: 0;
  padding-right: 1.25rem;
}

/* ---------- Заголовки после перестройки иерархии (h4/h5 → h3) ----------
   Вид прежний; стили повторяют старые правила landing_page.css для h4/h5.
   Общее «.feature-icons h3» (32px, синий, по центру) сюда не должно протекать. */
section.group-features .feature-icons .content .icon-box h3.feature-title,
section.what-we-offer .icon-box h3.feature-title {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 10px 0;
  color: inherit;
  text-align: inherit;
}

section.how-it-work .single_work_step h3.step-title {
  transition-duration: 500ms;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 0.5rem;
}

section.how-it-work .single_work_step:hover h3.step-title,
section.how-it-work .single_work_step:focus h3.step-title {
  color: var(--kr-primary);
}

html[data-bs-theme="dark"] section.how-it-work .single_work_step:hover h3.step-title,
html[data-bs-theme="dark"] section.how-it-work .single_work_step:focus h3.step-title {
  color: #fd8a2a;
}

/* В тёмной теме --bs-primary-rgb светлый (для текста), а заливки
   под белым текстом должны оставаться тёмно-оранжевыми. */
html[data-bs-theme="dark"] .bg-primary {
  background-color: var(--kr-primary) !important;
}

/* ---------- Тёмная тема: то, что было тёмным на тёмном ---------- */
/* лого одноцветное тёмно-серое — в тёмной теме инвертируем в светлое */
html[data-bs-theme="dark"] .navbar-brand img,
html[data-bs-theme="dark"] .footer a.link-body-emphasis img {
  filter: invert(1) brightness(1.15);
}

/* кружки шагов «Как это работает»: тёмно-синий #0d1399 на тёмном фоне */
html[data-bs-theme="dark"] section.how-it-work .single_work_step .step-icon::after {
  border-color: #8b93ff;
}

html[data-bs-theme="dark"] section.how-it-work .single_work_step .step-icon i {
  color: #8b93ff;
}

/* кнопка «наверх» фиксирована в правом нижнем углу и наезжала на копирайт */
.footer {
  padding-bottom: 5.5rem !important;
}

/* ---------- Блог ---------- */
/* мета статьи (автор | категория | дата): gray давал 3.9:1 */
.post-single .post-meta p {
  color: #636363;
}

html[data-bs-theme="dark"] .post-single .post-meta p {
  color: #a8a8a8;
}

/* кнопки соцсетей в сайдбаре: фирменные цвета затемнены до AA под белым текстом */
.btn-social.twitter-btn   { background-color: #0b6fae !important; }
.btn-social.youtube-btn   { background-color: #cc0000 !important; }
.btn-social.whatsapp-btn  { background-color: #13803d !important; }
.btn-social.instagram-btn { background-color: #c1255a !important; }
.btn-social.pinterest-btn { background-color: #c5141a !important; }

/* ---------- Текстовые страницы (соглашение и т. п.) ---------- */
/* строки по 120+ знаков → комфортная ширина чтения */
section.more-content .container {
  max-width: 760px;
}

/* длинные цепочки вида «удалённый\закрытый\…» без пробелов вылезали за экран */
section.more-content li,
section.more-content p {
  overflow-wrap: anywhere;
}

/* реквизиты в контенте вставлены как 8pt (10.7px) */
section.more-content span[style*="font-size: 8pt"] {
  font-size: 13px !important;
}

/* плашка «Форма заказа» (bg-light text-dark) была белой в тёмной теме */
html[data-bs-theme="dark"] .order-form .card-title.bg-light {
  background-color: var(--bs-tertiary-bg) !important;
  color: var(--bs-emphasis-color) !important;
}

/* стрелки между шагами — чёрные на тёмном фоне */
html[data-bs-theme="dark"] section.how-it-work .single_work_step .arrow,
html[data-bs-theme="dark"] section.how-it-work .single_work_step .arrow i {
  color: #8a8a8a;
}