/* ============================================================================
   Hermes restyle layer — «Строгий минимал», версия 2 (аккуратная)
   Файл: modules/store/contents/template_block/default/_css/ha_restyle.css
   Подключён ПОСЛЕ default_store.css в modules/store/contents/store_tpl.php

   ПРИНЦИП v2: НЕ трогаем вендорские размеры и отступы, от которых зависит
   раскладка (у движка куча фиксированных высот: .name 54px, .os-block-caption
   50px, .os-block-basket .head 40px, .os-productthumb-element 220x350 и т.д.).
   Меняем только цвета, границы, тени и контентную типографику.

   Откат: убрать registerCSSFile(... ha_restyle.css) из store_tpl.php
          (бэкап store_tpl.php.before-restyle-20261013105152) — или переименовать файл.
   ============================================================================ */

/* --- 1. Фон и базовая подложка ------------------------------------------ */
body {
    background-color: #fff !important;
    box-shadow: none !important;          /* вендорская вставная тень на body */
    color: #111;
}
/* вендорская серая заливка контентных строк конструктора -> белая */
.wpt-row-styler[class*="template-background-color-"],
.wpt-row-styler[class*="default-template-background-color"] {
    background-color: #fff !important;
    box-shadow: none !important;
}
/* цветные полосы отдельных страниц (page-N-background-color) — гасим в светло-серый */
.wpt-row-styler[class*="page-"][class*="-background-color-"] {
    background-color: #fafafa !important;
    box-shadow: none !important;
}
.template-default { box-shadow: none !important; }
.template-head-default { box-shadow: none !important; }
.template-default-block-preheader,
.template-default-block-footer-line,
.template-default-block-footer-line-copy { box-shadow: none !important; }

/* --- 2. Контентная типографика (только текст, не UI) -------------------- */
.os-text p, .os-text li, .os-editor-content p, .os-editor-content li,
.os-category-description, .os-category-description p,
.os-textpage p, .os-textpage li, .os-block-textpage p { font-size: 15px; line-height: 1.6; }

h1, h1.title { color: #111; }
h1.title { font-size: 24px; font-weight: 700; letter-spacing: -0.015em; }
h2 { color: #111; }
h3 { color: #111; }

/* ссылки в тексте — чёрные с подчёркиванием при наведении */
.os-text a, .os-editor-content a, .os-category-description a, .os-textpage a {
    color: #111 !important;
    text-decoration: underline;
    text-decoration-color: #bdbdbd;
}
.os-text a:hover, .os-editor-content a:hover, .os-textpage a:hover {
    color: #111 !important;
    text-decoration-color: #111;
}

/* --- 3. Шапка: белая, тонкая линия снизу. Размеры НЕ меняем ------------- */
.wpt-header-wrapper .wpt-row-styler {
    background-color: #fff !important;
    box-shadow: none !important;
    border-bottom: none;
}
.wpt-header-wrapper .wpt-row-styler:last-child { border-bottom: 1px solid #e6e6e6; }

/* телефоны: в разметке инлайн font-size:22px;color:#da4933 — перебиваем на чёрный */
.os-block-contactsheader .phone a {
    color: #111 !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}
.os-block-contactsheader .phone a:hover { text-decoration: underline !important; }
/* остальные контакты (почта, адрес, режим работы) — из красно-оранжевого в серый */
.os-block-contactsheader .element,
.os-block-contactsheader .element a,
.os-block-contactsheader .worktime { color: #6b7280 !important; }
.os-block-contactsheader .element a:hover { color: #111 !important; }

/* ссылки «Кабинет клиента»/язык в прехедере */
.wpt-header-wrapper .os-link-dashed { color: #111 !important; border-bottom-color: #cfcfcf !important; }
.os-block-preheader a, .os-block-preheader span { color: #111 !important; }

/* логотип — размеры вендорские (max-width:140px; max-height:105px), только убираем лишнее */
.os-block-logoheader { background: transparent !important; }

/* корзина в шапке: вендорская оранжевая плашка -> чёрная, текст не обрезать */
.os-block-basket { box-shadow: none !important; border: 1px solid #e6e6e6; }
.os-block-basket .head span {
    background-color: #111 !important;
    font-size: 12px !important;
    padding: 0 14px !important;
}
.os-block-basket .head span.go { background-color: #0cb061 !important; }
.os-block-basket .body a, .os-block-basket .body span { color: #111 !important; }

/* поиск: вендорская коробка с серым полем — оставляем, только чистим рамку */
.os-block-search { box-shadow: none !important; }
.os-block-search input[type="text"] { border: 1px solid #e6e6e6 !important; }
.os-block-search .os-submit { padding-left: 22px !important; padding-right: 22px !important; }

/* --- 4. Кнопки: чёрные. Размеры/высоты вендорские (не ломаем сетку) ----- */
.os-submit {
    background-color: #111 !important;
    color: #fff !important;
    border-radius: 4px !important;
    text-transform: none !important;
    text-shadow: none !important;
    box-shadow: none !important;
}
.os-submit:hover { background-color: #2b2b2b !important; box-shadow: none !important; }
.os-submit:active { box-shadow: none !important; }
.os-submit.green { background-color: #111 !important; }
.os-submit.green:hover { background-color: #2b2b2b !important; }
.os-submit.red { background-color: #fff !important; color: #111 !important; box-shadow: 0 0 0 1px #111 inset !important; }
.os-submit.red:hover { background-color: #f5f5f5 !important; }
.os-submit.grey { background-color: #6b7280 !important; }

/* --- 5. Карточки товаров: убрать тени, добавить рамку. Паддинги вендорские */
.os-productthumb-element .wrapper {
    box-shadow: 0 0 0 1px #e6e6e6 !important;
    border-radius: 6px !important;
    transition: box-shadow .15s ease;
}
.os-productthumb-element .wrapper:hover { box-shadow: 0 0 0 1px #111 !important; }
.os-productthumb-element .name, .os-productthumb-element .name a { color: #111 !important; }
.os-productthumb-element .name a { font-weight: 600; }
.os-productthumb-element .option, .os-productthumb-element .option a { color: #6b7280 !important; }

/* цена: убрать жёлтую плашку «цена по запросу», сделать текст чёрным */
.os-price-available, .os-price-unavailable, .os-price-specify { background: none !important; color: #111 !important; }
.os-price-specify { color: #6b7280 !important; }
.os-available { color: #0cb061 !important; }
.os-unavailable { color: #6b7280 !important; }

/* --- 6. Категории и подписи блоков ------------------------------------- */
.os-category-element .image { box-shadow: 0 0 0 1px #e6e6e6 !important; border-radius: 4px; }
.os-category-element .head { color: #111 !important; }
/* подпись блока (НОВОСТИ/СТАТЬИ): вместо серой плашки в 50px — тонкая линия */
.os-block-caption {
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid #e6e6e6 !important;
    color: #8a8a8a !important;
    font-size: 13px !important;
    height: auto !important;
    line-height: 1.4 !important;
    padding: 8px 0 !important;
    letter-spacing: .06em;
}

/* --- 7. Формы: поля без вендорских теней ------------------------------- */
input[type="text"], input[type="email"], input[type="tel"], input[type="password"], textarea, select {
    box-shadow: none !important;
    border-radius: 4px;
    border: 1px solid #e6e6e6;
}
input[type="text"]:focus, input[type="email"]:focus, input[type="tel"]:focus,
input[type="password"]:focus, textarea:focus, select:focus { border-color: #111 !important; }

/* --- 8. Подвал и крошки ------------------------------------------------- */
.wpt-footer-wrapper .wpt-row-styler {
    background-color: #fff !important;
    box-shadow: none !important;
    border-top: 1px solid #e6e6e6;
}
.wpt-footer-wrapper .footer-caption { color: #8a8a8a !important; letter-spacing: .06em; }
.os-crumbs { color: #8a8a8a !important; }
.os-crumbs a { color: #6b7280 !important; }

/* --- 9. Боковая колонка «Новости» -> лента на всю ширину --------------- */
/* Только узкая боковая колонка (span-2/3): на /news/ тот же блок стоит
   в span-12, там ничего не меняется. Всё завёрнуто в :has() — браузеры
   без поддержки :has() видят прежнюю верстку. */
.wpt-column[data-span="2"]:has(.os-block-news-flex),
.wpt-column[data-span="3"]:has(.os-block-news-flex) {
    width: calc(100% - 20px) !important;
    float: none !important;
    margin: 10px 10px 0 10px !important;
    padding-top: 14px;
    border-top: 1px solid #e6e6e6;
}
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    width: 100% !important;
    float: none !important;
}
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element {
    display: flex;
    flex-direction: column;
    gap: 8px;
    float: none !important;
    width: auto !important;
    margin: 0 !important;
    padding: 12px;
    background: #fff;
    box-shadow: 0 0 0 1px #e6e6e6;
    border-radius: 6px;
}
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element:hover,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element:hover { box-shadow: 0 0 0 1px #111; }
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .image,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .image { margin: 0 !important; }
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .image img,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .image img {
    display: block; width: 100%; height: 130px; object-fit: cover; border-radius: 4px;
}
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .data > a,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .data > a {
    font-size: 15px; font-weight: 600; line-height: 1.35; color: #111 !important; text-decoration: none;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .data > a:hover,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .data > a:hover { text-decoration: underline; }
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .date,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .date { font-size: 12px !important; color: #8a8a8a !important; }
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element .text,
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element .text {
    font-size: 13px; line-height: 1.45; color: #666;
    display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
/* только 4 свежих новости — блок не тянется вниз */
.wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex .element:nth-child(n+5),
.wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex .element:nth-child(n+5) { display: none !important; }

@media (max-width: 1100px) {
    .wpt-column[data-span="2"]:has(.os-block-news-flex) .os-block-news-flex,
    .wpt-column[data-span="3"]:has(.os-block-news-flex) .os-block-news-flex { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- 10. Полировка: ссылки подвала/текстов, панель формы заказа -------- */
.wpt-footer-wrapper a, .wpt-footer-wrapper .element a { color: #4b5563 !important; }
.wpt-footer-wrapper a:hover { color: #111 !important; }
.os-textpage a, .os-contentpage a, .os-text a { text-decoration: none; border-bottom: 1px solid #d5d5d5; }
.os-textpage a:hover, .os-contentpage a:hover, .os-text a:hover { border-bottom-color: #111; }
.js-content-spoiler .spoiler-toggle { color: #111 !important; }
.os-message-search-results { color: #111 !important; }

/* --- 11. Пейджер: вендор плашку #232323 -> минимализм ------------------ */
.os-stepper {
    background-color: #fff !important;
    color: #6b7280 !important;
    box-shadow: 0 0 0 1px #e6e6e6;
    border-radius: 4px;
}
.os-stepper a {
    background-color: #fff !important;
    color: #111 !important;
    box-shadow: 0 0 0 1px #e6e6e6;
    border-radius: 4px;
}
.os-stepper a:hover { background-color: #f5f5f5 !important; color: #111 !important; }
.os-stepper a.selected { background-color: #111 !important; color: #fff !important; box-shadow: none; }

/* --- 12. Табы карточки товара: синие плашки -> рамка, активный — чёрный -- */
.os-block-tabs a {
    background-color: #fff !important;
    color: #111 !important;
    box-shadow: inset 0 0 0 1px #d5d5d5 !important;
    text-shadow: none !important;
}
.os-block-tabs a:hover { background-color: #f5f5f5 !important; box-shadow: inset 0 0 0 1px #111 !important; }
.os-block-tabs a:active { box-shadow: inset 0 0 0 1px #111 !important; }
.os-block-tabs a.selected { background-color: #111 !important; color: #fff !important; box-shadow: none !important; }

/* --- 13. Ссылки в таблицах товара (характеристики, аналоги) ------------- */
.os-block-productfeatures a,
.os-block-productinfo a,
.os-block-productcontent a,
.def-block-table a,
.table-wrapper a {
    color: #111 !important;
    text-decoration: none;
    border-bottom: 1px solid #d5d5d5;
}
.os-block-productfeatures a:hover,
.os-block-productinfo a:hover,
.def-block-table a:hover,
.table-wrapper a:hover { border-bottom-color: #111; }

/* --- 14. Ссылки в подвале (перебиваем вендорский синий) ---------------- */
.wpt-footer-wrapper .wpt-row-styler a,
.wpt-footer-wrapper .os-block-footer-category a,
.wpt-footer-wrapper .os-block-footer-textpages a,
.wpt-footer-wrapper .os-block-footer-contacts a,
.wpt-footer-wrapper .os-block-footer-account a { color: #4b5563 !important; }
.wpt-footer-wrapper .wpt-row-styler a:hover { color: #111 !important; }

/* ============================ конец слоя ================================ */