/* Каркас сайта по макету редизайна: бегущая строка, шапка, полоса меню.
   [2026-09-13] v1 — значения взяты из макета «Карточка товара.dc.html».
   Пока применяется только на широких экранах: мобильная шапка темы остаётся
   рабочей до отдельного мобильного захода. */

/* ------------------------------------------------------------------
   Шрифт и контейнер: общие для всех экранов.
   ------------------------------------------------------------------ */

/* Шрифт темы прописан с !important (Cabin, Arimo, Helvetica), поэтому Rubik
   приходится ставить так же жёстко. Иконочные шрифты не трогаем: они висят
   на псевдоэлементах и на тегах <i>, их исключаем. */
body.dm-frame-on,
body.dm-frame-on *:not(i):not([class*="fa-"]):not([class*="icon"]):not([class*="Icon"]) {
  font-family: Rubik, system-ui, "Segoe UI", Arial, sans-serif !important;
}

body.dm-frame-on {
  font-size: 15px;
  line-height: 1.5;
  color: #1C2529;
}


/* Фон страницы по дизайн-системе: #F7F6F3, а карточки и блоки белые. */
body.dm-frame-on {
  background: #F7F6F3 !important;
}

body.dm-frame-on #content,
body.dm-frame-on .site-wrapper {
  background: transparent;
}

/* В теме стоит правило «все ссылки 12 px», из-за него текст мельчал.
   А на наведении тема меняла шрифт, вес и размер, отчего всё прыгало. */
body.dm-frame-on a {
  /* [2026-09-14] размер ссылки всегда равен размеру текста вокруг неё,
     и в обычном состоянии, и на наведении: тема ставила ссылкам 12 px,
     а на наведении другой размер, отчего строки дёргались.
     Если ссылке нужен свой размер, он пишется с !important. */
  font-size: inherit !important;
}

/* [2026-09-14] Правило без исключений: при наведении у ссылки и кнопки
   меняются только цвет, фон и рамка. Размер, вес, семейство, межбуквенное
   расстояние и регистр остаются теми же — иначе текст дёргается.
   Если элементу нужен свой размер или вес, он прописывается сразу для
   трёх состояний: обычное, :hover и :focus. Проверяется скриптом
   hover-sweep.mjs: он включает наведение принудительно и сверяет числа. */
body.dm-frame-on a:hover,
body.dm-frame-on a:focus,
body.dm-frame-on a:active,
body.dm-frame-on .btn:hover,
body.dm-frame-on .btn:focus,
body.dm-frame-on button:hover,
body.dm-frame-on button:focus {
  font-size: inherit !important;
  letter-spacing: inherit !important;
  transform: none !important;
  font-family: Rubik, system-ui, "Segoe UI", Arial, sans-serif !important;
}

/* вес кнопок и наших ссылок держим постоянным: тема сбрасывала его на наведении */
body.dm-frame-on .btn,
body.dm-frame-on .btn:hover,
body.dm-frame-on .btn:focus,
body.dm-frame-on button,
body.dm-frame-on button:hover,
body.dm-frame-on button:focus {
  font-weight: 500 !important;
}

/* [2026-09-13] ссылки и чипы карточки: на наведении только цвет и рамка.
   Тема сбрасывала вес на 400, из-за чего строка бренда дёргалась. */
body.dm-frame-on a.dm-meta-brand,
body.dm-frame-on a.dm-meta-brand:hover,
body.dm-frame-on a.dm-meta-brand:focus {
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}

body.dm-frame-on .dm-collection,
body.dm-frame-on .dm-collection,
body.dm-frame-on .dm-collection:hover,
body.dm-frame-on .dm-collection:focus,
body.dm-frame-on .dm-tab,
body.dm-frame-on .dm-tab:hover,
body.dm-frame-on .dm-tab:focus {
  /* вкладки всегда одного веса и размера: активную отличаем цветом и
     подчёркиванием, иначе полоска дёргается и на наведении, и на клике */
  font-size: 17px !important;
  font-weight: 500 !important;
}

/* [2026-09-14] плитки каталога: у темы правило на наведение специфичнее
   общего, поэтому семейство и вес держим отдельно и для трёх состояний */
body.dm-frame-on .product-thumb a,
body.dm-frame-on .product-thumb a:hover,
body.dm-frame-on .product-thumb a:focus,
body.dm-frame-on .product-thumb .btn,
body.dm-frame-on .product-thumb .btn:hover,
body.dm-frame-on .product-thumb .btn:focus,
/* у темы селектор из шести классов, поэтому класс повторён: так правило
   весомее, а читается всё так же — это те же кнопки плитки */
body.dm-frame-on .product-thumb .btn.btn.btn:hover,
body.dm-frame-on .product-thumb .btn.btn.btn:focus {
  font-family: Rubik, system-ui, "Segoe UI", Arial, sans-serif !important;
}

/* вкладки блоков под карточкой: вес одинаковый в покое и на наведении,
   выделяется только активная */
body.dm-frame-on .module-products .nav-tabs > li > a,
body.dm-frame-on .module-products .nav-tabs > li > a:hover,
body.dm-frame-on .module-products .nav-tabs > li > a:focus {
  font-weight: 400 !important;
}

body.dm-frame-on .module-products .nav-tabs > li.active > a,
body.dm-frame-on .module-products .nav-tabs > li.active > a:hover,
body.dm-frame-on .module-products .nav-tabs > li.active > a:focus {
  font-weight: 700 !important;
}

body.dm-frame-on a.dm-wa-cat,
body.dm-frame-on a.dm-wa-cat:hover,
body.dm-frame-on a.dm-wa-cat:focus {
  font-weight: 700 !important;
}

body.dm-frame-on .dm-cart,
body.dm-frame-on .dm-cart:hover,
body.dm-frame-on .dm-phone-number,
body.dm-frame-on .dm-menu-all,
body.dm-frame-on .dm-menu-all:hover {
  font-weight: 500 !important;
}

/* Кнопки WhatsApp и «Позвонить»: на наведении меняется только цвет.
   Ни жирность, ни размер не трогаем, иначе кнопка дёргается. */
body.dm-frame-on .dm-wa,
body.dm-frame-on .dm-wa:hover,
body.dm-frame-on .dm-wa:focus,
body.dm-frame-on a.dm-act-wa,
body.dm-frame-on a.dm-act-wa:hover,
body.dm-frame-on a.dm-act-wa:focus,
body.dm-frame-on a.dm-act-call,
body.dm-frame-on a.dm-act-call:hover,
body.dm-frame-on a.dm-act-call:focus {
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: normal !important;
}

body.dm-frame-on .dm-wa,
body.dm-frame-on a.dm-act-wa {
  color: #FFFFFF !important;
}

body.dm-frame-on .dm-wa:hover,
body.dm-frame-on a.dm-act-wa:hover {
  background: #1FB955 !important;
  border-color: #1FB955 !important;
  color: #FFFFFF !important;
}

body.dm-frame-on a.dm-act-call:hover {
  background: #F7F6F3 !important;
  border-color: #0F4E5B !important;
  color: #0F4E5B !important;
}

/* В теме 46 правил вида «при наведении сделать шрифт 12 или 14 px».
   Из-за них прыгало всё: кнопки, названия товаров, фильтры, опции.
   Задаём этим местам постоянный размер в обоих состояниях. */
body.dm-frame-on .btn,
body.dm-frame-on .btn:hover,
body.dm-frame-on .btn:focus,
body.dm-frame-on .product-thumb .name a,
body.dm-frame-on .product-thumb .name a:hover,
body.dm-frame-on .refine-item a .refine-name,
body.dm-frame-on .refine-item a:hover .refine-name,
body.dm-frame-on .product-options .option-value,
body.dm-frame-on .product-options .option-value:hover {
  font-size: 15px !important;
}

body.dm-frame-on .product-info .product-manufacturer a,
body.dm-frame-on .product-info .product-manufacturer a:hover,
body.dm-frame-on .category-description a,
body.dm-frame-on .category-description a:hover {
  font-size: inherit !important;
}

/* переключатель языков: активный всегда полужирный, остальные всегда обычные */
body.dm-frame-on .dm-langs a,
body.dm-frame-on .dm-langs a:hover,
body.dm-frame-on .dm-langs a:focus {
  font-weight: 400 !important;
}

body.dm-frame-on .dm-langs a.dm-lang-active,
body.dm-frame-on .dm-langs a.dm-lang-active:hover {
  font-weight: 500 !important;
}

/* Кнопка «В корзину»: у темы на наведении прописаны Helvetica, вес 400 и красный
   текст, причём очень весомыми селекторами. Держим её вид постоянным. */
body.dm-frame-on .product-info .button-group-page .btn-cart.btn,
body.dm-frame-on .product-info .button-group-page .btn-cart.btn:hover,
body.dm-frame-on .main-products.product-grid .product-thumb .btn-cart.btn,
body.dm-frame-on .main-products.product-grid .product-thumb .btn-cart.btn:hover,
body.dm-frame-on .side-product .btn-cart.btn,
body.dm-frame-on .side-product .btn-cart.btn:hover {
  font-family: Rubik, system-ui, "Segoe UI", Arial, sans-serif !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  color: #FFFFFF !important;
  background: #146678 !important;
  border-color: #146678 !important;
}

body.dm-frame-on .product-info .button-group-page .btn-cart.btn:hover,
body.dm-frame-on .main-products.product-grid .product-thumb .btn-cart.btn:hover,
body.dm-frame-on .side-product .btn-cart.btn:hover {
  background: #0F4E5B !important;
  border-color: #0F4E5B !important;
}

/* В макете холст 1440 с полями 60, рабочая ширина 1320.
   На узких мониторах поля сжимаются, но содержимое не липнет к краям. */
body.dm-frame-on .container {
  width: auto;
  max-width: 1320px;
  padding-inline: clamp(16px, 3vw, 40px);
}

@media (min-width: 768px) {

  /* старая шапка темы уходит, вместо неё наша */
  body.dm-frame-on header.header-1,
  body.dm-frame-on header[class^="header-"],
  body.dm-frame-on .header-fixed-placeholder {
    display: none !important;
  }

  .dm-frame {
    background: #F7F6F3;
  }

  /* бегущая строка */
  .dm-ticker {
    background: #146678;
    height: 40px;
    overflow: hidden;
    display: flex;
    align-items: center;
  }

  .dm-ticker-track {
    display: flex;
    width: max-content;
    animation: dmMarquee 46s linear infinite;
    will-change: transform;
  }

  .dm-ticker-line {
    display: flex;
    align-items: center;
    gap: 32px;
    padding-inline-end: 32px;
    font-size: 15px;
    color: #FFFFFF;
    white-space: nowrap;
  }

  .dm-ticker-dot {
    width: 6px;
    height: 6px;
    background: #7FD3A0;
    transform: rotate(45deg);
    display: inline-block;
  }

  @keyframes dmMarquee {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }

  [dir="rtl"] .dm-ticker-track {
    animation-name: dmMarqueeRtl;
  }

  @keyframes dmMarqueeRtl {
    from { transform: translateX(-50%); }
    to   { transform: translateX(0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .dm-ticker-track { animation: none; }
  }

  /* шапка */
  .dm-head {
    background: #FFFFFF;
    min-height: 84px;
    display: flex;
    align-items: center;
    gap: clamp(16px, 2vw, 32px);
    padding-inline: clamp(16px, 3vw, 60px);
    border-bottom: 1px solid #E3E8EC;
  }

  .dm-logo img {
    height: 46px;
    width: auto;
    display: block;
  }

  .dm-search {
    flex: 1;
    display: flex;
    height: 44px;
    border: 1px solid #E3E8EC;
    border-radius: 8px;
    overflow: hidden;
    max-width: 520px;
    margin: 0;
  }

  .dm-search input {
    flex: 1;
    border: 0;
    outline: 0;
    padding: 0 16px;
    font-size: 15px;
    color: #1C2529;
    background: #FFFFFF;
  }

  .dm-search input::placeholder {
    color: #5C6A72;
  }

  .dm-search button {
    width: 52px;
    background: #146678;
    border: 0;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }

  .dm-search button:hover {
    background: #0F4E5B;
  }

  .dm-head-side {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-inline-start: auto;
  }

  .dm-phone {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #146678;
    text-decoration: none;
  }

  .dm-phone > span {
    display: flex;
    flex-direction: column;
    line-height: 1.2;
  }

  .dm-phone-label {
    font-size: 13px;
    color: #5C6A72;
  }

  .dm-phone-number {
    font-size: 17px;
    font-weight: 600;
  }

  .dm-wa {
    height: 44px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 18px;
    background: #25D366;
    color: #FFFFFF;
    font-size: 15px;
    font-weight: 500;
    border-radius: 8px;
    text-decoration: none;
  }

  .dm-wa:hover {
    background: #1FB955;
    color: #FFFFFF;
  }

  .dm-head-ico {
    color: #5C6A72;
    display: flex;
  }

  .dm-head-ico:hover {
    color: #146678;
  }

  .dm-cart {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 15px;
    font-weight: 500;
    color: #146678;
    text-decoration: none;
  }

  .dm-langs {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    color: #5C6A72;
  }

  .dm-langs a {
    color: #5C6A72;
    text-decoration: none;
  }

  .dm-langs a + a::before {
    content: "/";
    margin-inline-end: 6px;
    color: #E3E8EC;
  }

  .dm-lang-active {
    color: #146678 !important;
    font-weight: 500;
  }

  /* полоса меню */
  .dm-menu {
    position: relative;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    gap: clamp(12px, 1.6vw, 24px);
    padding-inline: clamp(16px, 3vw, 60px);
    min-height: 56px;
    border-bottom: 1px solid #E3E8EC;
  }

  .dm-menu-all {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 16px;
    background: #146678;
    color: #FFFFFF;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
  }

  .dm-menu-all:hover {
    background: #0F4E5B;
    color: #FFFFFF;
  }

  .dm-menu-item {
    font-size: 15px;
    color: #1C2529;
    text-decoration: none;
  }

  .dm-menu-item:hover {
    color: #146678;
  }

  /* раздел, на котором мы сейчас стоим: цветом и весом, остальные тонкие */
  .dm-menu-item.dm-menu-active,
  .dm-menu-item.dm-menu-active:hover {
    color: #146678;
    font-weight: 500;
  }

  /* выпадающий каталог */
  .dm-menu-drop {
    /* панель растягивается на всю полосу меню, поэтому точкой отсчёта
       служит сама полоса, а не кнопка */
    position: static;
  }

  button.dm-menu-all {
    border: 0;
    cursor: pointer;
    font-family: inherit;
  }

  /* Панель каталога по макету «Общие модули»: три столбца в одном слое.
     [2026-09-14] разделы 280, подразделы 300, коллекции — остаток. */
  .dm-catalog {
    position: absolute;
    inset-inline-start: 0;
    inset-inline-end: 0;
    top: calc(100% + 8px);
    z-index: 60;
    background: #FFFFFF;
    border: 1px solid #E3E8EC;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
  }

  .dm-catalog[hidden] {
    display: none;
  }

  .dm-cat-cols {
    display: grid;
    grid-template-columns: 280px 300px minmax(0, 1fr);
    min-height: 420px;
  }

  .dm-cat-sections {
    border-inline-end: 1px solid #E3E8EC;
    padding: 12px 0;
    max-height: 540px;
    overflow-y: auto;
  }

  body.dm-frame-on .dm-cat-section {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 20px;
    /* ссылки у нас наследуют размер окружающего текста, поэтому здесь
       размер задаётся явно */
    font-size: 17px !important;
    color: #1C2529;
    text-decoration: none;
  }

  .dm-cat-section .dm-ico {
    color: #5C6A72;
    flex: 0 0 auto;
  }

  .dm-cat-section span {
    flex: 1;
  }

  .dm-cat-section .dm-ico:last-child {
    color: #C3CCD2;
  }

  .dm-cat-section.dm-cat-on,
  .dm-cat-section:hover {
    background: #EAF0F1;
    color: #146678;
  }

  .dm-cat-section.dm-cat-on .dm-ico,
  .dm-cat-section:hover .dm-ico {
    color: #146678;
  }

  .dm-cat-subs {
    border-inline-end: 1px solid #E3E8EC;
    padding: 20px;
    max-height: 540px;
    overflow-y: auto;
  }

  .dm-cat-colls {
    padding: 20px 24px;
  }

  .dm-cat-cap {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #5C6A72;
  }

  .dm-cat-cap a {
    font-size: 15px;
    letter-spacing: normal;
    text-transform: none;
    color: #146678;
    text-decoration: none;
    white-space: nowrap;
  }

  .dm-cat-list {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }

  body.dm-frame-on .dm-cat-sub {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 12px;
    border-radius: 8px;
    font-size: 17px !important;
    color: #1C2529;
    text-decoration: none;
  }

  .dm-cat-sub span:first-child {
    flex: 1;
  }

  .dm-cat-sub.dm-cat-on,
  .dm-cat-sub:hover {
    background: #EAF0F1;
    color: #146678;
  }

  .dm-cat-small {
    font-size: 13px;
    color: #5C6A72;
  }

  body.dm-frame-on .dm-cat-more,
  body.dm-frame-on .dm-cat-more:hover,
  body.dm-frame-on .dm-cat-more:focus {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 12px;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: normal !important;
    color: #146678;
    text-decoration: none;
  }

  /* место под значок у подразделов без вложенности: строки не съезжают */
  .dm-cat-pad {
    width: 16px;
    flex: 0 0 16px;
  }

  .dm-cat-sub .dm-ico {
    color: #C3CCD2;
    flex: 0 0 auto;
  }

  .dm-cat-sub.dm-cat-on .dm-ico,
  .dm-cat-sub:hover .dm-ico {
    color: #146678;
  }

  /* Размер и вес в панели одинаковые в покое и на наведении.
     Общее правило делает ссылке размер окружающего текста, поэтому
     каждое место, где размер свой, перечисляет три состояния. */
  body.dm-frame-on .dm-cat-section,
  body.dm-frame-on .dm-cat-section:hover,
  body.dm-frame-on .dm-cat-section:focus,
  body.dm-frame-on .dm-cat-sub,
  body.dm-frame-on .dm-cat-sub:hover,
  body.dm-frame-on .dm-cat-sub:focus {
    font-size: 17px !important;
    font-weight: 400 !important;
    letter-spacing: normal !important;
  }

  body.dm-frame-on .dm-cat-cap a,
  body.dm-frame-on .dm-cat-cap a:hover,
  body.dm-frame-on .dm-cat-cap a:focus {
    font-size: 15px !important;
    font-weight: 400 !important;
    /* у заголовка столбца разрядка, ссылка её не берёт ни в покое, ни на наведении */
    letter-spacing: normal !important;
    text-transform: none !important;
  }

  body.dm-frame-on .dm-cat-card,
  body.dm-frame-on .dm-cat-card:hover,
  body.dm-frame-on .dm-cat-card:focus {
    font-size: 15px !important;
  }

  body.dm-frame-on .dm-cat-card .dm-cat-name {
    font-size: 15px !important;
    font-weight: 500 !important;
  }

  body.dm-frame-on .dm-menu-item,
  body.dm-frame-on .dm-menu-item:hover,
  body.dm-frame-on .dm-menu-item:focus {
    font-size: 15px !important;
    letter-spacing: normal !important;
  }

  .dm-cat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
  }

  .dm-cat-card {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: #1C2529;
    text-decoration: none;
  }

  .dm-cat-pic {
    display: block;
    height: 104px;
    border-radius: 8px;
    overflow: hidden;
    background: #F7F6F3;
  }

  .dm-cat-pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .dm-cat-name {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.3;
  }

  .dm-cat-card:hover .dm-cat-name {
    color: #146678;
  }

  .dm-cat-note {
    /* отступ по бокам как у полосы меню, иначе текст липнет к краю плашки */
    padding: 16px clamp(16px, 3vw, 60px);
    border-top: 1px solid #E3E8EC;
    background: #F7F6F3;
    font-size: 13px;
    color: #5C6A72;
  }

  @media (max-width: 1279px) {
    .dm-cat-cols {
      grid-template-columns: 260px 260px minmax(0, 1fr);
    }

    .dm-cat-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }

  /* счётчик корзины */
  .dm-cart {
    position: relative;
  }

  .dm-cart-count {
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 10px;
    background: #C9463B;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .dm-cart-count.dm-cart-empty {
    background: #E3E8EC;
    color: #5C6A72;
  }
}

/* ------------------------------------------------------------------
   Страница товара: сетка макета.
   В макете правой колонки категорий нет, контент во всю ширину,
   слева галерея 704, справа липкая колонка с ценой и покупкой.
   ------------------------------------------------------------------ */

@media (min-width: 992px) {

  body.dm-frame-on[class*="product-product"] #column-right {
    display: none;
  }

  /* тема держит запас 240 px под колонку категорий, а её больше нет */
  body.dm-frame-on[class*="product-product"] #content.col-sm-9 {
    width: 100%;
    max-width: none;
    float: none;
    padding-inline-end: 0;
  }

  /* На узком мониторе галерея не должна давить колонку покупки:
     до 1320 обе тянутся, дальше галерея встаёт ровно на 704, как в макете. */
  body.dm-frame-on[class*="product-product"] .product-info {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(380px, 560px);
    gap: clamp(24px, 3vw, 48px);
    align-items: start;
  }

  @media (min-width: 1320px) {
    body.dm-frame-on[class*="product-product"] .product-info {
      /* галерее меньше половины ширины: информации о товаре нужно больше места */
      grid-template-columns: minmax(0, 560px) minmax(0, 1fr);
    }
  }

  body.dm-frame-on[class*="product-product"] .product-info > .product-left,
  body.dm-frame-on[class*="product-product"] .product-info > .product-right {
    width: 100%;
    max-width: none;
    float: none;
    padding: 0;
  }

  /* При прокрутке на месте остаётся галерея: информации о товаре обычно
     больше, поэтому едет именно она, а снимок всё время перед глазами. */
  body.dm-frame-on[class*="product-product"] .product-info > .product-left {
    position: sticky;
    top: 16px;
  }

  body.dm-frame-on[class*="product-product"] .product-info > .product-right {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  /* [2026-09-13] галерея: белая карточка только вокруг самого снимка,
     иначе выходила плашка в плашке. Стили в dm-redesign.css. */
  body.dm-frame-on[class*="product-product"] .product-image {
    border: 0;
    background: transparent;
    padding: 0;
  }
}

/* ==================================================================
   [2026-09-27] Шапка на телефоне по мобильному макету: бегущая строка,
   строка с меню, логотипом, звонком и корзиной, под ней поиск и язык.
   Раньше здесь стояла шапка темы — она и была «не тот дизайн».
   ================================================================== */

@media (max-width: 767px) {
  .dm-frame { background: #FFFFFF; }

  /* шапку темы убираем: теперь наша работает на всех экранах */
  body.dm-frame-on header[class^="header-"],
  body.dm-frame-on .header-fixed-placeholder { display: none !important; }

  .dm-ticker {
    height: 36px;
    background: #146678;
    overflow: hidden;
  }

  .dm-ticker-line { font-size: 13px; }

  /* первая строка: меню, логотип, звонок, корзина */
  .dm-head {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 56px;
    padding-inline: 16px;
    border-bottom: 1px solid #E3E8EC;
    background: #FFFFFF;
  }

  /* [2026-09-27] Логотип и кнопки крупнее: на телефоне прежние 32 px и
     44 px читались мелко (просьба Светланы). */
  .dm-logo img { height: 40px; width: auto; }

  .dm-head { min-height: 64px; height: auto; }

  /* поиск уводим во вторую строку */
  .dm-head .dm-search {
    order: 5;
    flex: 1 0 100%;
    height: 44px;
    margin: 0;
  }

  .dm-head-side {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-inline-start: auto;
  }

  /* телефон и WhatsApp в шапке значками, подписи не нужны */
  .dm-head-side .dm-phone span,
  .dm-head-side .dm-wa { display: none !important; }

  .dm-head-side .dm-phone,
  .dm-head-side .dm-head-ico,
  .dm-head-side .dm-searchbtn,
  .dm-head-side .dm-cart {
    width: 48px;
    height: 48px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #146678;
  }

  /* личный кабинет и избранное на телефоне не показываем: место нужно
     лупе, звонку, корзине и языку */
  .dm-head-side .dm-head-ico { display: none !important; }

  .dm-head-side .dm-searchbtn {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: none;
    padding: 0;
    color: #146678;
  }

  /* языки: показываем текущий флажок, по нажатию — все три */
  /* [2026-09-27] Языки: в шапке виден текущий флажок, по нажатию под ним
     ровным столбиком выпадают остальные. Список абсолютный — шапка не
     растягивается и логотип не сплющивается. */
  .dm-head-side .dm-langs {
    position: relative;
    display: flex !important;
    align-items: center;
    width: 44px;
    height: 48px;
    margin-inline-start: 2px;
  }

  .dm-head-side .dm-langs a {
    display: none;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
  }

  .dm-head-side .dm-langs a.dm-lang-active { display: flex; }

  /* [2026-09-27] Сам переключатель остаётся в строке шириной 44 px, иначе
     при открытии логотип прыгал. Выпадают только другие языки — их
     раскладывает скрипт, потому что активный может быть любым по счёту. */
  .dm-head-side .dm-langs.dm-langs-open a:not(.dm-lang-active) {
    display: flex;
    position: absolute;
    inset-inline-end: 0;
    z-index: 5200;
    width: 44px;
    height: 44px;
    border: 1px solid #E3E8EC;
    border-radius: 10px;
    background: #FFFFFF;
    box-shadow: 0 6px 18px rgba(28, 37, 41, .14);
  }

  .dm-head-side .dm-langs a span { display: none; }

  .dm-head-side .dm-langs svg { width: 26px; height: 18px; }

  .dm-head-side .dm-cart > span:not(.dm-cart-count),
  .dm-head-side .dm-cart-sum { display: none !important; }

  .dm-head-side .dm-cart { position: relative; }

  .dm-head-side .dm-cart .dm-cart-count {
    position: absolute;
    top: 6px;
    inset-inline-end: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 8px;
    background: #C9463B;
    color: #FFFFFF;
    font-size: 11px;
    font-weight: 500;
    line-height: 16px;
    text-align: center;
  }

  .dm-head-side .dm-cart .dm-cart-count.dm-cart-empty { display: none; }

  /* языки — одним квадратом рядом с поиском */
  .dm-head-side .dm-langs { display: none; }

  /* вторая строка: поиск и язык */
  /* [2026-09-27] «hidden» на строке поиска перебивался нашим display:flex —
     строка стояла раскрытой с самого начала. */
  .dm-mobsearch[hidden] { display: none !important; }

  .dm-mobsearch {
    display: flex;
    gap: 8px;
    padding: 8px 16px 12px;
    border-bottom: 1px solid #E3E8EC;
    background: #FFFFFF;
  }

  .dm-mobsearch form.dm-search {
    /* поле во всю ширину строки: у темы стоит предел в 520 px, на телефоне
       из-за него поле занимало половину */
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
    height: 48px;
    margin: 0;
    border: 1px solid #E3E8EC;
    border-radius: 8px;
    background: #FFFFFF;
  }

  .dm-mobsearch .dm-lang-btn {
    flex: none;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #E3E8EC;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    color: #1C2529 !important;
    text-decoration: none !important;
    background: #FFFFFF;
  }

  /* кнопка меню слева от логотипа */
  .dm-burger {
    width: 48px;
    height: 48px;
    margin-inline-start: -10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: none;
    color: #1C2529;
    padding: 0;
  }

  /* полоса разделов и панель каталога на телефоне не нужны:
     разделы открываются шторкой по кнопке меню */
  .dm-menu { display: none !important; }
}

/* Слева на экране висит кнопка доступности (занимает 65 px). На узком мониторе
   контент упирается в неё, поэтому добавляем зазор, который тает по мере того,
   как центрирование само даёт поля. Отступ физический: кнопка всегда слева. */
@media (min-width: 768px) {
  body.dm-frame-on .container {
    padding-left: max(clamp(16px, 3vw, 40px), calc(84px - max(0px, (100vw - 1320px) / 2)));
  }
}

/* [2026-09-15] Окошко корзины из шапки темы под нашей кнопкой. */
@media (min-width: 768px) {
  body.dm-frame-on .dm-cart-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
  }

  body.dm-frame-on .dm-cart-wrap .desktop-cart-wrapper {
    display: block !important;
    position: static !important;
    width: 0;
    height: 0;
  }

  /* [2026-09-16] Кнопка темы полностью убрана из-под курсора: невидимая
     накладка перехватывала соседние ссылки, в том числе языки.
     Окно открывает наша кнопка, скрипт добавляет обёртке класс open. */
  body.dm-frame-on .dm-cart-wrap .cart-heading {
    position: absolute !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
  }


  /* [2026-09-15] Прятать содержимое обёртки по структуре нельзя: окно
     лежит внутри одного из этих узлов и пропадало вместе с ними.
     Гасим только видимые части кнопки темы. */
  body.dm-frame-on .dm-cart-wrap .desktop-cart-wrapper,
  body.dm-frame-on .dm-cart-wrap .desktop-cart-wrapper *:not(.cart-content):not(.cart-content *),
  body.dm-frame-on .dm-cart-wrap .cart-heading,
  body.dm-frame-on .dm-cart-wrap .cart-heading * {
    color: transparent !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
  }

  body.dm-frame-on .dm-cart-wrap .cart-content {
    position: absolute !important;
    /* без зазора: на разрыве курсор терял кнопку и окно моргало.
       Воздух даёт внутренний отступ, он же держит наведение */
    top: 100% !important;
    padding-top: 10px !important;
    background-clip: padding-box;
    inset-inline-end: 0 !important;
    inset-inline-start: auto !important;
    z-index: 80;
    min-width: 340px;
    border: 1px solid #E3E8EC;
    border-radius: 14px;
    background: #FFFFFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .06);
  }
}

@media (min-width: 768px) {
  body.dm-frame-on .dm-cart-wrap .desktop-cart-wrapper .cart-content {
    display: none;
  }

  body.dm-frame-on .dm-cart-wrap .desktop-cart-wrapper.open .cart-content {
    display: block !important;
  }
}

/* ==================================================================
   [2026-09-25] Панель каталога отступает от краёв экрана: слева на неё
   налезал значок доступности (он висит на 15-65 px и ставит себя поверх
   всего), справа отступ ради симметрии. Карточки коллекций тянутся долями,
   поэтому сжимаются сами.
   ================================================================== */

@media (min-width: 992px) {
  body.dm-frame-on .dm-catalog {
    inset-inline-start: 76px;
    inset-inline-end: 76px;
  }
}

  /* [2026-09-26] подпись группы разделов в панели каталога */
  .dm-cat-group {
    padding: 14px 20px 6px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #9AA7AE;
  }

  .dm-cat-sections .dm-cat-group:first-child { padding-top: 6px; }

  /* [2026-09-26] «Системы очистки воды» в быстром меню — голубым: это не
     мебель, а отдельное направление, и по просьбе Светланы оно должно
     бросаться в глаза */
  body.dm-frame-on .dm-menu-item.dm-menu-water,
  body.dm-frame-on .dm-menu-item.dm-menu-water:hover,
  body.dm-frame-on .dm-menu-item.dm-menu-water:focus {
    color: #1C8FB5 !important;
  }

  body.dm-frame-on .dm-menu-item.dm-menu-water:hover {
    color: #14708F !important;
  }

  /* [2026-09-26] вес как у остальных пунктов: полужирный только там, где
     мы сейчас находимся (просьба Светланы) */
  body.dm-frame-on .dm-menu-item.dm-menu-water.dm-menu-active,
  body.dm-frame-on .dm-menu-item.dm-menu-water.dm-menu-active:hover {
    font-weight: 500;
  }


/* ==================================================================
   [2026-09-26] Липкая полоса меню.
   Шапка с логотипом и поиском высокая: при прокрутке она уезжает, а
   сверху остаётся полоса разделов. В неё добавлены корзина и языки —
   в обычном положении они спрятаны, чтобы не дублировать шапку.
   ================================================================== */

.dm-menu-side { display: none; }

@media (min-width: 768px) {
  body.dm-stuck .dm-menu {
    position: fixed;
    inset-inline: 0;
    top: 0;
    z-index: 1200;
    min-height: 52px;
    box-shadow: 0 2px 14px rgba(28, 37, 41, .12);
    /* [2026-09-27] строго одна строка: корзина, WhatsApp и языки забирают
       место, и разделы уезжали на вторую строку */
    flex-wrap: nowrap;
    gap: clamp(8px, 1vw, 18px);
    padding-inline: clamp(12px, 2vw, 32px);
    /* [2026-09-27] overflow тут стоять не может: он резал панель «Весь
       каталог», она выпадает из полосы наружу. Лишнее в строку не лезет
       за счёт скрытия средних разделов ниже. */
    overflow: visible;
  }

  body.dm-stuck .dm-menu-item {
    font-size: 14px;
    white-space: nowrap;
  }

  body.dm-stuck .dm-menu-all { white-space: nowrap; }

  /* [2026-09-27] Полоса разделов всегда в одну строку — и на главной, и
     внутри, и в закреплённом виде. Раньше на узких экранах разделы
     переносились, и высота шапки гуляла от страницы к странице.
     Лишние разделы прячем: «Весь каталог» открывает их панелью. */
  .dm-menu {
    flex-wrap: nowrap;
  }

  .dm-menu-item { white-space: nowrap; }

  /* [2026-09-27] Разделы не прячем — на узком экране сокращаем подпись
     («Европейские новинки» → «Новинки») и ужимаем кегль. Пропадающие
     пункты покупателя сбивают: меню должно быть одинаковым везде. */
  .dm-menu-short { display: none; }

  @media (max-width: 1500px) {
    .dm-menu { gap: 12px; }
    .dm-menu-item { font-size: 14px; }
  }

  @media (max-width: 1440px) {
    .dm-menu { gap: 10px; padding-inline: 16px; }
    .dm-menu-item { font-size: 13px; }
    .dm-menu-long { display: none; }
    .dm-menu-short { display: inline; }
  }

  @media (max-width: 1100px) {
    .dm-menu { gap: 8px; padding-inline: 12px; }
    .dm-menu-item { font-size: 12px; }
    body.dm-stuck .dm-menu-wa .dm-wa-text { display: none; }
    body.dm-stuck .dm-menu-wa { padding-inline: 10px; }
  }

  body.dm-stuck .dm-menu-side {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-inline-start: auto;
  }

  /* [2026-09-27] В полосе живёт настоящая корзина: скрипт переносит её
     сюда вместе с выпадашкой темы. Ужимаем под высоту 52 px, состояние
     («0», число товаров, «Ваша корзина пуста») остаётся темовое. */
  body.dm-stuck .dm-menu-side .dm-cart-wrap { position: relative; }

  .dm-menu-wa {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding-inline: 12px;
    border-radius: 8px;
    background: #25D366;
    color: #FFFFFF !important;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
  }

  /* [2026-09-27] размеры кнопки держим жёстко: при наведении менялась
     жирность и полоса подпрыгивала (та же болезнь, что у подсказок) */
  .dm-menu-wa,
  .dm-menu-wa:hover,
  .dm-menu-wa:focus,
  .dm-menu-wa:active {
    height: 34px !important;
    padding-inline: 12px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    transform: none !important;
    box-shadow: none !important;
  }

  .dm-menu-wa:hover { background: #1FB855; }

  body.dm-stuck .dm-menu-side .dm-cart {
    height: 36px;
    padding-inline: 12px;
  }

  /* слово «Корзина» оставляем: в полосе она должна читаться так же,
     как в шапке, а не превращаться в безымянную иконку */
  body.dm-stuck .dm-menu-side .dm-cart > span { font-size: 14px; }

  .dm-menu-langs {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
  }

  .dm-menu-langs a { color: #5C6A72; }

  .dm-menu-langs a.dm-lang-active { color: #146678; font-weight: 600; }

  /* панель каталога открывается из липкой полосы и не должна уезжать под неё */
  body.dm-stuck .dm-catalog { max-height: calc(100vh - 70px); overflow-y: auto; }
}


/* [2026-09-27] «Быстрая доставка» — зелёным: это товары со склада в Израиле,
   тем же цветом, что срок «10-14 дней» в карточках. «Системы очистки воды»
   рядом голубым, так что пункты не сливаются. */
.dm-menu-item.dm-menu-fast { color: #1E7F4F; }

.dm-menu-item.dm-menu-fast:hover,
.dm-menu-item.dm-menu-fast.dm-menu-active { color: #156239; }



/* [2026-09-27] Сообщение «товар в корзине» уезжало под липкую полосу:
   у контейнера уведомлений темы z-index 999, у полосы 1200. Поднимаем
   уведомления выше и в закреплённом виде отодвигаем их от полосы. */
.notification-wrapper { z-index: 1300 !important; }

body.dm-stuck .notification-wrapper[class*="-t"] { padding-top: 60px; }

[dir="rtl"] body.dm-stuck .notification-wrapper[class*="-t"] { padding-top: 60px; }


/* кнопка «назад» живёт только в шторке на телефоне */
.dm-cat-back { display: none; }

/* [2026-09-27] Иврит читается справа налево, поэтому «следующий уровень»
   показывает стрелка влево. Значки одни и те же, зеркалим их стилем. */
[dir="rtl"] .dm-catalog .dm-ico-dir {
  transform: scaleX(-1);
}


/* [2026-09-27] Сумма рядом с корзиной — как на боевом сайте. Прячется,
   когда корзина пуста (атрибут hidden ставит скрипт). */
.dm-cart-sum {
  margin-inline-start: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #146678;
  white-space: nowrap;
}

body.dm-stuck .dm-menu-side .dm-cart-sum { font-size: 13px; }

/* [2026-09-27] Шторка разделов на телефоне: панель каталога разворачивается
   во весь экран под шапкой, страница за ней не прокручивается. */
@media (max-width: 767px) {
  .dm-burger { display: flex; }

  body.dm-drawer-on { overflow: hidden; }

  body.dm-drawer-on .dm-catalog {
    display: block !important;
    position: fixed;
    inset: 148px 0 0;
    z-index: 5000;
    overflow-y: auto;
    padding: 12px 16px 84px;
    background: #FFFFFF;
    border-top: 1px solid #E3E8EC;
  }

  body.dm-drawer-on .dm-cat-cols {
    display: flex !important;
    flex-direction: column;
    gap: 0;
  }

  /* [2026-09-27] Три уровня шторки: разделы → подразделы → коллекции.
     Виден ровно один столбец, остальные убраны из потока. */
  body.dm-drawer-on .dm-cat-subs,
  body.dm-drawer-on .dm-cat-colls,
  body.dm-drawer-on .dm-cat-note,
  body.dm-drawer-on .dm-cat-back { display: none !important; }

  body.dm-drawer-2 .dm-cat-sections,
  body.dm-drawer-3 .dm-cat-sections,
  body.dm-drawer-3 .dm-cat-subs { display: none !important; }

  body.dm-drawer-2 .dm-cat-back,
  body.dm-drawer-3 .dm-cat-back { display: flex !important; }

  /* столбец разворачиваем сверху вниз: на компьютере он узкий и стоит
     рядом с соседями, здесь занимает весь экран */
  body.dm-drawer-2 .dm-cat-subs,
  body.dm-drawer-3 .dm-cat-colls {
    display: block !important;
    max-height: none;
    padding: 0;
    border: 0;
  }

  body.dm-drawer-on .dm-cat-back {
    align-items: center;
    gap: 8px;
    width: 100%;
    min-height: 48px;
    margin-bottom: 4px;
    padding: 0;
    border: 0;
    background: none;
    font-size: 15px;
    font-weight: 500;
    color: #2F6B4F;
  }

  body.dm-drawer-on .dm-cat-back .dm-ico {
    /* значок «вперёд» разворачиваем: это ход назад */
    transform: scaleX(-1);
  }

  /* подразделы и «весь раздел» — такими же строками, как разделы */
  body.dm-drawer-on .dm-cat-sub,
  body.dm-drawer-on .dm-cat-more {
    display: flex !important;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 4px;
    border-bottom: 1px solid #E9EDF0;
    font-size: 16px;
    color: #1C2529 !important;
    text-decoration: none !important;
  }

  body.dm-drawer-on .dm-cat-sub > span:first-child { flex: 1 1 0%; min-width: 0; }

  /* [2026-09-27] Общий телефонный множитель давал в меню 22,5 px —
     названия разделов ломались на три строки. Здесь свой размер. */
  body.dm-drawer-on .dm-cat-section,
  body.dm-drawer-on .dm-cat-section:hover,
  body.dm-drawer-on .dm-cat-sub,
  body.dm-drawer-on .dm-cat-sub:hover,
  body.dm-drawer-on .dm-cat-more,
  body.dm-drawer-on .dm-cat-more:hover { font-size: 18px !important; }

  body.dm-drawer-on .dm-cat-small { font-size: 15px; }

  body.dm-drawer-on .dm-cat-more { font-weight: 500; color: #2F6B4F !important; }

  body.dm-drawer-on .dm-cat-cap {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 12px;
    padding: 4px 4px 10px;
    font-size: 19px;
    font-weight: 600;
    color: #1C2529;
  }

  /* ссылка «весь раздел» в шапке столбца остаётся доступной */
  body.dm-drawer-on .dm-cat-cap a {
    font-size: 15px;
    font-weight: 500;
    color: #2F6B4F !important;
    text-decoration: none !important;
  }

  /* [2026-09-27] В иврите стрелка «назад» смотрит направо — общее правило
     зеркалит значки внутри каталога, поэтому свой разворот здесь снимаем. */
  [dir="rtl"] body.dm-drawer-on .dm-cat-back .dm-ico { transform: none; }

  body.dm-drawer-on .dm-cat-list { display: block; }

  body.dm-drawer-on .dm-cat-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  /* [2026-09-27] Кубики коллекций описаны только для больших экранов —
     на телефоне третий уровень выходил голыми ссылками. */
  body.dm-drawer-on .dm-cat-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: #1C2529 !important;
    text-decoration: none !important;
  }

  body.dm-drawer-on .dm-cat-pic {
    display: block;
    height: 100px;
    border-radius: 8px;
    overflow: hidden;
    background: #F7F6F3;
  }

  body.dm-drawer-on .dm-cat-pic img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  body.dm-drawer-on .dm-cat-name {
    font-size: 16px !important;
    font-weight: 500;
    line-height: 1.3;
  }

  body.dm-drawer-on .dm-cat-card .dm-cat-small {
    display: block;
    color: #5C6A72;
  }

  body.dm-drawer-on .dm-cat-section {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 52px;
    padding: 0 4px;
    border-bottom: 1px solid #E9EDF0;
    font-size: 16px;
    color: #1C2529 !important;
    text-decoration: none !important;
  }

  body.dm-drawer-on .dm-cat-group {
    margin-top: 16px;
    padding: 0 4px;
    font-size: 13px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #9AA7AE;
  }

  /* выбор языка: три кнопки вместо одной */
  .dm-mobsearch.dm-lang-open .dm-lang-btn { display: none; }

  .dm-mobsearch.dm-lang-open:after { content: none; }

  .dm-mobsearch.dm-lang-open .dm-langs {
    display: flex !important;
    gap: 4px;
  }

  .dm-mobsearch .dm-langs a {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #E3E8EC;
    border-radius: 8px;
    font-size: 13px;
    color: #5C6A72 !important;
    text-decoration: none !important;
  }

  .dm-mobsearch .dm-langs a.dm-lang-active {
    border-color: #146678;
    color: #146678 !important;
    font-weight: 600;
  }
}

@media (min-width: 768px) {
  .dm-burger,
  .dm-mobsearch { display: none !important; }
}

/* [2026-09-27] Флажок рядом с буквами языка. На широком экране показываем
   и флаг, и код, на телефоне — только флаг: место дорогое. */
.dm-langs a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.dm-langs svg {
  display: block;
  border-radius: 2px;
}

@media (max-width: 767px) {
  .dm-mobsearch .dm-langs a span,
  .dm-lang-btn span { display: none; }

  .dm-lang-btn svg { width: 24px; height: 17px; border-radius: 3px; }
}

/* [2026-09-27] Бегущая строка на телефоне стояла: анимация была объявлена
   только внутри медиазапроса для широких экранов. Повторяем её здесь —
   строка едет на любом экране. */
@media (max-width: 767px) {
  .dm-ticker-track {
    display: flex;
    width: max-content;
    animation: dmMarqueeMob 38s linear infinite;
    will-change: transform;
  }

  .dm-ticker-line {
    display: flex;
    align-items: center;
    gap: 20px;
    padding-inline-end: 20px;
    color: #FFFFFF;
    white-space: nowrap;
  }

  .dm-ticker-dot {
    width: 5px;
    height: 5px;
    background: #7FD3A0;
    transform: rotate(45deg);
    display: inline-block;
  }

  @keyframes dmMarqueeMob {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
  }

  [dir="rtl"] .dm-ticker-track { animation-name: dmMarqueeMobRtl; }

  @keyframes dmMarqueeMobRtl {
    from { transform: translateX(-50%); }
    to   { transform: translateX(0); }
  }

  @media (prefers-reduced-motion: reduce) {
    .dm-ticker-track { animation: none; }
  }
}

/* [2026-09-27] Поле в раскрытой строке поиска: у темы оно тянется флексом,
   а в нашей строке схлопывалось до нуля. Задаём ширину явно. */
@media (max-width: 767px) {
  .dm-mobsearch form.dm-search {
    display: flex;
    align-items: center;
    overflow: hidden;
  }

  .dm-mobsearch form.dm-search input[name="search"] {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 46px;
    padding-inline: 12px;
    border: 0;
    background: transparent;
    font-size: 16px;
  }

  .dm-mobsearch form.dm-search button {
    flex: none;
    width: 46px;
    height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #146678;
    color: #FFFFFF;
  }
}


/* [2026-09-27] Текст бегущей строки по центру полосы. Строка высотой 36 px,
   а текст прижимался к верхнему краю: у дорожки и строк не было выравнивания
   по вертикали, работала только базовая линия. */
.dm-ticker {
  display: flex;
  align-items: center;
}

.dm-ticker-track,
.dm-ticker-line {
  align-items: center;
  height: 100%;
}

.dm-ticker-line span { line-height: 1; }

@media (max-width: 767px) {
  .dm-ticker {
    height: 36px;
    display: flex;
    align-items: center;
  }

  .dm-ticker-track,
  .dm-ticker-line {
    align-items: center;
    height: 36px;
  }
}


/* [2026-09-27] Шапка на телефоне прилипает к верху при прокрутке — так же
   работала старая шапка темы. Бегущая строка уезжает: на маленьком экране
   место дорого, остаётся ряд с логотипом и кнопками. */
@media (max-width: 767px) {
  body.dm-stuck .dm-head {
    position: fixed;
    inset-inline: 0;
    top: 0;
    z-index: 5100;
    box-shadow: 0 2px 12px rgba(28, 37, 41, .12);
  }

  body.dm-stuck .dm-mobsearch {
    position: fixed;
    inset-inline: 0;
    top: 64px;
    z-index: 5100;
  }

  /* место под закреплённую шапку, чтобы страница не прыгала */
  body.dm-stuck .dm-ticker { margin-bottom: 64px; }

  /* шторка разделов открывается под закреплённой шапкой */
  body.dm-stuck.dm-drawer-on .dm-catalog { inset-block-start: 64px; }
}

/* ==================================================================
   [2026-09-28] Шторка разделов на телефоне: кнопка «все товары раздела»
   вместо бледной ссылки и запас снизу под прибитые полосы.
   ================================================================== */

@media (max-width: 767px) {
  body.dm-drawer-on .dm-catalog {
    /* запас снизу: внизу экрана стоят полосы «в корзину» и «связаться»,
       из-за них последние разделы было не докрутить */
    padding-bottom: calc(180px + env(safe-area-inset-bottom)) !important;
    overscroll-behavior: contain;
  }

  /* шапка столбца переносит кнопку на свою строку */
  body.dm-drawer-on .dm-cat-cap {
    flex-wrap: wrap;
    gap: 4px 12px;
  }

  body.dm-drawer-on .dm-cat-cap > span { flex: 1 1 100%; }

  body.dm-frame-on .dm-cat-more.dm-cat-more-btn,
  body.dm-frame-on .dm-cat-more.dm-cat-more-btn:hover,
  body.dm-frame-on .dm-cat-cap a.dm-cat-more-btn,
  body.dm-frame-on .dm-cat-cap a.dm-cat-more-btn:hover {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 54px;
    margin: 4px 0 14px;
    padding: 0 16px;
    border: 0;
    border-radius: 10px;
    background: #146678;
    color: #FFFFFF !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }

  .dm-cat-more.dm-cat-more-btn .dm-ico { color: #FFFFFF; }
}

/* ==================================================================
   [2026-09-29] Окно корзины в шапке. ⚠️ Кнопку темы мы гасим правилом
   `color: transparent` на всех её потомках, и текст внутри выпадающего
   окна оказывался прозрачным: строки «x 1», «Сумма», «Итого» и суммы не
   читались. Цвета внутри окна задаём явно.
   ================================================================== */

body.dm-frame-on .dm-cart-wrap .cart-content,
body.dm-frame-on .dm-cart-wrap .cart-content * {
  color: #1C2529 !important;
  border-color: #E3E8EC !important;
}

body.dm-frame-on .dm-cart-wrap .cart-content table {
  width: 100%;
  margin: 0;
}

body.dm-frame-on .dm-cart-wrap .cart-content td {
  padding: 10px 8px !important;
  background: transparent !important;
  vertical-align: middle;
  font-size: 14px;
}

body.dm-frame-on .dm-cart-wrap .cart-content .td-image img {
  width: 54px;
  height: 54px;
  object-fit: contain;
  border: 1px solid #E3E8EC;
  border-radius: 8px;
  background: #FFFFFF;
}

body.dm-frame-on .dm-cart-wrap .cart-content .td-name a {
  color: #1C2529 !important;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  line-height: 1.3;
}

body.dm-frame-on .dm-cart-wrap .cart-content .td-name a:hover { color: #146678 !important; }

body.dm-frame-on .dm-cart-wrap .cart-content .td-qty { color: #5C6A72 !important; }

body.dm-frame-on .dm-cart-wrap .cart-content .td-total { font-weight: 600; }

/* итоги отделяем чертой, подписи серые, суммы тёмные */
body.dm-frame-on .dm-cart-wrap .cart-content .td-total-title {
  color: #5C6A72 !important;
  background: transparent !important;
}

body.dm-frame-on .dm-cart-wrap .cart-content .td-total-text {
  color: #1C2529 !important;
  background: transparent !important;
  font-weight: 600;
}

body.dm-frame-on .dm-cart-wrap .cart-content .table-totals,
body.dm-frame-on .dm-cart-wrap .cart-content tfoot {
  border-top: 1px solid #E3E8EC;
}

/* кнопки внизу окна */
body.dm-frame-on .dm-cart-wrap .cart-content .cart-buttons,
body.dm-frame-on .dm-cart-wrap .cart-content .buttons {
  display: flex;
  gap: 10px;
  padding: 12px;
}

body.dm-frame-on .dm-cart-wrap .cart-content .btn {
  flex: 1 1 0;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 500;
}

body.dm-frame-on .dm-cart-wrap .cart-content .btn-secondary,
body.dm-frame-on .dm-cart-wrap .cart-content .btn-default {
  border: 1px solid #146678;
  background: #FFFFFF;
  color: #146678 !important;
}

body.dm-frame-on .dm-cart-wrap .cart-content .btn-primary,
body.dm-frame-on .dm-cart-wrap .cart-content .btn-primary * {
  border: 1px solid #146678;
  background: #146678;
  color: #FFFFFF !important;
}

body.dm-frame-on .dm-cart-wrap .cart-content .cart-empty,
body.dm-frame-on .dm-cart-wrap .cart-content p {
  padding: 16px;
  color: #5C6A72 !important;
  font-size: 15px;
}