/**
 * sale.css — страница «Распродажа». СВЕТЛЫЙ фон, тёмный читаемый текст,
 * акценты в цветах темы (навигация #212b62, золото #e8a530). Промо-баннер —
 * тёмно-синий (как прифутер) с белым текстом для контраста.
 * Подключается только на /catalog/rasprodazha/ (inc/sale-page.php).
 */

.sale{
  --s-bg:#f6f8fc;
  --s-panel:#ffffff; --s-panel2:#f9fafc;
  --s-border:#e6e9f2; --s-border2:#d5dbe8;
  --s-text:#1a1f3a; --s-muted:#5b6478; --s-dim:#98a1b5;
  --s-navy:#212b62; --s-navy2:#191f4a; --s-navy-l:#3a4580;
  --s-gold:#e8a530; --s-gold-d:#b97d15;
  --s-green:#1f9d57; --s-red:#e11900; --s-red-l:#ff5a45;

  position:relative;
  background:var(--s-bg);
  color:var(--s-text);
  min-height:70vh;
  padding:26px 0 46px;
  overflow-x:hidden; /* страховка: секция распродажи не тянет страницу вбок */
}
.sale *{box-sizing:border-box}
.sale__inner{max-width:1400px;margin:0 auto;padding:0 16px}
.sale a{text-decoration:none}
.sale__accent-gold{color:var(--s-gold-d)}
.sale__accent-red{color:var(--s-red)}
.sale__accent-navy{color:var(--s-navy)}
.sale__accent-green{color:var(--s-green)}

/* Шапка */
.sale__head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px;flex-wrap:wrap}
.sale__title-row{display:flex;align-items:center;gap:12px}
.sale__title-icon{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--s-gold),var(--s-red));box-shadow:0 6px 18px rgba(225,25,0,.22)}
.sale__title{font-size:26px;font-weight:900;letter-spacing:-.5px;margin:0;color:var(--s-navy)}
.sale__subtitle{margin:5px 0 0 46px;color:var(--s-muted);font-size:14px}
.sale__subtitle strong{color:var(--s-text)}
.sale__stats{display:flex;gap:12px}
.sale__stat{display:flex;align-items:center;gap:10px;background:var(--s-panel);border:1px solid var(--s-border);border-radius:14px;padding:9px 16px;box-shadow:0 2px 8px rgba(20,30,60,.04)}
.sale__stat-num{font-size:22px;font-weight:900;line-height:1}
.sale__stat-lbl{font-size:11px;color:var(--s-dim);line-height:1.15}
@media(max-width:720px){.sale__stats{display:none}}

/* Секции */
.sale__section{margin-bottom:32px}
.sale__section-head{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.sale__section-bar{width:4px;height:22px;border-radius:4px;background:linear-gradient(180deg,var(--s-gold),var(--s-red))}
.sale__section-title{color:var(--s-navy);font-size:18px;font-weight:800;margin:0}
.sale__section-tag{font-size:11px;color:var(--s-muted);background:var(--s-panel);border:1px solid var(--s-border);padding:2px 10px;border-radius:20px}

/* Карусель */
.sale-carousel{position:relative;padding:0 8px}
.sale-carousel__viewport{overflow:hidden;border-radius:12px}
.sale-carousel__track{display:flex;gap:16px;transition:transform .45s cubic-bezier(.4,0,.2,1);will-change:transform;touch-action:pan-y}
.sale-card{flex:0 0 calc((100% - 32px)/3);min-width:0;display:flex;flex-direction:column;position:relative;background:var(--s-panel);border:1px solid var(--s-border);border-radius:16px;padding:16px;color:var(--s-text);transition:transform .25s,border-color .25s,box-shadow .25s;box-shadow:0 2px 10px rgba(20,30,60,.05)}
.sale-card:hover{transform:translateY(-4px);border-color:var(--s-gold);box-shadow:0 14px 30px rgba(20,30,60,.12)}
.sale-card__badge{position:absolute;top:12px;right:12px;background:linear-gradient(90deg,var(--s-gold),var(--s-red));color:#fff;font-size:12px;font-weight:800;padding:4px 10px;border-radius:20px;box-shadow:0 4px 10px rgba(225,25,0,.25)}
.sale-card__cat{align-self:flex-start;font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--s-navy);background:rgba(33,43,98,.07);padding:2px 8px;border-radius:5px;margin-bottom:10px;font-weight:700}
.sale-card__img{width:100%;height:120px;border-radius:12px;overflow:hidden;background:#fff;border:1px solid var(--s-border);display:flex;align-items:center;justify-content:center;margin-bottom:12px}
.sale-card__img img{width:100%;height:100%;object-fit:contain}
.sale-card__noimg{color:#c3ccdf}
.sale-card__name{font-size:14px;font-weight:600;line-height:1.35;color:var(--s-text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:38px}
.sale-card__prices{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:8px}
.sale-card__old{color:var(--s-dim);font-size:13px}
.sale-card__new{color:var(--s-navy);font-size:20px;font-weight:800}
.sale-card__new small{font-size:12px;font-weight:500;color:var(--s-muted)}
.sale-card__save{margin-top:10px;font-size:12px;font-weight:700;color:var(--s-red);background:rgba(225,25,0,.07);border:1px solid rgba(225,25,0,.15);border-radius:8px;padding:5px 10px;text-align:center}
.sale-carousel__nav{position:absolute;top:42%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;background:var(--s-navy);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(20,30,60,.25);transition:transform .2s,background .2s;z-index:5}
.sale-carousel__nav:hover{background:var(--s-gold);transform:translateY(-50%) scale(1.1)}
.sale-carousel__nav--prev{left:-6px}.sale-carousel__nav--next{right:-6px}
@media(max-width:900px){.sale-card{flex-basis:calc((100% - 16px)/2)}}
@media(max-width:560px){.sale-card{flex-basis:100%}}

/* Поиск */
.sale-search{position:relative;max-width:680px;margin:0 auto 30px}
.sale-search__box{display:flex;align-items:center;background:var(--s-panel);border:1px solid var(--s-border2);border-radius:16px;overflow:hidden;transition:border-color .2s,box-shadow .2s;box-shadow:0 4px 16px rgba(20,30,60,.06)}
.sale-search__box:focus-within{border-color:var(--s-gold);box-shadow:0 6px 20px rgba(232,165,48,.15)}
.sale-search__icon{margin:0 8px 0 16px;color:var(--s-gold-d);flex-shrink:0}
.sale-search__input{flex:1;background:transparent;border:none;outline:none;color:var(--s-text);font-size:14px;padding:14px 8px}
.sale-search__input::placeholder{color:var(--s-dim)}
.sale-search__clear{color:var(--s-dim);padding:0 12px;display:flex;align-items:center}
.sale-search__clear:hover{color:var(--s-red)}
.sale-search__btn{margin:6px;padding:9px 20px;background:var(--s-navy);color:#fff;border:none;border-radius:11px;font-size:14px;font-weight:700;cursor:pointer;transition:background .2s}
.sale-search__btn:hover{background:var(--s-gold)}
/* Живые подсказки поиска (ведут к товару) */
.sale-search__results{position:absolute;top:calc(100% + 6px);left:0;right:0;background:#fff;border:1px solid var(--s-border2);border-radius:14px;box-shadow:0 14px 34px rgba(20,30,60,.16);z-index:40;overflow:hidden;max-height:60vh;overflow-y:auto}
.sale-search__item{display:flex;align-items:center;gap:10px;padding:11px 14px;color:var(--s-text);border-bottom:1px solid var(--s-border);cursor:pointer;text-decoration:none}
.sale-search__item:last-child{border-bottom:none}
.sale-search__item:hover,.sale-search__item.is-active{background:#f4f6fb}
.sale-search__item-title{font-size:14px;font-weight:600;line-height:1.3;color:var(--s-navy)}
.sale-search__item mark{background:rgba(232,165,48,.28);color:inherit;border-radius:2px;padding:0 1px}
.sale-search__item-badge{margin-left:auto;flex-shrink:0;font-size:11px;color:var(--s-dim);background:var(--s-panel2);border:1px solid var(--s-border);border-radius:6px;padding:2px 8px;white-space:nowrap}
.sale-search__empty{padding:16px;text-align:center;color:var(--s-dim);font-size:13px}

/* Категории */
.sale-cats__title{display:flex;align-items:center;gap:8px;color:var(--s-navy);font-size:12px;text-transform:uppercase;letter-spacing:2px;font-weight:700;margin:0 0 14px}
.sale-cats__title svg{color:var(--s-gold-d)}
.sale-cats__chips{display:flex;flex-wrap:wrap;gap:10px}
.sale-chip{display:inline-flex;align-items:center;gap:8px;background:var(--s-panel);border:1px solid var(--s-border);color:var(--s-muted);font-size:13px;font-weight:600;padding:9px 14px;border-radius:12px;cursor:pointer;transition:all .2s}
.sale-chip:hover{color:var(--s-navy);border-color:var(--s-border2)}
.sale-chip.is-active{background:var(--s-navy);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(33,43,98,.22)}
.sale-chip__cnt{font-size:11px;font-weight:800;background:rgba(33,43,98,.08);color:var(--s-navy);padding:1px 7px;border-radius:8px}
.sale-chip.is-active .sale-chip__cnt{background:rgba(255,255,255,.2);color:#fff}
.sale-chip__pct{font-size:11px;font-weight:800;color:#fff;background:var(--s-red);padding:1px 6px;border-radius:6px}

/* Баннер (тёмно-синий, белый текст) */
.sale-banner{position:relative;overflow:hidden;border-radius:18px;margin-bottom:32px;background:linear-gradient(135deg,var(--s-navy) 0,var(--s-navy2) 100%);box-shadow:0 12px 34px rgba(20,30,60,.18)}
.sale-banner__blob{position:absolute;width:260px;height:260px;border-radius:50%;filter:blur(60px);opacity:.28;animation:saleBlob 3s ease-in-out infinite}
.sale-banner__blob--a{top:-60px;left:22%;background:var(--s-navy-l)}
.sale-banner__blob--b{bottom:-60px;right:22%;background:var(--s-gold);animation-delay:1s}
.sale-banner__inner{position:relative;z-index:2;display:flex;align-items:center;gap:28px;padding:30px 32px;flex-wrap:wrap}
.sale-banner__text{flex:1;min-width:240px}
.sale-banner__pill{display:inline-flex;align-items:center;gap:6px;background:var(--s-red);color:#fff;font-size:12px;font-weight:800;padding:5px 12px;border-radius:20px;animation:saleBounce 1s infinite}
.sale-banner__h{font-size:32px;font-weight:900;color:#fff;margin:12px 0 6px;line-height:1.1}
.sale-banner__grad{background:linear-gradient(90deg,var(--s-gold),var(--s-red-l));-webkit-background-clip:text;background-clip:text;color:transparent}
.sale-banner__sub{color:rgba(255,255,255,.82);font-size:15px;margin:0 0 14px}
.sale-banner__sub strong{color:#fff}
.sale-banner__feats{display:flex;flex-wrap:wrap;gap:14px}
.sale-banner__feat{display:inline-flex;align-items:center;gap:6px;color:#5fe0a0;font-size:13px}
.sale-banner__timer{display:flex;flex-direction:column;align-items:center;gap:6px}
.sale-banner__timer-lbl{color:rgba(255,255,255,.7);font-size:11px;text-transform:uppercase;letter-spacing:2px;margin:0}
.sale-banner__clock{display:flex;align-items:center;gap:8px}
.sale-cell{display:flex;flex-direction:column;align-items:center}
.sale-cell b{width:58px;height:58px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:12px;font-size:22px;font-weight:900;color:var(--s-gold)}
.sale-cell i{font-size:9px;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,.65);margin-top:5px;font-style:normal}
.sale-sep{color:var(--s-gold);font-size:22px;font-weight:800;margin-top:-16px}
.sale-banner__cta{display:flex;flex-direction:column;gap:10px}
.sale-banner__btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:12px;font-size:14px;font-weight:700;cursor:pointer;border:1px solid transparent;transition:all .2s;white-space:nowrap}
.sale-banner__btn--primary{background:linear-gradient(90deg,var(--s-gold),var(--s-red));color:#fff}
.sale-banner__btn--primary:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 10px 24px rgba(225,25,0,.3)}
.sale-banner__btn--ghost{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.35);color:#fff}
.sale-banner__btn--ghost:hover{background:rgba(255,255,255,.14)}
@media(max-width:820px){.sale-banner__timer{order:3;width:100%}.sale-banner__cta{width:100%}.sale-banner__btn{width:100%}}

/* Таблица */
.sale-table-wrap{background:var(--s-panel);border:1px solid var(--s-border);border-radius:16px;overflow:hidden;box-shadow:0 4px 18px rgba(20,30,60,.05);scroll-margin-top:16px}
.sale-table__bar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 20px;border-bottom:1px solid var(--s-border);flex-wrap:wrap}
.sale-table__count{color:var(--s-muted);font-size:13px}
.sale-table__count strong{color:var(--s-navy)}
.sale-table__tools{display:flex;align-items:center;gap:10px}
.sale-table__sort-lbl{color:var(--s-dim);font-size:12px}
.sale-table__sort{background:#fff;border:1px solid var(--s-border2);color:var(--s-text);font-size:13px;border-radius:9px;padding:7px 10px;cursor:pointer;outline:none}
.sale-table__sort:focus{border-color:var(--s-gold)}
.sale-table__scroll{overflow-x:auto}
.sale-table{width:100%;border-collapse:collapse;font-size:14px}
.sale-table thead th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.6px;color:var(--s-dim);font-weight:700;padding:12px 14px;border-bottom:1px solid var(--s-border);white-space:nowrap;background:var(--s-panel2)}
.sale-table__th-photo{width:96px}
.sale-row{border-bottom:1px solid var(--s-border);transition:background .15s}
.sale-row:hover{background:#fbf7ee}
.sale-row td{padding:12px 14px;vertical-align:top}

.sale-photo{position:relative;display:flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:10px;overflow:hidden;background:#fff;border:1px solid var(--s-border)}
.sale-photo img{width:100%;height:100%;object-fit:contain}
.sale-photo__no{color:#c3ccdf}
.sale-photo__badge{position:absolute;top:3px;left:3px;background:linear-gradient(90deg,var(--s-gold),var(--s-red));color:#fff;font-size:10px;font-weight:800;padding:1px 6px;border-radius:6px}

.sale-name{color:var(--s-navy);font-weight:700;line-height:1.35;display:block}
.sale-name:hover{color:var(--s-gold-d)}
.sale-name__meta{margin-top:5px;display:flex;flex-wrap:wrap;gap:8px;font-size:12px;color:var(--s-dim)}
.sale-name__cat{color:var(--s-navy-l)}

.sale-specs{list-style:none;margin:0;padding:0;font-size:12.5px;color:var(--s-muted);line-height:1.5}
.sale-specs li span{color:var(--s-dim)}
.sale-specs__empty{color:var(--s-dim)}

.sale-td-price{white-space:nowrap}
.sale-price__old{color:var(--s-dim);font-size:12.5px;text-decoration:line-through}
.sale-price__new{color:var(--s-navy);font-size:18px;font-weight:800;margin:2px 0}
.sale-price__new small{font-size:12px;font-weight:500;color:var(--s-muted)}
.sale-price__save{color:var(--s-red);font-size:12px;font-weight:700}

.sale-stock{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:600;padding:5px 10px;border-radius:8px;white-space:nowrap}
.sale-stock--in{color:var(--s-green);background:rgba(31,157,87,.1)}
.sale-stock--wait{color:var(--s-gold-d);background:rgba(232,165,48,.12)}
.sale-stock__dot{width:7px;height:7px;border-radius:50%;background:var(--s-green);animation:salePulse 2s infinite}

.sale-add{white-space:nowrap}
.sale-table__empty{padding:34px 16px;text-align:center;color:var(--s-muted)}
.sale-table__empty a{color:var(--s-gold-d);text-decoration:underline}

/* Кнопка «В корзину»: состояние «добавлено» */
.sale-add{white-space:nowrap}
.sale-add.is-added{background:var(--s-green,#16a34a)!important;border-color:var(--s-green,#16a34a)!important;color:#fff!important;pointer-events:none}
.sale-add.is-added svg{flex-shrink:0}

/* Пагинация */
.sale-pager{display:flex;align-items:center;justify-content:center;gap:6px;padding:16px;border-top:1px solid var(--s-border);flex-wrap:wrap}
.sale-pager__btn{min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;padding:0 10px;border-radius:9px;border:1px solid var(--s-border2);background:#eef1f8;color:var(--s-navy);font-size:14px;font-weight:800;cursor:pointer;transition:all .2s}
.sale-pager__btn:hover{background:#fff;border-color:var(--s-gold);color:var(--s-gold-d);box-shadow:0 2px 8px rgba(20,30,60,.08)}
.sale-pager__btn.is-active{background:var(--s-navy);color:#fff;border-color:var(--s-navy)}
.sale-pager__dots{color:var(--s-muted);padding:0 4px;font-weight:700}

.sale-seo{margin-top:30px}
.sale__note{text-align:center;color:var(--s-dim);font-size:12px;margin-top:22px}
.sale__empty{text-align:center;padding:60px 16px;color:var(--s-muted)}
.sale__empty p{margin-bottom:16px}

/* Анимации */
@keyframes salePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.4)}}
@keyframes saleBounce{0%,100%{transform:translateY(-15%)}50%{transform:translateY(0)}}
@keyframes saleBlob{0%,100%{opacity:.22;transform:scale(1)}50%{opacity:.34;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.sale-carousel__track,.sale-stock__dot,.sale-banner__pill,.sale-banner__blob,.sale-card{animation:none!important;transition:none!important}}

/* Адаптив */
@media(max-width:760px){
  .sale-table__th-specs,.sale-td-specs{display:none}
  .sale-photo{width:56px;height:56px}
  .sale-price__new{font-size:16px}
  .sale__title{font-size:22px}
  .sale-banner__h{font-size:27px}
  .sale-table__bar{gap:8px}
}
@media(max-width:480px){
  .sale{padding:18px 0 36px}
  .sale__inner{padding:0 12px}
  .sale-banner__inner{padding:22px 18px;gap:18px}
  .sale-banner__h{font-size:24px}
  .sale-banner__sub{font-size:14px}
  .sale-cell b{width:46px;height:46px;font-size:18px}
  .sale-cell i{font-size:8px}
  .sale-banner__clock{gap:5px}
  .sale-sep{font-size:18px;margin-top:-14px}
  .sale-search__btn{padding:9px 14px}
  .sale-td-name .sale-name{font-size:13px}
  .sale-pager__btn{min-width:30px;height:30px}
}