/* ============================================================
   m-lotos — патч визуальных дефектов
   Файл: /premium/ml-fix.css
   Версия: 20260918-1
   Подключать ПОСЛЕДНИМ, после ml-glass.css

   Состав:
   1. Мобильная панель покупки и плавающие кнопки
   2. Порядок блоков в мобильной карточке товара
   3. Хлебные крошки на мобильном
   4. Кнопка «В корзину» в каталоге
   5. Таблица контактов
   6. Поля формы заказа
   7. Контраст вспомогательного текста
   8. Дробные размеры шрифта
   9. Страница корзины: убрать боковую колонку
   10. Выравнивание заголовков служебных страниц
   ============================================================ */

/* ---------- 1. Мобильная панель покупки ----------
   Было: виджет чата (60×60, bottom 16px) перекрывал правую часть
   кнопки в .ml-buybar, кнопка «наверх» (bottom 90px) стояла над ним.
   Стало: чат и стрелка поднимаются над панелью. */
@media (max-width: 767px) {
  /* Специфичность повышена намеренно: в ml-glass.css есть правило
     html body #ml-chat-btn#ml-chat-btn{bottom:16px!important},
     которое перебивает такое же правило из ml-premium.css. */
  html body.ml-has-buybar #ml-chat-btn#ml-chat-btn { bottom: 88px !important; }
  html body.ml-has-buybar #toTop#toTop             { bottom: 162px !important; }

  .ml-buybar { padding-left: 16px !important; padding-right: 16px !important; gap: 12px; }
  .ml-buybar .btn { flex: 0 1 auto; min-width: 0; padding-left: 20px !important; padding-right: 20px !important; }
  .ml-buybar__price { flex: 0 0 auto; }
}

/* ---------- 2. Порядок блоков в мобильной карточке ----------
   Было: цена → форма с кнопкой → «В наличии» → описание.
   Стало: цена → наличие → описание → форма с кнопкой.
   Галерея (order:2) не трогается. */
@media (max-width: 767px) {
  .product_wrap .product_name          { order: 1 !important; }
  .product_wrap .product_price         { order: 3 !important; }
  .product_wrap .ml-stock              { order: 4 !important; }
  .product_wrap .product_desc          { order: 5 !important; margin-bottom: 18px; }
  .product_wrap form.form-horizontal   { order: 6 !important; }
  .product_wrap .ml-trust-block        { order: 7 !important; }
}

/* ---------- 3. Хлебные крошки на мобильном ----------
   Было: 4 строки, 112px высоты + 35px отступ до названия.
   Стало: одна строка с горизонтальной прокруткой.
   Микроразметка BreadcrumbList не затрагивается — ничего не скрываем. */
@media (max-width: 767px) {
  .breadcrumb {
    margin: 12px 0 18px !important;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .breadcrumb::-webkit-scrollbar { display: none; }
  .breadcrumb > li { display: inline !important; float: none !important; }
}

/* ---------- 4. Кнопка «В корзину» в каталоге ----------
   Было: белая с синим контуром — читается как второстепенное действие.
   Стало: заливная синяя, как основное действие.
   На эту кнопку действуют 12 правил из 4 файлов; побеждало
   #wrapper2 .product .btn-cart{background:#fff!important} —
   отсюда длинные селекторы ниже. */
html body #wrapper2 .product .btn.btn-cart,
html body .product button.btn.btn-cart,
html body button.btn.btn-cart,
html body .index-scope .product .product_links .btn-cart {
  background: #1A6EA8 !important;
  border: 1px solid #1A6EA8 !important;
  color: #fff !important;
}
html body #wrapper2 .product .btn.btn-cart:hover,
html body .product button.btn.btn-cart:hover,
html body button.btn.btn-cart:hover,
html body .index-scope .product .product_links .btn-cart:hover {
  background: #155D8F !important;
  border-color: #155D8F !important;
  color: #fff !important;
}

/* ---------- 5. Таблица контактов ----------
   Было: padding 1px — «Телефон, Telegram, Макс8 929 051 88 22». */
.contact_info { margin-top: 18px !important; }
.contact_info td { padding: 10px 0 !important; vertical-align: top; }
.contact_info td:empty { display: none !important; padding: 0 !important; }
.contact_info td.contact_title {
  padding-right: 28px !important;
  color: #5A6B7B;
  white-space: nowrap;
}
@media (max-width: 600px) {
  .contact_info,
  .contact_info tbody,
  .contact_info tr,
  .contact_info td { display: block !important; width: auto !important; }
  .contact_info td.contact_title {
    padding: 0 0 2px !important;
    font-size: 13px;
    white-space: normal;
  }
  .contact_info td.contact_value { padding: 0 0 16px !important; }
}

/* ---------- 6. Поля формы заказа ----------
   Было: селект страны — радиус 8px и рамка #E6E6E6, остальные поля 999px/#E1E9F0. */
.form-control {
  border-radius: 999px !important;
  border: 1px solid #E1E9F0 !important;
  font-size: 16px !important;
}
input.form-control,
select.form-control { height: 44px !important; }
textarea.form-control {
  border-radius: 14px !important;
  height: auto !important;
  padding: 12px 18px !important;
}
.form-control:focus {
  border-color: #1A6EA8 !important;
  box-shadow: 0 0 0 3px rgba(26, 110, 168, .15) !important;
  outline: none !important;
}

/* ---------- 7. Контраст вспомогательного текста ----------
   Было: #6B7B8B на светлом фоне — 4.04 при норме 4.5.
   Стало: 5.11 на #F4F7FA, 4.62 на фоне страницы. */
:root {
  --ml-muted: #5A6B7B;
  --mlr-muted: #5A6B7B;
  --mlg-muted: #54647A;
}

/* ---------- 8. Дробные размеры шрифта ----------
   Приводим к целым значениям шкалы. */
.ml-chip, .ml-msg       { font-size: 14px !important; }
.ml-review__text        { font-size: 14px !important; }
.ml-review__meta        { font-size: 12px !important; }
.ml-logo-descr          { font-size: 11px !important; }
.product_name           { font-size: 14px !important; }

/* ---------- 9. Страница корзины ----------
   Проверено и НЕ включено: скрытие боковой колонки с растягиванием
   контента на всю ширину ломает вёрстку .cart-item (bootstrap-колонки
   внутри рассчитаны на 870px). Убирать блок «Подбор без догадок»
   со страницы корзины нужно в шаблоне — у него нет своего класса,
   зацепиться из CSS не за что. */

/* ---------- 10. Заголовки служебных страниц ----------
   Было: H1 по центру, весь остальной текст по левому краю. */
body:has(.cart-scope) h1.page_heading,
body:has(.contact_info) h1.page_heading { text-align: left !important; }