.breadcrumb {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  font-size: 0.9375rem;
  color: var(--white);
  margin-bottom: 3.75rem;
  margin-top: 7.25rem;
}
.breadcrumb a {
  color: var(--white);
  text-decoration: none;
}

.breadcrumb a:first-of-type{
	display: block;
	width: 1.25rem;
	height: 1.25rem;
	background-image: url("../images/home-icon.png");
	background-repeat: no-repeat;
	background-position: center;
	background-size: contain;
	margin-right: 0.25rem;
}

.catalog__title_main {
  margin-bottom: 4.6875rem;
}

.catalog__categories {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 2rem;
  margin-bottom: 4rem;
}

.catalog__category-img img {
  width: 100%;
  height: 100%;
  object-fit: cover; 
  display: block;
	border-radius: 0.375rem;
}

.catalog__category.active .catalog__category-img{
	padding: 0.125rem;
	background: var(--gradient-2);
	border-radius: 0.375rem;
}

.catalog .catalog__content{
	display: grid;
	grid-template-columns: 19rem 1fr;
	gap: 2rem;
}

.catalog .catalog__filter {
  padding-right: 1.25rem;
}

.catalog .catalog__filter .filter__button{
  width: 100%;
  font-size: 1rem;
  font-family: "Druk Wide Cyr", sans-serif;
  margin: 0px;
  font-weight: 600;
  line-height: 1.5em;
  display: inline-flex;       
  align-items: center;        
  justify-content: center;  
	
  height: 3rem;
  background: linear-gradient(90deg,rgba(255, 255, 255, 0.03) 0%, rgba(255, 255, 255, 0.08) 100%); 
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 0.25rem;
  color: #fff;
  margin-bottom: 2rem;
}

.catalog .catalog__filter .filter__button.active .btn__text--open{
	display: none;
}

.catalog .catalog__filter .filter__button .btn__text--close{
	display: none;
}

.catalog .catalog__filter .filter__button.active .btn__text--close{
	display: block;
}

.catalog .catalog__filter .filter__button .btn__icon{
	width: 1.5rem;
	height: 1.5rem;
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
}

.catalog .catalog__filter .filter__button .btn__icon.btn__icon--filter{
	background-image: url("../images/filter-icon.png")
}

.catalog .catalog__filter .filter__button .btn__icon.btn__icon--chevron{
	background-image: url("../images/chevron-right.png");
	transform: rotate(-90deg);
}

.catalog .catalog__filter .filter__button.active .btn__icon.btn__icon--chevron{
	transform: rotate(90deg);
}

.catalog .catalog__content #catalogLayout{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.9375rem;
 width: 100%;
}

.catalog__pagination {
  width: 61rem;
  margin-left: auto;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-top: 10em;
}

.catalog__pagination .page-numbers {
  position: relative;
  overflow: hidden;

  display: flex;
  width: 3.25rem;
  height: 3.25rem;
  align-items: center;
  justify-content: center;

  background-color: var(--white);
  font-size: 1.125rem;
  color: #515151;
  text-decoration: none;
  font-weight: 600;

  border-radius: 0.75rem;
  transition: color .3s ease;
}

/* Градієнт */
.catalog__pagination .page-numbers::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    #FF0000 0%,
    #D80000 53.8462%,
    #D80000 72.5962%,
    #FF5B5B 100%
  );
  opacity: 0;
  transition: opacity .35s ease;
  z-index: 0;
}

/* Текст поверх */
.catalog__pagination .page-numbers > * {
  position: relative;
  z-index: 1;
}

/* Hover / current */
.catalog__pagination .page-numbers:hover::before,
.catalog__pagination .page-numbers.current::before {
  opacity: 1;
}

.catalog__pagination .page-numbers:hover,
.catalog__pagination .page-numbers.current {
  color: #fff;
}
.catalog__pagination .page-numbers.current svg,
.catalog__pagination .page-numbers:hover svg{
  stroke: #fff;
}

.catalog__pagination .page-numbers svg{
	height: 0.875rem;
	width: auto;
}

.catalog__pagination .page-numbers.prev svg{
	transform: rotate(180deg);
}

.catalog__filter-panel {
  flex-shrink: 0;
  height: 0;
  overflow: hidden;
  transition: width 0.4s ease, opacity 0.4s ease;
  position: relative;
	transition: height 0.35s ease;
  will-change: height;
}

.catalog__filter-panel.active {
  height: auto;
}

.catalog__active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0;
}
.filter-section{
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.filter-section .section__top svg{
	height: 1rem;
	width: 1rem;
	stroke: white;
}
.filter-section + .filter-section{
	margin-top: 2.25rem;
}
.filter-section .filter__search{
	margin-bottom: 0.5rem;
}
.filter-section .filter__search input{
	width: 100%;
}
.filter-section .filter__option {
	display: flex;
	gap: 0.5rem;
	padding: 0.375rem 0.5rem;
	font-size: 0.875rem;
	letter-spacing: -0.06em;
	cursor: pointer;
}
.filter-section .filter__option input{
	display: none;
}
.filter-section .filter__option::before{
	display:block;
	content: "";
	width: 1rem;
	height: 1rem;
	border: 1px solid #2A2929;
	border-radius: 0.125rem;
	flex-shrink: 0;
}
.filter-section .filter__option .filter__option-count{
	color: #7E7E7E;
}
.filter-section .filter__option:has(input:checked)::before{
	background-repeat: no-repeat;
    background-position: center;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 17' fill='none'%3E%3Cpath d='M0.750244 5.78017L6.28567 15.7501L16.7502 0.750061' stroke='url(%23paint0_linear_183_1636)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_183_1636' x1='0.750244' y1='8.25006' x2='16.7502' y2='8.25006' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23FF0000'/%3E%3Cstop offset='0.538462' stop-color='%23D80000'/%3E%3Cstop offset='0.725962' stop-color='%23D80000'/%3E%3Cstop offset='0.9999' stop-color='%23FF5B5B'/%3E%3Cstop offset='1' stop-color='%23FF5B5B'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
	background-size: 0.875rem 0.875rem;
	background-repeat: no-repeat;
}
.filter-section .filter__options {
  overflow-y: auto;
	max-height: 20rem;
}

.filter-section .section__top {
  cursor: pointer;
}

.filter-section .section__top svg {
  transition: transform .3s ease;
}
.active-filter-tag {
  background: #CBB7AE;
  border: 1px solid #CBB7AE;
  border-radius: 0.3125rem;
  padding: 0.75rem 0.9375rem;
  font-size: 1.375rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.active-filter-tag button.remove-filter {
  background: none;
  border: none;
  color: var(--brown);
  font-weight: normal;
  font-size: 2rem;
  cursor: pointer;
  line-height: 1;
}

.catalog__active-filters-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-right: 3.5rem;
}

.catalog__active-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 1.25rem;
}
.price-inputs svg{
    fill:none;
    stroke: var(--text-dark);
}
#resetFilters {
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--gray);
  cursor: pointer;
  transition: all 0.2s ease;
  margin-top: 3rem;
}

.hidden {
  display: none;
}

.price-inputs {
 display: flex;
	margin-top: 1rem;
}
.price-inputs .price__input {
  flex: 1 1 100%;
  margin-right: 0.5rem;
	
}
.price-inputs .price__input input{
	width: 100%;
	text-align: center;
	height: 2rem;
	border-color: rgba(221, 221, 221, 1); 
	
}
.price-inputs input::-webkit-outer-spin-button,
.price-inputs input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.price-inputs .price-inputs__button{
	padding: 0 0.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 0.5rem;
}

.price-inputs input[type=number] {
  -moz-appearance: textfield;
}
.price-range .slider-container { 
  position: relative; 
  height: 0.15rem; 
  background: #CBB7AE; 
}
.price-range .slider-track { 
  position: absolute; 
  height: 0.15rem;  
  width: 100%; 
  top: 0; 
  left: 0;
  background: #DDDDDD;
}
.price-range .slider-range { 
  position: absolute; 
  height: 0.25rem; 
  border-radius: 2px;
  background: linear-gradient(90deg, #F00 0%, #D80000 53.85%, #D80000 72.6%, #FF5B5B 99.99%, #FF5B5B 100%);
  top: 0; 
  transform: translate(0, -50%);
}
.price-range .slider-thumb {
  position: absolute; 
  width: 1rem; 
  height: 1rem;
  border-radius: 50%;
  background: #FFFFFF; 
  border: 1px solid 
  top: 0;
  transform: translate(0, -50%);
  cursor: pointer;
  border: none; 
  z-index: 2;
}

.price-range .slider-numbers{
	margin-top: 0.625rem;
}

.price-range .numbers-track{
	padding: 0px 0.5rem;
}

.price-range .numbers-track .track__rect{
	width: 0.0625rem;
	height: 0.5rem;
	border-radius: 99px;
	background-color: #7E7E7E;
}

.price-range .numbers-track .track__rect.track__rect--large{
	height: 0.75rem;
}

.price-range .numbers-items{
	margin-top: 0.5rem;
}

.price-range .numbers-items .track__item{
	flex: 1 1 100%;
	color: #7E7E7E;
	font-size: 0.75rem;
}

.price-range .numbers-items .track__item:nth-of-type(2){
	text-align: center;
}

.price-range .numbers-items .track__item:last-of-type{
	text-align: right;
}

/* SEO TEXT */
.seo{
	padding-top: 11.25rem;
	padding-bottom: 10.75rem;
}

.seo .seo__title{
	margin-bottom: 2rem;
	width: 100%;
}

.seo .seo__text{
	gap: 1.5rem;
	height: 16.125rem; 
  overflow: hidden;
  transition: height .5s ease;
	position: relative;
}

.seo__text::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 8.6875rem;
  background: linear-gradient(
    to bottom,
	rgba(11,10,10,.5) 50%,
    rgba(11,10,10,1)
  );
  pointer-events: none;
  transition: opacity .3s ease;
}

.seo__text.is-open {
  height: auto;
}

.seo__text.is-open::after {
  opacity: 0;
}

.seo .seo__toggle{
	width: auto;
	margin-top: 1.5rem;
}

.seo .seo__toggle.is-open .btn__hide{
	display: inline;
}

.seo .seo__toggle.is-open .btn__show,
.seo .seo__toggle .btn__hide{
	display: none;
}

.seo .seo__toggle svg{
	fill: none;
	stroke: var(--deep-red);
	transform: rotate(180deg);
	transform-origin: center;
}

.seo .seo__toggle.is-open svg{
	transform: rotate(0deg);
}

div:has(> .woocommerce-error), div:has(> .woocommerce-info), div:has(> .woocommerce-message){
	grid-column: 1 / -1;
}

.woocommerce-error, .woocommerce-info, .woocommerce-message{
	    width: 100%;
    padding: 1rem 1.5rem;
    border-radius: 0.625rem;
    border: 1px solid rgba(221, 221, 221, 0.3);
    background: var(--morphism);
    color: #fff;
    letter-spacing: -0.06em;
}

.woocommerce-error::before, .woocommerce-info::before, .woocommerce-message::before{
	display: none;
}

@media (max-width: 959px) {
	.breadcrumb{
		margin-top: 7.375rem;
		margin-bottom: 2.25rem;
	}
	
	.catalog .container{
		max-width: 100%;
		overflow: hidden;
	}
  .content_top {
    display: flex;
    flex-direction: column;
    text-align: center; 
    margin: 0 auto; 
    width: 100%; 
  }

  .catalog__categories {
    grid-template-columns: 1fr 1fr;
	  gap: 0.5rem;
	  margin-bottom: 6.25rem;
  }
	
	.catalog .catalog__content{
		display: flex;
		flex-direction: column;
		gap: 0.5rem;
	}

  #filterButton{
    border-radius: 0.3125rem;
    width: 100%;
	  padding-right: 1rem;
		padding-left: 1rem;
  }
	
	.catalog .catalog__filter{
		padding-right: 0px;
	}
	
	.catalog .catalog__filter .btn__text{
		flex: 1 1 auto;
		text-align: center;
	}

  .catalog .catalog__content .catalog__layout{
    grid-template-columns: repeat(2, 1fr); 
    gap: 0.75rem; 
  }
	
	.catalog__pagination {
		width: 100%;
		margin-top: 2.25rem;
	}
	
	.price-inputs input,
	.price-range .slider-track{
	  width: 100%;
	}

  .catalog__pagination .pagination-buttons {
    display: flex;
    justify-content: space-between;
    width: 100%;
  }
	
	.seo{
		padding-bottom: 7.5rem;
		padding-top: 7.5rem;
	}
	
	.seo .seo__text:not(.is-open){
		height: 24.875rem;
	}
	
	.seo .seo__text::after{
		height: 41.4375rem;
		bottom: -34.25rem;
	}
	
	.catalog__filter-panel{
		z-index: 6000;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		padding: 2.5rem 1rem;
		background-color: #0B0A0A;
		border: 1px solid #7E7E7E;
		border-radius: 0.9375rem;
		
		display: none;
		align-items: stretch;
		justify-content: start;
		flex-direction: column;
		gap: 2.125rem;
	}
	
	.catalog__filter-panel.active{
		display: flex;
	}
	
	.catalog__filter-panel form{
		flex: 1 1 0;
		height: 0;
		padding-right: 3.75rem;
		overflow-y: auto;
	}
	
	.catalog__filter-panel .filter-section + .filter-section{
		margin-top: 1.5rem;
	}
	
	.catalog__filter-panel .filter__reset-btn{
		font-size: 0.875rem;
		background: var(--gradient-2, linear-gradient(90deg, #F00 0%, #D80000 45.11%, #FB8E11 95.06%));
		background-clip: text;
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		border: none;
		margin-top: 1rem;
		line-height: 110%;
		letter-spacing: -0.06em;
	}
	
	.catalog__pagination .page-numbers{
		width: 2.105rem;
		height: 2.105rem;
		font-size: 0.725rem;
		border-radius: 0.4875rem;
	}
	
	.catalog .catalog__content #catalogLayout{
		grid-template-columns: 1fr 1fr;
		gap: 0.75rem;
	}
}