/* ============================ ELVORA — Cart page reskin ============================
   Pure visual layer over the native cart markup — no structural/JS changes, so the
   built-in add/remove animations, container queries and accessibility all keep working.
*/

/* ---------- Page title ---------- */
.cart-page__title .cart-title,
.cart-page__title h1,
.cart-page__title h2 {
  font-family: var(--font-heading--family);
  font-weight: 700;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  font-size: clamp(2rem, 4vw, 3rem) !important;
}

.cart-page__title [class*="count"],
.cart-title__count {
  background: var(--el-ion);
  color: #fff;
  font-family: var(--font-subheading--family);
  font-weight: 700;
}

/* ---------- Item cards ---------- */
.cart-items--dividers .cart-items__table-row {
  border-bottom: none;
}

.cart-items__table-row {
  background: var(--el-paper, #fafbfc);
  border: 1px solid var(--el-line, #e7ebf0);
  border-radius: 16px;
  padding: 14px !important;
  margin-bottom: 14px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.cart-items__table-row:hover {
  border-color: var(--el-ion);
  box-shadow: 0 14px 32px -20px rgba(11, 15, 20, 0.35);
}

.cart-items--dividers .cart-items__table-row:last-of-type {
  margin-bottom: 0 !important;
}

/* ---------- Product image ---------- */
.cart-items__table-row {
  --cart-item-price-width: 6rem;
  grid-template-columns: clamp(6rem, 28cqi, 10.5rem) minmax(0, 1fr) minmax(var(--cart-item-price-width), auto) !important;
}

@container cart-items (min-width: 720px) {
  .cart-items__table-row {
    grid-template-columns: 12rem 1fr 1fr minmax(var(--cart-item-price-width), auto) !important;
  }
}

@media (max-width: 480px) {
  .cart-items__table-row {
    --cart-item-price-width: 4rem;
    grid-template-columns: 4.25rem minmax(80px, 1fr) minmax(var(--cart-item-price-width), auto) !important;
    column-gap: 10px !important;
    padding: 10px !important;
  }
}

.cart-items__media {
  padding: 4px !important;
}

.cart-items__media-container {
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(160deg, #fff 60%, var(--el-paper, #fafbfc) 100%);
  border: 1px solid var(--el-line, #e7ebf0);
  box-shadow: 0 10px 24px -16px rgba(11, 15, 20, 0.25);
}

.cart-items__media-image {
  transition: transform 0.5s cubic-bezier(0.2, 0.7, 0.2, 1);
}

.cart-items__table-row:hover .cart-items__media-image {
  transform: scale(1.06);
}

/* ---------- Typography ---------- */
.cart-items__title {
  font-family: var(--font-heading--family);
  font-weight: 700;
  font-size: 1.05rem !important;
  letter-spacing: -0.01em;
  transition: color 0.15s ease;
}

.cart-items__table-row:hover .cart-items__title {
  color: var(--el-ion);
}

.cart-items__price {
  font-family: var(--font-heading--family);
  font-weight: 700;
  font-size: 1.05rem !important;
}

.cart-items__price .compare-at-price {
  font-family: var(--font-body--family);
  font-weight: 400;
  opacity: 0.55;
}

/* ---------- Quantity + remove controls ---------- */
.cart-items .quantity-selector {
  border-radius: 10px;
  border-color: var(--el-line, #e7ebf0);
}

.cart-items .quantity-selector:focus-within {
  border-color: var(--el-ion);
}

.cart-items__remove {
  border-radius: 10px;
}

.cart-items__remove:hover {
  background: rgba(18, 190, 206, 0.1);
  color: var(--el-ion);
}

/* ---------- Order summary sidebar ---------- */
.cart-summary__inner {
  background: var(--el-paper, #fafbfc) !important;
  border: 1px solid var(--el-line, #e7ebf0) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 44px -28px rgba(11, 15, 20, 0.28);
  position: relative;
  overflow: hidden;
}

.cart-summary__inner > .cart-totals {
  padding: 20px 20px 6px;
}

.cart-summary__inner > .cart__ctas {
  padding: 10px 20px 20px;
}

.cart-summary__inner::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  background: linear-gradient(90deg, var(--el-ion), var(--el-ion-bright, #00e5c7));
}

.cart__total-label {
  font-family: var(--font-subheading--family);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.72rem !important;
}

.cart__total-value {
  font-family: var(--font-heading--family);
  font-weight: 700;
  font-size: 1.7rem !important;
}

.cart__checkout-button {
  background: var(--el-ion) !important;
  border-color: var(--el-ion) !important;
  border-radius: 10px !important;
  font-weight: 700;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.cart__checkout-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 24px -14px rgba(18, 190, 206, 0.55);
}

/* ---------- Recommendations heading ---------- */
#shopify-section-template--cart .product-list h3,
.cart-page ~ * h3 {
  font-family: var(--font-heading--family);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: -0.01em;
}

@media (prefers-reduced-motion: reduce) {
  .cart-items__table-row,
  .cart-items__media-image,
  .cart__checkout-button {
    transition: none !important;
  }
}