/* ==========================================================================
   PORT từ evo-collections.scss (Phase 3.4). PREPEND (đầu file) để giữ đúng thứ
   tự cascade cũ: evo-collections → kicap-collection (evo có overlap với sidebar
   lọc .aside-title/.aside-filter/.aside-content nên phải chèn trước, không append).
   VERBATIM từ compiled ($main-color=#c9d6df; URL banner tuyệt đối). `.evo-blog-header`
   ở đây là bản collection (min-height 360, #fff) — không đụng bản page (khác file,
   không co-load). Dark-mode: giữ hardcode như evo gốc (Phase 4).
   ========================================================================== */
.evo-blog-header{background:url(//bizweb.dktcdn.net/100/436/596/themes/1143989/assets/evo-col-banner.jpg?1784372232182) no-repeat;background-size:cover;background-position:center}@media (max-width: 767px){.evo-blog-header{background-position:right}}.evo-blog-header .evo-blog-header-content{min-height:360px;display:flex;justify-content:center;padding:20px 0 40px;flex-flow:column;text-align:left}.evo-blog-header .evo-blog-header-content h1{font-size:26px;line-height:28px;margin:0;font-weight:500;text-transform:uppercase;letter-spacing:2.4px;color:#fff}.evo-blog-header .evo-blog-header-content .evo-blog-des{font-size:14px;line-height:24px;color:#fff;letter-spacing:0.5px;margin-top:10px}.evo-blog-header .evo-blog-header-content .evo-blog-des p{margin-bottom:0}.aside-item.collection-category{margin-top:25px}.aside-item.collection-category .aside-title .title-head{font-size:20px;line-height:30px;font-weight:500;color:#1c1c1c;letter-spacing:2px;text-transform:uppercase}.aside-item.collection-category .aside-content .navbar-pills .nav-item a{font-size:14px;padding-left:0px;padding-right:25px;color:#1c1c1c;position:relative;display:table;width:100%}.aside-item.collection-category .aside-content .navbar-pills .nav-item a:hover,.aside-item.collection-category .aside-content .navbar-pills .nav-item a:focus{color:#c9d6df;background-color:transparent}.aside-item.collection-category .aside-content .navbar-pills .nav-item .Collapsible__Plus{position:absolute;right:7px;top:calc(50% - (20px / 2));width:20px;height:20px}.aside-item.collection-category .aside-content .navbar-pills .nav-item .Collapsible__Plus::before,.aside-item.collection-category .aside-content .navbar-pills .nav-item .Collapsible__Plus::after{position:absolute;content:'';top:50%;left:50%;transform:translate(-50%, -50%) rotate(-90deg);background-color:currentColor;transition:transform 0.4s ease-in-out, opacity 0.4s ease-in-out}.aside-item.collection-category .aside-content .navbar-pills .nav-item .Collapsible__Plus::before{width:11px;height:1px;opacity:1}.aside-item.collection-category .aside-content .navbar-pills .nav-item .Collapsible__Plus::after{width:1px;height:11px}.aside-item.collection-category .aside-content .navbar-pills .nav-item.active>.Collapsible__Plus::after{transform:translate(-50%, -50%) rotate(90deg)}.aside-item.collection-category .aside-content .navbar-pills .nav-item.active>.Collapsible__Plus::before{opacity:0}.aside-item.collection-category .aside-content .navbar-pills .nav-item .dropdown-menu{margin:0;padding:0;transition:left 0.3s ease 0s, opacity 0.3s}.aside-item.collection-category .aside-content .navbar-pills .nav-item .dropdown-menu .nav-item a{padding:5px 10px}.aside-item.collection-category .aside-content .navbar-pills .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item a{padding:5px 20px}.aside-item.collection-category .aside-content .navbar-pills .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item .dropdown-menu .nav-item a{padding:5px 30px}.aside-filter{margin-top:20px;padding-top:20px;border-top:1px solid #f5f5f5}.aside-filter .heading{font-size:20px;line-height:30px;font-weight:500;color:#1c1c1c;letter-spacing:2px;text-transform:uppercase;margin-bottom:10px}.aside-filter .aside-hidden-mobile .aside-item .aside-title{color:#1c1c1c;font-weight:500;font-size:16px;margin-bottom:10px;line-height:24px}.aside-filter .aside-hidden-mobile .aside-item .aside-content{margin-bottom:20px}.category-products{margin-top:25px}.category-products .sort-cate{border-bottom:1px solid #f5f5f5;display:block;padding-bottom:5px}.category-products .sort-cate .sort-cate-left{float:left;margin-top:5px}.category-products .sort-cate .sort-cate-left h3{color:#000;font-size:14px;float:left;margin:0;margin-top:2px}.category-products .sort-cate .sort-cate-left ul{display:inline-block}.category-products .sort-cate .sort-cate-left ul li{float:left;padding:0 0 0 10px}.category-products .sort-cate .sort-cate-left ul li a{color:#000;font-size:14px;position:relative}.category-products .sort-cate .sort-cate-left ul li a i{height:16px;width:16px;border:2px solid #ddd;border-radius:50%;display:inline-block;vertical-align:middle;margin:-3px 5px 0 0;position:relative}.category-products .sort-cate .sort-cate-left ul li:hover i,.category-products .sort-cate .sort-cate-left ul li.active i{border:2px solid #c9d6df;height:16px;width:16px}.category-products .sort-cate .sort-cate-left ul li:hover i:before,.category-products .sort-cate .sort-cate-left ul li.active i:before{content:"";width:8px;height:8px;background-color:#c9d6df;position:absolute;border-radius:50%;margin:2px}.category-products .sort-cate .sort-cate-right{float:right}.category-products .sort-cate .sort-cate-right h3{color:#000;font-size:14px;font-weight:normal;float:left;margin:0;margin-top:5px;margin-right:5px}.category-products .sort-cate .sort-cate-right .view-mode{display:inline-block}@media (max-width: 480px){.category-products .sort-cate .sort-cate-right .view-mode{text-align:center;display:block}}.category-products .sort-cate .sort-cate-right .view-mode a{border:1px solid #eaeced;width:65px;display:inline-block;color:#333;font-size:14px;height:auto;line-height:inherit;float:left;border-radius:0;height:30px;line-height:30px}@media (min-width: 413px) and (max-width: 415px){.category-products .sort-cate .sort-cate-right .view-mode a{width:90px}}@media (min-width: 374px) and (max-width: 380px){.category-products .sort-cate .sort-cate-right .view-mode a{width:80px}}.category-products .sort-cate .sort-cate-right .view-mode a.active,.category-products .sort-cate .sort-cate-right .view-mode a:hover{color:#c9d6df}.category-products .sort-cate .sort-cate-right .view-mode a+a{margin-left:5px}@media (max-width: 480px){.category-products .sort-cate .sort-cate-right .view-mode a{float:none}}@media (max-width: 480px){.category-products .sort-cate .sort-cate-right{width:50%}.category-products .sort-cate .sort-cate-right h3{display:block;text-align:left;margin-right:0;float:none}}@media (max-width: 480px){.category-products .sort-cate .sort-cate-right-mobile{width:100%;float:left}.category-products .sort-cate .sort-cate-right-mobile #sort-by{float:none}.category-products .sort-cate .sort-cate-right-mobile #sort-by .left{display:block;float:left;line-height:1.4;font-weight:normal;margin-right:10px;margin-top:5px}.category-products .sort-cate .sort-cate-right-mobile #sort-by ul{float:none}.category-products .sort-cate .sort-cate-right-mobile #sort-by ul>li{border:1px solid #eaeced;padding:0 5px;width:137px;line-height:28px}.category-products .sort-cate .sort-cate-right-mobile #sort-by ul ul{background-color:#fff;border-top:none}.category-products .sort-cate .sort-cate-right-mobile #sort-by ul ul li{width:100%;border:none}}@media (min-width: 768px){.category-products .products-view-grid .col-xs-6:nth-child(3n+1){clear:left}}@media (max-width: 767px){.category-products .products-view-grid .col-xs-6:nth-child(2n+1){clear:left}}.category-products .products-view-grid .product-card .product-card__inner .product-card__image{position:relative;height:293px}@media (max-width: 1024px){.category-products .products-view-grid .product-card .product-card__inner .product-card__image{height:243px}}@media (max-width: 991px){.category-products .products-view-grid .product-card .product-card__inner .product-card__image{height:250px}}@media (max-width: 480px){.category-products .products-view-grid .product-card .product-card__inner .product-card__image{height:213px}}@media (max-width: 376px){.category-products .products-view-grid .product-card .product-card__inner .product-card__image{height:194px}}@media (max-width: 321px){.category-products .products-view-grid .product-card .product-card__inner .product-card__image{height:166px}}.category-products .products-view-grid .product-card .product-card__inner .product-card__image img{width:auto;max-height:100%;position:absolute;top:0;bottom:0;left:0;right:0;margin:auto}.filter-container__selected-filter{margin-bottom:10px;padding-bottom:5px;border-bottom:1px solid #eee}.filter-container__selected-filter-header{margin-bottom:5px}.filter-container__selected-filter-header-title{font-size:16px;font-weight:500;color:#ff4c4c}.filter-container__clear-all{float:right;color:#333;margin-top:3px}.filter-container__selected-filter-item{padding:3px 0}.filter-container__selected-filter-item>a{color:#333;font-size:13px}.filter-container__selected-filter-item>a:hover,.filter-container__selected-filter-item>a:focus{color:#c9d6df}.list-category .col-title h3{font-weight:500;font-size:18px;padding:0;margin:10px 0;float:left;letter-spacing:1px}.list-category .col-title h3 span{font-size:14px;font-weight:400}.list-category .col-title a{float:right;color:#c9d6df;font-size:14px;margin-top:12px}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev,.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next{border:none;border-radius:50%;background:#fff;color:#5c5c5c;cursor:pointer;text-align:center;z-index:1;box-shadow:0 2px 10px rgba(54,54,54,0.15);vertical-align:middle;line-height:0;transform:scale(1.001);transition:background 0.15s ease-in-out, opacity 0.15s ease-in-out, color 0.2s ease-in-out, transform 0.2s ease-in-out;overflow:hidden;height:45px;width:45px;stroke-width:1px;position:absolute;line-height:40px;font-size:25px}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next{right:-50px}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next.disabled{opacity:0.2 !important}@media (max-width: 1024px){.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next{right:-20px}}@media (max-width: 991px){.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next{right:0}}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev{left:-50px}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev.disabled{opacity:0.2 !important}@media (max-width: 1024px){.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev{right:-20px}}@media (max-width: 991px){.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev{left:0}}.list-category .evo-owl-product.owl-carousel .owl-nav .owl-prev:hover,.list-category .evo-owl-product.owl-carousel .owl-nav .owl-next:hover{transform:scale(1.1)}.list-category .evo-owl-product.owl-carousel .owl-dots{display:none !important}@media (max-width: 767px){.list-category .evo-owl-product.owl-carousel{display:block;margin-right:-10px;margin-left:-10px;width:auto}.list-category .evo-owl-product.owl-carousel .product-card{width:50%;float:left;padding-left:10px;padding-right:10px}.list-category .evo-owl-product.owl-carousel .product-card:nth-child(2n+1){clear:left}}@media (max-width: 767px) and (max-width: 480px){.list-category .evo-owl-product.owl-carousel{margin-right:-7px;margin-left:-7px}.list-category .evo-owl-product.owl-carousel .product-card{padding-left:7px;padding-right:7px}}

/* KICAP Human Frame v2 product listing. Scoped to preserve legacy Sapo data contracts. */
.kicap-collection {
	color: var(--kicap-text);
	font-family: var(--kicap-font-sans);
}

.kicap-collection__hero {
	padding-block: var(--kicap-space-7) var(--kicap-space-8);
	border-bottom: 1px solid var(--kicap-border);
	background: var(--kicap-surface);
}

.kicap-collection__heading {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--kicap-space-7);
}

.kicap-collection__heading > div {
	min-width: 0;
	max-width: 48rem;
}

.kicap-collection__eyebrow {
	margin: 0 0 var(--kicap-space-3);
	color: var(--kicap-color-accent-strong);
	font: 700 var(--kicap-font-size-xs) / var(--kicap-line-height-tight) var(--kicap-font-sans);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.kicap-collection h1,
.kicap-collection h2,
.kicap-collection p {
	margin-top: 0;
}

.kicap-collection h1 {
	margin-bottom: var(--kicap-space-4);
	font: 700 clamp(2.35rem, 4.6vw, 4rem) / 1 var(--kicap-font-sans);
	letter-spacing: -0.05em;
}

.kicap-collection__description {
	max-width: 43rem;
	color: var(--kicap-text-muted);
	font: 400 var(--kicap-font-size-base) / var(--kicap-line-height-relaxed) var(--kicap-font-sans);
}

.kicap-collection__description > *:last-child {
	margin-bottom: 0;
}

.kicap-collection__count {
	flex: 0 0 auto;
	color: var(--kicap-text-muted);
	font: 400 var(--kicap-font-size-sm) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection__layout {
	display: grid;
	grid-template-columns: minmax(13.75rem, 15.25rem) minmax(0, 1fr);
	gap: clamp(var(--kicap-space-6), 3vw, var(--kicap-space-8));
	padding-block: var(--kicap-space-7) var(--kicap-section-space);
}

.kicap-collection__filter-drawer {
	position: sticky;
	top: var(--kicap-space-5);
	align-self: start;
	min-width: 0;
}

.kicap-collection__filter-drawer-head,
.kicap-collection__filter-drawer-foot {
	display: none;
}

.kicap-collection .aside-filter {
	border-top: 1px solid var(--kicap-border-strong);
}

.kicap-collection .aside-filter .heading {
	padding-block: var(--kicap-space-5);
	color: var(--kicap-text);
	font: 700 var(--kicap-font-size-sm) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection .aside-filter .aside-item {
	margin: 0;
	padding-block: var(--kicap-space-5);
	border-top: 1px solid var(--kicap-border);
}

.kicap-collection .aside-filter .aside-title {
	margin: 0 0 var(--kicap-space-4);
	color: var(--kicap-text);
	font: 700 var(--kicap-font-size-sm) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection .aside-filter ul,
.kicap-collection .filter-container__selected-filter-list ul {
	display: grid;
	gap: var(--kicap-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.kicap-collection .aside-filter .filter-item,
.kicap-collection .filter-container__selected-filter-item {
	margin: 0;
	padding: 0;
}

.kicap-collection .aside-filter .filter-item label {
	display: flex;
	gap: var(--kicap-space-3);
	align-items: flex-start;
	margin: 0;
	color: var(--kicap-text-muted);
	font: 400 var(--kicap-font-size-sm) / var(--kicap-line-height-base) var(--kicap-font-sans);
	cursor: pointer;
}

.kicap-collection .aside-filter .filter-item label:hover {
	color: var(--kicap-text);
}

.kicap-collection .aside-filter .filter-item input[type="checkbox"] {
	box-sizing: border-box;
	width: 1rem;
	height: 1rem;
	flex: 0 0 auto;
	margin: 0.19rem 0 0;
	border: 1px solid var(--kicap-border-strong);
	border-radius: 0.25rem;
	background: var(--kicap-surface-elevated);
	appearance: none;
	transition: background-color var(--kicap-motion-fast) var(--kicap-ease-standard), border-color var(--kicap-motion-fast) var(--kicap-ease-standard), box-shadow var(--kicap-motion-fast) var(--kicap-ease-standard);
}

.kicap-collection .aside-filter .filter-item input[type="checkbox"]:checked {
	border-color: var(--kicap-color-accent);
	background: var(--kicap-color-accent);
	box-shadow: inset 0 0 0 3px var(--kicap-surface-elevated);
}

.kicap-collection .aside-filter .filter-item input[type="checkbox"]:focus-visible {
	outline: var(--kicap-focus-width) solid var(--kicap-focus-ring);
	outline-offset: var(--kicap-focus-offset);
	box-shadow: 0 0 0 4px var(--kicap-focus-shadow);
}

.kicap-collection .aside-filter .filter-item label > i,
.kicap-collection .filter-container__selected-filter-item i {
	display: none;
}

.kicap-collection .filter-container__selected-filter {
	margin: 0;
	padding: var(--kicap-space-5) 0;
	border-bottom: 1px solid var(--kicap-border);
}

.kicap-collection .filter-container__selected-filter-header {
	display: flex;
	justify-content: space-between;
	gap: var(--kicap-space-3);
	margin-bottom: var(--kicap-space-3);
}

.kicap-collection .filter-container__selected-filter-header-title,
.kicap-collection .filter-container__clear-all {
	color: var(--kicap-color-accent-strong);
	font: 600 var(--kicap-font-size-xs) / var(--kicap-line-height-base) var(--kicap-font-sans);
	text-decoration: none;
}

.kicap-collection .filter-container__selected-filter-item a {
	display: inline-flex;
	gap: var(--kicap-space-2);
	align-items: center;
	padding: var(--kicap-space-2) var(--kicap-space-3);
	border: 1px solid var(--kicap-border);
	border-radius: var(--kicap-radius-pill);
	background: var(--kicap-color-accent-subtle);
	color: var(--kicap-text);
	font: 400 var(--kicap-font-size-xs) / var(--kicap-line-height-base) var(--kicap-font-sans);
	text-decoration: none;
}

.kicap-collection__selected-filter-remove {
	color: var(--kicap-color-accent-strong);
	font-weight: 700;
}

.kicap-collection__results {
	min-width: 0;
}

.kicap-collection__toolbar {
	display: flex;
	align-items: end;
	justify-content: flex-end;
	gap: var(--kicap-space-4);
	min-height: 3rem;
	margin-bottom: var(--kicap-space-6);
}

.kicap-collection__filter-trigger {
	display: none;
}

.kicap-collection__sort-control {
	display: grid;
	grid-template-columns: auto minmax(11.5rem, 14rem);
	gap: var(--kicap-space-3);
	align-items: center;
}

.kicap-collection__sort-control label {
	margin: 0;
	color: var(--kicap-text-muted);
	font: 600 var(--kicap-font-size-xs) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection__sort-control .kicap-select {
	min-height: 2.75rem;
	padding-block: var(--kicap-space-2);
	font-size: var(--kicap-font-size-sm);
}

.kicap-collection__product-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(var(--kicap-space-4), 2vw, var(--kicap-space-6));
}

.kicap-collection-card {
	display: flex;
	min-width: 0;
	flex-direction: column;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
}

.kicap-collection-card__media {
	position: relative;
	display: grid;
	aspect-ratio: 1;
	place-items: center;
	border: 1px solid var(--kicap-border);
	border-radius: var(--kicap-radius-md);
	background: var(--kicap-surface-elevated);
	overflow: hidden;
}

.kicap-collection-card__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform var(--kicap-motion-base) var(--kicap-ease-out);
}

.kicap-collection-card__media:hover img {
	transform: scale(1.02);
}

.kicap-collection-card__image-fallback {
	color: var(--kicap-text-subtle);
	font: 700 var(--kicap-font-size-sm) / 1 var(--kicap-font-sans);
	letter-spacing: 0.14em;
}

.kicap-collection-card__badge,
.kicap-collection-card__status {
	position: absolute;
	top: var(--kicap-space-3);
	padding: var(--kicap-space-2) var(--kicap-space-3);
	border-radius: var(--kicap-radius-pill);
	font: 700 var(--kicap-font-size-xs) / 1 var(--kicap-font-sans);
}

.kicap-collection-card__badge {
	left: var(--kicap-space-3);
	background: var(--kicap-color-accent-subtle);
	color: var(--kicap-color-accent-strong);
}

.kicap-collection-card__status {
	right: var(--kicap-space-3);
	background: var(--kicap-surface-inverse);
	color: var(--kicap-text-inverse);
}

.kicap-collection-card__content {
	display: flex;
	min-height: 12.5rem;
	flex-direction: column;
	padding: var(--kicap-space-4) var(--kicap-space-2) 0;
}

.kicap-collection-card__type,
.kicap-collection-card__variant {
	margin-bottom: var(--kicap-space-2);
	color: var(--kicap-text-subtle);
	font: 600 var(--kicap-font-size-xs) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection-card__type {
	letter-spacing: 0.09em;
	text-transform: uppercase;
}

.kicap-collection-card h2 {
	display: -webkit-box;
	margin-bottom: var(--kicap-space-3);
	overflow: hidden;
	font: 700 var(--kicap-font-size-sm) / 1.38 var(--kicap-font-sans);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.kicap-collection-card h2 a {
	color: var(--kicap-text);
	text-decoration: none;
}

.kicap-collection-card h2 a:hover {
	color: var(--kicap-color-accent-strong);
}

.kicap-collection-card__price {
	display: flex;
	flex-wrap: wrap;
	gap: var(--kicap-space-2);
	align-items: baseline;
	margin-bottom: var(--kicap-space-2);
	color: var(--kicap-text);
	font: 400 var(--kicap-font-size-sm) / var(--kicap-line-height-base) var(--kicap-font-sans);
}

.kicap-collection-card__price strong {
	font-weight: 700;
}

.kicap-collection-card__price del {
	color: var(--kicap-text-subtle);
	font-size: var(--kicap-font-size-xs);
}

.kicap-collection-card__variant {
	margin-bottom: var(--kicap-space-4);
}

.kicap-collection-card__form {
	display: flex;
	margin-top: auto;
}

.kicap-collection-card__form .kicap-button {
	width: 100%;
	min-height: 2.75rem;
	padding-block: var(--kicap-space-2);
	font-size: var(--kicap-font-size-xs);
}

.kicap-collection__empty-state {
	min-height: 17rem;
	border-color: var(--kicap-border);
	background: var(--kicap-surface);
}

.kicap-collection__empty-state h2 {
	margin-bottom: var(--kicap-space-3);
	font: 700 var(--kicap-font-size-xl) / var(--kicap-line-height-tight) var(--kicap-font-sans);
}

.kicap-collection__empty-state p {
	margin-bottom: 0;
	color: var(--kicap-text-muted);
}

.kicap-collection__pagination {
	margin-top: var(--kicap-space-8);
}

.kicap-collection__pagination ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--kicap-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.kicap-collection__pagination a,
.kicap-collection__pagination span {
	display: inline-grid;
	min-width: 2.5rem;
	min-height: 2.5rem;
	place-items: center;
	padding-inline: var(--kicap-space-3);
	border: 1px solid var(--kicap-border);
	border-radius: var(--kicap-radius-sm);
	background: var(--kicap-surface);
	color: var(--kicap-text);
	font: 600 var(--kicap-font-size-xs) / 1 var(--kicap-font-sans);
	text-decoration: none;
}

.kicap-collection__pagination a:hover {
	border-color: var(--kicap-color-accent);
	color: var(--kicap-color-accent-strong);
}

.kicap-collection__pagination [aria-current="page"] {
	border-color: var(--kicap-surface-inverse);
	background: var(--kicap-surface-inverse);
	color: var(--kicap-text-inverse);
}

.kicap-collection__pagination [aria-disabled="true"] {
	opacity: 0.48;
}

body.kicap-collection-filter-locked {
	overflow: hidden;
}

@media (max-width: 1023px) {
	.kicap-collection__layout {
		grid-template-columns: minmax(12.5rem, 14rem) minmax(0, 1fr);
		gap: var(--kicap-space-6);
	}

	.kicap-collection__product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 991px) {
	.kicap-collection__layout {
		display: block;
		padding-top: var(--kicap-space-5);
	}

	.kicap-collection__filter-trigger {
		display: inline-flex;
	}

	.kicap-collection__toolbar {
		justify-content: space-between;
	}

	.kicap-collection__filter-drawer {
		position: fixed;
		z-index: var(--kicap-z-modal);
		inset: auto 0 0;
		display: flex;
		max-height: min(84dvh, 46rem);
		flex-direction: column;
		padding: var(--kicap-space-5) var(--kicap-container-gutter) calc(var(--kicap-space-5) + env(safe-area-inset-bottom));
		border: 1px solid var(--kicap-border);
		border-radius: var(--kicap-radius-lg) var(--kicap-radius-lg) 0 0;
		background: var(--kicap-surface-elevated);
		box-shadow: var(--kicap-shadow-elevated);
		transform: translateY(105%);
		transition: transform var(--kicap-motion-base) var(--kicap-ease-out);
		visibility: hidden;
	}

	.kicap-collection__filter-drawer.is-open {
		transform: translateY(0);
		visibility: visible;
	}

	.kicap-collection__filter-drawer-head,
	.kicap-collection__filter-drawer-foot {
		display: flex;
		flex: 0 0 auto;
		align-items: center;
		justify-content: space-between;
		gap: var(--kicap-space-4);
	}

	.kicap-collection__filter-drawer-head {
		padding-bottom: var(--kicap-space-4);
		border-bottom: 1px solid var(--kicap-border);
	}

	.kicap-collection__filter-drawer-head strong {
		font: 700 var(--kicap-font-size-lg) / var(--kicap-line-height-tight) var(--kicap-font-sans);
	}

	.kicap-collection__filter-close {
		min-width: 2.75rem;
		min-height: 2.75rem;
	}

	.kicap-collection__filter-drawer .aside-filter {
		min-height: 0;
		margin-block: var(--kicap-space-4);
		overflow: auto;
	}

	.kicap-collection__filter-drawer-foot {
		padding-top: var(--kicap-space-4);
		border-top: 1px solid var(--kicap-border);
	}

	.kicap-collection__filter-drawer-foot .kicap-button {
		flex: 1 1 0;
	}

	.kicap-collection__filter-backdrop {
		position: fixed;
		z-index: var(--kicap-z-overlay);
		inset: 0;
		background: var(--kicap-overlay);
	}
}

@media (max-width: 767px) {
	.kicap-collection__hero {
		padding-block: var(--kicap-space-6) var(--kicap-space-7);
	}

	.kicap-collection__heading {
		align-items: flex-start;
		flex-direction: column;
		gap: var(--kicap-space-4);
	}

	.kicap-collection__count {
		font-size: var(--kicap-font-size-xs);
	}

	.kicap-collection__toolbar {
		align-items: stretch;
		flex-direction: column;
		gap: var(--kicap-space-3);
	}

	.kicap-collection__filter-trigger,
	.kicap-collection__sort-control,
	.kicap-collection__sort-control .kicap-select {
		width: 100%;
	}

	.kicap-collection__sort-control {
		grid-template-columns: 1fr;
		gap: var(--kicap-space-2);
	}

	.kicap-collection__product-grid {
		gap: var(--kicap-space-4) var(--kicap-space-3);
	}

	.kicap-collection-card__content {
		min-height: 13.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.kicap-collection-card__media img,
	.kicap-collection__filter-drawer,
	.kicap-collection .aside-filter .filter-item input[type="checkbox"] {
		transition-duration: 1ms;
	}
}