/* Допродажи (js/upsell.js): окно «Добавить к заказу?» и блок в корзине.
   Токены — из css/style.css. Кешируется 7 дней — при правке поднимать ?v=. */

.upsell-backdrop {
  position: fixed; inset: 0; z-index: 1100; background: rgba(0,0,0,0);
  display: flex; align-items: flex-end; justify-content: center; transition: background .25s;
}
.upsell-backdrop.is-open { background: rgba(0,0,0,.6); }
.upsell-modal {
  position: relative; width: 100%; max-width: 440px;
  background: var(--bg-card); border: 1px solid var(--border-light); border-bottom: none;
  border-radius: var(--radius-xl) var(--radius-xl) 0 0;
  padding: 22px 18px calc(18px + env(safe-area-inset-bottom));
  transform: translateY(100%); transition: transform .28s var(--ease-out);
}
.upsell-backdrop.is-open .upsell-modal { transform: none; }
@media (min-width: 768px) {
  .upsell-backdrop { align-items: center; }
  .upsell-modal { border-radius: var(--radius-xl); border-bottom: 1px solid var(--border-light); transform: translateY(20px); opacity: 0; transition: transform .28s var(--ease-out), opacity .2s; }
  .upsell-backdrop.is-open .upsell-modal { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .upsell-modal, .upsell-backdrop { transition: none; } }

.upsell-modal__close {
  position: absolute; top: 10px; right: 10px; width: var(--tap-min); height: var(--tap-min);
  border: none; border-radius: 50%; background: var(--bg-elevated); color: var(--text); font-size: 1rem; cursor: pointer;
}
.upsell-modal__close:focus-visible, .upsell-item__add:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.upsell-modal__eyebrow { font-size: 0.8rem; color: var(--text-sec); padding-right: 48px; }
.upsell-modal__title { font: 700 1.35rem/1.2 var(--font-display); margin: 4px 0 14px; }
.upsell-modal__no { width: 100%; margin-top: 14px; }

.upsell-list { display: flex; flex-direction: column; gap: 8px; }
.upsell-item {
  display: flex; align-items: center; gap: 12px; padding: 10px 10px 10px 14px;
  background: var(--bg-elevated); border: 1px solid var(--border); border-radius: var(--radius-lg);
}
.upsell-item__info { flex: 1; min-width: 0; }
.upsell-item__name { font-weight: 700; font-size: 0.92rem; line-height: 1.3; }
.upsell-item__meta { font-size: 0.8rem; color: var(--text-sec); margin-top: 2px; }
.upsell-item__meta b { color: var(--accent); font-weight: 800; }
.upsell-item__add {
  flex-shrink: 0; width: var(--tap-min); height: var(--tap-min); border-radius: 50%;
  border: 1px solid var(--accent); background: transparent; color: var(--accent);
  font: 700 1.3rem/1 var(--font-body); cursor: pointer; transition: background var(--ease), color var(--ease);
}
.upsell-item__add:hover { background: var(--accent); color: #1a1206; }
.upsell-item__add.is-added { background: var(--accent); color: #1a1206; cursor: default; }

/* Блок в корзине — компактнее */
.upsell-cart { margin-top: 18px; padding: 16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--bg-card); }
.upsell-cart__title { font: 700 1.05rem var(--font-display); margin-bottom: 10px; }
.upsell-cart .upsell-item { padding: 8px 8px 8px 12px; }

/* Промокод в корзине (cart.html) */
.promo-box { margin: 4px 0 14px; }
.promo-box__row { display: flex; gap: 8px; }
.promo-box__row .form-input { flex: 1; min-width: 0; text-transform: uppercase; }
.promo-box__msg { font-size: 0.8rem; margin-top: 6px; color: var(--text-sec); line-height: 1.45; }
.promo-box__msg:empty { display: none; }
.promo-box__msg.is-ok { color: var(--success); }
.promo-box__msg.is-err { color: var(--error); }
.promo-box__rm { background: none; border: none; padding: 0; color: var(--text-sec); text-decoration: underline; cursor: pointer; font: inherit; }
