/* ===== БАЗА ===== */
*{
  box-sizing:border-box;
  margin:0;
  padding:0;
}

input,
textarea,
[contenteditable="true"] {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
html,body{
  height:100%;
}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:#f5f5f5;
  color:#222;
}

a{
  text-decoration:none;
  color:inherit;
}

img{
  max-width:100%;
  display:block;
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

.page-main{
  padding:30px 0 50px;
}

/* ===== ВЕРХНЯЯ ЗЕЛЁНАЯ ПОЛОСА ===== */
.top-line{
  background:#0c8a3d;
  color:#fff;
  font-size:13px;
  padding:6px 0;
  
  text-align:center;
  letter-spacing:0.04em;
  text-transform:uppercase;
}

/* ===== ШАПКА ===== */
.header-main{
  background:#fff;
  border-bottom:1px solid #e3e3e3;
}

.header-main-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 0;
  gap:24px;
}

/* Логотип */
.logo-box{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.logo-title{
  display:inline-block;
  padding:6px 16px;
  background:#0c8a3d;
  color:#fff;
  font-weight:700;
  font-size:26px;
  letter-spacing:0.08em;
  text-transform:uppercase;
}

.logo-sub{
  font-size:12px;
  color:#666;
  text-transform:uppercase;
}

/* Контакты */
.header-contacts{
  display:flex;
  flex-direction:column;
  gap:2px;
  font-size:14px;
  color:#444;
}

.header-phone{
  font-size:20px;
  font-weight:700;
}

.header-contacts small{
  font-size:12px;
  color:#777;
}

/* Правая часть (логин + корзина) */
.header-right{
  display:flex;
  align-items:flex-end;
  gap:18px;
  font-size:14px;
}
.header-cashback {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(34,197,94,.14), rgba(22,163,74,.08));
  border: 1px solid rgba(34,197,94,.5);
  text-decoration: none;
  cursor: pointer;
  transition: transform .1s ease, box-shadow .1s ease, background .15s ease;
}


.header-cashback:active {
  transform: translateY(0);
  box-shadow: 0 3px 8px rgba(22,163,74,.25);
}

.header-cashback-icon {
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: #16a34a;
  background: rgba(255,255,255,.95);
  box-shadow: 0 2px 6px rgba(22,163,74,.3);
}

.header-cashback-text {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.header-cashback-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #bbf7d0; /* светло-зелёный */
}

.header-cashback-value {
  font-size: 13px;
  font-weight: 600;
  color: #ecfdf3; /* почти белый */
}
.auth-links{
  display:flex;
  flex-direction:column;
  gap:4px;
  text-align:left;
}

.auth-links a{
  font-size:13px;
  color:#0c8a3d;
}

.auth-links a:hover{
  text-decoration:underline;
}

.cart-box{
  border:1px solid #0c8a3d;
  padding:8px 14px;
  border-radius:2px;
  min-width:140px;
  font-size:13px;
  background:#f8fff9;
}

.cart-title{
  font-weight:600;
  margin-bottom:4px;
}

.cart-meta{
  display:flex;
  justify-content:space-between;
  color:#555;
}

/* ===== МЕНЮ ===== */
.nav-bar{
  background:#f5f6f8;
  border-bottom:1px solid #e3e3e3;
  position:sticky;
  top:0px;        /* столько же, сколько margin-top у header-main / высота top-line */
  z-index:40;
}


html.no-scroll,
body.no-scroll{
  overflow: hidden;
}


.nav-row{
  display:flex;
  align-items:center;
  gap:18px;
  padding:10px 0;
  font-size:14px;
  overflow-x:auto;
}

.nav-catalog-btn{
  background:#0c8a3d;
  color:#fff;
  border-radius:2px;
  padding:8px 16px;
  font-weight:600;
  text-transform:uppercase;
  font-size:13px;
  white-space:nowrap;
}

.nav-catalog-btn:hover{
  background:#0a6f31;
}

.nav-link{
  color:#333;
  white-space:nowrap;
}

.nav-link:hover{
  color:#0c8a3d;
}

/* ===== ПОИСКОВАЯ ПОЛОСА ===== */
.search-bar-wrap{
  background:#4f4f4f;
  background-image:
    linear-gradient(135deg,rgba(255,255,255,0.05) 25%,transparent 25%),
    linear-gradient(225deg,rgba(255,255,255,0.05) 25%,transparent 25%),
    linear-gradient(45deg,rgba(255,255,255,0.05) 25%,transparent 25%),
    linear-gradient(315deg,rgba(255,255,255,0.05) 25%,#4f4f4f 25%);
  background-position:10px 0,10px 0,0 0,0 0;
  background-size:12px 12px;
  color:#fff;
}

.search-row{
  padding:18px 0 22px;
  display:flex;
  align-items:center;
  gap:10px;
}

.search-input-wrap{
  flex:1;
  display:flex;          /* теперь это flex-контейнер */
  align-items:stretch;
  gap:8px;               /* расстояние между инпутом и кнопками */
}

/* чтобы инпут не занимал всю строку и делил место с кнопками */
.search-input{
  flex:1;                /* занимает всё доступное место */
  width:auto;            /* переопределяем width:100% */
  padding:12px 16px;
  border-radius:2px;
  border:none;
  font-size:14px;
  outline:none;
}

.search-input::placeholder{
  color:#888;
}

.search-btn{
  padding:12px 22px;
  background:#0c8a3d;
  color:#fff;
  border:none;
  border-radius:2px;
  font-size:14px;
  cursor:pointer;
  white-space:nowrap;
}

.search-btn:hover{
  background:#0a6f31;
}

.search-photo-btn{
  padding:11px 14px;
  background:#fff;
  color:#0c8a3d;
  border:none;
  border-radius:2px;
  font-size:18px;
  cursor:pointer;
}

.search-photo-btn:hover{
  background:#e4ffe9;
}

/* ===== ЗАГОЛОВОК НА ГЛАВНОЙ ===== */
.page-title{
  font-size:26px;
  font-weight:700;
  margin-bottom:22px;
}

/* ===== КАРТОЧКИ ТОВАРОВ ===== */
.products-grid{
  display:grid;
  /* колонки по 240–260px, сколько влезет по ширине */
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  column-gap:1px;   /* боковое расстояние между карточками */
  row-gap:15px;  
}
.product-card{
  background:#fff;
  border:1px solid #e3e3e3;
  border-radius:2px;
  padding:10px 10px 12px;
  display:flex;
  flex-direction:column;

  max-width:240px;   /* ← реальная ширина карточки */
  width:100%;
  height:100%;
  margin:0 auto;     /* центрируем внутри ячейки */
}
.product-thumb{
  margin-bottom:8px;
  text-align:center;
}

.product-thumb img{
    width: 180px;
  height:180px;
  object-fit:cover;
}

.product-title{
  font-size:14px;
  font-weight:500;
  margin-bottom:1px;
  min-height:32px;
}
.product-art{
  font-size: 13px;
  padding: 5px 0px;
  color: gray;
    white-space: normal !important;
  word-break: break-all;     /* переносить даже внутри длинной строки */
  overflow-wrap: anywhere;   /* современный вариант для переноса */
}
.product-stock{
  font-size:13px;
  margin-bottom:6px;
  display:flex;
  align-items:center;
  gap:4px;
}

.product-stock::before{
  content:"";
  width:10px;
  height:10px;
  border-radius:50%;
  display:inline-block;
}

.product-stock.in-stock{
  color:#0c8a3d;
}

.product-stock.in-stock::before{
  background:#0c8a3d;
}

.product-price{
  font-size:15px;
  font-weight:600;
  margin-bottom:10px;
}

/* Кол-во и кнопка */
.product-qty-row{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap:4px;

}
.product-qty-row-btns{
  border:1px solid #d0d0d0;
}
.qty-btn{
  width:28px;
  height:30px;
  border: none;
  background:#f7f7f7;
  cursor:pointer;
  font-size:16px;
}

.qty-btn:hover{
  background:#ececec;
}

.qty-input{
  border: none;
  width:40px;
  height:30px;
  border: none;
  text-align:center;
  font-size:14px;
}

.buy-btn{
  margin:auto;  
  width: 100px;
  height:32px;

  border:none;
  background:#0c8a3d;
  color:#fff;
  font-size:14px;
  font-weight:600;
  cursor:pointer;

  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;              /* расстояние между иконкой и текстом */
  border-radius:2px;
  transition:background .15s ease, transform .05s ease;
}

.buy-btn:hover{
  background:#0a6f31;
}

.buy-btn:active{
  transform:translateY(1px);
}

/* сама иконка */
.buy-btn svg{
  width:20px;
  height:20px;
  flex-shrink:0;
  display:block;
/* чтобы иконка была того же цвета, что и текст */
}
/* "Дубликат" карточки, который улетает в корзину */
.fly-card{
  position:fixed;
  z-index:9999;
  background:#ffffff;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
  border-radius:2px;
  overflow:hidden;
  pointer-events:none;
  transform-origin:center center;
  opacity:1;
  transition:
    transform .65s cubic-bezier(.25,.8,.25,1),
    opacity .65s ease-out;
}

/* внутри не показываем кнопки и инпуты, чтобы не мигали */
.fly-card .product-qty-row{
  display:none;
}

/* лёгкий пульс корзины, как был раньше */
.cart-box.cart-box-pulse{
  animation:cartPulse .4s ease-out;
}

@keyframes cartPulse{
  0%{transform:scale(1);}
  40%{transform:scale(1.07);}
  100%{transform:scale(1);}
}

/* ===== АДАПТИВ ===== */
@media (max-width:1024px){
  .products-grid{
    grid-template-columns:repeat(3,1fr);
  }
}

@media (max-width:768px){
  .header-main-row{
    flex-direction:column;
    align-items:flex-start;
  }

  .header-right{
    align-self:stretch;
    justify-content:space-between;
    width:100%;
  }

  .products-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .search-row{
    flex-direction:column;
    align-items:stretch;
  }

  .search-btn,
  .search-photo-btn{
    width:100%;
  }

  .search-photo-btn{
    font-size:16px;
  }
}

@media (max-width:480px){
  .products-grid{
    grid-template-columns:1fr;
  }

  .logo-title{
    font-size:22px;
  }

  .page-main{
    padding:20px 0 30px;
  }
}
/* ===== ВЫПАДАЮЩИЙ КАТАЛОГ (ПОД КНОПКОЙ, НО ПОВЕРХ ВСЕГО) ===== */

.nav-catalog-wrapper{
  position:relative; /* нужна только для ширины кнопки, но не для позиции меню */
}

/* активная кнопка */
.nav-catalog-btn.js-catalog-toggle.is-active{
  background:#0a6f31;
}

/* Белая панель каталога — фиксированная, поверх header/поиска/контента */
.catalog-dropdown{
  position:fixed;
  top:0;          /* реальные координаты задаём из JS */
  left:0;
  display:none;
  z-index:1000;   /* выше header и всего остального */
    opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition:opacity .18s ease-out, transform .18s ease-out;
}

/* когда открыто */
.catalog-dropdown.is-open{
  display:block;
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}
.catalog-dropdown-inner{
  display:flex;
  background:#fff;
  border:1px solid #dcdcdc;

  /* фиксированная высота, чтобы внутри работали свои скроллы */
  height:40vh;
  overflow-y:hidden;   /* здесь скролла НЕ делаем */
}
.catalog-dropdown-left,
.catalog-dropdown-right{
  height:100%;
  overflow-y:auto;
}
/* левый столбец */
.catalog-dropdown-left{
  flex:0 0 260px;
  border-right:1px solid #e6e6e6;
}

.catalog-main-item{
  padding:10px 16px;
  font-size:14px;
  cursor:pointer;
  border-bottom:1px solid #f1f1f1;
}

.catalog-main-item.is-active{
  background:#f9fff9;
  border-left:3px solid #0c8a3d;
  padding-left:13px;
  color:#0c8a3d;
  font-weight:600;
}

/* правый столбец */
.catalog-dropdown-right{
  display:none;
  min-width:260px;
  max-height:40vh;
  overflow-y:auto;
  padding:8px 0;
}

/* показываем и анимируем только когда есть класс is-visible */
.catalog-dropdown-right.is-visible{
  display:block;
  animation: catalogRightIn .24s ease-out .05s forwards;
}

.catalog-sub-list{
  display:none;
  padding:4px 16px;
}

.catalog-sub-list.is-active{
  display:block;
  animation: catalogSubFade .18s ease-out;
}
/* чтобы анимация срабатывала только когда меню открыто */
.catalog-dropdown.is-open .catalog-dropdown-left,
.catalog-dropdown.is-open .catalog-dropdown-right{
  will-change: transform, opacity;
}

/* левая колонка — падает сверху вниз */
.catalog-dropdown.is-open .catalog-dropdown-left{
  animation: catalogLeftIn .22s ease-out forwards;
}

/* правая колонка — выезжает слева под левую (с маленькой задержкой) */

/* ключевые кадры */
@keyframes catalogLeftIn{
  from{
    opacity:0;
    transform:translateY(-16px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes catalogRightIn{
  from{
    opacity:0;
    transform:translateX(-16px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

.catalog-sub-item{
  display:block;
  padding:6px 0;
  font-size:14px;
  color:#222;
}

.catalog-sub-item:hover{
  color:#0c8a3d;
}

/* ТЁМНЫЙ ФОН ПОД КАТАЛОГОМ */
.catalog-backdrop{

  position:fixed;
  left:0;
  right:0;
  bottom:0;
  top:0;                       /* по умолчанию — весь экран, но мы перепишем JS-ом */
  background:rgba(0,0,0,.22);
  display:none;
  z-index:900;                 /* ниже панели каталога, но выше контента */
}

.catalog-backdrop.is-open{
  display:block;
}


/* адаптив */
@media (max-width:768px){
  .catalog-dropdown-inner{
    width:90vw;
    max-width:640px;
  }
}
.admin-login-wrap{
  max-width:360px;
  margin:40px auto;
  background:#fff;
  border:1px solid #e3e3e3;
  padding:24px 20px;
}

.admin-login-wrap h1{
  font-size:20px;
  margin-bottom:18px;
}

.admin-login-form label{
  display:block;
  font-size:14px;
  margin-bottom:12px;
}

.admin-login-form input{
  width:100%;
  padding:8px 10px;
  margin-top:4px;
  border:1px solid #ccc;
}

.admin-login-form button{
  width:100%;
  padding:10px;
  margin-top:10px;
  border:none;
  background:#0c8a3d;
  color:#fff;
  font-weight:600;
  cursor:pointer;
}
.admin-page-wrap{
  max-width:900px;
  margin:30px auto;
  background:#fff;

  padding:24px 24px 30px;
}

.admin-page-wrap h1{
  font-size:22px;
  margin-bottom:20px;
}

.admin-fieldset{
  border:1px solid #ddd;
  padding:14px 14px 6px;
  margin-bottom:18px;
}

.admin-fieldset legend{
  padding:0 6px;
  font-weight:600;
  font-size:14px;
}

.field-row{
  margin-bottom:10px;
}

.field-row label{
  display:block;
  font-size:14px;
  margin-bottom:4px;
}

.field-row input[type="text"],
.field-row select,
.field-row textarea{
  width:100%;
  padding:8px 10px;
  border:1px solid #ccc;
  font-size:14px;
}

.admin-submit-btn{
  padding:10px 18px;
  border:none;
  background:#0c8a3d;
  color:#fff;
  font-weight:600;
  cursor:pointer;
}
.admin-page-wrap{
  max-width:900px;
  margin:30px auto;
  background:#fff;

  padding:24px 24px 30px;
}

.admin-page-wrap h1{
  font-size:22px;
  margin-bottom:20px;
}

.admin-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.admin-btn{
  display:inline-block;
  padding:10px 16px;
  background:#0c8a3d;
  color:#fff;
  font-weight:600;
  text-decoration:none;
  border-radius:2px;
}

.admin-btn:hover{
  background:#0a6f31;
}
.admin-page-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}

.admin-secondary-btn{
  display:inline-block;
  padding:8px 14px;
  border:1px solid #ccc;
  text-decoration:none;
  color:#333;
  margin-right:8px;
  background:#f7f7f7;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}

.admin-table th,
.admin-table td{
  border:1px solid #e3e3e3;
  padding:6px 8px;
}

.admin-table th{
  background:#f5f5f5;
}

.admin-link{
  color:#0c8a3d;
  text-decoration:none;
}
.admin-link:hover{ text-decoration:underline; }
.admin-product-image-preview{
  max-width:200px;
  max-height:200px;
  border:1px solid #ddd;
}

.field-hint{
  display:block;
  font-size:12px;
  color:#777;
  margin-top:2px;
}

.admin-form-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:12px;
}
.category-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}

.back-btn{
  display:inline-block;
  padding:6px 14px;
  border:1px solid #ccc;
  background:#f7f7f7;
  text-decoration:none;
  color:#333;
  font-size:14px;
}
.back-btn:hover{
  background:#e9e9e9;
}
.alpha-filter-row{
  margin:16px 0 24px;
}

/* сам фильтр — по размеру содержимого */
.alpha-filter-bar{
  display:inline-block;
  border:1px solid #dde1e6;
  padding:10px 14px 12px;
  margin-bottom:16px;  /* ← отступ от карточек */
}

.alpha-filter-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
  font-size:14px;
}

.alpha-filter-label{
  position:relative;
  padding-right:10px;
}

.alpha-filter-label::after{
  content:"";
  display:block;
  position:absolute;
  left:100%;
  right:-8px;
  top:50%;
  height:1px;
  background:#dde1e6;
}

.alpha-filter-clear{
  font-size:14px;
  color:#777;
  text-decoration:none;
}
.alpha-filter-clear:hover{
  text-decoration:underline;
}

.alpha-filter-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}
.alpha-range{
  display:flex;
  align-items:center;
  gap:4px;
}
.alpha-filter-item{
  padding:4px 10px;
  border:1px solid transparent;
  background:none;
  cursor:pointer;
  text-decoration:none;
  color:#222;
  font-size:15px;
}
.alpha-filter-item:hover{
  border-color:#a4c9a8;
}
.alpha-range-letters{
  display:none;
  gap:4px;
}
.alpha-filter-item.is-active{
  color:#00923f;
  font-weight:600;
}
.alpha-range-expanded{
  display:flex;
  gap:4px;
}

/* Квадратики букв */
.alpha-letters{
  margin-top:6px;
  display:flex;
  gap:4px;
}

.alpha-letter{
  min-width:28px;
  text-align:center;
  padding:4px 0;
  border:1px solid #a4c9a8;
  background:none;
  cursor:pointer;
  color:#222;
  font-size:14px;
}
.alpha-letter:hover{
  border-color:#1a8c3a;
}
.alpha-letter.is-active{
  border-color:#1a8c3a;
  box-shadow:0 0 0 1px #1a8c3a inset;
  font-weight:600;
  color:#1a8c3a;
}
.nav-catalog-wrapper{
  position:relative;
  display:inline-block;
}

/* зелёная кнопка "Каталог" теперь просто ссылка */
.nav-catalog-btn{
  display:inline-flex;
  align-items:center;
  background:#0c8a3d;
  color:#fff;
  border-radius:2px;
  padding:8px 32px 8px 16px; /* справа запас под стрелку */
  font-weight:600;
  text-transform:uppercase;
  font-size:13px;
  white-space:nowrap;
}

/* стрелка-иконка справа, визуально как часть кнопки */
.nav-catalog-arrow{
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  width:28px;
  border:none;
  background:#0a6f31;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}

/* треугольник вниз */
.nav-catalog-arrow::before{
  content:"";
  border:4px solid transparent;
  border-top-color:#fff;
  transform:translateY(2px);
}

/* при открытом меню поворачиваем стрелку вверх */
.nav-catalog-arrow.is-active::before{
  transform:translateY(-2px) rotate(180deg);
}
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:32px;
}

.catalog-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:30px 20px;
  background:#fff;
  border:1px solid #e3e3e3;
  text-align:center;
  transition:
    box-shadow .2s ease,
    transform .2s ease,
    border-color .2s ease;
}

.catalog-card-img-wrap{
  height:160px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:16px;
}

.catalog-card-img{
  max-width:200px;
  max-height:140px;
  filter: grayscale(100%) brightness(0.9);
  transition:transform .2s ease, filter .2s ease;
}

/* заголовок */
.catalog-card-title{
  font-weight:600;
  font-size:16px;
}

/* hover-эффект: плитка приподнимается, картинка становится зелёной */
.catalog-card:hover{
  transform:translateY(-4px);
  border-color:#0c8a3d;
  box-shadow:0 8px 18px rgba(0,0,0,.08);
}

.catalog-card:hover .catalog-card-img{
  filter:
    brightness(0) saturate(100%)
    invert(60%) sepia(96%) saturate(530%) hue-rotate(90deg) brightness(90%) contrast(95%);
}

/* адаптив */
@media (max-width:1024px){
  .catalog-grid{
    grid-template-columns:repeat(3,1fr);
  }
}
@media (max-width:768px){
  .catalog-grid{
    grid-template-columns:repeat(2,1fr);
  }
}
@media (max-width:480px){
  .catalog-grid{
    grid-template-columns:1fr;
  }
}
/* ===== Плитка групп каталога ===== */
.catalog-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0,1fr));
  gap:24px;
}

.catalog-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  padding:24px 16px 20px;
  background:#fff;
  border:1px solid #e3e3e3;
  border-radius:2px;
  text-align:center;
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.catalog-card-img-wrap{
  width:140px;
  height:140px;
  margin-bottom:16px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fafafa;
}

.catalog-card-img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  transition:filter .2s ease, transform .2s ease;
}

.catalog-card-title{
  font-size:15px;
  font-weight:600;
  color:#222;
}

/* “Зеленеет” при наведении */
.catalog-card:hover{
  border-color:#0c8a3d;
  box-shadow:0 8px 18px rgba(0,0,0,.08);
  transform:translateY(-2px);
}
.catalog-card:hover .catalog-card-img{
  filter:hue-rotate(70deg) saturate(140%);
  transform:scale(1.03);
}

/* ===== Фильтр категорий в группе ===== */
.catalog-cat-filter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:18px;
}

.catalog-cat-pill{
  padding:6px 12px;
  border-radius:16px;
  border:1px solid #d1d5db;
  background:#fff;
  font-size:13px;
  cursor:pointer;
}

.catalog-cat-pill.is-active{
  background:#0c8a3d;
  color:#fff;
  border-color:#0c8a3d;
}

/* адаптив для плитки */
@media (max-width:1024px){
  .catalog-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:768px){
  .catalog-grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:480px){
  .catalog-grid{ grid-template-columns:1fr; }
}
/* ===== СТРАНИЦА ТОВАРА ===== */

.product-page{
  background:#fff;

  padding:26px 26px 32px;
}

/* Заголовок и артикул */
.product-page-head{
  margin-bottom:18px;
}

.product-page-title{
  font-size:32px;
  line-height:1.25;
  font-weight:700;
  margin:0 0 8px;
}

.product-page-sku{
  font-size:14px;
  color:#757575;
  padding-bottom:14px;
  border-bottom:1px solid #ededed;
}

/* Сетка: фото слева, инфо справа */
.product-main-grid{
  display:flex;
  align-items:flex-start;
  gap:40px;
  margin-top:22px;
}

/* Левая колонка */
.product-main-left{
  flex:1 1 60%;
}

.product-main-photo{
  border:1px solid #e2e2e2;
  background:#fafafa;
  padding:14px;
  text-align:center;
}

/* ===== ЕДИНЫЙ РАЗМЕР КАРТИНОК В КАРТОЧКАХ И КАТАЛОГЕ ===== */

/* контейнеры под фото: карточки товаров и плитки каталога */
.product-thumb,
.catalog-card-img-wrap{
  height: 180px;              /* общий размер превью */
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fafafa;
  padding:8px;
}

/* само изображение внутри */
.product-thumb img,
.catalog-card-img{
  width:100%;
  height:100%;
  object-fit:contain;         /* всё видно, без обрезания */
}

/* ===== ЕДИНЫЙ РАЗМЕР ДЛЯ ФОТО НА СТРАНИЦЕ ТОВАРА ===== */

.product-main-photo{
  height: 500px;              /* единая высота большого фото */
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fafafa;
  border:1px solid #e2e2e2;
  padding:12px;
  overflow:hidden;
}

.product-main-photo img{
  width:100%;
  height:100%;
  object-fit:contain;
}


/* Правая колонка */
.product-main-right{
  flex:0 0 280px;
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* В наличии */
.product-availability-row{
  display:flex;
  align-items:center;
  font-size:14px;
  color:#1a8c3a;
}

.product-availability-dot{
  width:18px;
  height:18px;
  border-radius:50%;
  background:#1a8c3a;
  display:inline-block;
  margin-right:8px;
  position:relative;
}

.product-availability-dot::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:inherit;
  background:#fff;
  opacity:.1;
}

/* Цена */
.product-price-block{
  margin-top:8px;
}

.product-price-main{
  font-size:28px;
  font-weight:700;
  margin-bottom:4px;
}

.product-price-note{
  font-size:13px;
  color:#777;
}

/* Кол-во + кнопка */
.product-buy-row{
  margin-top:10px;
  display:flex;
  gap:14px;
  align-items:stretch;
}

/* коробка с количеством */
.product-qty-box{
  display:flex;
  align-items:stretch;
  border:1px solid #d0d0d0;
  background:#fff;
}

.product-qty-box .qty-btn{
  width:38px;
  height:44px;
  border:none;
  background:#f7f7f7;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}

.product-qty-box .qty-btn:hover{
  background:#ececec;
}

.product-qty-box .qty-input{
  width:60px;
  height:44px;
  border-left:1px solid #d0d0d0;
  border-right:1px solid #d0d0d0;
  border-top:none;
  border-bottom:none;
  text-align:center;
  font-size:16px;
}

/* зелёная кнопка "В корзину" */
.product-buy-btn{
  flex:1;
  border:none;
  height:44px;
  padding:0 20px;
  background:linear-gradient(90deg,#1fb14b,#00923f);
  color:#fff;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:background .15s ease, transform .05s ease;
}

.product-buy-btn:hover{
  background:linear-gradient(90deg,#1aa243,#008437);
}

.product-buy-btn:active{
  transform:translateY(1px);
}

/* Описание товара */
.product-description-block{
  margin-top: 28px;
  padding-top: 8px;
  border-top: 1px solid #e5e5e5;
}

.product-description-block h2{
  font-size:20px;
  margin:0 0 10px;
}

.product-description-text{
  margin-top: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: #333;

  max-height: 240px;      /* высота области с текстом */
  overflow-y: auto;       /* вертикальный скролл при переполнении */
  overflow-x: hidden;     /* горизонтальный скрываем */
  padding-right: 6px;     /* чтобы текст не прилипал к скроллу */
}
/* Немного стилизуем скролл (опционально) */
.product-description-text::-webkit-scrollbar{
  width: 6px;
}

.product-description-text::-webkit-scrollbar-track{
  background: #f3f3f3;
}

.product-description-text::-webkit-scrollbar-thumb{
  background: #c4c4c4;
}

.product-description-text::-webkit-scrollbar-thumb:hover{
  background: #a8a8a8;
}

/* Адаптив */
@media (max-width:900px){
  .product-main-grid{
    flex-direction:column;
  }
  .product-main-right{
    flex:1 1 auto;
    max-width:420px;
  }
}

@media (max-width:600px){
  .product-page{
    padding:18px 14px 24px;
  }
  .product-page-title{
    font-size:24px;
  }
  .product-buy-row{
    flex-direction:column;
  }
  .product-qty-box,
  .product-buy-btn{
    width:100%;
  }
}
.user-panel{
  border:1px solid #dbe2e8;
  border-radius:2px;
  overflow:hidden;
  background:#ffffff;
  min-width:190px;  
  min-height:80px ;        /* ширина примерно как у корзины */
  display:inline-flex;
  font-size:13px;
  align-items:stretch;
}

.user-panel-icon{
  background:linear-gradient(135deg,#4caf50,#6ecb6a);
  padding:12px 20px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.user-panel-icon svg{
  width:22px;
  height:22px;
}

.user-panel-text{
  padding:6px 12px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.user-panel-name{
  font-size:14px;
  font-weight:600;
  color:#008000;
  text-decoration:none;
}

.user-panel-name:hover{
  text-decoration:underline;
}

.user-panel-link{
  font-size:12px;
  color:#555;
  text-decoration:none;
}

.user-panel-link:hover{
  text-decoration:underline;
}

/* кнопки "Регистрация" / "Вход" как ссылки */
.auth-links{
  display:flex;
  gap:8px;
  margin-right:16px;
}

.auth-link{
  background:none;
  border:none;
  padding:0;
  color:#008000;
  cursor:pointer;
  font-size:14px;
  text-decoration:underline;
}
.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  display:none;
  z-index:1000;
}

.modal-backdrop.is-show{
  display:block;
}

.modal-auth{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:1001;
}

.modal-auth.is-show{
  display:flex;
}

.modal-auth-inner{
  background:#fff;
  padding:20px 24px;
  border-radius:6px;
  width:100%;
  max-width:420px;
  box-shadow:0 14px 45px rgba(0,0,0,.35);
  position:relative;
}

.modal-auth-close{
  position:absolute;
  top:8px;
  right:8px;
  border:none;
  background:none;
  font-size:22px;
  cursor:pointer;
}

.modal-auth-tabs{
  display:flex;
  gap:8px;
  margin-bottom:16px;
}

.modal-tab-btn{
  flex:1;
  padding:8px 0;
  border-radius:4px;
  border:1px solid #d0d7e2;
  background:#f3f5f9;
  cursor:pointer;
  font-size:14px;
}

.modal-tab-btn.is-active{
  background:#4caf50;
  color:#fff;
  border-color:#4caf50;
}

.modal-form{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.modal-form label{
  display:flex;
  flex-direction:column;
  font-size:13px;
}

.modal-form input{
  margin-top:4px;
  padding:6px 8px;
  border-radius:4px;
  border:1px solid #cbd5e1;
  font-size:14px;
}

.modal-submit{
  margin-top:6px;
  padding:8px 10px;
  border-radius:4px;
  border:none;
  background:#4caf50;
  color:#fff;
  font-weight:600;
  cursor:pointer;
}

/* helper */
.is-hidden{ display:none; }
.product-card-link:hover{
  color: #008000;
}

/* ============ КОРЗИНА ============ */

.cart-page{
  padding: 24px 0 60px;
}

.cart-layout{
  display:flex;
  gap:32px;
  align-items:flex-start;
}

.cart-items-col{
  flex:1 1 auto;
}

.cart-summary-col{
  flex:0 0 320px;
}

/* Адаптив */
@media (max-width: 960px){
  .cart-layout{
    flex-direction:column;
  }
  .cart-summary-col{
    width:100%;
  }
}

/* ---- товар в корзине ---- */

.cart-item{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:4px;
  padding:16px 20px;
  margin-bottom:12px;
}

.cart-item-title{
  font-size:15px;
  font-weight:600;
  color:#111827;
  margin-bottom:4px;
}

.cart-item-meta{
  font-size:12px;
  color:#6b7280;
  margin-bottom:10px;
}

.cart-item-sku{
  color:#6b7280;
}

/* строка: цена / кол-во / сумма / удалить */
.cart-item-row{
  display:flex;
  align-items:center;
  gap:24px;
  margin-top:4px;
}

.cart-item-price{
  min-width:110px;
  font-size:14px;
  color:#111827;
}

.cart-item-qty{
  display:flex;
  align-items:center;
  gap:4px;
}

/* кнопки +/- в корзине (можно использовать те же, что и в карточках) */
.cart-qty-btn{
  width:32px;
  height:32px;
  border-radius:4px;
  border:1px solid #d1d5db;
  background:#f9fafb;
  font-size:18px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.cart-qty-btn:hover{
  background:#e5f2ff;
  border-color:#60a5fa;
}

.cart-qty-input{
  width:54px;
  height:32px;
  border-radius:4px;
  border:1px solid #d1d5db;
  text-align:center;
  font-size:14px;
  padding:0 6px;
}

/* сумма по строке */
.cart-item-sum{
  min-width:120px;
  font-weight:600;
  font-size:14px;
  color:#111827;
}

/* кнопка удаления строки */
.cart-item-remove{
  margin-left:auto;
  border:none;
  background:transparent;
  color:#9ca3af;
  font-size:18px;
  cursor:pointer;
}

.cart-item-remove:hover{
  color:#ef4444;
}

/* ============ ПРАВАЯ КОЛОНКА (ИТОГИ) ============ */

.cart-summary-box{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:4px;
  padding:16px 18px 20px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.cart-summary-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:14px;
  color:#111827;
}

.cart-summary-total{
  font-size:18px;
  font-weight:700;
}

.cart-summary-note{
  font-size:13px;
  color:#6b7280;
}

/* кнопка "Проверить остатки" */
.cart-check-btn{
  margin-top:10px;
  width:100%;
  height:40px;
  border-radius:4px;
  border:1px solid #10b981;
  background:#ecfdf5;
  color:#047857;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
}

.cart-check-btn:hover:not(:disabled){
  background:#d1fae5;
}

.cart-check-btn:disabled{
  opacity:.6;
  cursor:default;
}

/* кнопка "К оформлению" */
.cart-order-btn{
  margin-top:8px;
  width:100%;
  height:42px;
  border:none;
  border-radius:4px;
  background:linear-gradient(90deg,#22c55e,#16a34a);
  color:#ffffff;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
}

.cart-order-btn:hover:not(:disabled){
  filter:brightness(1.05);
}

.cart-order-btn:disabled{
  background:#e5e7eb;
  color:#9ca3af;
  cursor:default;
}
/* ============ ОФОРМЛЕНИЕ ЗАКАЗА (checkout) ============ */

.checkout-page{
  padding:24px 0 60px;
}

/* общий layout */
.checkout-layout{
  display:flex;
  gap:32px;
  align-items:flex-start;
}

.checkout-left{
  flex:1 1 auto;
}

.checkout-right{
  flex:0 0 320px;
}

/* заголовки блоков слева ("Мои данные", "Способ получения" и т.д.) */
.checkout-block-title{
  font-size:16px;
  font-weight:600;
  margin:18px 0 10px;
}

/* белая карточка блока */
.checkout-card{
  background:#ffffff;
  border-radius:6px;
  border:1px solid #e5e7eb;
  padding:14px 16px;
  box-shadow:0 6px 18px rgba(15,23,42,.03);
}

.checkout-card + .checkout-card{
  margin-top:10px;
}

/* поля формы внутри левой колонки */
.checkout-form label{
  display:block;
  margin-bottom:12px;
  font-size:13px;
  color:#4b5563;
}

.checkout-form input,
.checkout-form textarea{
  width:100%;
  margin-top:4px;
  padding:8px 10px;
  font-size:14px;
  border-radius:4px;
  border:1px solid #d1d5db;
  background:#fff;
}

.checkout-form input[disabled]{
  background:#f9fafb;
  color:#6b7280;
}

.checkout-form textarea{
  resize:vertical;
  min-height:80px;
}

/* строки с radio "Самовывоз / по городу / КЗ / РФ" */
.checkout-radio-row{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:8px 10px;
  border-radius:6px;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.checkout-radio-row + .checkout-radio-row{
  margin-top:4px;
}

.checkout-radio-row input[type="radio"]{
  margin-top:4px;
}

.checkout-radio-title{
  font-size:14px;
  font-weight:600;
  color:#111827;
}

.checkout-radio-sub{
  font-size:13px;
  color:#6b7280;
}

/* лёгкий подсвет при наведении */
.checkout-radio-row:hover{
  background:#f9fafb;
}

/* акцент для выбранного варианта (через :checked + div) */
.checkout-radio-row input[type="radio"]:checked + div .checkout-radio-title{
  color:#047857;
}

.checkout-radio-row input[type="radio"]:checked + div .checkout-radio-sub{
  color:#16a34a;
}

/* блоки адресов под вариантами доставки (по городу / КЗ / РФ) */

.checkout-address-block{
  margin-top:10px;
  padding-top:8px;
  border-top:1px dashed #e5e7eb;
  display:none;              /* по умолчанию скрыт, показываешь классом is-visible */
}

.checkout-address-block.is-visible{
  display:block;
}

/* сетка для город/улица/дом/кв по городу */
.checkout-address-grid{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:8px;
}

/* для межгорода/РФ можно использовать 2 колонки: город + адрес */
.checkout-address-grid-2col{
  display:grid;
  grid-template-columns:1.2fr 2fr;
  gap:8px;
}

.checkout-address-row{
  margin-bottom:8px;
}

.checkout-address-row label{
  margin-bottom:6px;
  font-size:13px;
  color:#4b5563;
}

.checkout-address-row input{
  margin-top:4px;
  padding:8px 10px;
  font-size:14px;
  border-radius:4px;
  border:1px solid #d1d5db;
}

/* кнопка "Подтвердить заказ" */
.checkout-submit-btn{
  margin-top:22px;
  padding:10px 24px;
  border:none;
  border-radius:6px;
  background:linear-gradient(90deg,#22c55e,#16a34a);
  color:#fff;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(22,163,74,.25);
}

.checkout-submit-btn:hover{
  filter:brightness(1.05);
}

/* блок справа "Итого" */
.checkout-summary{
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:6px;
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  gap:10px;
  box-shadow:0 6px 18px rgba(15,23,42,.03);
}

.checkout-summary-row{
  display:flex;
  justify-content:space-between;
  font-size:14px;
  color:#111827;
  gap:10px;
}

.checkout-summary-divider{
  height:1px;
  background:#e5e7eb;
  margin:6px 0;
}

.checkout-summary-total-row strong{
  font-size:18px;
}

/* адаптив для checkout */
@media (max-width: 960px){
  .checkout-layout{
    flex-direction:column;
  }
  .checkout-right{
    width:100%;
  }
  .checkout-address-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .checkout-address-grid-2col{
    grid-template-columns:1fr;
  }
}

@media (max-width: 640px){
  .checkout-page{
    padding:18px 0 40px;
  }
  .checkout-card{
    padding:12px 12px;
  }
}
/* === Checkout: выбор доставки кликом по карточке (без кружков) === */

.checkout-radio-row{
  position:relative;
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:12px 14px;
  margin-bottom:8px;
  border-radius:10px;
  border:1px solid transparent;
  cursor:pointer;
  transition:
    background .15s ease,
    border-color .15s ease,
    box-shadow .15s ease;
}

/* прячем сам кружок radio */
.checkout-radio-row input[type="radio"]{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

/* обычное состояние при наведении */
.checkout-radio-row:hover{
  background:#f9fafb;
}

/* выбранный вариант */
.checkout-radio-row.is-active{
  background:linear-gradient(135deg,#eff6ff,#f9fafb);
  border-color:#bfdbfe;
  box-shadow:0 0 0 1px rgba(59,130,246,.12);
}

.checkout-radio-row.is-active .checkout-radio-title{
  color:#047857;
}

.checkout-radio-row.is-active .checkout-radio-sub{
  color:#16a34a;
}

/* ===== ЛИЧНЫЙ КАБИНЕТ ===== */

.lk-page {
  padding-top: 24px;
  padding-bottom: 60px;
}

.lk-layout {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

/* левая колонка */
.lk-sidebar {
  flex: 0 0 220px;
}

.lk-menu {
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
}

.lk-menu-item {
  display: block;
  padding: 10px 14px;
  font-size: 14px;
  color: #374151;
  border-bottom: 1px solid #e5e7eb;
}

.lk-menu-item:last-child {
  border-bottom: none;
}

.lk-menu-item.is-active {
  background: #bbf7d0;
  color: #047857;
  font-weight: 600;
}

/* правая колонка */
.lk-content {
  flex: 1 1 auto;
}

.lk-section {
  display: none;
}

.lk-section.is-active {
  display: block;
}

.lk-profile-card {
  background: #ffffff;
  border-radius: 4px;
  border: 1px solid #e5e7eb;
  padding: 18px 20px 20px;
  max-width: 520px;
}

.lk-hello {
  margin-bottom: 12px;
  font-size: 15px;
}

.lk-profile-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
  padding: 4px 0;
  border-bottom: 1px dashed #e5e7eb;
}

.lk-profile-row:last-child {
  border-bottom: none;
}

.lk-profile-label {
  color: #6b7280;
}

.lk-profile-actions {
  margin-top: 16px;
}

.lk-link-danger {
  font-size: 14px;
  color: #b91c1c;
  text-decoration: none;
}

.lk-link-danger:hover {
  text-decoration: underline;
}

/* таблица заказов */

.lk-section-title {
  font-size: 20px;
  margin: 0 0 12px;
}

.lk-orders-table-wrap {
  margin-top: 10px;
}

.lk-orders-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
  background: #ffffff;
  border-radius: 4px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
}

.lk-orders-table th,
.lk-orders-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e5e7eb;
}

.lk-orders-table th {
  background: #f9fafb;
  text-align: left;
  color: #6b7280;
  font-weight: 500;
}

.lk-orders-table tr:last-child td {
  border-bottom: none;
}

.lk-orders-col-actions {
  text-align: right;
  white-space: nowrap;
}

.lk-order-link {
  color: #047857;
  text-decoration: none;
  font-weight: 600;
}

.lk-order-link:hover {
  text-decoration: underline;
}

/* статусы */

.lk-status {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  border: 1px solid transparent;
}

.lk-status-new {
  background: #ecfdf3;
  color: #166534;
  border-color: #bbf7d0;
}

.lk-status-paid {
  background: #eff6ff;
  color: #1d4ed8;
  border-color: #bfdbfe;
}

.lk-status-done {
  background: #ecfdf3;
  color: #15803d;
  border-color: #86efac;
}

.lk-status-cancelled {
  background: #fef2f2;
  color: #b91c1c;
  border-color: #fecaca;
}

/* действия */

.lk-order-cancel-link {
  border: 1px solid #fecaca;
  background: #fef2f2;
  color: #b91c1c;
  border-radius: 4px;
  padding: 6px 10px;
  font-size: 13px;
  cursor: pointer;
  margin-right: 8px;
}

.lk-order-cancel-link:hover {
  background: #fee2e2;
}

.lk-order-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 4px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color: #6b7280;
  font-size: 18px;
  text-decoration: none;
}

.lk-order-arrow:hover {
  background: #f9fafb;
}

/* пустое состояние */

.lk-empty {
  margin-top: 10px;
  color: #6b7280;
  font-size: 14px;
}

/* ===== МОДАЛКА ОТМЕНЫ ЗАКАЗА ===== */

.lk-modal-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  display: none;
  z-index: 900;
}

.lk-modal-backdrop.is-show {
  display: block;
}

.lk-modal {
  position: fixed;
  inset: 0;
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 901;
}

.lk-modal.is-show {
  display: flex;
}

.lk-modal-inner {
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #e5e7eb;
  padding: 18px 20px 16px;
  max-width: 420px;
  width: 100%;
  position: relative;
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.35);
}

.lk-modal-close {
  position: absolute;
  top: 6px;
  right: 8px;
  border: none;
  background: none;
  font-size: 20px;
  cursor: pointer;
  color: #9ca3af;
}

.lk-modal-title {
  font-size: 18px;
  margin: 0 0 8px;
}

.lk-modal-text {
  font-size: 14px;
  margin-bottom: 10px;
}

.lk-modal-label {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  margin-bottom: 12px;
}

.lk-modal-label textarea {
  margin-top: 4px;
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid #d1d5db;
  font-size: 14px;
  resize: vertical;
}

.lk-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.lk-modal-btn {
  border-radius: 4px;
  padding: 8px 12px;
  font-size: 14px;
  cursor: pointer;
  border: none;
}

.lk-modal-btn-secondary {
  background: #f3f4f6;
  color: #374151;
}

.lk-modal-btn-secondary:hover {
  background: #e5e7eb;
}

.lk-modal-btn-danger {
  background: #dc2626;
  color: #ffffff;
}

.lk-modal-btn-danger:hover {
  background: #b91c1c;
}

/* ===== ДЕТАЛИ ЗАКАЗА ===== */

.lk-order-detail {
  max-width: 900px;
  margin: 0 auto;
}

.lk-back-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  color: #6b7280;
  text-decoration: none;
  margin-bottom: 8px;
}

.lk-back-link:hover {
  color: #374151;
}

.lk-order-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 18px;
  background: #f9fafb;
  border-radius: 4px;
  border: 1px solid #e5e7eb;
  margin-bottom: 14px;
}

.lk-order-date {
  margin-top: 4px;
  font-size: 13px;
  color: #6b7280;
}

.lk-order-status-box {
  display: flex;
  align-items: center;
}

.lk-order-status-label {
  font-size: 13px;
}

.lk-order-summary {
  margin-top: 12px;
  margin-bottom: 18px;
  padding: 14px 18px;
  background: #ffffff;
  border-radius: 4px;
  border: 1px solid #e5e7eb;
}

.lk-order-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  padding: 4px 0;
}

.lk-order-subtitle {
  font-size: 18px;
  margin: 0 0 8px;
}

.lk-order-items-wrap {
  border-radius: 4px;
  border: 1px solid #e5e7eb;
  overflow: hidden;
  background: #ffffff;
  margin-bottom: 16px;
}

.lk-order-items-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.lk-order-items-table th,
.lk-order-items-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e5e7eb;
}

.lk-order-items-table th {
  background: #f9fafb;
  text-align: left;
  color: #6b7280;
}

.lk-order-items-table tr:last-child td {
  border-bottom: none;
}

.lk-order-item-title {
  max-width: 420px;
}

/* комментарий */
.lk-order-comment {
  margin-top: 12px;
  padding: 12px 14px;
  background: #f9fafb;
  border-radius: 4px;
  border: 1px dashed #d1d5db;
}

.lk-order-comment-label {
  font-size: 13px;
  color: #6b7280;
  margin-bottom: 4px;
}

.lk-order-comment-text {
  font-size: 14px;
}

/* отмена заказа на странице */
.lk-order-cancel-block {
  margin-top: 18px;
}

.lk-order-cancel-form label {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  margin-bottom: 10px;
}

.lk-order-cancel-form textarea {
  margin-top: 4px;
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid #d1d5db;
  font-size: 14px;
  resize: vertical;
}

.lk-order-cancel-btn {
  border: none;
  border-radius: 4px;
  padding: 9px 14px;
  background: #dc2626;
  color: #ffffff;
  font-size: 14px;
  cursor: pointer;
}

.lk-order-cancel-btn:hover {
  background: #b91c1c;
}

.lk-order-status-note {
  margin-top: 12px;
  font-size: 14px;
  color: #b91c1c;
}

/* адаптив */
@media (max-width: 900px) {
  .lk-layout {
    flex-direction: column;
  }
  .lk-sidebar {
    flex: 1 1 auto;
  }
  .lk-order-head {
    flex-direction: column;
  }
}
/* ===== АДМИНКА: ЗАКАЗЫ ===== */

.admin-order-filters{
  margin: 16px 0 20px;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  font-size:14px;
}

.admin-order-filters span{
  margin-right:4px;
  color:#4b5563;
}

.admin-filter-pill{
  display:inline-block;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid #d1d5db;
  background:#f9fafb;
  text-decoration:none;
  color:#374151;
  font-size:13px;
}

.admin-filter-pill.is-active{
  background:#0c8a3d;
  border-color:#0c8a3d;
  color:#fff;
}

.admin-orders-table td{
  vertical-align:top;
}

.admin-order-email{
  font-size:12px;
  color:#6b7280;
}

.admin-order-comment{
  max-width:260px;
  font-size:13px;
  color:#4b5563;
}

.admin-order-actions{
  white-space:nowrap;
}

.admin-order-actions .inline-form{
  display:inline-block;
  margin-left:6px;
}

.admin-small-btn{
  padding:4px 10px;
  font-size:12px;
  border-radius:3px;
  border:1px solid #0c8a3d;
  background:#ecfdf5;
  color:#047857;
  cursor:pointer;
}

.admin-small-btn:hover{
  background:#d1fae5;
}

/* статусные плашки */

.status-pill{
  display:inline-flex;
  align-items:center;
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:500;
}

.status-new{
  background:#eff6ff;
  color:#1d4ed8;
}

.status-processing{
  background:#fef3c7;
  color:#b45309;
}

.status-issued,
.status-completed{
  background:#dcfce7;
  color:#15803d;
}

.status-cancelled{
  background:#fee2e2;
  color:#b91c1c;
}

/* страница одного заказа */

.admin-order-page .admin-page-head{
  margin-bottom:16px;
}

.admin-order-top{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
}

.admin-order-info{
  font-size:14px;
  color:#374151;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.admin-order-actions-block{
  display:flex;
  align-items:flex-start;
}

.admin-main-btn{
  padding:10px 18px;
  border:none;
  border-radius:3px;
  background:#0c8a3d;
  color:#fff;
  font-weight:600;
  cursor:pointer;
}

.admin-main-btn:hover{
  background:#0a6f31;
}

.admin-order-block{
  margin-top:18px;
}

.admin-order-block h2{
  font-size:16px;
  margin:0 0 8px;
}

.admin-order-cancel-block{
  background:#fef2f2;
  border:1px solid #fecaca;
  padding:10px 14px;
  border-radius:4px;
}

/* адаптив */

@media (max-width:768px){
  .admin-order-top{
    flex-direction:column;
  }
}
.admin-secondary-btn,
.admin-primary-btn,
.admin-small-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border-radius:6px;
  font-size:.9rem;
  cursor:pointer;
  border:1px solid #d1d5db;
  background:#fff;
}

.admin-page-wrap{
  max-width:1100px;
  margin:24px auto;
  padding:0 16px 40px;
}
.admin-page-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:20px;
}
.admin-order-head-actions{
  display:flex;
  gap:12px;
}
/* ===== КОРЗИНА В ХЕДЕРЕ ===== */

.cart-box{
  border:1px solid #0c8a3d;
  border-radius:2px;
  overflow:hidden;
  background:#ffffff;
  min-width:110px;
  max-height: 80px;
  display:inline-flex;
  font-size:13px;
}

.cart-box-link{
  display:flex;
  align-items:stretch;
  width:100%;
  color:inherit;
  text-decoration:none;
}

/* левая зелёная часть */
.cart-box-left{
  background:linear-gradient(135deg,#6fdc83,#26a84a);
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.cart-box-icon svg{
  width:32px;
  height:22px;
}

/* правая белая часть */
.cart-box-right{
  padding:8px 14px 10px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:140px;
}

.cart-box-title{
  font-weight:600;
  color:#0c8a3d;
  margin-bottom:4px;
  font-size:14px;
}

.cart-box-row{
  display:flex;
  gap:4px;
  line-height:1.3;
}

.cart-box-label{
  color:#6b7280;
}

.cart-box-value{
  font-weight:600;
  color:#111827;
}

.cart-box-value.cart-sum{
  color:#0c8a3d;
}

/* чуть ужимаем на маленьких экранах */
@media (max-width:768px){
  .cart-box{
    min-width:0;
  }
  .cart-box-right{
    padding:6px 10px 8px;
  }
}
.buy-btn.is-disabled{
  opacity: .5;
  cursor: not-allowed;
}
.currency-switcher{
  display:flex;
  align-items:center;
  gap:6px;
  margin-right:16px;
}

.currency-pill{
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.3);
  font-size:12px;
  color:#f9fafb;
  text-decoration:none;
  background:rgba(0,0,0,.2);
  transition:background .15s ease, color .15s ease, border-color .15s ease;
}

.currency-pill.is-active{
  background:linear-gradient(90deg,#22c55e,#16a34a);
  border-color:transparent;
  color:#fff;
}
/* ============ CHAT WIDGET (support) ============ */
/* ============ CHAT WIDGET (support) ============ */
.cw {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
  color: #111827;
}

/* свернутая плашка */
.cw-tab {
  border: none;
  padding: 8px 18px;
  border-radius: 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(110deg,#bbf7d0 0%,#4ade80 35%,#22c55e 70%,#e0f2fe 100%);
  color: #022c22;
  font-size: 14px;
  box-shadow: 0 10px 25px rgba(15,23,42,.18);
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}

.cw-tab::before{
  content:"";
  position:absolute;
  inset:-40%;
  background: radial-gradient(circle at 0 0, rgba(255,255,255,.55), transparent 55%);
  opacity:.0;
  transform: translateX(-40%);
  transition: opacity .25s ease, transform .25s ease;
}
.cw-tab:hover::before{
  opacity:.9;
  transform: translateX(0);
}

/* маленький уголок + пульс */
.cw-tab-indicator {
  width: 18px;
  height: 18px;
  position: absolute;
  top: -4px;
  right: -4px;
  background: #22c55e;
  border-radius: 0 0 0 999px;
  box-shadow: 0 0 0 0 rgba(34,197,94,.55);
  animation: cw-tab-pulse 1.8s infinite;
}

@keyframes cw-tab-pulse {
  0%   { box-shadow: 0 0 0 0 rgba(34,197,94,.55); }
  70%  { box-shadow: 0 0 0 18px rgba(34,197,94,0); }
  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}

/* окно чата */
.cw-window {
  position: absolute;
  right: 0;
  bottom: 0px;  /* окно висит над табом */
  width: 320px;
  height: 360px;
  max-height: 480px;
  background: #ffffff;
  border-radius: 18px;
  box-shadow: 0 18px 40px rgba(15,23,42,.18);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid #e5e7eb;
  transform-origin: bottom right;
  transform: scaleY(1);
  opacity: 1;
  transition:
    transform 0.22s cubic-bezier(.25,.8,.25,1),
    opacity   0.18s ease-out;
}

/* когда свернуто — визуально схлопываем высоту сверху вниз */
.cw.cw--minimized .cw-window {
  
  transform: scaleY(0);
  opacity: 0;
  pointer-events: none;  /* чтобы не ловить клики по невидимому окну */
}

.cw.cw--minimized .cw-tab {
  display: inline-flex;
}

/* открыто — плашка скрыта */
.cw:not(.cw--minimized) .cw-tab {
  display: none;
}

/* шапка окна */
.cw-header {
  background: linear-gradient(120deg,#bbf7d0 0%,#4ade80 35%,#22c55e 70%,#e0f2fe 100%);
  padding: 10px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: move;
}

.cw-header-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.cw-title {
  font-size: 15px;
  font-weight: 600;
  color: #022c22;
}

.cw-subtitle {
  font-size: 12px;
  color: #064e3b;
  display:flex;
  align-items:center;
  gap:6px;
}

.cw-subtitle::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:#22c55e;
  box-shadow:0 0 0 0 rgba(34,197,94,.5);
  animation:cw-online-pulse 1.6s infinite;
}

@keyframes cw-online-pulse{
  0%{ box-shadow:0 0 0 0 rgba(34,197,94,.5); }
  70%{ box-shadow:0 0 0 10px rgba(34,197,94,0); }
  100%{ box-shadow:0 0 0 0 rgba(34,197,94,0); }
}

.cw-close {
  border: none;
  background: rgba(22,163,74,.15);
  width: 24px;
  height: 24px;
  border-radius: 999px;
  color: #022c22;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.cw-close:hover{
  background: rgba(22,163,74,.25);
}

/* тело чата */
.cw-body {
  padding: 10px 10px 6px;
  flex: 1 1 auto;
  overflow-y: auto;
  background:
    radial-gradient(circle at 0 0, rgba(186,230,253,.7), transparent 55%),
    radial-gradient(circle at 100% 100%, rgba(187,247,208,.7), transparent 55%),
    #f9fafb;
}

/* контейнер сообщений */
.cw-messages{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-height:100%;
  overflow-y:auto;
  padding-right:4px;
}

.cw-messages::-webkit-scrollbar{
  width:6px;
}
.cw-messages::-webkit-scrollbar-track{
  background:transparent;
}
.cw-messages::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.7);
  border-radius:999px;
}

/* сообщения */
.cw-msg {
  max-width: 82%;
  padding: 7px 11px;
  border-radius: 16px;
  font-size: 13px;
  line-height: 1.4;
  box-shadow: 0 2px 6px rgba(148,163,184,.55);
  position: relative;
  color:#111827;
  background:#ffffff;
  animation: cw-msg-appear .16s ease-out;
}

@keyframes cw-msg-appear{
  0%{ transform: translateY(3px); opacity:0; }
  100%{ transform: translateY(0); opacity:1; }
}

.cw-msg--user {
  margin-left: auto;
  background: linear-gradient(140deg,#bbf7d0 0%,#4ade80 40%,#22c55e 100%);
  color:#022c22;
}

.cw-msg--bot {
  margin-right: auto;
  background: #e0f2fe;
  border:1px solid #0ea5e9;
  color:#0f172a;
}

/* хвостики пузырей */
.cw-msg--user::after,
.cw-msg--bot::after{
  content:"";
  position:absolute;
  bottom:0;
  width:10px;
  height:10px;
}

.cw-msg--user::after{
  right:-3px;
  background:inherit;
  border-radius:0 0 0 10px;
  transform:skewY(-35deg);
}

.cw-msg--bot::after{
  left:-3px;
  background:inherit;
  border-radius:0 0 10px 0;
  transform:skewY(35deg);
}

/* индикатор "печатает..." */
.cw-typing{
  margin-top:6px;
  font-size:11px;
  color:#6b7280;
  display:flex;
  align-items:center;
  gap:6px;
}

.cw-typing::before{
  content:"";
  width:14px;
  height:14px;
  border-radius:999px;
  border:2px solid #d1d5db;
  border-top-color:#22c55e;
  animation:cw-typing-spin .7s linear infinite;
}

@keyframes cw-typing-spin{
  to{ transform:rotate(360deg); }
}

/* нижнее поле ввода */
.cw-input {
  padding: 8px 10px;
  border-top: 1px solid #e5e7eb;
  background: #f3f4f6;
  display: flex;
  gap: 8px;
  align-items: center;
}

.cw-input-field {
  flex: 1 1 auto;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: #ffffff;
  color:#111827;
  padding: 7px 12px;
  font-size: 13px;
  outline: none;
}

.cw-input-field::placeholder{
  color:#9ca3af;
}

.cw-input-field:focus {
  border-color: #22c55e;
  box-shadow: 0 0 0 1px rgba(34,197,94,.35);
}

.cw-send-btn {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: none;
  background: radial-gradient(circle at 30% 0,#ecfdf5 0%,transparent 50%), #22c55e;
  color: #022c22;
  font-size: 16px;
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transform: translateY(0);
  transition: transform .08s ease, box-shadow .08s ease;
  box-shadow:0 4px 10px rgba(34,197,94,.4);
}
.cw-send-btn:hover{
  transform: translateY(-1px);
  box-shadow:0 6px 16px rgba(34,197,94,.45);
}
.cw-send-btn:active{
  transform: translateY(1px) scale(.97);
  box-shadow:0 2px 6px rgba(34,197,94,.5);
}

/* мобилки */
@media (max-width: 480px) {
  .cw-window {
    width: calc(100vw - 32px);
    right: 16px;
  }
}
/* по умолчанию точка скрыта */
.cw-unread-dot {
  display: none;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #ef4444;
  margin-left: 8px;
  vertical-align: middle;

  box-shadow: 0 0 0 0 rgba(239, 68, 68, .7);
}

/* когда есть класс .is-visible — показываем и добавляем свечение */
.cw-unread-dot.is-visible {
  display: inline-block;
  animation: cw-unread-glow 1.4s ease-out infinite;
}

@keyframes cw-unread-glow {
  0% {
    box-shadow: 0 0 0 0 rgba(239, 68, 68, .7);
    transform: scale(1);
  }
  60% {
    box-shadow: 0 0 0 10px rgba(239, 68, 68, 0);
    transform: scale(1.05);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
    transform: scale(1);
  }
}

/* ============ ADMIN SUPPORT CHAT ============ */

.support-chat-layout{
  display:flex;
  gap:18px;
  height: calc(100vh - 180px);
  max-height: 720px;
}

/* ЛЕВАЯ КОЛОНКА — список чатов */
.sc-sidebar{
  width:280px;
  background:#ffffff;
  border-radius:16px;
  border:1px solid #e5e7eb;
  box-shadow:0 14px 30px rgba(15,23,42,.12);
  padding:10px 10px 8px;
  display:flex;
  flex-direction:column;
}

.sc-sidebar-title{
  font-size:14px;
  font-weight:600;
  color:#111827;
  letter-spacing:.02em;
  text-transform:uppercase;
  margin-bottom:8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.sc-sidebar-title span{
  font-size:11px;
  color:#6b7280;
}

.sc-chat-list{
  list-style:none;
  margin:0;
  padding:0;
  flex:1 1 auto;
  overflow-y:auto;
}

.sc-chat-list::-webkit-scrollbar{
  width:6px;
}
.sc-chat-list::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.8);
  border-radius:999px;
}

/* item чата */
.sc-item{
  padding:8px 9px;
  border-radius:10px;
  cursor:pointer;
  margin-bottom:4px;
  transition:background .16s ease, transform .08s ease, box-shadow .16s ease;
  position:relative;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.sc-item:hover{
  background:#f3f4f6;
  transform: translateY(-1px);
  box-shadow:0 4px 12px rgba(15,23,42,.08);
}

.sc-item--active{
  background:linear-gradient(135deg,#e0f2fe 0%,#bfdbfe 40%,#bbf7d0 100%);
  box-shadow:0 6px 18px rgba(37,99,235,.25);
}

.sc-item-email{
  font-size:13px;
  font-weight:600;
  color:#111827;
}

.sc-item-preview{
  font-size:12px;
  color:#6b7280;
  max-width:100%;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}

.sc-item-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:3px;
}

.sc-item-unread{
  font-size:11px;
  color:#b91c1c;
  background:rgba(248,113,113,.2);
  border-radius:999px;
  padding:2px 7px;
}

.sc-item-lastfrom{
  font-size:11px;
  color:#4b5563;
}

/* ПРАВАЯ ЧАСТЬ — диалог */
.sc-main{
  flex:1 1 auto;
  border-radius:16px;
  border:1px solid #e5e7eb;
  background:
    radial-gradient(circle at 0 0, rgba(191,219,254,.7), transparent 60%),
    radial-gradient(circle at 100% 100%, rgba(187,247,208,.7), transparent 60%),
    #f9fafb;
  box-shadow:0 18px 40px rgba(15,23,42,.12);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

/* заголовок диалога */
.sc-header{
  padding:10px 14px;
  border-bottom:1px solid #e5e7eb;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:rgba(255,255,255,.9);
}

.sc-header-main{
  display:flex;
  flex-direction:column;
}

.sc-header-email{
  font-size:14px;
  font-weight:600;
  color:#111827;
}

.sc-header-sub{
  font-size:12px;
  color:#6b7280;
}

.sc-header-sub span{
  color:#16a34a;
}

/* "клиент печатает..." */
.sc-typing{
  font-size:12px;
  color:#4f46e5;
  display:none;
}

/* область сообщений */
.sc-messages{
  flex:1 1 auto;
  padding:12px 14px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.sc-messages::-webkit-scrollbar{
  width:6px;
}
.sc-messages::-webkit-scrollbar-thumb{
  background:rgba(148,163,184,.9);
  border-radius:999px;
}

/* сообщение */
.sc-msg-row{
  display:flex;
}

.sc-msg-row--user{
  justify-content:flex-start;
}
.sc-msg-row--support{
  justify-content:flex-end;
}

.sc-msg{
  max-width:70%;
  padding:7px 11px;
  border-radius:14px;
  font-size:13px;
  line-height:1.4;
  position:relative;
  box-shadow:0 2px 7px rgba(148,163,184,.5);
  color:#111827;
  background:#ffffff;
}

.sc-msg--user{
  background:#e5f0ff;
  border:1px solid #bfdbfe;
}
.sc-msg--support{
  background:linear-gradient(140deg,#bfdbfe 0%,#93c5fd 35%,#bbf7d0 100%);
}

/* форма ввода */
.sc-form{
  display:flex;
  gap:8px;
  padding:8px 10px;
  border-top:1px solid #e5e7eb;
  background:#ffffff;
}

.sc-input{
  flex:1 1 auto;
  border-radius:999px;
  border:1px solid #d1d5db;
  background:#f9fafb;
  color:#111827;
  padding:7px 12px;
  font-size:13px;
  outline:none;
}

.sc-input::placeholder{
  color:#9ca3af;
}

.sc-input:focus{
  border-color:#6366f1;
  box-shadow:0 0 0 1px rgba(79,70,229,.25);
}

.sc-send-btn{
  border-radius:999px;
  border:none;
  padding:6px 14px;
  font-size:13px;
  font-weight:500;
  cursor:pointer;
  background:linear-gradient(120deg,#6366f1 0%,#0ea5e9 40%,#22c55e 100%);
  color:#f9fafb;
  box-shadow:0 6px 16px rgba(79,70,229,.35);
  display:flex;
  align-items:center;
  gap:6px;
}
.sc-send-btn span{
  font-size:16px;
}
.sc-send-btn:hover{
  transform:translateY(-1px);
}
.sc-send-btn:active{
  transform:translateY(1px) scale(.97);
  box-shadow:0 3px 10px rgba(79,70,229,.3);
}

/* адаптив */
@media(max-width: 1024px){
  .support-chat-layout{
    flex-direction:column;
    height:auto;
    max-height:none;
  }
  .sc-sidebar{
    width:100%;
    flex:0 0 auto;
  }
}
.sc-form {
  border-top: 1px solid #e5e7eb;
  padding: 8px 10px;
  background: #f9fafb;
  position: relative;
}

.sc-form-inner {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sc-icon-btn {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: none;
  background: #e5e7eb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
}

.sc-icon-btn:hover {
  background: #d1d5db;
}



/* панель эмодзи в админке */
.sc-emoji-panel {
  position: absolute;
  right: 16px;
  bottom: 52px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 18px 35px rgba(15,23,42,.28);
  padding: 6px;
  display: none;
  z-index: 10;
}

.sc-emoji-panel button {
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  padding: 4px;
}

.sc-emoji-panel button:hover {
  transform: scale(1.1);
}

/* картинки в сообщениях админки */
.sc-msg-image {
  display: block;
  max-width: 260px;
  border-radius: 12px;
  margin-top: 4px;
}
/* изображения в пузырях */
.cw-msg-image {
  display: block;
  max-width: 180px;
  border-radius: 14px;
  margin-top: 4px;
}

/* кнопки и иконки внизу */
.cw-input {
  padding: 8px 10px;
  border-top: 1px solid #e5e7eb;
  background: #f9fafb;
  display: flex;
  gap: 8px;
  align-items: center;
  position: relative;
}

.cw-btn-icon {
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: none;
  background: #e5e7eb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  cursor: pointer;
  flex-shrink: 0;
}

.cw-btn-icon:hover {
  background: #d1d5db;
}

/* панель эмодзи */
.cw-emoji-panel {
  position: absolute;
  right: 10px;
  bottom: 46px;
  background: #ffffff;
  border-radius: 14px;
  box-shadow: 0 18px 35px rgba(15,23,42,.28);
  padding: 6px;
  display: none;
  z-index: 10;
}

.cw-emoji-panel button {
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  padding: 4px;
}

.cw-emoji-panel button:hover {
  transform: scale(1.1);
}

/* быстрые шаблонные фразы */
.cw-quick-replies {
  display: none; /* покажем из JS, если чат пустой */
  margin-top: 4px;
  gap: 6px;
  flex-wrap: wrap;
}

.cw-quick-btn {
  border: none;
  border-radius: 999px;
  padding: 6px 10px;
  font-size: 12px;
  background: #e5f9ff;
  color: #0369a1;
  cursor: pointer;
  white-space: nowrap;
}

.cw-quick-btn:hover {
  background: #bae6fd;
}

/* индикатор непрочтанного — яркая точка без обводки */
.cw-unread-dot {
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, #facc15, #f97316 55%, #b91c1c 100%);
  box-shadow: 0 0 12px rgba(251,113,133,.9);
  margin-left: 6px;
}
/* ====== FOOTER ====== */

.site-footer {

  background: #020617; /* очень тёмный, подчёркивает низ страницы */
  color: #e5e7eb;
  border-top: 1px solid rgba(148, 163, 184, 0.25);
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
}

.footer-inner {
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 32px;
  padding: 28px 0 22px;
}

.footer-col {
  font-size: 14px;
}

.footer-col--brand {
  max-width: 320px;
}

.footer-logo {
  display: inline-flex;
  flex-direction: column;
  text-decoration: none;
  margin-bottom: 10px;
}

.footer-logo-title {
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #f9fafb;
}

.footer-logo-sub {
  font-size: 12px;
  text-transform: uppercase;
  color: #9ca3af;
}

.footer-text {
  font-size: 13px;
  line-height: 1.5;
  color: #9ca3af;
}

.footer-title {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
  color: #e5e7eb;
}

.footer-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-links li {
  margin-bottom: 6px;
}

.footer-links a {
  text-decoration: none;
  color: #9ca3af;
  font-size: 13px;
  transition: color 0.18s ease, transform 0.18s ease;
}

.footer-links a:hover {
  color: #22c55e; /* зелёный как в чате */
  transform: translateX(2px);
}

.footer-col--contacts .footer-contact-item {
  margin-bottom: 8px;
}

.footer-contact-label {
  display: block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #6b7280;
}

.footer-contact-value {
  font-size: 13px;
  color: #e5e7eb;
  text-decoration: none;
}

.footer-contact-value a {
  color: inherit;
}

/* нижняя полоска */
.footer-bottom {
  border-top: 1px solid rgba(31, 41, 55, 0.9);
  background: #020617;
}

.footer-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0 14px;
  font-size: 12px;
  color: #6b7280;
}

.footer-bottom-links a {
  color: #9ca3af;
  text-decoration: none;
  margin-left: 16px;
  font-size: 12px;
}

.footer-bottom-links a:hover {
  color: #22c55e;
}

/* адаптация под мобильные */
@media (max-width: 900px) {
  .footer-inner {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
}

@media (max-width: 640px) {
  .footer-inner {
    grid-template-columns: 1fr;
  }

  .footer-bottom-inner {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .footer-bottom-links a {
    margin-left: 0;
    margin-right: 16px;
  }
}
.partner-offers{
  margin-top:32px;
  padding:20px;
  border-radius:8px;
  background:#f9fafb;
  border:1px solid #e5e7eb;
}

.partner-offers-title{
  font-size:18px;
  font-weight:600;
  margin-bottom:12px;
}

.partner-offers-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.partner-offer-card{
  padding:12px 14px;
  border-radius:6px;
  background:#fff;
  border:1px solid #e5e7eb;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.partner-offer-head{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:8px;
}

.partner-offer-shop{
  font-weight:600;
}

.partner-offer-location{
  font-size:13px;
  color:#6b7280;
}

.partner-offer-meta{
  display:flex;
  gap:24px;
  font-size:14px;
}

.partner-offer-meta dt{
  font-size:12px;
  color:#6b7280;
  margin-bottom:2px;
}

.partner-offer-meta dd{
  font-weight:500;
}

@media (max-width:768px){
  .partner-offer-meta{
    flex-direction:column;
    gap:4px;
  }
}
/* ===== ADMIN PARTNERS ===== */

.admin-block{
  margin-top:24px;
  padding:20px;
  background:#fff;
  border-radius:6px;
  border:1px solid #e5e7eb;
}

.admin-block-title{
  font-size:18px;
  font-weight:600;
  margin-bottom:12px;
}

.admin-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.admin-form-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.admin-label{
  flex:1 1 220px;
  display:flex;
  flex-direction:column;
  font-size:14px;
  gap:4px;
}

.admin-input{
  padding:8px 10px;
  border-radius:4px;
  border:1px solid #d1d5db;
  font-size:14px;
}

.admin-input:focus{
  outline:none;
  border-color:#2563eb;
  box-shadow:0 0 0 1px rgba(37,99,235,.3);
}

.admin-form-actions{
  margin-top:8px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 16px;
  border-radius:4px;
  border:none;
  font-size:14px;
  cursor:pointer;
}

.btn-primary{
  background:#2563eb;
  color:#fff;
}

.btn-primary:hover{
  background:#1d4ed8;
}

.admin-table-wrapper{
  overflow-x:auto;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}

.admin-table th,
.admin-table td{
  padding:8px 10px;
  border-bottom:1px solid #e5e7eb;
  text-align:left;
  vertical-align:top;
}

.admin-table th{
  font-weight:600;
  background:#f9fafb;
}

.admin-subtext{
  font-size:12px;
  color:#6b7280;
}

.admin-apikey code{
  font-size:12px;
  word-break:break-all;
}

.badge{
  display:inline-block;
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
}

.badge-green{
  background:#dcfce7;
  color:#166534;
}

.badge-gray{
  background:#e5e7eb;
  color:#374151;
}

@media (max-width:768px){
  .admin-form-row{
    flex-direction:column;
  }
}
/* ===== PARTNER DASHBOARD ===== */

.partner-page{
  max-width: 960px;
  margin-top: 24px;
  margin-bottom: 40px;
}

.partner-block{
  margin-top: 20px;
  padding: 18px 20px;
  background:#fff;
  border-radius:6px;
  border:1px solid #e5e7eb;
}

.partner-block-title{
  font-size:18px;
  font-weight:600;
  margin-bottom:10px;
}

.partner-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.partner-form-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.partner-label{
  flex:1 1 220px;
  display:flex;
  flex-direction:column;
  font-size:14px;
  gap:4px;
}

.partner-input{
  padding:8px 10px;
  border-radius:4px;
  border:1px solid #d1d5db;
  font-size:14px;
}

.partner-input:focus{
  outline:none;
  border-color:#2563eb;
  box-shadow:0 0 0 1px rgba(37,99,235,.3);
}

.partner-form-actions{
  margin-top:8px;
}

.partner-key,
.partner-url{
  padding:8px 10px;
  background:#f9fafb;
  border-radius:4px;
  border:1px solid #e5e7eb;
  font-family:monospace;
  font-size:13px;
  word-break:break-all;
}

.partner-code{
  background:#0b1120;
  color:#e5e7eb;
  padding:12px 14px;
  border-radius:6px;
  font-size:13px;
  overflow-x:auto;
}

.partner-note{
  font-size:13px;
  color:#6b7280;
  margin-top:6px;
}

.partner-steps{
  padding-left:18px;
  font-size:14px;
}

.partner-steps li + li{
  margin-top:4px;
}

@media (max-width:768px){
  .partner-form-row{
    flex-direction:column;
  }
}
.btn-xs{
  padding:4px 8px;
  font-size:12px;
}
.btn-secondary{
  background:#6b7280;
  color:#fff;
}
.btn-secondary:hover{
  background:#4b5563;
}
.search-page .search-form-top{
  margin:16px 0 24px;
  display:flex;
  gap:10px;
}
.search-block{
  margin-top:24px;
}
.search-block-title{
  font-size:20px;
  font-weight:600;
  margin-bottom:12px;
}
.search-partner-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.search-partner-item{
  border:1px solid #e5e7eb;
  border-radius:6px;
  padding:10px 12px;
  display:flex;
  flex-direction:column;
}
.search-partner-main{
  display:flex;
  justify-content:space-between;
  gap:16px;
}
.search-partner-name{
  font-weight:600;
  margin-bottom:4px;
}
.search-partner-meta span{
  margin-right:10px;
  font-size:13px;
  color:#6b7280;
}
.search-partner-buy{
  text-align:right;
}
.search-partner-price{
  font-weight:700;
}
.search-partner-qty{
  font-size:13px;
  color:#6b7280;
}
.partner-buy-btn{
  margin-top:6px;
  padding:6px 10px;
  border-radius:4px;
  border:none;
  background:#16a34a;
  color:#fff;
  cursor:pointer;
}
.partner-buy-btn:hover{
  background:#15803d;
}
/* ===== SEARCH RESULTS LIST (общие карточки) ===== */

.search-result-list{
  margin-top:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

/* базовая карточка */
.search-result-item{
  border-radius:8px;
  border:1px solid #e5e7eb;
  padding:12px 16px;
}

.search-result-item--own{
  background:#ecfdf5; /* светло-зелёный для наших */
}

.search-result-item--partner{
  background:#fffbeb; /* светло-жёлтый для партнёров */
}

.search-result-main{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}

.search-result-title{
  font-weight:600;
  margin-bottom:4px;
}

.search-result-meta{
  font-size:13px;
  color:#6b7280;
}

.search-result-meta span + span{
  margin-left:12px;
}

.search-result-buy{
  text-align:right;
  min-width:160px;
}

.search-result-price{
  font-weight:700;
}

.search-result-qty{
  font-size:13px;
  color:#6b7280;
  margin-top:2px;
}

.search-result-actions{
  margin-top:6px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
}

.search-result-btn{
  padding:6px 12px;
  border-radius:4px;
  border:none;
  cursor:pointer;
  font-size:14px;
  color:#fff;
  background:#16a34a; /* зелёная, как на скрине */
}

.search-result-btn:hover{
  background:#15803d;
}

/* счётчик количества для наших */
.qty-box{
  display:inline-flex;
  border:1px solid #d1d5db;
  border-radius:4px;
  overflow:hidden;
}

.qty-btn{
  padding:4px 8px;
  border:none;
  background:#f9fafb;
  cursor:pointer;
}

.qty-input{
  width:40px;
  text-align:center;
  border:none;
  outline:none;
  font-size:14px;
}

@media (max-width:768px){
  .search-result-main{
    flex-direction:column;
    align-items:flex-start;
  }
  .search-result-buy{
    text-align:left;
  }
}
  html, body {
      height: 100%;
      overflow: auto; /* или scroll */
    }

    /* Скрыть скроллбар в Chrome / Safari / Opera */
    body::-webkit-scrollbar {
      display: none;
    }

    /* Скрыть скроллбар в Firefox */
    body {
      scrollbar-width: none;      /* Firefox */
      -ms-overflow-style: none;   /* старый Edge/IE */
    }
    .header-cashback{
  margin-left: 16px;
  padding: 4px 10px;
  border-radius: 999px;
  background: #22c55e;        /* зелёный бейдж */
  color: #ffffff;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.header-cashback-label{
  opacity: .9;
}

.header-cashback-value{
  font-variant-numeric: tabular-nums;
}
.logo-box{
  display: flex;
  align-items: center;
  gap: 12px;
}

/* Ссылка вокруг логотипа */
.logo-link{
  display: flex;
  align-items: center;
}

/* Сам логотип — делаем крупнее */
.logo-img-big{
  height: 80px;   /* можешь менять 72 на 80/90, как понравится */
  width: auto;
  display: block;
}

/* Чтобы старая зелёная надпись не мешала, класс можно оставить,
   но он сейчас не используется */
.logo-title{
  display: none;
}
/* ===== ADMIN DASHBOARD (главная админки) ===== */

.adm-dashboard {
  max-width: 1100px;
  margin: 24px auto 40px;
}

/* Заголовок и бейдж */
.adm-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 20px;
}

.adm-head-title {
  font-size: 26px;
  font-weight: 700;
  margin: 0 0 4px;
}

.adm-head-sub {
  font-size: 14px;
  color: #6b7280;
  max-width: 520px;
}

.adm-head-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid #bbf7d0;
  background: #ecfdf5;
  font-size: 12px;
  color: #047857;
  white-space: nowrap;
}

.adm-head-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 0 6px rgba(34,197,94,0.25);
}

/* Статкарточки */
.adm-stats-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 26px;
}

.adm-stat-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid #e5e7eb;
  background: #f9fafb;
}

.adm-stat-icon {
  width: 32px;
  height: 32px;
  border-radius: 10px;
  flex-shrink: 0;
  border: 1px solid transparent;
  background: #e5e7eb;
}

.adm-stat-icon--green {
  background: linear-gradient(135deg,#dcfce7,#bbf7d0);
  border-color: #86efac;
}

.adm-stat-icon--blue {
  background: linear-gradient(135deg,#e0f2fe,#bfdbfe);
  border-color: #93c5fd;
}

.adm-stat-icon--yellow {
  background: linear-gradient(135deg,#fef9c3,#fef3c7);
  border-color: #facc15;
}

.adm-stat-main {
  display: flex;
  flex-direction: column;
}

.adm-stat-label {
  font-size: 12px;
  color: #6b7280;
  margin-bottom: 2px;
}

.adm-stat-value {
  font-size: 18px;
  font-weight: 700;
  color: #111827;
}

/* Секции и карточки действий */

.adm-section {
  margin-top: 12px;
}

.adm-section-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 12px;
}

/* сетка карточек */
.adm-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

/* базовая карточка-линк */
.adm-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 14px 12px;
  border-radius: 10px;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  text-decoration: none;
  color: inherit;
  transition:
    box-shadow .18s ease,
    transform .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.adm-card:hover {
  transform: translateY(-2px);
  border-color: #0c8a3d;
  box-shadow: 0 10px 25px rgba(15,23,42,0.12);
}

/* более акцентная */
.adm-card--primary {
  background: linear-gradient(135deg,#ecfdf5,#dbeafe);
  border-color: #bfdbfe;
}

.adm-card--accent {
  background: linear-gradient(135deg,#fffbeb,#fef3c7);
  border-color: #facc15;
}

/* иконка-квадратик слева */
.adm-card-icon {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  background: #f3f4f6;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.adm-card-icon-shape {
  position: relative;
  display: inline-block;
}

/* разные «иконки» только через границы/линии (без картинок и смайлов) */
.adm-card-icon-shape--folders {
  width: 18px;
  height: 12px;
  border-radius: 3px;
  border: 2px solid #0c8a3d;
  box-shadow: 0 0 0 1px rgba(16,185,129,0.3);
}

.adm-card-icon-shape--list {
  width: 16px;
  height: 2px;
  background: #0f172a;
  box-shadow:
    0 4px 0 #0f172a,
    0 8px 0 #0f172a;
}

.adm-card-icon-shape--plus {
  width: 14px;
  height: 2px;
  background: #0f172a;
}
.adm-card-icon-shape--plus::before {
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:2px;
  height:14px;
  background:#0f172a;
  transform:translate(-50%,-50%);
}

.adm-card-icon-shape--orders {
  width: 14px;
  height: 18px;
  border-radius: 2px;
  border: 2px solid #0f172a;
  box-shadow: inset 0 4px 0 rgba(148,163,184,0.6);
}

.adm-card-icon-shape--star {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 11px solid #f97316;
}
.adm-card-icon-shape--star::before {
  content:"";
  position:absolute;
  left:-8px;
  top:4px;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 11px solid #fbbf24;
}

/* текст карточки */
.adm-card-content {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.adm-card-title {
  font-size: 15px;
  font-weight: 600;
}

.adm-card-sub {
  font-size: 13px;
  color: #6b7280;
  max-width: 320px;
}

/* адаптив под планшет/мобилу */
@media (max-width: 900px) {
  .adm-stats-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .adm-head {
    flex-direction: column;
    align-items: flex-start;
  }
  .adm-actions-grid {
    grid-template-columns: 1fr;
  }
  .adm-stats-row {
    grid-template-columns: 1fr;
  }
}
.adm-card-icon-shape--partners{
  background: linear-gradient(135deg,#22c55e,#15803d);
}

.adm-card-icon-shape--support{
  background: linear-gradient(135deg,#6366f1,#0ea5e9);
}
/* ==== DASHBOARD: общие карточки ==== */

.adm-dashboard .adm-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:20px;
}

.adm-head-title{
  font-size:24px;
  font-weight:700;
}

.adm-head-sub{
  font-size:14px;
  color:#6b7280;
  margin-top:4px;
}

.adm-stats-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-bottom:24px;
}

.adm-stat-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #e5e7eb;
  background:#ffffff;
}

.adm-stat-icon{
  width:32px;
  height:32px;
  border-radius:999px;
  flex-shrink:0;
}

.adm-stat-icon--green{ background:linear-gradient(135deg,#22c55e,#16a34a); }
.adm-stat-icon--blue{ background:linear-gradient(135deg,#3b82f6,#0ea5e9); }
.adm-stat-icon--yellow{ background:linear-gradient(135deg,#facc15,#f97316); }

.adm-stat-main{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.adm-stat-label{
  font-size:12px;
  color:#6b7280;
}

.adm-stat-value{
  font-size:18px;
  font-weight:700;
}

/* ==== DASHBOARD: общие карточки ==== */

.adm-dashboard .adm-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  margin-bottom:20px;
}

.adm-head-title{
  font-size:24px;
  font-weight:700;
}

.adm-head-sub{
  font-size:14px;
  color:#6b7280;
  margin-top:4px;
}

.adm-stats-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  margin-bottom:24px;
}

.adm-stat-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #e5e7eb;
  background:#ffffff;
}

.adm-stat-icon{
  width:32px;
  height:32px;
  border-radius:999px;
  flex-shrink:0;
}

.adm-stat-icon--green{ background:linear-gradient(135deg,#22c55e,#16a34a); }
.adm-stat-icon--blue{ background:linear-gradient(135deg,#3b82f6,#0ea5e9); }
.adm-stat-icon--yellow{ background:linear-gradient(135deg,#facc15,#f97316); }

.adm-stat-main{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.adm-stat-label{
  font-size:12px;
  color:#6b7280;
}

.adm-stat-value{
  font-size:18px;
  font-weight:700;
}

/* блок карточек */
.adm-section{
  margin-top:10px;
}

.adm-section-title{
  font-size:16px;
  font-weight:600;
  margin-bottom:10px;
}

.adm-actions-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

/* сама карточка */
.adm-card{
  display:flex;
  padding:12px 12px;
  border-radius:10px;
  border:1px solid #e5e7eb;
  background:#ffffff;
  text-decoration:none;
  color:inherit;
  gap:10px;
  align-items:flex-start;
  transition:
    box-shadow .18s ease,
    transform .18s ease,
    border-color .18s ease,
    background .18s ease;
}

.adm-card--primary{
  border-color:#bfdbfe;
  background:linear-gradient(135deg,#eff6ff,#ffffff);
}

.adm-card--accent{
  border-color:#fed7aa;
  background:linear-gradient(135deg,#fff7ed,#ffffff);
}

.adm-card:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 25px rgba(15,23,42,.12);
  border-color:#cbd5f5;
}

/* круг с иконкой слева */
.adm-card-icon{
  width:40px;
  height:40px;
  border-radius:999px;
  background:#f3f4f6;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  position:relative;
  overflow:hidden;
}

/* базовая форма иконки */
.adm-card-icon-shape{
  position:relative;
  width:20px;
  height:20px;
  border-radius:4px;
}

/* Папка (Каталог) */
.adm-card-icon-shape--folders{
  background:linear-gradient(135deg,#22c55e,#16a34a);
}
.adm-card-icon-shape--folders::before{
  content:"";
  position:absolute;
  left:0;
  right:30%;
  top:-4px;
  height:7px;
  border-radius:3px 3px 0 0;
  background:rgba(255,255,255,.85);
}

/* Список (Товары) */
.adm-card-icon-shape--list{
  background:linear-gradient(135deg,#3b82f6,#0ea5e9);
}
.adm-card-icon-shape--list::before,
.adm-card-icon-shape--list::after{
  content:"";
  position:absolute;
  left:3px;
  right:3px;
  height:2px;
  border-radius:999px;
  background:#eff6ff;
}
.adm-card-icon-shape--list::before{ top:5px; }
.adm-card-icon-shape--list::after{ top:11px; }

/* Плюс (Добавить товар) */
.adm-card-icon-shape--plus{
  background:linear-gradient(135deg,#22c55e,#16a34a);
}
.adm-card-icon-shape--plus::before,
.adm-card-icon-shape--plus::after{
  content:"";
  position:absolute;
  background:#f9fafb;
  border-radius:999px;
}
.adm-card-icon-shape--plus::before{
  width:12px;
  height:2px;
  top:9px;
  left:4px;
}
.adm-card-icon-shape--plus::after{
  width:2px;
  height:12px;
  top:4px;
  left:9px;
}

/* Коробка (Заказы) */
.adm-card-icon-shape--orders{
  background:linear-gradient(135deg,#f97316,#fb923c);
}
.adm-card-icon-shape--orders::before{
  content:"";
  position:absolute;
  inset:4px 3px 4px 3px;
  border-radius:3px;
  border:2px solid rgba(255,255,255,.9);
}
.adm-card-icon-shape--orders::after{
  content:"";
  position:absolute;
  left:5px;
  right:5px;
  top:7px;
  height:2px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
}

/* Звезда (Спецпредложения) */
.adm-card-icon-shape--star{
  background:radial-gradient(circle at 50% 20%,#facc15,#f97316);
}
.adm-card-icon-shape--star::before{
  content:"";
  position:absolute;
  inset:4px;
  background:
    conic-gradient(from 0deg,#fef9c3 0 20%,#fff7ed 20% 40%,#fed7aa 40% 60%,#f97316 60% 80%,#fef9c3 80% 100%);
  -webkit-mask:
    radial-gradient(circle at 50% 20%,transparent 0 55%,#000 55%) top/100% 60% no-repeat,
    radial-gradient(circle at 50% 80%,transparent 0 55%,#000 55%) bottom/100% 60% no-repeat;
  mask:
    radial-gradient(circle at 50% 20%,transparent 0 55%,#000 55%) top/100% 60% no-repeat,
    radial-gradient(circle at 50% 80%,transparent 0 55%,#000 55%) bottom/100% 60% no-repeat;
}

/* === НОВЫЕ === */

/* Партнёры (рукопожатие) */
.adm-card-icon-shape--partners{
  background:linear-gradient(135deg,#22c55e,#0ea5e9);
}
.adm-card-icon-shape--partners::before,
.adm-card-icon-shape--partners::after{
  content:"";
  position:absolute;
  height:8px;
  width:11px;
  border-radius:999px;
  background:#f9fafb;
}
.adm-card-icon-shape--partners::before{
  left:0;
  bottom:4px;
  transform:rotate(-12deg);
}
.adm-card-icon-shape--partners::after{
  right:0;
  bottom:4px;
  transform:rotate(12deg);
}

/* Поддержка (диалоговое облачко с «наушниками») */
.adm-card-icon-shape--support{
  background:linear-gradient(135deg,#6366f1,#0ea5e9);
}
.adm-card-icon-shape--support::before{
  content:"";
  position:absolute;
  inset:4px 4px 6px 4px;
  border-radius:6px;
  background:#eff6ff;
}
.adm-card-icon-shape--support::after{
  content:"";
  position:absolute;
  width:8px;
  height:5px;
  border-radius:999px;
  background:#0ea5e9;
  left:6px;
  bottom:3px;
}

/* текст внутри карточки */
.adm-card-content{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.adm-card-title{
  font-size:14px;
  font-weight:600;
}

.adm-card-sub{
  font-size:12px;
  color:#6b7280;
}

/* адаптив */
@media (max-width:900px){
  .adm-actions-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:640px){
  .adm-actions-grid{
    grid-template-columns:1fr;
  }
}
 /* ====== БЛОК НОВОСТЕЙ ====== */
  .news-section{
    margin-bottom: 40px;
  }
  .news-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:1rem;
    margin-bottom:24px;
  }
  .news-header-title{
    font-size:32px;
    line-height:1.1;
    font-weight:600;
  }
  .news-nav{
    display:flex;
    gap:8px;
  }
  .news-arrow{
    width:40px;
    height:40px;
    border-radius:999px;
    border:1px solid rgba(148,163,184,.7);
    background:#fff;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .15s ease, transform .15s ease, box-shadow .15s ease;
  }
  .news-arrow svg{
    width:18px;
    height:18px;
  }
  .news-arrow:hover{
    background:#f3f4f6;
    box-shadow:0 2px 6px rgba(15,23,42,.12);
    transform:translateY(-1px);
  }

  .news-track{
    display:flex;
    gap:24px;
    overflow-x:auto;
    padding-bottom:8px;
    scroll-behavior:smooth;
  }
  .news-track::-webkit-scrollbar{
    height:0; /* спрятать скролл под каруселью */
  }

  .news-card{
    flex:0 0 280px;
    max-width:320px;
    background:#fff;
    border-radius:6px;
    overflow:hidden;
    box-shadow:0 4px 16px rgba(15,23,42,.08);
    display:flex;
    flex-direction:column;
  }
  .news-card-image{
    display:block;
    width:100%;
    height:220px;
    overflow:hidden;
  }
  .news-card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
  }
  .news-card-body{
    padding:16px 18px 14px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .news-card-title{
    font-size:15px;
    line-height:1.4;
    font-weight:500;
    color:#111827;
    text-decoration:none;
  }
  .news-card-title:hover{
    color:#2563eb;
  }
  .news-card-date{
    margin-top:6px;
    font-size:14px;
    color:#9ca3af;
  }

  @media (max-width:768px){
    .news-header-title{
      font-size:24px;
    }
    .news-card{
      flex:0 0 240px;
    }
    .news-card-image{
      height:190px;
    }
  }
  /* ===== МОБИЛЬНАЯ АДАПТАЦИЯ БЛОКА НОВОСТЕЙ ===== */
/* Планшеты и мобилки: одна карточка по центру, без "хвостов" соседних */
@media (max-width: 768px) {
  .news-section{
    margin-top: 24px;
    margin-bottom: 32px;
    overflow: hidden;           /* обрезаем всё, что выходит за контейнер */
  }

  .news-header{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .news-header-title{
    font-size: 22px;
    line-height: 1.2;
  }


  .news-track{
    display: flex;
    gap: 0;                     /* без промежутков, чтобы не выглядывали края */
    overflow-x: auto;           /* скролл/свайп тут */
    margin: 0;
    padding: 0 20px 12px;       /* боковые отступы от краёв экрана */
    scroll-snap-type: x mandatory;
    scroll-padding-left: 20px;
    -webkit-overflow-scrolling: touch;
  }

  .news-card{
    flex: 0 0 100%;             /* ровно одна карточка на ширину экрана */
    max-width: 100%;
    margin: 0 auto;
    scroll-snap-align: center;  /* при остановке — по центру */
  }

  .news-card-image{
    height: 190px;
  }
}

@media (max-width: 480px) {
  .news-header-title{
    font-size: 20px;
  }

  .news-card-image{
    height: 170px;
  }

  .news-card-body{
    padding: 12px 14px 12px;
  }

  .news-card-title{
    font-size: 14px;
  }

  .news-card-date{
    font-size: 12px;
  }
}

/* ===== МОБИЛЬНАЯ ШАПКА ===== */

/* ===== МОБИЛЬНАЯ ШАПКА ===== */

.header-main-mobile{
  display:none;
  background:#ffffff;
  border-bottom:1px solid #e5e7eb;
}

.header-mobile-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:8px 0;
}

.header-burger{
  width:36px;
  height:36px;
  border:none;
  background:#0c8a3d;
  border-radius:8px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:4px;
  padding:0;
  cursor:pointer;
}

.header-burger span{
  display:block;
  width:18px;
  height:2px;
  background:#fff;
  border-radius:999px;
}

.header-mobile-logo{
  flex:1;
  text-align:center;
}

.logo-img-mobile{
  max-height:32px;
  margin:0 auto;
}

.header-mobile-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}

.header-mobile-phone{
  font-size:11px;
  font-weight:600;
  color:#111827;
  white-space:nowrap;
}

.currency-switcher--mobile{
  display:flex;
  gap:4px;
}

.currency-switcher--mobile .currency-pill{
  padding:3px 8px;
  font-size:11px;
}

.header-mobile-cart{
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:#0c8a3d;
  color:#fff;
  padding:4px 8px;
  border-radius:999px;
  font-size:11px;
}

.header-mobile-cart-icon svg{
  width:16px;
  height:16px;
}

.header-mobile-cart-count{
  min-width:18px;
  text-align:center;
}

/* поиск под мобильной шапкой */
.header-mobile-search{
  border-top:1px solid #e5e7eb;
  padding:6px 0 8px;
  background:#f5f5f5;
}

.header-mobile-search-form{
  display:flex;
  align-items:center;
  gap:6px;
}

.header-mobile-search-input{
  flex:1;
  padding:8px 10px;
  border-radius:6px;
  border:1px solid #d1d5db;
  font-size:13px;
}

.header-mobile-search-btn,
.header-mobile-search-photo{
  padding:8px 10px;
  border:none;
  border-radius:6px;
  font-size:12px;
  white-space:nowrap;
  cursor:pointer;
}

.header-mobile-search-btn{
  background:#0c8a3d;
  color:#fff;
}

.header-mobile-search-photo{
  background:#ffffff;
  color:#0c8a3d;
}

/* ===== МОБИЛЬНОЕ БУРГЕР-МЕНЮ ===== */
/* ===== МОБИЛЬНЫЙ ХЭДЕР ===== */
.header-main-mobile{
  display:none;            /* по умолчанию скрыт, покажем на мобилке */
  background:#ffffff;
}

@media (max-width: 768px){
  .header-main--desktop{
    display:none;          /* прячем десктопную шапку */
  }
  .header-main-mobile{
    display:block;
  }
}

.header-mobile-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:10px 16px;
}

/* бургер как на примере */
.header-burger{
  width:32px;
  height:32px;
  border:none;
  background:transparent;
  display:inline-flex;
  flex-direction:column;
  justify-content:center;
  gap:5px;
  padding:0;
  cursor:pointer;
}
.header-burger span{
  display:block;
  width:22px;
  height:3px;
  border-radius:999px;
  background:#111111;
}

/* логотип по центру */
.header-mobile-logo{
  flex:1;
  display:flex;
  justify-content:center;
}
.logo-img-mobile{
  max-height:32px;
  width:auto;
}

/* Вход/Кабинет + корзина справа */
.header-mobile-right{
  display:flex;
  align-items:center;
  gap:14px;
}

/* Вход/Кабинет */
.header-mobile-login{
  border:none;
  background:transparent;
  padding:0;
  font-size:15px;
  font-weight:600;
  color:#008631;           /* зелёный как на скрине */
  text-decoration:underline;
  cursor:pointer;
}

/* Корзина с зелёным кружком */
.header-mobile-cart{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.header-mobile-cart-icon svg{
  width:26px;
  height:26px;
}
.header-mobile-cart-count{
  position:absolute;
  top:-8px;
  right:-10px;
  width:26px;
  height:26px;
  border-radius:50%;
  background:#008631;
  color:#ffffff;
  font-size:13px;
  font-weight:600;
  display:flex;
  align-items:center;
  justify-content:center;
}



.mobile-menu{
  position:fixed;
  inset:0 0 0 auto;
  width:80%;
  max-width:320px;
  background:#0b1120;
  color:#f9fafb;
  transform:translateX(100%);
  transition:transform .25s ease-out;
  z-index:1200;
  display:flex;
  flex-direction:column;
}

.mobile-menu-inner{
  padding:16px 16px 24px;
  height:100%;
  overflow-y:auto;
}

.mobile-menu.is-open{
  transform:translateX(0);
}

.mobile-menu-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,23,42,.55);
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease-out;
  z-index:1190;
}

.mobile-menu-backdrop.is-open{
  opacity:1;
  pointer-events:auto;
}

.mobile-menu-close{
  border:none;
  background:transparent;
  color:#e5e7eb;
  font-size:24px;
  line-height:1;
  padding:0;
  margin-left:auto;
  cursor:pointer;
}

/* пользователь */
.mobile-menu-user{
  margin:8px 0 12px;
  display:flex;
  align-items:center;
  gap:10px;
}

.mobile-menu-user-icon{
  width:32px;
  height:32px;
  border-radius:999px;
  background:linear-gradient(135deg,#22c55e,#16a34a);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:14px;
  color:#f9fafb;
}

.mobile-menu-user-name{
  font-size:14px;
  font-weight:600;
}

.mobile-menu-user-link{
  font-size:12px;
  color:#9ca3af;
}

/* кэшбэк */
.mobile-menu-cashback{
  margin-top:4px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(34,197,94,.08);
  border:1px solid rgba(34,197,94,.3);
  color:#bbf7d0;
  font-size:13px;
}

.mobile-menu-cashback-icon{
  width:22px;
  height:22px;
  border-radius:999px;
  background:#22c55e;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  font-size:13px;
}

.mobile-menu-cashback-text span{
  display:block;
  font-size:11px;
  color:#86efac;
}

/* выйти */
.mobile-menu-logout{
  margin-top:10px;
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(248,113,113,.4);
  color:#fecaca;
  font-size:12px;
}

/* авторизация (гость) */
.mobile-menu-auth{
  display:flex;
  gap:8px;
  margin:12px 0 8px;
}

.mobile-menu-auth-btn{
  flex:1;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.6);
  background:transparent;
  color:#e5e7eb;
  font-size:13px;
  padding:8px 0;
  cursor:pointer;
}

.mobile-menu-auth-btn--accent{
  background:linear-gradient(135deg,#0ea5e9,#22c55e);
  border:none;
  color:#0f172a;
  font-weight:600;
}

/* список ссылок */
.mobile-menu-nav{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(148,163,184,.35);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.mobile-menu-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:9px 4px;
  font-size:14px;
  color:#e5e7eb;
}

.mobile-menu-link::after{
  content:"›";
  font-size:18px;
  line-height:1;
  color:#4b5563;
}

/* блокируем скролл под меню */
body.mobile-menu-open{
  overflow:hidden;
}

/* ===== ПЕРЕКЛЮЧЕНИЕ ДЕСКТОП / МОБИЛЬНЫЙ ===== */

@media (max-width: 768px){
  .header-main--desktop{
    display:none;
  }

  .nav-bar{
    display:none;
  }

  .search-bar-wrap{
    display:none;
  }

  .header-main-mobile{
    display:block;
  }
}
/* Бэкдроп под модалкой поиска по фото */
.modal-photo-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
  z-index: 60;
}

/* Корпус модалки */
.modal-photo{
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  z-index: 61;
  pointer-events: none;
  transition: opacity .2s ease, visibility .2s ease;
}

/* Когда модалка активна — добавляешь класс .is-open через JS */
.modal-photo.is-open{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.modal-photo-backdrop.is-open{
  opacity: 1;
  visibility: visible;
}

.modal-photo-inner{
  max-width: 480px;
  width: 100%;
  background: #ffffff;
  border-radius: 12px;
  box-shadow:
    0 22px 45px rgba(15, 23, 42, 0.20),
    0 0 0 1px rgba(148, 163, 184, 0.25);
  padding: 24px 24px 22px;
  position: relative;
}

.modal-photo-close{
  position: absolute;
  right: 14px;
  top: 12px;
  border: none;
  background: transparent;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  color: #6b7280;
}

.modal-photo-title{
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 4px;
  color: #111827;
}

.modal-photo-text{
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 16px;
}

.modal-photo-form{
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* Placeholder / dropzone под фото */
.photo-dropzone{
  border-radius: 14px;
  border: 2px dashed #d1d5db;
  background: #f9fafb;
  padding: 22px 16px;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
  display: block;
}
.photo-dropzone:hover{
  border-color: #059669;
  background: #f0fdf4;
  box-shadow: 0 0 0 1px rgba(5, 150, 105, 0.2);
}

.photo-dropzone-input{
  display: none;
}

.photo-dropzone-inner{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 4px;
}

.photo-dropzone-icon{
  width: 56px;
  height: 56px;
  border-radius: 999px;
  background: #059669;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
  margin-bottom: 4px;
}

.photo-dropzone-title{
  font-size: 15px;
  font-weight: 600;
  color: #111827;
}

.photo-dropzone-sub{
  font-size: 13px;
  color: #6b7280;
}

.photo-dropzone-hint{
  font-size: 12px;
  color: #9ca3af;
}

.modal-photo-submit{
  margin-top: 4px;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 999px;
  border: none;
  padding: 9px 18px;
  font-size: 14px;
  font-weight: 600;
  background: #059669;
  color: #ffffff;
  cursor: pointer;
  transition: background .15s ease, box-shadow .15s ease, transform .05s ease;
}
.modal-photo-submit:hover{
  background: #047857;
  box-shadow: 0 8px 20px rgba(4, 120, 87, 0.35);
}
.modal-photo-submit:active{
  transform: translateY(1px);
  box-shadow: none;
}

/* Кнопка поиска по фото в шапке (если нужно слегка освежить) */

.photo-search-preview{
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f3f4f6;
  border: 1px dashed #d1d5db;
}

.photo-search-preview-title{
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 500;
  color: #4b5563;
}

.photo-search-preview-image-wrap{
  width: 100%;
  max-height: 260px;
  overflow: hidden;
  border-radius: 8px;
  background: #111827;
  display: flex;
  align-items: center;
  justify-content: center;
}

.photo-search-preview-image-wrap img{
  max-width: 100%;
  max-height: 260px;
  object-fit: contain;
  display: block;
}

.photo-search-preview-remove{
  margin-top: 10px;
  padding: 6px 10px;
  border-radius: 999px;
  border: none;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  background: #e5e7eb;
  color: #374151;
}

.photo-search-preview-remove:hover{
  background: #d1d5db;
}
.photo-dropzone.is-hidden {
  display: none;
}
/* Обёртка превью */
.photo-preview {
  margin-top: 14px;
}

/* Контейнер под картинку */
.photo-preview-inner {
  width: 100%;
  max-height: 260px;
  border-radius: 10px;
  overflow: hidden;
  background: #0f172a;              /* тёмный фон, как у сайта */
  border: 1px solid rgba(148,163,184,0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px;
}

/* Картинка подгоняется под контейнер */
.photo-preview-img {
  max-width: 100%;
  max-height: 240px;
  width: 100%;
  height: auto;
  object-fit: contain;              /* сохраняет пропорции, вся деталь видна */
  display: block;
}

/* Кнопка "Изменить фото" */
.photo-preview-change {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;

  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,0.5);

  background: #111827;
  color: #e5e7eb;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}

.photo-preview-change:hover {
  background: #0c8a3d;
  border-color: #22c55e;
  color: #ffffff;
  transform: translateY(-1px);
}

.photo-preview-change:active {
  transform: translateY(0);
  background: #0a6a30;
}

/* На маленьких экранах растянем кнопку на всю ширину */
@media (max-width: 480px) {
  .photo-preview-change {
    width: 100%;
  }
}

/* Скрытие плейсхолдера, когда есть превью */
.photo-dropzone.is-hidden {
  display: none;
}
.news-section{
  margin-top: 40px;   /* или 32px, как нравится */
}
/* Скрываем бургер-меню в десктопной версии */
@media (min-width: 769px){
  .header-main--desktop .header-burger{
    display:none;
  }
}
/* === Хлебные крошки на странице товара === */
.breadcrumbs{
  font-size:13px;
  color:#6b7280;
  margin-bottom:12px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
}

.breadcrumbs a{
  color:#4b5563;
  text-decoration:none;
  transition:color .15s ease, text-decoration .15s ease;
}

.breadcrumbs a:hover{
  color:#0c8a3d;
  text-decoration:underline;
}

.breadcrumbs span:last-child{
  color:#111827;
  font-weight:500;
}

/* === Мета-инфо под заголовком товара (бренд, категория) === */
.product-page-head-row{
  margin-top:6px;
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  align-items:center;
}

.product-page-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px 10px;
  font-size:13px;
  color:#6b7280;
}

.product-page-meta-item{
  padding:3px 10px;
  border-radius:999px;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
}

/* На узких экранах всё в столбик */
@media (max-width: 640px){
  .product-page-head-row{
    flex-direction:column;
    align-items:flex-start;
    gap:6px;
  }
}

/* === Блок "Доставка и оплата" справа от товара === */
.product-info-block{
  margin-top:18px;
  padding:14px 16px;
  border-radius:8px;
  background:#f9fafb;
  border:1px solid #e5e7eb;
  border-left:3px solid #0c8a3d;
}

.product-info-block h2{
  font-size:16px;
  font-weight:600;
  margin-bottom:6px;
  color:#111827;
}

.product-info-list{
  margin:6px 0 0;
  padding-left:18px;
  font-size:14px;
  color:#4b5563;
  line-height:1.5;
}

.product-info-list li{
  margin-bottom:4px;
}

/* === Блок "Наличие в других магазинах" === */
.partner-offers{
  margin-top:24px;
  padding:24px 0 32px;
  border-top:1px solid #e5e7eb;
  background:transparent;
}

.partner-offers-title{
  font-size:22px;
  font-weight:600;
  margin-bottom:16px;
  color:#111827;
}

/* Сетка карточек с предложениями партнёров */
.partner-offers-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

@media (max-width: 960px){
  .partner-offers-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width: 640px){
  .partner-offers-list{
    grid-template-columns:1fr;
  }
}

/* Карточка партнёрского предложения */
.partner-offer-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:8px;
  padding:12px 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.partner-offer-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:8px;
  margin-bottom:6px;
}

.partner-offer-shop{
  font-size:14px;
  font-weight:600;
  color:#111827;
}

.partner-offer-location{
  font-size:13px;
  color:#6b7280;
}

/* Характеристики внутри карточки (цена / срок / остаток) */
.partner-offer-meta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
}

.partner-offer-meta > div{
  flex:1 1 0;
}

.partner-offer-meta dt{
  font-weight:500;
  color:#6b7280;
  margin-bottom:2px;
}

.partner-offer-meta dd{
  margin:0;
  font-weight:600;
  color:#111827;
}

/* На мобиле складываем характеристики в столбик */
@media (max-width: 640px){
  .partner-offer-meta{
    flex-direction:column;
    align-items:flex-start;
  }
}
/* ==== Табы на странице товара ==== */
.product-tabs-wrapper{
  margin-top:18px;
}

.product-tabs{
  display:flex;
  gap:8px;
  border-bottom:1px solid #e5e7eb;
  margin-bottom:10px;
}

.product-tab{
  border:none;
  background:transparent;
  padding:8px 14px;
  font-size:14px;
  font-weight:500;
  color:#6b7280;
  cursor:pointer;
  border-radius:8px 8px 0 0;
  transition:color .15s ease, background .15s ease;
}

.product-tab.is-active{
  color:#111827;
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-bottom-color:#ffffff;
}

.product-tab-panels{
  border:1px solid #e5e7eb;
  border-radius:0 8px 8px 8px;
  padding:12px 14px;
  background:#fff;
  font-size:14px;
  color:#374151;
}

.product-tab-panel{
  display:none;
}

.product-tab-panel.is-active{
  display:block;
}

/* Описание / характеристики */
.product-description-text{
  line-height:1.6;
}

.product-description-text--empty{
  color:#6b7280;
  font-style:italic;
}

.product-specs-table{
  width:100%;
  border-collapse:collapse;
  font-size:14px;
}

.product-specs-table th,
.product-specs-table td{
  padding:6px 8px;
  border-bottom:1px solid #e5e7eb;
}

.product-specs-table th{
  width:40%;
  text-align:left;
  font-weight:500;
  color:#6b7280;
}

.product-specs-empty{
  margin:0;
  color:#6b7280;
  font-style:italic;
}

/* ==== Похожие товары ==== */
.product-related{
  margin-top:16px;
  padding:24px 0 32px;
  border-top:1px solid #e5e7eb;
}

.product-related-title{
  font-size:22px;
  font-weight:600;
  margin-bottom:14px;
  color:#111827;
}

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

@media (max-width: 1024px){
  .product-related-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width: 768px){
  .product-related-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width: 480px){
  .product-related-grid{
    grid-template-columns:1fr;
  }
}

/* ===== Похожие товары ===== */

.product-related {
  padding: 40px 0 48px;
  border-top: 1px solid #e5e7eb;
  background: #f9fafb;
}

.product-related-head {
  margin-bottom: 20px;
}

.product-related-title {
  font-size: 20px;
  font-weight: 600;
  color: #111827;
  margin-bottom: 4px;
}

.product-related-subtitle {
  font-size: 13px;
  color: #6b7280;
}

.product-related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 18px;
}

/* Карточка похожего товара */

.product-card-mini {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  padding: 10px 10px 12px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.04);
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.product-card-mini:hover {
  transform: translateY(-3px);
  border-color: #0c8a3d;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
  background: #ffffff;
}

.product-card-mini-img {
  position: relative;
  width: 100%;
  padding-top: 70%;
  border-radius: 10px;
  overflow: hidden;
  background: #f3f4f6;
  margin-bottom: 10px;
}

.product-card-mini-img img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}



.product-card-mini-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.product-card-mini-title {
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
  color: #111827;
  max-height: 3.9em;
  overflow: hidden;
}

.product-card-mini-sku {
  font-size: 12px;
  color: #6b7280;
}

.product-card-mini-bottom {
  margin-top: 6px;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.product-card-mini-price {
  font-size: 15px;
  font-weight: 700;
  color: #0c8a3d;
}

.product-card-mini-similarity {
  font-size: 11px;
  color: #9ca3af;
}

/* Мобилка: плотнее сетка */

@media (max-width: 640px) {
  .product-related-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .product-card-mini {
    padding: 8px 8px 10px;
  }

  .product-card-mini-title {
    font-size: 12px;
  }

  .product-card-mini-price {
    font-size: 14px;
  }
}
/* Внутренний блок с воздухом */
.product-related-inner{

  border-radius:16px;
  padding:24px 24px 28px;   /* вот тут как раз пространство внутри */

}

/* Чуть больше паддинги внутри самой карточки */
.product-card-mini{
  padding:14px 16px 16px;
}

/* Чуть опустим бейдж, чтобы не лип к краю */
.product-card-mini-badge {
  top: 10px;
  left: 10px;
}

/* Немного больше отступ между картинкой и текстом */
.product-card-mini-img{
  margin-bottom:12px;
}
/* Родителю нужно position: relative, чтобы absolute цеплялся к шапке */
.header-main-row {
  position: relative;
}

/* Блок погоды в десктопной шапке */
.currency-switcher {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding-top: 18px; /* даём место сверху под погоду */
}

/* Плашка погоды "над" свитчером */
.header-weather {
  position: absolute;
  top: -20px;              /* можно поиграться значением, чтобы нравилось визуально */
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  gap: 4px;

  padding: 8px 10px;
  border-radius: 9999px;

  background-color: #fff;
  color: #020617;
  font-size: 11px;
  line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,0.08);

  z-index: 2;
  pointer-events: none; /* чтобы клики по валюте не блокировала */
}

/* Иконка погоды — уменьшаем твой большой SVG */
.header-weather-icon svg {
  width: 14px;
  height: 14px;
  display: block;
}

.header-weather-temp {
  font-weight: 600;
}

.header-weather-city {
  opacity: 0.8;
}

/* Мобильный вариант — оставляем встроенным, не absolute */
.header-weather--mobile {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: #ffffff;
}

/* На узких экранах можно отключить абсолютное позиционирование,
   чтобы ничего не ломало адаптив */
@media (max-width: 1024px) {
  .header-weather {
    position: static;
    transform: none;
    margin-left: 12px;
    box-shadow: none;
    background: transparent;
    color: green;
  }

  .header-weather-icon svg {
    stroke: #ffffff;
    fill: transparent;
  }
}
.user-panel-cashback {
  margin-top: 2px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  color: #008631; /* жёлтый, как акцент */
  text-decoration: none;
}

.user-panel-cashback-value {
  font-weight: 600;
}
/* ===== СЛАЙДЕР СПЕЦПРЕДЛОЖЕНИЙ ===== */
.specials-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:16px;
}
.specials-head .page-title{
  margin-bottom:0;
}
.specials-nav{
  display:flex;
  gap:8px;
}
.contact-btn-icon svg{
  width:20px;
  height:20px;
  display:block;
}
.specials-arrow{
  width:32px;
  height:32px;
  border-radius:9999px;
  border:1px solid #d1d5db;
  background:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .08s ease;
}
.specials-arrow svg{
  width:18px;
  height:18px;
}
.specials-arrow:hover:not(:disabled){
  background:#f3f4f6;
  border-color:#9ca3af;
  transform:translateY(-1px);
}
.specials-arrow:disabled{
  opacity:.4;
  cursor:default;
}

/* окно слайдера – режем всё лишнее и даём ширину ровно под 4 карточки */
.specials-window{
  overflow:hidden;
  max-width: calc(260px * 4 + 24px * 3); /* 4 карточки по 260px + 3 промежутка по 24px */
  margin:0 auto;
}

/* дорожка с карточками */
.specials-track{
  display:flex;
  gap:24px; /* такой же визуальный отступ между карточками, как в сетке */
}

/* сами карточки – фиксированная ширина, как в обычном каталоге */
.specials-track .product-card{
  box-sizing:border-box;
  flex:0 0 260px;
  max-width:260px;

}

/* адаптив, чтобы на узких экранах оно не ломалось */
@media (max-width:1024px){
  .specials-window{
    max-width:100%;
  }
}

/* окно слайдера – режем всё лишнее и даём ширину ровно под 4 карточки */
.specials-window{
  overflow:hidden;
  max-width: calc(260px * 4 + 24px * 3); /* 4 карточки по 260px + 3 промежутка по 24px */
  margin:0 auto;
}

/* адаптив, чтобы на узких экранах была ОДНА карточка */
@media (max-width:768px){
  .specials-window{
    max-width: 280px;   /* одна карточка 260px + небольшие поля */
    padding: 0 8px;
  }
}
/* Центрируем заголовки и стрелки на мобиле */
@media (max-width: 768px){
  /* спецпредложения */
  .specials-head{
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .specials-head .page-title{
    width: 100%;
    text-align: center;
  }

  .specials-nav{
    margin-top: 8px;
    justify-content: center;
  }

  /* блок новостей */
  .news-header{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .news-header-title{
    width: 100%;
    text-align: center;
  }

  .news-nav{
    display: flex;          /* важно: делаем flex, чтобы justify-content сработал */
    margin-top: 8px;
    justify-content: center; /* стрелки по центру */
    
  }

  /* одна новость на экране, горизонтальный скролл/свайп */
  .news-track{
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 16px;
    padding: 0 8px;
  }

 .news-card{
    flex: 0 0 88%;            /* не 100%, а ~88% ширины */
    max-width: 360px;         /* ограничим максимальную ширину */
    margin: 0 auto;
    scroll-snap-align: center;
  }

  /* если хочешь вообще все h1.page-title по центру на мобиле */
  .page-title{
    text-align: center;
  }
}
/* ===== БЛОК ПРЕИМУЩЕСТВ СЕРВИСА ===== */
.benefits-section{
  margin:40px 0 32px;
}

.benefits-head{
  text-align:left;
  margin-bottom:20px;
}

.benefits-title{
  font-size:24px;
  font-weight:700;
  margin-bottom:4px;
}

.benefits-subtitle{
  font-size:14px;
  color:#6b7280;
}

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

.benefit-card{
  border-radius:12px;
  border:1px solid #e5e7eb;
  background:#ffffff;
  padding:16px 18px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.benefit-label{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-weight:600;
  color:#25eb5a;
}

.benefit-title{
  font-size:16px;
  font-weight:600;
}

.benefit-text{
  font-size:13px;
  color:#6b7280;
}

/* адаптив по преимуществам */
@media (max-width:1024px){
  .benefits-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (max-width:640px){
  .benefits-section{
    margin:28px 0 24px;
  }
  .benefits-head{
    text-align:center;
  }
  .benefits-grid{
    grid-template-columns:1fr;
  }
}

/* ===== БЛОК "СВЯЗАТЬСЯ БЫСТРО" ===== */
.contact-fast{
  margin:24px 0 40px;
  border-radius:16px;
  padding:18px 20px;
  background:linear-gradient(135deg,#0f766e,#0ea5e9);
  color:#ffffff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
}

.contact-fast-text{
  max-width:420px;
}

.contact-fast-title{
  font-size:20px;
  font-weight:700;
  margin-bottom:4px;
}

.contact-fast-subtitle{
  font-size:14px;
  opacity:.9;
}

.contact-fast-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.contact-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:8px 14px;
  border-radius:9999px;
  font-size:14px;
  font-weight:600;
  border:none;
  cursor:pointer;
  text-decoration:none;
  transition:transform .08s ease, box-shadow .12s ease, background .12s ease;
  white-space:nowrap;
}

.contact-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 20px rgba(0,0,0,.18);
}

/* цвета кнопок */
.contact-btn--wa{
  background:#22c55e;
  color:#ffffff;
}
.contact-btn--wa:hover{
  background:#16a34a;
}
.contact-btn--tg{
  background:#0ea5e9;
  color:#ffffff;
}
.contact-btn--tg:hover{
  background:#0284c7;
}
.contact-btn--phone{
  background:#f97316;
  color:#ffffff;
}
.contact-btn--phone:hover{
  background:#ea580c;
}

.contact-btn-icon{
  font-size:16px;
}

/* адаптив по "Связаться быстро" */
@media (max-width:768px){
  .contact-fast{
    flex-direction:column;
    align-items:flex-start;
  }
  .contact-fast-text{
    max-width:100%;
  }
}
@media (max-width:480px){
  .contact-fast{
    padding:14px 14px;
  }
  .contact-fast-title{
    font-size:18px;
  }
  .contact-fast-actions{
    width:100%;
  }
  .contact-btn{
    flex:1 1 auto;
    justify-content:center;
  }
}
/* Дополнительные отступы по краям для блоков */
.benefits-section{
  padding-left: 8px;
  padding-right: 8px;
}

/* На больших экранах вернём в ноль — там и так контейнер держит поля */
@media (min-width: 768px){
  .benefits-section{
    padding-left: 0;
    padding-right: 0;
  }
}
/* ===== ПОЛОСА ЛОГО БРЕНДОВ ===== */
.brands-marquee{
  margin: 24px 0 32px;
  border-radius: 16px;
  padding: 14px 16px;

  overflow: hidden;
}

.brands-marquee-head{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:8px;
}

.brands-marquee-head h2{
  font-size:20px;
  font-weight:900;
}

.brands-marquee-head p{
  font-size:13px;
  color:#6b7280;
}

.brands-marquee-viewport{
  overflow:hidden;
}

.brands-marquee-track{
  display:inline-flex;
  align-items:center;
  gap:20px;
  padding: 20px;
  white-space:nowrap;
  animation: brands-marquee 30s linear infinite;
}

/* Одна плитка с лого */
.brand-logo-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:140px;
  height:140px;
  border-radius:16px;          /* можешь сделать 8px или 0, если нужен прямой квадрат */
  background:#ffffff;
  border:1px solid #e5e7eb;
  box-shadow:0 1px 3px rgba(15,23,42,.08);
  text-decoration:none;
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.brand-logo-link img{
  display:block;
  max-width:70%;
  max-height:70%;
  object-fit:contain;
  filter: grayscale(0.15);
  opacity:0.9;
  transition:
    filter .15s ease,
    opacity .15s ease,
    transform .15s ease;
}

.brand-logo-link:hover{

  box-shadow:0 8px 20px rgba(15,23,42,.16);
  border-color:#0ea5e9;
  background:#eff6ff;
}

.brand-logo-link:hover img{
  filter:none;
  opacity:1;
  transform:scale(1.04);
}

/* При наведении на полосу/любой логотип — стоп анимации */
.brands-marquee:hover .brands-marquee-track{
  animation-play-state: paused;
}

@keyframes brands-marquee{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);  /* т.к. дублируем список лого 2 раза */
  }
}

/* Адаптив */
@media (max-width:640px){
  .brands-marquee{
    padding:10px 12px;
  }
  .brands-marquee-head h2{
    font-size:18px;
  }
  .brand-logo-link{
    width:64px;
    height:64px;
    border-radius:14px;
  }
  .brand-logo-link img{
    max-height:24px;
  }
}
/* ===== ПОЛОСА ЛОГО БРЕНДОВ ===== */
.brands-marquee{
  margin: 24px 0 32px;
  border-radius: 16px;
  padding: 14px 16px;

  overflow: hidden;
}

.brands-marquee-head{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:8px;
}

.brands-marquee-head h2{
  font-size:25px;
  font-weight:700;
}

.brands-marquee-head p{
  font-size:13px;
  color:#6b7280;
}

.brands-marquee-viewport{
  overflow:hidden;
}

.brands-marquee-track{
  display:inline-flex;
  align-items:center;
  gap:20px;
  white-space:nowrap;
  animation: brands-marquee 30s linear infinite;
}

/* Одна плитка с лого */
.brand-logo-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:140px;
  height:140px;
  border-radius:16px;          /* можешь сделать 8px или 0, если нужен прямой квадрат */
  background:#ffffff;
  border:1px solid #e5e7eb;
  box-shadow:0 1px 3px rgba(15,23,42,.08);
  text-decoration:none;
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    border-color .15s ease,
    background .15s ease;
}

.brand-logo-link img{
  display:block;
  max-width:70%;
  max-height:70%;
  object-fit:contain;
  filter: grayscale(0.15);
  opacity:0.9;
  transition:
    filter .15s ease,
    opacity .15s ease,
    transform .15s ease;
}

.brand-logo-link:hover{

  box-shadow:0 8px 20px rgba(15,23,42,.16);
  border-color:#0ea5e9;
  background:#eff6ff;
}

.brand-logo-link:hover img{
  filter:none;
  opacity:1;
  transform:scale(1.04);
}

/* При наведении на полосу/любой логотип — стоп анимации */
.brands-marquee:hover .brands-marquee-track{
  animation-play-state: paused;
}

@keyframes brands-marquee{
  0%{
    transform:translateX(0);
  }
  100%{
    transform:translateX(-50%);  /* т.к. дублируем список лого 2 раза */
  }
}

/* Адаптив */
@media (max-width:640px){
  .brands-marquee{
    padding:10px 12px;
  }
  .brands-marquee-head h2{
    font-size:18px;
  }
  .brand-logo-link{
    width:64px;
    height:64px;
    border-radius:14px;
  }
  .brand-logo-link img{
    max-height:24px;
  }
}

.benefit-card-head{
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-bottom:6px;
}

.benefit-head-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}

/* общий стиль кружка */
.benefit-icon{
  width:40px;
  height:40px;
  border-radius:9999px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  background:rgba(37,99,235,0.06);
  border:1px solid rgba(148,163,184,0.4);
}

.benefit-icon svg{
  width:22px;
  height:22px;
  color:#2563eb;
}

/* можно чуть отличать по цвету заливки */
.benefit-icon--reliability{
  background:rgba(22,163,74,0.08);
}
.benefit-icon--speed{
  background:rgba(249,115,22,0.08);
}
.benefit-icon--warehouse{
  background:rgba(14,165,233,0.08);
}
.benefit-icon--vin{
  background:rgba(99,102,241,0.08);
}
.cashback-banner{
  margin: 32px 0;
  padding: 22px 24px;
  border-radius: 18px;
  background: radial-gradient(circle at top left, #4ade80 0, #14532d 30%, #022c22 80%);
  color:#f9fafb;
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  gap:24px;
  box-shadow:0 20px 40px rgba(15,23,42,0.35);
  overflow:hidden;
}

.cashback-main{
  flex:1.4;
  display:flex;
  flex-direction:column;
  gap:12px;
    align-items:flex-start;
}

.cashback-tag{
  display:inline-flex;
  align-items:center;
  padding:3px 10px;
  border-radius:9999px;
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
  background:rgba(15,23,42,0.9);
  border:1px solid rgba(148,163,184,0.4);
  color:#bbf7d0;
}

.cashback-title{
  font-size:22px;
  font-weight:800;
  line-height:1.25;
}

.cashback-subtitle{
  font-size:14px;
  color:#e5e7eb;
  max-width:460px;
}

.cashback-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:4px;
}

.cashback-pill{
  font-size:12px;
  padding:6px 10px;
  border-radius:9999px;
  border:1px solid rgba(209,250,229,0.5);
  background:rgba(6,95,70,0.5);
  backdrop-filter:blur(6px);
}

.cashback-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}

.cashback-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 16px;
  border-radius:9999px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  transition:transform .08s ease, box-shadow .12s ease, background .12s ease, color .12s ease, border-color .12s ease;
  border:1px solid transparent;
}

.cashback-btn--primary{
  background:#22c55e;
  color:#022c22;
  box-shadow:0 10px 25px rgba(21,128,61,0.55);
}

.cashback-btn--primary:hover{
  background:#16a34a;
  transform:translateY(-1px);
  box-shadow:0 16px 30px rgba(21,128,61,0.65);
}

.cashback-btn--ghost{
  background:transparent;
  color:#e5e7eb;
  border-color:rgba(148,163,184,0.7);
}

.cashback-btn--ghost:hover{
  background:rgba(15,23,42,0.4);
  border-color:#e5e7eb;
  transform:translateY(-1px);
}

/* Правая часть: шаги */
.cashback-steps{
  flex:1;
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.cashback-step{
  border-radius:14px;
  padding:10px 12px;
  background:rgba(15,23,42,0.55);
  border:1px solid rgba(15,118,110,0.55);
  display:flex;
  align-items:flex-start;
  gap:10px;
}

.cashback-step-icon{
  width:34px;
  height:34px;
  border-radius:9999px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:700;
  background:radial-gradient(circle at 30% 0%, #bbf7d0, #16a34a 60%, #052e16 100%);
  color:#022c22;
  flex-shrink:0;
}

/* Можно немного отличать иконки цветом, если захочешь */
.cashback-step-title{
  font-size:14px;
  font-weight:600;
  margin-bottom:2px;
}

.cashback-step-text{
  font-size:12px;
  color:#d1d5db;
}

/* Адаптив */
@media (max-width:900px){
  .cashback-banner{
    flex-direction:column;
  }
  .cashback-steps{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .cashback-banner{
    padding:16px 16px;
  }
  .cashback-title{
    font-size:20px;
  }
  .cashback-steps{
    grid-template-columns:1fr;
  }
}
/* === ПЛАВНОЕ ПОЯВЛЕНИЕ БЛОКОВ === */
@keyframes fade-up-soft{
  from{
    opacity:0;
    transform:translateY(16px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.cashback-banner,
.benefits-section,
.brands-marquee,
.news-section,
.contact-fast{
  opacity:0;
  animation:fade-up-soft .6s ease forwards;
}

/* лёгкая задержка, чтобы всё не прыгало разом */
.benefits-section{ animation-delay:.08s; }
.brands-marquee{  animation-delay:.12s; }
.news-section{    animation-delay:.16s; }
.contact-fast{    animation-delay:.2s; }

/* === ХОВЕР ДЛЯ КАРТОЧЕК ПРЕИМУЩЕСТВ === */
.benefit-card{
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease,
    background .16s ease;
}

.benefit-card:hover{
  transform:translateY(-4px);
  box-shadow:0 14px 30px rgba(15,23,42,.12);
  border-color:#cbd5f5;
  background:#f9fafb;
}

/* === БЛИК ПО ПИЛЮЛЕ "НОВАЯ ВЫГОДА" === */
@keyframes cashback-shine{
  0%,70%{
    transform:translateX(-130%);
  }
  85%{
    transform:translateX(130%);
  }
  100%{
    transform:translateX(130%);
  }
}

.cashback-tag{
  position:relative;
  overflow:hidden;
}

.cashback-tag::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(120deg,
    transparent 0,
    rgba(248,250,252,.6) 45%,
    transparent 90%);
  transform:translateX(-130%);
  pointer-events:none;
  opacity:.7;
  mix-blend-mode:screen;
  animation:cashback-shine 3.2s ease-in-out infinite;
}
.product-availability-row.is-out .product-availability-dot {
  background-color: #dc2626; /* красный */
}

.product-availability-row.is-out .product-availability-text {
  color: #dc2626;
}

.product-notify-form {
  margin-top: 16px;
}

.product-notify-text {
  font-size: 14px;
  color: #4b5563;
  margin-bottom: 8px;
}

.product-notify-row {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.product-notify-input {
  flex: 1 1 180px;
  padding: 8px 10px;
  border-radius: 6px;
  border: 1px solid #d1d5db;
  font-size: 14px;
}

.product-notify-btn {
  padding: 8px 16px;
  border-radius: 6px;
  border: none;
  cursor: pointer;
  background: #0f766e;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
}

.product-notify-btn:hover {
  background: #0d5f59;
}