/* Add-to-cart popup — values from Yulia's prototype (.cart-modal, .ci, .qty …). */
.cart-popup .modal-dialog { max-width: 640px; }
.cart-popup .modal-content { border: 0; border-radius: 10px; box-shadow: 0 18px 48px rgba(0,0,0,.2); overflow: hidden; color: #1c1c1c; }
.cart-popup :is(h3, h4, p, a, span, div, button, b) { font-family: Manrope, system-ui, sans-serif !important; }
.cart-popup .cart-modal-h h3, .cart-popup .cart-modal-body h4, .cart-popup .ci-name { font-family: "Cormorant Garamond", Georgia, serif !important; }
.cart-modal-h { display: flex; align-items: center; justify-content: space-between; padding: 16px 22px; border-bottom: 1px solid #ece8e0; }
.cart-popup .cart-modal-h h3 { font-size: 24px; font-weight: 600; color: #2c3338; margin: 0; line-height: 1.2; }
.cart-popup .x { width: 28px; height: 28px; border: 0; background: none; color: #9a9a9a; font-size: 20px; cursor: pointer; line-height: 1; padding: 0; }
.cart-popup .x:hover { color: #c45c4a; }
.cart-modal-ask { padding: 16px 22px 8px; color: #3a4148; line-height: 1.5; font-size: 15px; }
.cart-modal-body { padding: 8px 22px 6px; }
.cart-popup .cart-modal-body h4 { font-size: 20px; font-weight: 600; margin: 0 0 12px; color: #1c1c1c; }
.cart-popup .ci {
  display: grid; grid-template-columns: 64px 1fr auto auto; gap: 12px; align-items: center;
  background: #fff; border: 1px solid #e8e4dc; border-radius: 10px; padding: 10px 36px 10px 10px; margin-bottom: 10px; position: relative;
}
.cart-popup .ci-img { width: 64px; height: 64px; border-radius: 8px; background: linear-gradient(160deg, #c5cbb4, #8a9a78); overflow: hidden; display: block; }
.cart-popup .ci-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.cart-popup .ci-name { display: block; font-size: 16px; font-weight: 600; color: #1c1c1c; text-decoration: none; line-height: 1.25; }
.cart-popup .ci-name:hover { color: #748264; }
.cart-popup .ci-sub { font-size: 12px; color: #8a8a8a; margin-top: 3px; }
.cart-popup .ci-price { color: #748264; font-weight: 700; font-size: 14px; min-width: 72px; text-align: right; white-space: nowrap; }
.cart-popup .ci .x { position: absolute; top: 4px; right: 6px; font-size: 16px; }
.cart-popup .qty { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.cart-popup .qty button { width: 24px; height: 24px; border-radius: 50%; border: 1px solid #d4cfc6; background: #fff; cursor: pointer; color: #555; padding: 0; line-height: 1; display: grid; place-items: center; }
.cart-popup .qty button:hover { border-color: #8a9a78; color: #748264; }
.cart-popup .cart-empty { font-size: 14px; color: #5c5c5c; margin: 0 0 12px; }
.cart-modal-acts { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 22px 18px; border-top: 1px solid #ece8e0; }
.cart-popup .cbtn {
  display: inline-flex; align-items: center; justify-content: center; height: 36px; border: 0; border-radius: 12px;
  background: #8a9a78; color: #fff; font: 600 13px/1 Manrope, sans-serif; padding: 0 16px; cursor: pointer; white-space: nowrap; text-decoration: none;
}
.cart-popup .cbtn:hover { background: #748264; color: #fff; }
.cart-popup .cbtn-light { background: #f4f2ed; color: #2c3338; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.cart-popup .cbtn-light:hover { background: #e8e4dc; color: #2c3338; }
.cart-popup-body.htmx-request { opacity: .55; transition: opacity .15s; }

@media (max-width: 575.98px) {
  .cart-popup .ci { grid-template-columns: 56px 1fr; }
  .cart-popup .ci-img { width: 56px; height: 56px; }
  .cart-popup .ci-price, .cart-popup .qty { grid-column: 2; justify-self: start; text-align: left; }
  .cart-modal-acts { flex-direction: column; }
  .cart-popup .cbtn { width: 100%; }
}