/* Start:/local/components/ka/catalog.sections.popular/templates/.default/style.css?17894107387551*/
/* Популярные категории на главной (ka:catalog.sections.popular).
   Плитка раздела повторяет блок geo-cv1__grid черновика каталога
   /product/?var=1: картинка на светлой подложке сверху, под ней название,
   счётчик товаров и короткий список подразделов со ссылкой «Ещё N».

   В ряду четыре плитки; когда их больше, шаблон включает карусель (см. низ
   файла) — сетка и карусель рисуются одной и той же разметкой. Сетка собрана
   на flex, а не на grid: карусель оборачивает карточки своими контейнерами,
   и grid-раскладка при этом рассыпалась бы. */

.geo-categories__grid {
    display: flex;
    flex-wrap: wrap;
    /* 60px отступа макета под блоком — с учётом padding карточек */
    margin: 0 -10px 44px;
}

.geo-categories__item {
    flex: 0 0 100%;
    max-width: 100%;
    min-width: 0;
    padding: 0 10px 20px;
}

.geo-categories__card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 18px;
    border: 1px solid #eef1f6;
    border-radius: 12px;
    background: #fff;
    transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease;
}

.geo-categories__card:hover {
    border-color: #dbe3f2;
    box-shadow: 0 12px 30px rgba(16, 49, 120, .10);
    transform: translateY(-2px);
}

.geo-categories__image {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 130px;
    margin-bottom: 14px;
    border-radius: 10px;
    background: #f5f7fb;
    color: #cbd4e6;
    font-size: 40px;
}

.geo-categories__image img {
    max-width: 82%;
    max-height: 112px;
    object-fit: contain;
    mix-blend-mode: multiply;
}

.geo-categories .geo-categories__name {
    margin: 0 0 4px;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.3;
}

.geo-categories__name a {
    color: #103178;
}

.geo-categories__name a:hover {
    color: #fd8d27;
}

.geo-categories__count {
    margin: 0 0 12px;
    color: #9babcd;
    font-size: 13px;
}

.geo-categories__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.geo-categories__list li {
    margin-bottom: 6px;
    font-size: 14px;
    line-height: 1.35;
}

.geo-categories__list a {
    color: #5b6c8f;
}

.geo-categories__list a:hover {
    color: #fd8d27;
}

.geo-categories__more a {
    color: #fd8d27;
    font-weight: 500;
}

@media (min-width: 480px) {
    .geo-categories__item {
        flex-basis: 50%;
        max-width: 50%;
    }
}

@media (min-width: 992px) {
    .geo-categories__item {
        flex-basis: 33.33333%;
        max-width: 33.33333%;
    }
}

@media (min-width: 1200px) {
    /* четыре раздела в ряд */
    .geo-categories__item {
        flex-basis: 25%;
        max-width: 25%;
    }
}

@media (max-width: 767.98px) {
    .geo-categories__card {
        padding: 14px;
    }

    .geo-categories__image {
        height: 96px;
    }
}

/* ---------- карусель ----------

   Карусель делается из этой же сетки: скрипт шаблона вешает на контейнер класс
   owl-carousel и инициализирует плагин (карточек больше четырёх — на любой
   ширине, меньше, но больше одной — только на телефоне, до 768px). Поэтому все
   правила ниже включаются вместе с классом owl-carousel и выключаются вместе
   с ним. */

.geo-categories__grid.owl-carousel {
    /* столько же места под блоком, сколько у сетки, минус строка точек;
       отрицательные поля сетки в карусели не нужны — отступы даёт сам плагин */
    margin: 0 0 18px;
}

/* в сетке карточку растягивает колонка, в карусели — слайд плагина */
.geo-categories__grid.owl-carousel .geo-categories__item {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    padding: 0;
}

/* карточки одного ряда тянутся на всю высоту слайда: без этого у соседних
   карточек разной длины (разное число подразделов) «плавает» нижняя граница */
.geo-categories__grid.owl-carousel .owl-stage {
    display: flex;
}

.geo-categories__grid.owl-carousel .owl-item {
    display: flex;
}

/* тень карточки при наведении не должна обрезаться краем окна карусели */
.geo-categories__grid.owl-carousel .owl-stage-outer {
    padding: 4px 0 10px;
    margin: -4px 0 -10px;
}

/* Точки: тема кладёт их поверх слайдов (position: absolute; bottom: 10px) — в
   карточке они ложились бы на ссылки подразделов. Убираем позиционирование
   совсем: точки становятся обычной строкой под карточками. */
.geo-categories__grid.owl-carousel .owl-dots {
    position: static;
    bottom: auto;
    left: auto;
    margin-top: 26px;
}

/* стрелки темы — полупрозрачная синяя заливка с белой иконкой: на светлой
   карточке такую стрелку не видно. Свой вид — белый круг с синей стрелкой;
   заливку тема объявляет через !important, перебиваем тем же */
.geo-categories__grid.owl-carousel .owl-nav > * {
    width: 44px;
    height: 44px;
    border: 1px solid #d7dde8;
    background-color: #fff !important;
    box-shadow: 0 4px 12px rgba(16, 49, 120, .12);
}

.geo-categories__grid.owl-carousel .owl-nav > * i {
    font-size: 16px;
    color: #103178;
}

.geo-categories__grid.owl-carousel .owl-nav > *:hover {
    border-color: #103178;
    background-color: #103178 !important;
}

.geo-categories__grid.owl-carousel .owl-nav > *:hover i {
    color: #fff;
}

/* стрелки наполовину вынесены за края слайдера, чтобы не закрывать карточку
   (у темы они, наоборот, сдвинуты на 40px внутрь) */
.geo-categories__grid.owl-carousel .owl-nav .owl-prev {
    margin-left: -22px;
}

.geo-categories__grid.owl-carousel .owl-nav .owl-next {
    margin-right: -22px;
}

/* Тема центрует стрелки по всей карусели (top: 50%), а в неё входит и строка
   точек — без поправки стрелки уезжают ниже середины карточек; поправка —
   половина высоты этой строки (26px отступа + 10px точки).
   На телефоне места по краям нет — там листаем точками и пальцем. */
.geo-categories__grid.owl-carousel .owl-nav {
    display: none;
    margin-top: -18px;
}

@media (min-width: 1024px) {
    .geo-categories__grid.owl-carousel .owl-nav {
        display: block;
    }
}

/* End */


/* Start:/local/components/ka/reviews.latest/templates/.default/style.css?17894107384477*/
/* Последние отзывы на главной (ka:reviews.latest).
   Основной вид блока — тема Mymedi (.ps-section--reviews, .ps-review в
   assets/css/style.css): здесь только то, чего в макете не было — товар,
   дата отзыва и одинаковая высота плиток. */

/* На широких экранах тема растягивает карусель шире вьюпорта
   (width: calc(100vw + 240px)) — плитки должны уходить за края блока, но не
   давать странице горизонтальную прокрутку. */
.geo-reviews {
    overflow: hidden;
}

/* owl отдаёт слайдам одинаковую высоту только с этим — иначе плитки в ряду
   разной высоты, а звёзды «плавают» */
.geo-reviews .owl-carousel .owl-stage {
    display: flex;
}

.geo-reviews .owl-carousel .owl-item {
    display: flex;
}

.geo-reviews .ps-review {
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* текст отзыва занимает всё свободное место — подпись, дата и звёзды
   прижаты к низу плитки */
.geo-reviews .ps-review__text {
    flex: 1 1 auto;
    font-size: 16px;
    line-height: 24px;
}

/* Низ плитки: слева автор с датой и оценкой, справа — товар. Плитки в
   карусели узкие (пять в ряд), поэтому колонки могут переноситься: товар
   уходит под автора, а не сжимается в нечитаемый столбик. */
.geo-reviews .ps-review__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 15px;
    margin-top: 20px;
    padding-top: 15px;
    border-top: 1px solid #e6ebf3;
}

.geo-reviews .ps-review__author {
    flex: 1 1 100px;
    min-width: 0;
}

/* Товар, на который оставлен отзыв: картинка и название справа от автора,
   вся плашка — ссылка на карточку товара (см. class.php: для товаров старого
   каталога ссылка ведёт на перенесённую копию). */
.geo-reviews .ps-review__product {
    display: flex;
    flex: 1 1 140px;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: #103178;
}

.geo-reviews .ps-review__product:hover .ps-review__product-name {
    color: #669900;
}

/* картинка товара — квадрат со светлой подложкой: фото у товаров с прозрачным
   фоном и разных пропорций, вписываем целиком */
.geo-reviews .ps-review__product-thumb {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    padding: 4px;
    border: 1px solid #e6ebf3;
    border-radius: 4px;
    background: #fff;
    color: #c3cbdb;
    font-size: 22px;
    overflow: hidden;
}

.geo-reviews .ps-review__product-thumb img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* длинные названия обрезаем тремя строками — иначе плитки разъезжаются */
.geo-reviews .ps-review__product-name {
    font-size: 13px;
    line-height: 18px;
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word;
    transition: color .15s ease;
}

/* имя автора в узкой колонке не должно ломать плитку */
.geo-reviews .ps-review__name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.geo-reviews .ps-review__date {
    margin-top: 2px;
    font-size: 13px;
    line-height: 18px;
    color: #9babcd;
}

/* звёзды сразу под датой — у темы отступ рассчитан на плитку без даты */
.geo-reviews .ps-review__review {
    margin-top: 10px;
}

@media (max-width: 767.98px) {
    .geo-reviews .ps-review {
        padding: 25px 20px;
    }

    .geo-reviews .ps-review__text {
        font-size: 15px;
        line-height: 23px;
    }
}

/* End */
/* /local/components/ka/catalog.sections.popular/templates/.default/style.css?17894107387551 */
/* /local/components/ka/reviews.latest/templates/.default/style.css?17894107384477 */