

/* Start:/local/templates/main_v3/components/bitrix/catalog/.default/style.css?17854870794673*/
.product-wrapper{
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(180px, 222px)) !important;
    gap: 24px !important;
}
.product-wrapper .product-wrap{
    max-width: 100%;
    padding: 0;
}
.pcard__price{
    font-size: 20px;
}
.btn-cart{
    text-transform: uppercase;
}
.product-wrapper-list{
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.prow {
    display: grid;
    grid-template-columns: 150px minmax(0,1fr) 230px;
    gap: 16px;
    background: #fff;
    border-radius: var(--r-lg);
    padding: 14px;
}
/* Блок с картинкой */
.prow__media {
    aspect-ratio: 1/1;
    background: var(--line-2);
    border-radius: var(--r);
    display: grid;
    place-items: center;
    color: #C3CCD8;
}
.prow__media img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}
/* Заголовок товара */
.prow__title {
    font-size: var(--fs-15) !important;
    font-weight: 600;
    margin-bottom: 6px;
    text-decoration: none;
    color: var(--ink-1);
}
.prow__title:hover {
    color: var(--brand-700);
}
/* Характеристики (если нужны) */
.specs {
    display: grid;
    gap: 4px;
    font-size: var(--fs-12);
}
.specs div {
    display: flex;
    gap: 8px;
}
.specs div i {
    font-style: normal;
    color: var(--muted);
    flex: none;
}
.specs div b {
    font-weight: 500;
}
/* Правый блок с ценой и кнопкой купить */
.prow__buy {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border-left: 1px solid var(--line-2);
    padding-left: 16px;
}
/* Мобильная адаптация для списка (чтобы на смартфонах не ломалось) */
@media (max-width: 600px) {
    .prow {
        grid-template-columns: 110px minmax(0,1fr);
    }
    .prow__buy {
        grid-column: 1 / -1;
        border-left: 0;
        padding-left: 0;
        border-top: 1px solid var(--line-2);
        padding-top: 12px;
        flex-direction: row;
        align-items: center;
    }
}
.pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 28px 0 !important;
    flex-wrap: wrap;
}
.pagination a, .pagination span {
    min-width: 40px;
    height: 40px;
    padding: 0 10px;
    border-radius: var(--r-sm);
    display: grid;
    place-items: center;
    background: #fff;
    font-weight: 600;
    font-size: var(--fs-13);
    color: var(--ink-2);
}
.pagination a:hover {
    color: var(--brand-700);
    box-shadow: inset 0 0 0 1px var(--brand-100);
}
.shop-content {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}
.shop-content > .main-content:only-child,
.shop-content > #catalog-products-container:only-child {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}
@media (max-width: 991px) {
    .shop-content {
        grid-template-columns: 1fr !important;
    }
    .shop-content > .main-content {
        grid-column: 1 / -1 !important;
        width: 100% !important;
    }
}
.toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    background: #fff;
    border-radius: var(--r-lg);
    padding: 10px 14px;
    margin-bottom: 12px;
}
.viewswitch {
    display: flex;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    overflow: hidden;
}
.viewswitch a {
    width: 36px;
    height: 36px;
    border: 0;
    background: #fff;
    color: var(--muted);
    display: grid;
    place-items: center;
}
.viewswitch a.is-active {
    background: var(--brand-050);
    color: var(--brand-700);
}
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #fff; border-radius: var(--r-lg); padding: 10px 14px; margin-bottom: 12px; }
.toolbar__sort { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: var(--fs-13); color: var(--muted); }
.select {
    height: 36px; padding: 0 32px 0 12px; border: 1px solid var(--line); border-radius: var(--r-sm);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A8694' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
    appearance: none; font-size: var(--fs-13); font-weight: 500; color: var(--ink); outline: none;
}
.select:focus { border-color: var(--brand); }
/* End */


/* Start:/local/templates/main_v3/components/bitrix/catalog.smart.filter/.default/style.css?17858517306393*/
/* ---------- 12. КАТАЛОГ (ФИЛЬТРЫ) ---------- */
.filters { background: #fff; border-radius: var(--r-lg); padding: 4px 16px 16px; position: sticky; top: 16px; align-self: start; }
.filters__head { display: flex; align-items: center; padding: 14px 0 10px; border-bottom: 1px solid var(--line); }
.filters__head b { font-size: var(--fs-16); }
.filters__reset { margin-left: auto; font-size: var(--fs-12); color: var(--muted); background: none; border: 0; }
.filters__reset:hover { color: var(--accent); }
.fgroup { border-bottom: 1px solid var(--line-2); padding: 14px 0; }
.fgroup:last-child { border-bottom: 0; }
.fgroup__t { display: flex; align-items: center; width: 100%; background: none; border: 0; padding: 0 0 10px; font-size: var(--fs-14); font-weight: 600; color: var(--ink); }
.fgroup__t .icon { margin-left: auto; color: var(--muted); transition: transform .2s; }
.fgroup.is-collapsed .fgroup__t .icon { transform: rotate(-90deg); }
.fgroup.is-collapsed .fgroup__body { display: none; }
.fgroup__body { display: flex; flex-direction: column; gap: 9px; }
.fgroup__more { background: none; border: 0; padding: 0; color: var(--brand-700); font-size: var(--fs-12); font-weight: 600; text-align: left; }

.check { display: flex; align-items: center; gap: 9px; font-size: var(--fs-13); color: var(--ink-2); cursor: pointer; }
.check input { appearance: none; width: 18px; height: 18px; border: 1.5px solid var(--line); border-radius: 5px; flex: none; background: #fff; position: relative; transition: .15s; }
.check input:checked { background: var(--brand); border-color: var(--brand); }
.check input:checked::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.check .cnt { margin-left: auto; font-size: var(--fs-12); color: var(--muted); }

.range { display: flex; gap: 8px; }
.range input { width: 100%; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-sm); outline: none; }
.range input:focus { border-color: var(--brand); }

/* Дополнительные стили для интеграции с JS Битрикса */
.bx_ui_slider_track { position: relative; margin-top: 15px; height: 4px; background: var(--line-2); border-radius: 2px; }
.bx_ui_slider_pricebar_V { position: absolute; top: 0; bottom: 0; background: var(--brand); border-radius: 2px; }
.bx_ui_slider_handle { position: absolute; top: -6px; width: 16px; height: 16px; background: #fff; border: 2px solid var(--brand); border-radius: 50%; cursor: pointer; margin-left: -8px; }
.bx_ui_slider_handle.left { margin-left: -8px; }
.bx_ui_slider_handle.right { margin-right: -8px; }
.bx_filter .bx_filter_popup_result {
    position: absolute; display: none; z-index: 999;
    background: #fff; border: 1px solid var(--brand); border-radius: var(--r);
    padding: 10px 16px; box-shadow: var(--sh-3); white-space: nowrap;
    margin-left: 20px; height: auto;

}
.bx_filter .bx_filter_popup_result.right { margin-left: -20px; right: 100%; top: -15px; }
.bx_filter .bx_filter_popup_result_text { margin-bottom: 8px; font-weight: 500; }
.bx_filter .bx_filter_popup_result a {
    display: inline-block;
    padding: 6px 12px;
    background: var(--brand);
    color: #fff;
    border-radius: var(--r-sm);
    font-weight: 600;
    text-decoration: none;
    margin-top: 5px;
}
.bx_filter .bx_filter_popup_result a:hover { background: var(--brand-700); color: #fff; text-decoration: none; }


/* ---------- TOOLBAR И СОРТИРОВКА ---------- */
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #fff; border-radius: var(--r-lg); padding: 10px 14px; margin-bottom: 12px; }
.toolbar__sort { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: var(--fs-13); color: var(--muted); }
.select {
    height: 36px; padding: 0 32px 0 12px; border: 1px solid var(--line); border-radius: var(--r-sm);
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A8694' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
    appearance: none; font-size: var(--fs-13); font-weight: 500; color: var(--ink); outline: none;
}
.select:focus { border-color: var(--brand); }

@media (max-width: 900px) {
    .filters { display: none; }
}

/* ---------- ПЛИТКИ КАТЕГОРИЙ ---------- */
.cat-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.cat-pills li { padding: 0; margin: 0; }
.cat-pill {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 16px;
    border: 1px solid var(--brand);
    background: var(--brand-050, #E8F5E9);
    color: var(--brand-700, #007D34);
    border-radius: 100px;
    font-size: var(--fs-14, 14px); font-weight: 500;
    text-decoration: none; transition: all .2s;
}
.cat-pill:hover { background: var(--brand); color: #fff; }
.cat-pill.is-active { background: var(--brand); color: #fff; border-color: var(--brand); }
.cat-pill .cnt { opacity: 0.7; font-size: 0.9em; }

/* Активные фильтры (с крестиком) и кнопка Сбросить */
.active-filters-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; margin-bottom: 16px; padding: 0; list-style: none; }
.cat-pill--active {
    background: var(--brand-050, #E8F5E9);
    border: 1px solid var(--brand, #00A046);
    color: var(--brand-700, #007D34);
    cursor: pointer;
}
.cat-pill--active:hover { background: var(--brand, #00A046); color: #fff; }
.cat-pill--active svg { width: 14px; height: 14px; margin-left: 4px; stroke: currentColor; opacity: 0.8; }
.cat-pill--reset {
    background: #fff;
    border: 1px dashed var(--line-2, #D8DCE3);
    color: var(--ink-2, #556272);
    cursor: pointer;
}
.cat-pill--reset:hover { border-color: var(--brand, #00A046); color: var(--brand, #00A046); }


/* --- Всплывающая подсказка фильтра (скрыта, так как работает мгновенный AJAX) --- */
#modef,
.bx_filter_popup_result,
.bx_filter_popup_result[style*="inline-block"] {
    display: none !important;
}
.smartfilter{
    z-index: 1;
}
.cat-pill--reset:hover{
    color: var(--white) !important;
}
/* End */


/* Start:/local/templates/main_v3/components/bitrix/catalog.section.list/sidebar/style.css?1785328341730*/
.cat-pills { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.cat-pills li { padding: 0; margin: 0; }
.cat-pill {
    display: inline-flex; align-items: center; gap: 8px;
    padding: 8px 16px;
    border: 1px solid var(--brand);
    background: var(--brand-050, #E8F5E9);
    color: var(--brand-700, #007D34);
    border-radius: 100px;
    font-size: var(--fs-14, 14px); font-weight: 500;
    text-decoration: none; transition: all .2s;
}
.cat-pill:hover { background: var(--brand); color: #fff; }
.cat-pill.is-active { background: var(--brand); color: #fff; border-color: var(--brand); }
.cat-pill .cnt { opacity: 0.7; font-size: 0.9em; }
.pages{
    margin-bottom: 24px;
}
/* End */
/* /local/templates/main_v3/components/bitrix/catalog/.default/style.css?17854870794673 */
/* /local/templates/main_v3/components/bitrix/catalog.smart.filter/.default/style.css?17858517306393 */
/* /local/templates/main_v3/components/bitrix/catalog.section.list/sidebar/style.css?1785328341730 */
