/* ===== Layout ===== */
.cart-container { max-width: 1180px; margin: 0 auto; padding: 24px 24px 40px; }
.cart-title { margin: 8px 0 18px; font-size: 28px; font-weight: 700; }

.cart-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 24px;
  align-items: start;
}
@media (max-width: 980px) { .cart-layout { grid-template-columns: 1fr; } }

.cart-main { display: grid; gap: 14px; }

/* ===== Card ===== */
.cart-card {
  display: grid;
  grid-template-columns: 28px 96px 1fr auto;
  gap: 14px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(0,0,0,.06);
  padding: 12px;
}
@media (max-width: 680px) {
  .cart-card {
    grid-template-columns: 22px 72px 1fr;
    gap: 12px;
  }
}

/* чекбокс */
.cart-check { display: flex; align-items: center; justify-content: center; }
.cart-check__input { width: 16px; height: 16px; }

/* миниатюра */
.cart-thumb {
  width: 96px; height: 96px;
  background: #f5f6fa;
  border: 1px solid #e7e7e7;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
}
.cart-thumb img { width: 100%; height: 100%; object-fit: contain; display: block; }
.cart-thumb .placeholder { font-size: 12px; color: #999; }

/* инфо */
.cart-info { display: flex; flex-direction: column; justify-content: center; gap: 6px; min-width: 0; }
.cart-name {
  color: inherit; text-decoration: none; font-weight: 600; line-height: 1.25;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cart-meta { color: #555; }
.cart-price { font-weight: 600; }

/* контролы */
.cart-controls {
  display: grid;
  grid-auto-flow: column;
  gap: 12px;
  align-items: center;
}
@media (max-width: 680px) {
  .cart-controls {
    grid-column: 1 / -1;
    justify-content: space-between;
  }
}

/* qty stepper */
.qty {
  display: inline-grid;
  grid-template-columns: 32px 54px 32px;
  align-items: center;
  border: 1px solid #ddd;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.qty-btn {
  height: 36px;
  border: 0;
  background: #fafafa;
  cursor: pointer;
  font-size: 18px;
  font-weight: 600;
  line-height: 1;
}
.qty-btn:active { transform: scale(.96); }
.cart-qty {
  width: 54px; height: 36px;
  border: 0;
  border-left: 1px solid #eee; border-right: 1px solid #eee;
  text-align: center;
  font-weight: 600;
  outline: none;
}

/* line total */
.line-total { display: flex; align-items: center; gap: 6px; min-width: 140px; justify-content: flex-end; }
.line-total__label { color: #666; font-size: 13px; }
.line-total__value { font-weight: 700; }

/* кнопки (скоупим в контейнер) */
.cart-container .btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: 38px; padding: 0 14px;
  background: #fff; color: #191919;
  border: 1px solid #d7d7d7;
  border-radius: 10px;
  font-weight: 600; cursor: pointer;
  transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.cart-container .btn:hover { border-color: #191919; }
.cart-container .btn--ghost { background: #fff; }
.cart-container .btn--primary { background: #1f1f1f; color: #fff; border-color: #1f1f1f; }
.cart-container .btn--primary:hover { opacity: .9; }

/* ===== Aside / Summary ===== */
.cart-aside { position: sticky; top: 14px; }
.summary-box {
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(0,0,0,.06);
  padding: 16px;
}
.summary-header { font-weight: 700; margin-bottom: 10px; }
.summary-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 0; border-top: 1px dashed #eee;
}
.summary-row:first-of-type { border-top: 0; padding-top: 0; }
.summary-submit { width: 100%; margin-top: 14px; }
.summary-note { margin-top: 8px; font-size: 12px; color: #666; }

/* ===== Modal base ===== */
.hidden{ display:none !important; }
.modal{ position:fixed; inset:0; display:grid; place-items:center; z-index:1000; }
.modal__overlay{ position:absolute; inset:0; background:rgba(0,0,0,.45); }
.modal__dialog{
  position:relative; width:min(520px, 92vw);
  background:#fff; border-radius:14px; box-shadow:0 20px 60px rgba(0,0,0,.25);
  padding:20px 20px 16px; animation:pop .2s ease;
}
@keyframes pop{ from{ transform:translateY(6px); opacity:.9 } to{ transform:none; opacity:1 } }
.modal__close{ position:absolute; top:8px; right:10px; width:36px; height:36px; border:0; border-radius:8px; background:#f6f7f9; cursor:pointer; }
.modal__header{ margin:4px 6px 12px; }
.modal__header h3{ margin:0 0 6px; }
.modal__subtitle{ margin:0; color:#666; font-size:.95rem; }
.modal__form{ display:grid; gap:12px; }
.form-group label{ display:block; margin:0 0 6px; font-weight:600; }
.form-group input, .form-group textarea{
  width:100%; border:1px solid #e1e3e8; border-radius:10px; padding:10px 12px; font:inherit;
}
.form-group input:focus, .form-group textarea:focus{ outline:none; border-color:#191919; box-shadow:0 0 0 3px rgba(25,25,25,.08); }
.form-actions{ display:flex; gap:10px; align-items:center; }
.form-message{ padding:10px 12px; border-radius:10px; background:#f1f8f1; color:#0a6d0a; border:1px solid #cfe8cf; }
.form-message.err{ background:#fff5f5; color:#9d1414; border-color:#f0caca; }

/* ===== Polished skin for cart modal ===== */
.modal--cart .modal__overlay{
  background: rgba(12,12,14,.55);
  backdrop-filter: blur(2px);
}
.modal__dialog--cart{
  width: min(560px, 92vw);
  max-height: 92vh;
  overflow: auto;
  border-radius: 16px;
  padding: 22px 22px 18px;
  box-shadow: 0 18px 60px rgba(0,0,0,.22), 0 6px 18px rgba(0,0,0,.10);
}
.modal--cart .modal__close{
  top:10px; right:12px; width:36px; height:36px;
  border:1px solid #ececec; border-radius:10px; background:#fff;
  font-size:20px; color:#333;
  transition: transform .08s, box-shadow .15s, border-color .15s;
}
.modal--cart .modal__close:hover{ border-color:#191919; box-shadow:0 3px 10px rgba(0,0,0,.08); }
.modal--cart .modal__close:active{ transform: scale(.96); }
.modal--cart .modal__header{ margin:2px 2px 14px; }
.modal--cart .modal__header h3{ font-size:1.25rem; font-weight:700; margin:0 0 6px; }
.modal--cart .modal__subtitle{ color:#6b7280; font-size:.97rem; }

.modal--cart .modal__form{ gap:14px; }
.modal--cart .form-group label{ font-size:.95rem; color:#222; }
.modal--cart .form-group input,
.modal--cart .form-group textarea{
  height:46px; border:1px solid #e4e6ea; border-radius:12px; padding:10px 12px;
}
.modal--cart .form-group textarea{ min-height:92px; resize:vertical; }
.modal--cart .form-group input::placeholder,
.modal--cart .form-group textarea::placeholder{ color:#9aa0a6; }
.modal--cart .field-hint{ margin-top:6px; font-size:.88rem; color:#6b7280; }

.modal--cart .form-actions{ margin-top:4px; }
.modal--cart .btn{ height:42px; padding:0 16px; border-radius:12px; border:1px solid #dcdfe4; font-weight:700; }
.modal--cart .btn--primary{ background:#191919; color:#fff; border-color:#191919; }
.modal--cart .btn--primary:hover{ opacity:.92; }
.modal--cart .btn:hover{ border-color:#191919; }
.modal--cart .btn:active{ transform: scale(.98); }
.modal--cart .form-message{ margin-top:6px; border-radius:12px; }

@media (max-width: 480px){
  .modal__dialog--cart{ padding:18px 16px 14px; }
  .modal--cart .form-actions{ flex-direction: column; }
  .modal--cart .form-actions .btn{ width: 100%; }
}
/* ===== Cart Request Modal — стиль как у формы регистрации ===== */
#cartRequestModal { display:grid; place-items:center; position:fixed; inset:0; z-index:1000; }
#cartRequestModal.hidden { display:none !important; }

/* затемнение фона чуть темнее */
#cartRequestModal .modal__overlay{
  position:absolute; inset:0;
  background:rgba(17,24,39,.55); /* ~tailwind gray-900/55 */
  backdrop-filter:saturate(120%) blur(1px);
}

/* диалог */
#cartRequestModal .modal__dialog{
  position:relative;
  width:min(640px, 94vw);               /* как у auth-модалки */
  max-height:90vh;                      /* без вертикального переполнения */
  overflow:auto;                        /* скроллим только контент */
  box-sizing:border-box;
  background:#fff;
  border:1px solid #eef0f3;
  border-radius:16px;
  box-shadow:0 25px 80px rgba(0,0,0,.22);
  padding:26px 26px 20px;               /* больше «воздуха» */
  animation:cart-modal-pop .22s ease;
}
@keyframes cart-modal-pop{
  from{ transform:translateY(6px); opacity:.9 }
  to  { transform:none; opacity:1 }
}

/* крестик как на регистрации */
#cartRequestModal .modal__close{
  position:absolute; top:10px; right:10px;
  width:34px; height:34px;
  display:grid; place-items:center;
  border:1px solid #e6e8ec;
  border-radius:10px;
  background:#fff;
  color:#555;
  cursor:pointer;
  transition:background .12s, border-color .12s, color .12s;
}
#cartRequestModal .modal__close:hover{
  background:#f7f8fa; border-color:#dfe3e8; color:#111;
}

/* заголовок/подзаголовок */
#cartRequestModal .modal__header{ margin:2px 2px 14px; }
#cartRequestModal .modal__header h3{
  margin:0 0 6px;
  font-size:28px; font-weight:800; letter-spacing:.2px;
}
#cartRequestModal .modal__subtitle{
  margin:0; color:#67738a; font-size:15px; line-height:1.35;
}

/* форма и поля */
#cartRequestModal .modal__form{ display:grid; gap:14px; }

#cartRequestModal .form-group label{
  display:block; margin:0 0 6px; font-weight:700; font-size:14px;
}
#cartRequestModal .form-group .field-hint{
  margin-top:6px; font-size:12px; color:#7b8598;
}

/* инпуты как у auth */
#cartRequestModal .form-group input,
#cartRequestModal .form-group textarea{
  width:100%;
  font:inherit;
  border:1px solid #e6e8ec;
  border-radius:12px;
  background:#fff;
  padding:12px 14px;
  transition:border-color .12s, box-shadow .12s, background .12s;
  box-sizing:border-box;
}
#cartRequestModal .form-group input{ height:52px; }
#cartRequestModal .form-group textarea{ min-height:120px; resize:vertical; }

#cartRequestModal .form-group input:focus,
#cartRequestModal .form-group textarea:focus{
  outline:none;
  border-color:#111;
  box-shadow:0 0 0 4px rgba(17,17,17,.07);
}

/* кнопки внизу */
#cartRequestModal .form-actions{
  display:flex; gap:10px; align-items:center; margin-top:4px;
}
#cartRequestModal .btn{
  height:48px; padding:0 18px;
  border-radius:12px; font-weight:700;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid #e6e8ec; background:#fff; color:#111;
  transition:opacity .12s, border-color .12s, background .12s;
}
#cartRequestModal .btn--primary{
  background:#111; border-color:#111; color:#fff;
}
#cartRequestModal .btn--primary:hover{ opacity:.9; }
#cartRequestModal .btn--ghost:hover{ background:#f7f8fa; border-color:#dfe3e8; }

/* убираем возможную горизонтальную прокрутку у окна */
#cartRequestModal .modal__dialog::-webkit-scrollbar{ width:10px }
#cartRequestModal .modal__dialog::-webkit-scrollbar-thumb{
  background:#e6e8ec; border-radius:8px;
}