/*
 * Klever v12 — фактическая сетка карточек номеров и читаемость тёмных CTA.
 * Подключается последним из footer, после inline-стилей страниц.
 */

/* ──────────────────────────────────────────────────────────────────────────
   НОМЕРА
   В v8 общий селектор .tab_index [class*="col-"] задал width:100% всем
   колонкам, включая room-grid-item. Поэтому Bootstrap-колонки перестали
   работать и карточки на ПК стали чрезмерно широкими.
   Здесь сетка задаётся независимо от Bootstrap.
   ────────────────────────────────────────────────────────────────────────── */
html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 28px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  clear: both !important;
  box-sizing: border-box !important;
}

html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact::before,
html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact::after {
  display: none !important;
  content: none !important;
}

html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact > .room-grid-item,
html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact > [class*="col-"] {
  float: none !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact .room-card {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  margin: 0 !important;
}

@media (max-width: 991.98px) {
  html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 20px !important;
  }
}

/* На iPhone — одна карточка в строке, но на всю ширину содержимого. */
@media (max-width: 767.98px) {
  html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact > .room-grid-item,
  html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  html body.klever-site-page:not(.klever-home-page) .tab_index .rooms-modern-grid.rooms-modern-grid--compact .room-card-image {
    aspect-ratio: 16 / 10 !important;
  }
}

/* ──────────────────────────────────────────────────────────────────────────
   ТЁМНЫЕ CTA-БЛОКИ
   На страницах гостиниц и других разделах старые inline-правила возвращали
   тёмный цвет текста поверх тёмного фона. Делаем текст белым независимо от
   вложенной разметки.
   ────────────────────────────────────────────────────────────────────────── */
html body [class*="klever-"][class*="-cta"] {
  color: #fff !important;
}

html body [class*="klever-"][class*="-cta"] :is(h1, h2, h3, h4, h5, h6, p, div, span, strong, em, b, small, li, label) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .78) !important;
}

html body [class*="klever-"][class*="-cta"] a:not([class*="button"]):not(.btn) {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}

/* Основная золотая CTA-кнопка остаётся с тёмной надписью; контурная — белой. */
html body .klever-volokolamka-cta .klever-volokolamka-button:not(.klever-volokolamka-button--light),
html body .klever-krasnogorsk-cta .klever-krasnogorsk-button:not(.klever-krasnogorsk-button--light),
html body .klever-mitino-cta .klever-mitino-button:not(.klever-mitino-button--light) {
  color: #201b12 !important;
  -webkit-text-fill-color: #201b12 !important;
  text-shadow: none !important;
}

html body .klever-volokolamka-cta .klever-volokolamka-button--light,
html body .klever-krasnogorsk-cta .klever-krasnogorsk-button--light,
html body .klever-mitino-cta .klever-mitino-button--light {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  text-shadow: none !important;
}