/* ============================================================
   xl-sidebar.css — левое меню каталога по макету
   ============================================================ */

:root {
  --xl-side-accent: #ff6a00;
  --xl-side-text: #171513;
  --xl-side-muted: #6f6a64;
  --xl-side-line: #eadfd3;
  --xl-side-bg: #fff;
  --xl-side-soft: #f7f2ea;
  --xl-side-radius: 16px;
}

/* старые длинные блоки фильтров скрываем — они внутри нового меню */
html.xl-redesign #left #boxHolidays,
html.xl-redesign #left #boxPrices,
html.xl-redesign #left #boxZalp,
body.xl-redesign #left #boxHolidays,
body.xl-redesign #left #boxPrices,
body.xl-redesign #left #boxZalp,
.xl-redesign #left #boxHolidays,
.xl-redesign #left #boxPrices,
.xl-redesign #left #boxZalp,
#left #boxHolidays,
#left #boxPrices,
#left #boxZalp {
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  visibility: hidden !important;
}

#left #boxCategories.xl-side,
#left .xl-side,
body.xl-redesign #left #boxCategories.xl-side,
body.xl-redesign #left .xl-side {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  margin: 0 0 16px !important;
  padding: 14px 10px 14px 8px !important;
  background: var(--xl-side-bg) !important;
  border: 1px solid var(--xl-side-line) !important;
  border-radius: var(--xl-side-radius) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

#left .xl-side__filters,
body.xl-redesign .xl-side__filters {
  display: grid !important;
  gap: 2px !important;
  margin: 0 0 12px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--xl-side-line) !important;
}

/* выпадающие блоки — скрыты, пока нет .is-open */
#left .xl-side__drop,
body.xl-redesign .xl-side__drop,
.xl-side__drop[hidden] {
  display: none !important;
}
#left .xl-side__drop.is-open,
body.xl-redesign .xl-side__drop.is-open {
  display: block !important;
  margin: 0 0 6px !important;
  padding: 4px 0 6px 8px !important;
  border-left: 2px solid rgba(255, 106, 0, 0.35) !important;
}

#left .xl-side__filter,
#left .xl-side__cat,
#left .xl-side__list a,
body.xl-redesign .xl-side__filter,
body.xl-redesign .xl-side__cat,
body.xl-redesign .xl-side__list a {
  display: grid !important;
  align-items: center !important;
  width: 100% !important;
  margin: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 12px !important;
  background: transparent !important;
  color: var(--xl-side-text) !important;
  text-decoration: none !important;
  text-align: left !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  font-family: inherit !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease !important;
}

#left .xl-side__filter,
body.xl-redesign .xl-side__filter {
  grid-template-columns: 22px 1fr 14px !important;
  gap: 10px !important;
  padding: 9px 8px 9px 2px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}
#left .xl-side__filter img:first-child,
#left .xl-side__cat > img:first-child,
#left .xl-side__list a > img:first-child,
body.xl-redesign .xl-side__filter img:first-child,
body.xl-redesign .xl-side__cat > img:first-child,
body.xl-redesign .xl-side__list a > img:first-child {
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
}
#left .xl-side__chev,
body.xl-redesign .xl-side__chev {
  width: 14px !important;
  height: 14px !important;
  opacity: 0.45 !important;
  justify-self: end !important;
  transition: transform .15s ease, opacity .15s ease !important;
}

/* активная ссылка фильтра */
#left .xl-side__filter.is-open,
#left .xl-side__cat.is-open,
body.xl-redesign .xl-side__filter.is-open,
body.xl-redesign .xl-side__cat.is-open {
  background: #fff7f2 !important;
  border-color: rgba(255, 106, 0, 0.45) !important;
  color: var(--xl-side-accent) !important;
  box-shadow: inset 3px 0 0 var(--xl-side-accent) !important;
}
#left .xl-side__filter.is-open .xl-side__chev,
#left .xl-side__cat.is-open .xl-side__chev,
body.xl-redesign .xl-side__filter.is-open .xl-side__chev,
body.xl-redesign .xl-side__cat.is-open .xl-side__chev {
  transform: rotate(90deg) !important;
  opacity: 0.9 !important;
}

#left .xl-side__filter:hover,
#left .xl-side__cat:hover,
#left .xl-side__list a:hover,
body.xl-redesign .xl-side__filter:hover,
body.xl-redesign .xl-side__cat:hover,
body.xl-redesign .xl-side__list a:hover {
  background: #fff7f2 !important;
  border-color: rgba(255, 106, 0, 0.28) !important;
  color: var(--xl-side-accent) !important;
}

body.xl-redesign .xl-side__label {
  margin: 0 0 8px !important;
  padding: 0 8px 0 2px !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: #9a928a !important;
}

body.xl-redesign .xl-side__cats {
  display: grid !important;
  gap: 2px !important;
  margin: 0 0 12px !important;
}

body.xl-redesign .xl-side__cat {
  grid-template-columns: 24px 1fr 14px !important;
  gap: 10px !important;
  padding: 8px 8px 8px 2px !important;
  font-size: 14px !important;
  font-weight: 650 !important;
}
body.xl-redesign .xl-side__cat--primary {
  padding: 10px 8px 10px 2px !important;
}
body.xl-redesign .xl-side__cat--primary > img:first-child {
  width: 24px !important;
  height: 24px !important;
}
body.xl-redesign .xl-side__cat-txt {
  display: grid !important;
  gap: 2px !important;
  min-width: 0 !important;
}
body.xl-redesign .xl-side__cat-txt strong {
  font-size: 14px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: inherit !important;
}
body.xl-redesign .xl-side__cat-txt em {
  font-style: normal !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--xl-side-muted) !important;
  line-height: 1.25 !important;
}
body.xl-redesign .xl-side__cat:hover .xl-side__cat-txt em {
  color: #b07a52 !important;
}

body.xl-redesign .xl-side__deal {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 14px 12px 12px !important;
  border-radius: 14px !important;
  background: #fff1ed !important;
  border: 1px solid #ffd4c2 !important;
  text-decoration: none !important;
  color: var(--xl-side-text) !important;
}
body.xl-redesign .xl-side__deal img {
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
}
body.xl-redesign .xl-side__deal strong {
  display: block !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  color: #c2410c !important;
}
body.xl-redesign .xl-side__deal em {
  display: block !important;
  font-style: normal !important;
  font-size: 11px !important;
  color: #9a6b52 !important;
}
body.xl-redesign .xl-side__deal:hover {
  background: #ffe8e0 !important;
}

body.xl-redesign .xl-side__list {
  display: grid !important;
  gap: 2px !important;
}
body.xl-redesign .xl-side__list a {
  grid-template-columns: 22px 1fr !important;
  gap: 10px !important;
  padding: 9px 8px 9px 2px !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}

/* шкала цены: 5 столбиков, заполнение растёт с уровнем */
body.xl-redesign .xl-side__list--price a {
  grid-template-columns: 22px 1fr !important;
}
body.xl-redesign .xl-side__meter {
  display: grid !important;
  grid-template-columns: repeat(5, 3px) !important;
  gap: 2px !important;
  align-items: end !important;
  justify-content: center !important;
  width: 22px !important;
  height: 16px !important;
}
body.xl-redesign .xl-side__meter i {
  display: block !important;
  width: 3px !important;
  margin: 0 !important;
  border-radius: 1.5px !important;
  background: #e8ddd0 !important;
}
body.xl-redesign .xl-side__meter i:nth-child(1) { height: 5px !important; }
body.xl-redesign .xl-side__meter i:nth-child(2) { height: 8px !important; }
body.xl-redesign .xl-side__meter i:nth-child(3) { height: 11px !important; }
body.xl-redesign .xl-side__meter i:nth-child(4) { height: 14px !important; }
body.xl-redesign .xl-side__meter i:nth-child(5) { height: 16px !important; }

body.xl-redesign .xl-side__list--price a[data-xl-price="1"] .xl-side__meter i:nth-child(-n+1),
body.xl-redesign .xl-side__list--price a[data-xl-price="2"] .xl-side__meter i:nth-child(-n+1),
body.xl-redesign .xl-side__list--price a[data-xl-price="3"] .xl-side__meter i:nth-child(-n+2),
body.xl-redesign .xl-side__list--price a[data-xl-price="4"] .xl-side__meter i:nth-child(-n+2),
body.xl-redesign .xl-side__list--price a[data-xl-price="5"] .xl-side__meter i:nth-child(-n+3),
body.xl-redesign .xl-side__list--price a[data-xl-price="6"] .xl-side__meter i:nth-child(-n+3),
body.xl-redesign .xl-side__list--price a[data-xl-price="7"] .xl-side__meter i:nth-child(-n+4),
body.xl-redesign .xl-side__list--price a[data-xl-price="8"] .xl-side__meter i:nth-child(-n+4),
body.xl-redesign .xl-side__list--price a[data-xl-price="9"] .xl-side__meter i:nth-child(-n+5),
body.xl-redesign .xl-side__list--price a[data-xl-price="10"] .xl-side__meter i:nth-child(-n+5),
body.xl-redesign .xl-side__list--price a[data-xl-price="11"] .xl-side__meter i:nth-child(-n+5) {
  background: var(--xl-side-accent) !important;
}
body.xl-redesign .xl-side__list--price a:hover .xl-side__meter i {
  background: #ffd4b8 !important;
}
body.xl-redesign .xl-side__list--price a[data-xl-price="1"]:hover .xl-side__meter i:nth-child(-n+1),
body.xl-redesign .xl-side__list--price a[data-xl-price="2"]:hover .xl-side__meter i:nth-child(-n+1),
body.xl-redesign .xl-side__list--price a[data-xl-price="3"]:hover .xl-side__meter i:nth-child(-n+2),
body.xl-redesign .xl-side__list--price a[data-xl-price="4"]:hover .xl-side__meter i:nth-child(-n+2),
body.xl-redesign .xl-side__list--price a[data-xl-price="5"]:hover .xl-side__meter i:nth-child(-n+3),
body.xl-redesign .xl-side__list--price a[data-xl-price="6"]:hover .xl-side__meter i:nth-child(-n+3),
body.xl-redesign .xl-side__list--price a[data-xl-price="7"]:hover .xl-side__meter i:nth-child(-n+4),
body.xl-redesign .xl-side__list--price a[data-xl-price="8"]:hover .xl-side__meter i:nth-child(-n+4),
body.xl-redesign .xl-side__list--price a[data-xl-price="9"]:hover .xl-side__meter i:nth-child(-n+5),
body.xl-redesign .xl-side__list--price a[data-xl-price="10"]:hover .xl-side__meter i:nth-child(-n+5),
body.xl-redesign .xl-side__list--price a[data-xl-price="11"]:hover .xl-side__meter i:nth-child(-n+5) {
  background: var(--xl-side-accent) !important;
}

/* убрать старые стили boxStyle на этом блоке */
body.xl-redesign #left #boxCategories.xl-side p.hD,
body.xl-redesign #left #boxCategories.xl-side #categoriesBoxMenu {
  display: none !important;
}

/* ---------- Статьи (левая колонка, компактно) ---------- */
#left #boxArticles.xl-articles,
body.xl-redesign #left #boxArticles.xl-articles,
td.one #boxArticles.xl-articles {
  display: block !important;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 1px solid var(--xl-side-line) !important;
  border-radius: var(--xl-side-radius) !important;
  background: #fff !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  float: none !important;
  filter: none !important;
}

#left #boxArticles.xl-articles > p.hD,
#left #boxArticles.xl-articles .hD {
  display: none !important;
}

.xl-articles__head,
body.xl-redesign #left #boxArticles.xl-articles > .xl-articles__head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 14px 16px 12px !important;
  box-sizing: border-box !important;
}

.xl-articles__ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  margin: 0 2px 0 0 !important;
  color: #ff6a00 !important;
}

.xl-articles__ico img {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 0 !important;
}

.xl-articles__title {
  display: block !important;
  margin: 0 !important;
  color: var(--xl-side-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

.xl-articles__list,
#boxArticlesContent.xl-articles__list,
body.xl-redesign #left #boxArticles.xl-articles > .xl-articles__list,
body.xl-redesign #left #boxArticlesContent.xl-articles__list {
  display: block !important;
  margin: 0 !important;
  padding: 2px 10px 6px !important;
  border: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

a.xl-articles__item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 0 !important;
  border-top: 1px solid #f0ebe3 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
  text-decoration: none !important;
  color: var(--xl-side-text) !important;
  transition: background .15s ease, color .15s ease !important;
}

a.xl-articles__item:first-child {
  border-top: 0 !important;
}

a.xl-articles__item:hover,
a.xl-articles__item.is-on {
  background: #fff8f2 !important;
  color: var(--xl-side-text) !important;
  text-decoration: none !important;
}

.xl-articles__bullet {
  display: none !important;
}

.xl-articles__name {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: inherit !important;
}

.xl-articles__meta {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  flex: 0 0 auto !important;
  margin-top: 1px !important;
}

.xl-articles__count {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 22px !important;
  height: 18px !important;
  padding: 0 6px !important;
  border-radius: 999px !important;
  background: #f3eee7 !important;
  color: #8a847c !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  flex: 0 0 auto !important;
}

.xl-articles__chev {
  display: block !important;
  width: 6px !important;
  height: 6px !important;
  margin: 0 1px 0 0 !important;
  border-right: 1.6px solid #c9c2b8 !important;
  border-bottom: 1.6px solid #c9c2b8 !important;
  transform: rotate(-45deg) !important;
  flex: 0 0 6px !important;
}

a.xl-articles__item:hover .xl-articles__chev {
  border-color: var(--xl-side-accent) !important;
}

a.xl-articles__all {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  border: 0 !important;
  border-top: 1px solid #f0ebe3 !important;
  background: transparent !important;
  color: var(--xl-side-accent) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
}

a.xl-articles__all:hover {
  color: #e85a00 !important;
  text-decoration: none !important;
  background: #fff8f2 !important;
}

.xl-articles__all-arrow {
  display: inline-block !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

/* ---------- Новые статьи (левая колонка, компактно) ---------- */
#left #boxArticlesNew.xl-anews,
body.xl-redesign #left #boxArticlesNew.xl-anews,
td.one #boxArticlesNew.xl-anews {
  display: block !important;
  width: 100% !important;
  margin: 0 0 12px !important;
  padding: 0 !important;
  border: 1px solid var(--xl-side-line) !important;
  border-radius: var(--xl-side-radius) !important;
  background: #fff !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  float: none !important;
  filter: none !important;
}

#left #boxArticlesNew.xl-anews > p.hD,
#left #boxArticlesNew.xl-anews .hD {
  display: none !important;
}

.xl-anews__head,
body.xl-redesign #left #boxArticlesNew.xl-anews > .xl-anews__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 14px 16px 12px !important;
  box-sizing: border-box !important;
}

.xl-anews__titlewrap {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.xl-anews__ico {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  flex: 0 0 22px !important;
  margin: 0 2px 0 0 !important;
  color: #ff6a00 !important;
}

.xl-anews__ico img {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  margin: 0 !important;
  border: 0 !important;
}

.xl-anews__title {
  display: block !important;
  margin: 0 !important;
  color: var(--xl-side-text) !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
}

a.xl-anews__top {
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--xl-side-accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

a.xl-anews__top:hover {
  color: #e85a00 !important;
  text-decoration: none !important;
}

.xl-anews__list,
#boxArticlesNewContent.xl-anews__list,
body.xl-redesign #left #boxArticlesNew.xl-anews > .xl-anews__list,
body.xl-redesign #left #boxArticlesNewContent.xl-anews__list {
  display: block !important;
  margin: 0 !important;
  padding: 4px 16px 12px !important;
  border: 0 !important;
  background: transparent !important;
  box-sizing: border-box !important;
}

.xl-anews__item {
  display: block !important;
  margin: 0 !important;
  padding: 12px 0 !important;
  border: 0 !important;
  border-top: 1px solid #f0ebe3 !important;
  background: transparent !important;
}

.xl-anews__item:first-child {
  border-top: 0 !important;
  padding-top: 4px !important;
}

a.xl-anews__name {
  display: block !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  color: var(--xl-side-text) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}

a.xl-anews__name:hover {
  color: var(--xl-side-accent) !important;
  text-decoration: none !important;
}

.xl-anews__bullet,
.xl-anews__name-text {
  display: none !important;
}

.xl-anews__excerpt {
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  margin: 0 0 6px !important;
  padding: 0 !important;
  color: #6f6a64 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
}

a.xl-anews__more {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--xl-side-accent) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

a.xl-anews__more:hover {
  color: #e85a00 !important;
  text-decoration: none !important;
}

a.xl-anews__foot {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  border: 0 !important;
  border-top: 1px solid #f0ebe3 !important;
  background: #fef2eb !important;
  color: var(--xl-side-accent) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  text-decoration: none !important;
  text-align: center !important;
}

a.xl-anews__foot:hover {
  color: #e85a00 !important;
  text-decoration: none !important;
  background: #ffe8da !important;
}