:root {
  --ch-red: #E3000F;
  --ch-red-hover: #b90511;
  --ch-red-hover-darken: #510004;
  --ch-white: #fff;
  --ch-black: #000;
  --ch-text-grey: #b0b0b0;
  --ch-pagination-hover: #efefef;
  --ch-filter-bg: #f8f8f8;
  --ch-select-label-grey: #adadad;
  --ch-select-option-selected-bg: #f3f3f3;
  --ch-select-option-hover-bg: #eaeaea;
  --ch-select-box-shadow-hover: rgba(216, 199, 199, 0.2);
  --ch-sort-box-shadow: rgba(216, 199, 199, .8);
  --ch-filter-found-info-box-shadow: rgba(181, 181, 181, .3);
  --ch-btn-disabled: rgba(0, 0, 0, .4);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; /* Убирает синюю подложку при тапе на мобильных*/
}

button {
  cursor: pointer;
  font-family: "Arteks", "Arial", sans-serif;
}

button, a {
  -webkit-tap-highlight-color: transparent; /* Убирает синюю подложку при тапе на мобильных*/
}

html {
  font-family: "Arteks", "Arial", sans-serif;
  line-height: 120%;
}

input {
  font-family: "Arteks", "Arial", sans-serif;
}

body.ch-dialog--opened {
  overflow: hidden;
  padding-right: 17px;
}

html[data-ch-filter-opened] {
  overflow: hidden;
}

.page {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

.ch-content {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.ch-section--h100 {
  height: 100%;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.ch-button {
  outline: none;
  border: none;
  background-color: var(--ch-red);
  color: var(--ch-white);
  padding: 12px 16px;
  text-transform: uppercase;
  transition: background-color .1s ease-in-out;
}

@media (hover: hover) {
  .ch-button:hover {
    background-color: var(--ch-red-hover);
  }
}

@media (hover: none) {
  .ch-button:active {
    background-color: var(--ch-red-hover);
  }
}

.ch-text-grey {
  color: var(--ch-text-grey);
}

.ch-font-weight-medium {
  font-weight: 500;
}

.ch-pointer-events-auto {
  pointer-events: auto;
}

.animation-underline {
  position: relative;
  color: var(--ch-black);
  transition: color .1s ease-in-out;
}

.animation-underline--active {
  color: var(--ch-red);
}

.animation-underline::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background-color: var(--ch-red);
  transition: width .1s ease-in-out;
}

.animation-underline svg path {
  transition: fill .1s ease-in-out;
}

@media (hover: hover) {
  .animation-underline:hover::after {
    width: 100%;
  }

  .animation-underline.animation-underline--active:hover {
    color: var(--ch-red-hover);
  }

  .animation-underline.animation-underline--active:hover::after {
    background-color: var(--ch-red-hover);
  }

  .animation-underline:hover {
    color: var(--ch-red);
  }

  .animation-underline:hover svg path {
    fill: var(--ch-red);
  }
}

@media (hover: none) {
  .animation-underline:active::after {
    /*width: 100%;*/
  }

  .animation-underline.animation-underline--active:active {
    color: var(--ch-red-hover);
  }

  .animation-underline.animation-underline--active:active::after {
    background-color: var(--ch-red-hover);
  }

  .animation-underline:active {
    color: var(--ch-red-hover);
  }

  .animation-underline:active svg path {
    fill: var(--ch-red-hover);
  }
}

.ch-button-icon-text {
  background-color: unset;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 7px;
}

.ch-button-icon-text:disabled {
  cursor: default;
  color: var(--ch-btn-disabled);
}

.ch-button-icon-text:disabled svg path {
  stroke: var(--ch-btn-disabled);
}

.ch-button-icon {
  background-color: unset;
  border: none;
}

.ch-text-uppercase {
  text-transform: uppercase;
}

.ch-text-color-anim {
  transition: color .1s ease-in-out;
}

@media (hover: hover) {
  .ch-text-color-anim:hover {
    color: var(--ch-red);
  }
}

@media (hover: none) {
  .ch-text-color-anim:active {
    color: var(--ch-red);
  }
}

.ch-no-link {
  width: fit-content;
  text-decoration: none;
  color: var(--ch-black);
}

.ch-underline-animate {
  position: relative;
  display: inline-block;
  text-decoration: none;
  color: inherit;
}

.ch-underline-animate::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  height: .5px;
  width: 0;
  background-color: currentColor;
  transition: width 0.1s linear;
}

@media (hover: hover) {
  .ch-underline-animate:hover::after {
    width: 100%;
    color: var(--ch-red-hover-darken);
  }
  .ch-underline-animate:hover {
    color: var(--ch-red-hover-darken);
  }
}

@media (hover: none) {
  .ch-underline-animate:active::after {
    width: 100%;
    color: var(--ch-red-hover-darken);
  }
  .ch-underline-animate:active {
    color: var(--ch-red-hover-darken);
  }
}

.ch-header {
  padding: 20px 50px;
}

.ch-catalog {
  display: grid;
  grid-template-columns: calc(100% - 300px) 300px;
  grid-template-rows: min-content 1fr min-content;
  height: 100%;
  flex-grow: 1;
}

.ch-catalog__header {
  padding: 20px;
  display: flex;
  column-gap: 20px;
  align-items: start;
  justify-content: space-between;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2;
}

.ch-catalog__header .ch-button {
  display: none;
}

.ch-catalog__sort-items {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 10px;
}

.ch-catalog__sort-item {
  white-space: nowrap;
  text-decoration: none;
}

.ch-catalog__sort-btn {

  white-space: nowrap;
  color: var(--ch-black);
  text-decoration: none;
  display: flex;
  align-items: center;
  column-gap: 5px;
}

.ch-dropdown {
  position: relative;
}

.ch-dropdown__list {
  z-index: 3;
  position: absolute;
  top: 25px;
  left: -20px;
  background-color: var(--ch-white);
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 15px 0 var(--ch-sort-box-shadow);
  visibility: hidden;
  opacity: 0;
  transition: visibility .2s ease-in-out, opacity .2s ease-in-out;
}

.ch-dropdown__list--opened {
  visibility: visible;
  opacity: 1;
}

.ch-dropdown__item {
  white-space: nowrap;
}

.ch-dropdown__arrow {
  transition: transform .1s ease-in-out;
}

.ch-dropdown__arrow--opened {
  transform: rotate(180deg);
}

.ch-wallpapers {
  list-style: none;
  padding: 0 20px;
  display: grid;
  grid-template-columns: repeat(6, calc((100% - (20px * 5)) / 6));
  grid-template-rows: repeat(auto-fit, 380px);
  grid-gap: 20px;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
}

.ch-wallpapers.ch-wallpapers--not-found {
  display: none;
}

.ch-wallpapers--not-found ~ .ch-wallpapers__info-not-found {
  padding: 0 20px;
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 2;
  grid-row-end: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ch-wallpapers__info-not-found p {
  text-align: center;
}

.ch-wallpapers__info-not-found {
  display: none;
}

.ch-wallpapers__item {
  position: relative;
}

@media (hover: hover) {
  .ch-wallpapers__item:hover .ch-wallpapers__item-info {
    visibility: visible;
    opacity: 1;
    pointer-events: none;
  }
}

@media (hover: none) {
  .ch-wallpapers__item:active .ch-wallpapers__item-info {
    visibility: visible;
    opacity: 1;
    pointer-events: none;
  }
}

.ch-wallpapers__item--is-new {
  z-index: 2;
  position: absolute;
  background-color: var(--ch-red);
  color: var(--ch-white);
  min-width: 60px;
  min-height: 25px;
  padding: 6px 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
}

.ch-wallpapers__swiper {
  width: 100%;
  height: 380px;
}

.ch-wallpapers__swiper-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ch-wallpapers__swiper-pagination .swiper-pagination-bullet {
  width: 5px!important;
  height: 5px!important;
  opacity: .5!important;
  background-color: var(--ch-white);
}

.ch-wallpapers__swiper-pagination .swiper-pagination-bullet-active {
  background: var(--ch-white)!important;
  opacity: 1!important;
}

.ch-wallpapers__swiper-button-next.swiper-button-next,
.ch-wallpapers__swiper-button-prev.swiper-button-prev {
  pointer-events: visible;
  color: var(--ch-white);
  bottom: 40px;
  top: auto;
  font-size: 10px;
}

.ch-wallpapers__swiper-button-next.swiper-button-next:after,
.ch-wallpapers__swiper-button-prev.swiper-button-prev:after {
  font-size: 18px;
}

.ch-wallpapers__swiper-button-prev.swiper-button-prev {
  left: 41%;
}

.ch-wallpapers__swiper-button-next.swiper-button-next {
  right: 41%;
}

.ch-wallpapers__item-info {
  visibility: hidden;
  opacity: 0;
  transition: visibility .2s ease-in-out, opacity .2s ease-in-out;
  padding: 100px 20px 80px;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 50%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, -50%);
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  row-gap: 15px;
  color: var(--ch-white);
}

.ch-wallpapers__item-info-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
  text-align: center;
}

.ch-wallpapers__item-format {
  white-space: nowrap;
}

.ch-wallpapers__item-hr {
  margin: 10px 0;
  width: 100%;
  background: var(--ch-red);
  height: 1px;
  border: none;
}

.ch-wallpapers__item-article {
  white-space: nowrap;
}

.ch-wallpapers__item-name {
  text-transform: uppercase;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: calc(1.2em * 2);
  line-height: 1.2;
}

.ch-catalog-pagination {
  padding: 50px 20px;
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  column-gap: 5px;
  grid-column-start: 1;
  grid-column-end: 3;
  grid-row-start: 3;
  grid-row-end: 4;
}

.ch-catalog-pagination-item a {
  text-decoration: none;
  color: var(--ch-black);
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color .1s ease-in-out;
}

@media (hover: hover) {
  .ch-catalog-pagination-item a:hover {
    background-color: var(--ch-pagination-hover);
  }
}

@media (hover: none) {
  .ch-catalog-pagination-item a:active {
    background-color: var(--ch-pagination-hover);
  }
}

.ch-catalog-pagination-item--active a {
  color: var(--ch-white);
  background-color: var(--ch-red);
}

@media (hover: hover) {
  .ch-catalog-pagination-item--active a:hover {
    background-color: var(--ch-red);
  }
}

@media (hover: none) {
  .ch-catalog-pagination-item--active a:active {
    background-color: var(--ch-red);
  }
}

.ch-catalog-filter {
  background-color: var(--ch-filter-bg);
  padding: 20px;
  grid-row-start: 1;
  grid-row-end: 3;
  grid-column-start: 2;
  grid-column-end: 3;

  display: flex;
  flex-direction: column;
  row-gap: 20px;
  height: min-content;
}

.ch-catalog-filter .ch-button-icon {
  display: none;
  padding: 20px;
  background-color: var(--ch-white);
}

.ch-custom-select {
  user-select: none;
  position: relative;
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.ch-custom-select__found-info {
  min-height: 44px;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 12px 10px;
  background-color: var(--ch-white);
  position: absolute;
  top: 21px;
  left: -10px;
  transform: translateX(-100%);
  z-index: 2;
  box-shadow: 0 0 15px 0 var(--ch-filter-found-info-box-shadow);
}

.ch-select--show-info ~ .ch-custom-select__found-info {
  display: flex;
}

.ch-custom-select__found-info--loading .ch-custom-select__found-text {
  display: none;
}

.ch-custom-select__found-info--loading .ch-select-loader {
  display: flex;
}

.ch-custom-select__found-info-mini {
  display: none;
  align-items: center;
  column-gap: 2px;
}

.ch-custom-select__found-text {
  display: flex;
  column-gap: 3px;
}

.ch-custom-select__found-info-mini--show {
  display: flex;
}

.ch-custom-select__found-number {
  color: var(--ch-red);
}

.ch-select-loader {
  width: 20px;
  height: 20px;
  border: 1.3px solid var(--ch-red);
  border-bottom-color: transparent;
  border-radius: 50%;
  display: none;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.ch-custom-select__label {
  color: var(--ch-select-label-grey);
}

.ch-catalog-filter__actions {
  height: 27px;
  padding-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  column-gap: 10px;
}

.ch-catalog-filter__c-btn {
  padding: 20px 20px 0;
  display: none;
  align-items: center;
  justify-content: center;
}

.ch-catalog-filter__c-selects {
  display: flex;
  flex-direction: column;
  row-gap: 20px;
}

.ch-select {
  /*min-width: 200px;*/
  display: flex;
  flex-direction: column;
  row-gap: 4px;
}

.ch-select--opened .ch-select__options {
  max-height: 1000px;
}

.ch-select__option input {
  display: none;
}

.ch-select__option label {
  cursor: pointer;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  row-gap: 1px;
}

.ch-select__option--border-bottom:not(:last-child) {
  border-bottom: 1px var(--ch-select-option-selected-bg) solid;
}

.ch-select--opened .ch-select__icon-arrow {
  transform: rotate(180deg);
}

.ch-select__header {
  cursor: pointer;
  padding: 12px 10px;
  display: flex;
  justify-content: space-between;
  column-gap: 10px;
  background-color: var(--ch-white);
  border: 1px transparent solid;
  transition: border-top-color .1s ease-in-out,
  border-bottom-color .1s ease-in-out,
  border-left-color .1s ease-in-out,
  box-shadow .1s ease-in-out,
  border-right-color .1s ease-in-out;
}

@media (hover: hover) {
  .ch-select__header:hover {
    box-shadow: 0 0 15px 0 var(--ch-select-box-shadow-hover);
  }
}

@media (hover: none) {
  .ch-select__header:active {
    box-shadow: 0 0 15px 0 var(--ch-select-box-shadow-hover);
  }
}

.ch-select__selected-items {
  display: none;
  column-gap: 4px;
  flex-wrap: wrap;
  list-style: none;
}

.ch-select--hidden {
  opacity: 0;
  height: 0;
  overflow: hidden;
}

.ch-select--selected .ch-select__selected-items {
  display: flex;
}

.ch-select--selected .ch-select__title {
  display: none;
}

.ch-select--selected .ch-select__header {
  background-color: var(--ch-red);
  color: var(--ch-white);
}

.ch-select--selected .ch-select__icon-arrow path {
  fill: var(--ch-white);
}

.ch-select__icon-arrow {
  margin: 6px 0;
  flex-shrink: 0;
  /*transition: transform .2s ease-in-out;*/
}

.ch-select__body {
  display: flex;
  flex-direction: column;
}

.ch-points-filter .ch-select__body .ch-button-icon {
  padding: 10px 20px;
  display: none;
  justify-content: center;
}

.ch-search {
  background-color: var(--ch-white);
  display: none;
  align-items: center;
  justify-content: space-between;
}

.ch-search input {
  width: 100%;
  border: none;
  outline: none;
  padding: 15px 20px;
}

.ch-search svg {
  height: 45px;
  width: 45px;
  padding: 15px 20px 15px 10px;
  cursor: pointer;
}

.ch-search input::placeholder {
  color: var(--ch-text-grey);
}

.ch-select__options {
  list-style: none;
  background-color: var(--ch-white);
  /*padding: 10px 0;*/
  display: flex;
  flex-direction: column;
  max-height: 0;
  transition: max-height .2s ease-in-out;
  overflow: hidden;
}

.ch-select__option, .ch-dropdown__item {
  cursor: pointer;
  padding: 6px 20px;
}

.ch-select__option--selected, .ch-dropdown__item--selected {
  background-color: var(--ch-select-option-selected-bg);
  color: var(--ch-red);
}

@media (hover: hover) {
  .ch-select__option:hover, .ch-dropdown__item:hover {
    color: var(--ch-red-hover);
    background-color: var(--ch-select-option-hover-bg);
  }
  .ch-select__option--selected:hover, .ch-dropdown__item--selected:hover {
    background-color: var(--ch-select-option-hover-bg);
    color: var(--ch-red);
  }
}

@media (hover: none) {
  .ch-select__option:active, .ch-dropdown__item:active, .ch-select__option:active a {
    color: var(--ch-red-hover);
    background-color: var(--ch-select-option-hover-bg);
  }
  .ch-select__option--selected:active, .ch-dropdown__item--selected:active, .ch-select__option--selected:active a {
    background-color: var(--ch-select-option-hover-bg);
    color: var(--ch-red);
  }
}

.ch-where-buy {
  display: flex;
  align-items: center;
  column-gap: 10px;
  text-decoration: none;
  color: var(--ch-black);
  width: fit-content;
}

.ch-slider {
  height: 870px;
}

.ch-slider__swiper {
  height: 100%;
}

.ch-slider__swiper-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.ch-slider__swiper-buttons {
  z-index: 1;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  row-gap: 10px;
}

.ch-slider__swiper-button-prev.swiper-button-prev {
  background-color: var(--ch-red);
  width: 30px;
  height: 30px;
  border-radius: 50%;
  position: initial;
  margin-top: initial;
}

.ch-slider__swiper-button-prev.swiper-button-prev::after {
  color: var(--ch-white);
  font-size: 10px;
}

.ch-slider__swiper-button-next.swiper-button-next {
  background-color: var(--ch-red);
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: initial;
  margin-top: initial;
}

.ch-slider__swiper-button-next.swiper-button-next::after {
  color: var(--ch-white);
  font-size: 18px;
}

.swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--ch-red);
}

.ch-slider__btn-open-slide {
  z-index: 1;
  background-color: var(--ch-red);
  position: absolute;
  right: 20px;
  bottom: 20px;
  border: none;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ch-slider__btn-open-slide svg {
  width: 12px;
  height: 12px;
}

dialog.ch-fullscreen-slide {
  width: 100%;
  height: 100%;
  border: none;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: transparent;
  max-width: initial;
  max-height: initial;
  flex-direction: column;
}

dialog::backdrop {
  background: rgba(0, 0, 0, 0.8);
}

.ch-fullscreen-slide__c-img {
  width: 100%;
  height: calc(100% - 50px - 50px);
  display: flex;
  align-items: center;
  justify-content: center;
}

.ch-fullscreen-slide__img {
  max-width: 100%;
  max-height: 100%;
  width: max-content;
  height: max-content;
  object-position: center;
  object-fit: contain;
}

.ch-fullscreen-slide[open] {
  display: flex;
}

.ch-fullscreen-slide__close {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background-color: transparent;
  align-self: end;
}

.points-of-sale {
  width: 100%;
  height: 100%;
  display: flex;
  flex-grow: 1;
  background-color: var(--ch-filter-bg);
}

.ch-map {
  width: 60%;
  /*height: 100%;*/
  display: flex;
  flex-grow: 1;
}

.ch-points-filter-container {
  width: 40%;
  padding: 15px 50px;
  flex-shrink: 0;
}

.ch-points-filter {
  display: flex;
  flex-direction: column;
  row-gap: 10px;
}

.ch-points-filter .ch-select__options {
  overflow-y: auto;
}

.ch-points-filter .ch-select--opened .ch-select__options {
  max-height: 300px;
}

.points-of-sale__message {
  margin-top: 20px;
}

.ch-cluster-circle {
  cursor: pointer;
  width: 35px;
  height: 35px;
  background-color: var(--ch-red);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ch-white);
  font-weight: bold;
  font-size: 14px;
}

.ch-points-filter .ch-select__selected-item {
  /*cursor: pointer;*/
  /*pointer-events: none;*/
  display: flex;
  flex-direction: column;
  row-gap: 1px;
}

.ch-points-filter .ch-select__selected-item .ch-text-grey {
  color: var(--ch-white);
}

@media (hover: hover) {
  .ch-points-filter .ch-select__selected-item .ch-underline-animate:hover {
    color: var(--ch-pagination-hover);
  }
  .ch-points-filter .ch-select__selected-item .ch-underline-animate:hover::after {
    width: 100%;
    color: var(--ch-pagination-hover);
  }
}

@media (hover: none) {
  .ch-points-filter .ch-select__selected-item .ch-underline-animate:active {
    color: var(--ch-pagination-hover);
  }
  .ch-points-filter .ch-select__selected-item .ch-underline-animate:active::after {
    width: 100%;
    color: var(--ch-pagination-hover);
  }
}

.ch-custom-scrollbar::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}

.ch-custom-scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--ch-red);
  transition: background-color .1s linear;
}

@media (hover: hover) {
  .ch-custom-scrollbar::-webkit-scrollbar-thumb:hover {
    cursor: pointer;
    background-color: var(--ch-red-hover);
  }
}

@media (hover: none) {
  .ch-custom-scrollbar::-webkit-scrollbar-thumb:active {
    cursor: pointer;
    background-color: var(--ch-red-hover);
  }
}

.ch-custom-scrollbar::-webkit-scrollbar-track {
  background: transparent;
}

.ch-points-filter .ch-button {
  display: none;
}