/* ============================================================
   Промокоды / подарочные карты — блок в форме заявки
   Добавить в public/assets/css/shared.css (использует те же CSS-переменные).
   Адаптив: десктоп и мобильные (брейкпоинт 560px).
   ============================================================ */

.promo-block{width:100%}
.promo-block__label{
  font-family:'Dela Gothic One',sans-serif;
  text-transform:uppercase;
  color:var(--white-1000);
  font-size:16px;
  margin-bottom:14px;
}

/* поле + кнопка */
.promo-block__row{display:flex;gap:12px}
.promo-block__input{
  flex:1 1 auto;min-width:0;
  display:flex;
  background:var(--dark-700);
  border-radius:10px;
  overflow:hidden;
}
.promo-block__input input{
  flex:1 1 auto;width:100%;
  background:transparent;border:none;outline:none;
  color:var(--white-1000);
  font-family:inherit;font-size:16px;
  padding:18px 24px;
  letter-spacing:1px;
}
.promo-block__input input::placeholder{color:var(--dark-500);text-transform:none;letter-spacing:0}
.promo-block__add{
  flex:0 0 auto;
  background:var(--sky-color);color:#06080A;
  border:none;border-radius:10px;cursor:pointer;
  font-family:'Dela Gothic One',sans-serif;text-transform:uppercase;font-size:14px;
  padding:0 26px;transition:.25s;
}
.promo-block__add:hover{background:var(--blue-color)}
.promo-block__add:active{transform:scale(.98)}
.promo-block__add:disabled{opacity:.6;cursor:default}

.promo-block__hint{margin-top:10px;font-size:13px;min-height:18px}
.promo-block__hint--err{color:var(--red-color)}
.promo-block__hint--ok{color:var(--green-color)}
.promo-block__hint--info{color:var(--dark-500)}

/* список применённых кодов */
.promo-applied{margin-top:18px;display:none}
.promo-applied.is-visible{display:block}
.promo-chip{
  display:flex;align-items:center;gap:14px;
  background:var(--dark-700);
  border-left:3px solid var(--sky-color);
  border-radius:10px;
  padding:14px 18px;margin-bottom:10px;
  animation:promoPop .25s ease;
}
@keyframes promoPop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.promo-chip__type{
  font-family:'Dela Gothic One',sans-serif;font-size:11px;text-transform:uppercase;
  letter-spacing:.5px;padding:4px 10px;border-radius:6px;flex:0 0 auto;
}
.promo-chip__type--promo{background:rgba(77,178,188,.18);color:var(--sky-color)}
.promo-chip__type--gift{background:rgba(217,181,103,.18);color:var(--yellow-color)}
.promo-chip__code{font-weight:600;letter-spacing:1px;flex:0 0 auto;color:var(--white-1000)}
.promo-chip__desc{color:var(--dark-500);font-size:14px;flex:1 1 auto;min-width:0}
.promo-chip__value{font-weight:600;color:var(--green-color);white-space:nowrap}
.promo-chip__remove{
  flex:0 0 auto;background:transparent;border:none;cursor:pointer;
  color:var(--dark-500);font-size:22px;line-height:1;padding:0 4px;transition:.2s;
}
.promo-chip__remove:hover{color:var(--red-color)}

/* предложение перейти на другой продукт */
.promo-suggest{margin-top:16px;display:none}
.promo-suggest.is-visible{display:block;animation:promoPop .25s ease}
.promo-suggest__box{
  background:linear-gradient(135deg,rgba(77,178,188,.14),rgba(46,158,169,.06));
  border:1px solid rgba(77,178,188,.5);border-radius:12px;
  padding:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap;
}
.promo-suggest__icon{
  flex:0 0 auto;width:44px;height:44px;border-radius:10px;
  background:rgba(77,178,188,.18);display:flex;align-items:center;justify-content:center;
}
.promo-suggest__icon svg{width:24px;height:24px}
.promo-suggest__text{flex:1 1 220px;min-width:0}
.promo-suggest__title{font-family:'Dela Gothic One',sans-serif;text-transform:uppercase;font-size:14px;margin-bottom:4px;color:var(--white-1000)}
.promo-suggest__desc{color:var(--white-800);font-size:14px;line-height:1.4}
.promo-suggest__desc b{color:var(--sky-color)}
.promo-suggest__btn{
  flex:0 0 auto;background:var(--sky-color);color:#06080A;border:none;border-radius:10px;
  cursor:pointer;font-family:'Dela Gothic One',sans-serif;text-transform:uppercase;font-size:13px;
  padding:14px 22px;transition:.25s;text-decoration:none;display:inline-block;
}
.promo-suggest__btn:hover{background:var(--blue-color)}
.promo-suggest__close{
  flex:0 0 auto;background:transparent;border:none;cursor:pointer;color:var(--dark-500);
  font-size:20px;line-height:1;padding:0 2px;transition:.2s;
}
.promo-suggest__close:hover{color:var(--red-color)}

/* ---------- Мобильные ---------- */
@media (max-width:560px){
  .promo-block__row{flex-direction:column}
  .promo-block__add{width:100%;padding:16px}
  .promo-block__input input{padding:16px 18px}

  .promo-chip{flex-wrap:wrap;gap:8px 12px;padding:12px 14px}
  .promo-chip__desc{flex-basis:100%;order:5}
  .promo-chip__remove{margin-left:auto}

  .promo-suggest__box{flex-direction:column;align-items:stretch;text-align:left;padding:18px}
  .promo-suggest__btn{width:100%;text-align:center}
  .promo-suggest__close{position:absolute}
  .promo-suggest{position:relative}
  .promo-suggest__close{top:10px;right:12px}
}
