

/* Start:/local/templates/krepco/components/bitrix/catalog/main/style.css?17909620304127*/
.grid{}
.grid .bx_content_section{
	margin-bottom: 15px;
}
.grid .bx_sidebar{
	margin-bottom: 15px;
}

/* grid2x1 */
.grid2x1{}
.grid2x1 .bx_content_section{
	float: left;
	width: 66%;
	margin-bottom: 15px;
}
.grid2x1 .bx_sidebar{
	float: right;
	width: 33%;
	margin-bottom: 15px;
	padding-left: 5%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
@media (max-width:960px){
	.grid2x1 .bx_sidebar{
		padding-left: 4%;
	}
}
@media (max-width:640px) {
	.grid2x1 .bx_content_section,
	.grid2x1 .bx_sidebar{
		width: 100%;
		float: none;
	}
	.grid2x1 .bx_sidebar{
		padding-left: 3%;
	}
}
@media (max-width:479px){
	.grid2x1 .bx_sidebar{
		padding-left: 1%;
	}

}

.catalog-block-header{
	font-size:14px;
	font-weight: bold;
	text-align: left;
	margin:5px 0;
	padding:5px 15px;
	border-bottom: 2px solid #d9dee6;
	color: #000;
}

body.bx-theme-blue .catalog-block-header{border-color:#006cc0;}
body.bx-theme-green .catalog-block-header{border-color:#63aa28;}
body.bx-theme-red .catalog-block-header{border-color:#da3737;}
body.bx-theme-yellow .catalog-block-header{border-color:#f4b236;}

/**
 * Индикатор загрузки на кнопке (BX.Krepco.Catalog.startButtonLoading / stopButtonLoading).
 *
 * Пока идёт запрос, содержимое кнопки уходит вверх и становится прозрачным, оставаясь в потоке,
 * поэтому ширина кнопки не меняется. На его месте волной подпрыгивают три точки и проходит мягкий блик.
 * Цвет точек и блика — исходный цвет текста кнопки (--btn-loader-color выставляет скрипт).
 * Блик рисуется внутри .btn-loader__dots, чтобы не занимать псевдоэлементы кнопки из вёрстки.
 */

.btn-loader {
    position: relative;
    overflow: hidden;
}

.btn-loader._loading {
    color: transparent !important;
    cursor: progress;
    transition: color 0.2s ease;
}

.btn-loader > :not(.btn-loader__dots) {
    transition: opacity 0.2s ease, transform 0.25s cubic-bezier(0.2, 0.7, 0.3, 1);
}

.btn-loader._loading > :not(.btn-loader__dots) {
    opacity: 0;
    transform: translateY(-6px);
}

.btn-loader__dots {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    color: var(--btn-loader-color, currentColor);
    opacity: 0;
    transform: translateY(6px);
    transition: opacity 0.2s ease, transform 0.25s cubic-bezier(0.2, 0.7, 0.3, 1);
    pointer-events: none;
}

.btn-loader._loading .btn-loader__dots {
    opacity: 1;
    transform: translateY(0);
}

.btn-loader__dots i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: currentColor;
    animation: btn-loader-dot 1.1s ease-in-out infinite;
}

.btn-loader__dots i:nth-child(2) {
    animation-delay: 0.15s;
}

.btn-loader__dots i:nth-child(3) {
    animation-delay: 0.3s;
}

.btn-loader__dots::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, 0.28) 50%, transparent 70%);
    background: linear-gradient(110deg, transparent 30%, color-mix(in srgb, currentColor 28%, transparent) 50%, transparent 70%);
    transform: translateX(-100%);
    animation: btn-loader-shimmer 1.4s ease-in-out infinite;
}

@keyframes btn-loader-dot {
    0%, 80%, 100% {
        transform: translateY(0) scale(0.75);
        opacity: 0.45;
    }

    40% {
        transform: translateY(-5px) scale(1);
        opacity: 1;
    }
}

@keyframes btn-loader-shimmer {
    from {
        transform: translateX(-100%);
    }

    to {
        transform: translateX(100%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn-loader > :not(.btn-loader__dots),
    .btn-loader__dots {
        transition: none;
    }

    .btn-loader__dots i {
        animation: none;
        opacity: 0.8;
    }

    .btn-loader__dots::before {
        display: none;
    }
}

/* End */


/* Start:/local/templates/krepco/components/bitrix/catalog/main/bitrix/catalog.section.list/catalog_root/style.css?17909722181205*/
/**
 * Плитка разделов каталога: колонки одинаковой ширины и строки одинаковой высоты
 * независимо от длины названий.
 *
 * min-width: 0 — карточка с aspect-ratio не расширяет колонку из-за высокого содержимого.
 * grid-auto-rows: 1fr — все строки сетки по высоте самой высокой, карточки одного размера.
 * На десктопе название ограничено тремя строками, чтобы карточки оставались квадратными;
 * на мобильных действует ограничение в две строки из общих стилей.
 */

.section-catalog__grid {
    grid-auto-rows: 1fr;
}

.section-catalog__grid > .card-category {
    min-width: 0;
    align-self: stretch;
    justify-self: stretch;
}

@media (min-width: 768px) {
    .section-catalog__grid .card-category__title {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}
/* End */
/* /local/templates/krepco/components/bitrix/catalog/main/style.css?17909620304127 */
/* /local/templates/krepco/components/bitrix/catalog/main/bitrix/catalog.section.list/catalog_root/style.css?17909722181205 */
