/**
 * Dynasty Luxury Rentals — Cart page (woocommerce/cart/cart.php override).
 *
 * Layout de tarjetas (pedido del cliente 2026-07-22: "no me gusta la tabla de
 * woocommerce") en vez de la tabla clásica — mismo lenguaje visual que el
 * resto del sitio: cards blancas con borde suave, tipografía Montserrat/
 * Raleway, botones redondeados gold/negro (misma familia que ya usaba el
 * checkout: border-radius 8px, gold↔negro en hover).
 *
 * Antes estas reglas vivían en checkout.css bajo `body.woocommerce-cart` —
 * se movieron todas acá al rehacer el template (ver CHANGELOG alpha.124).
 * `.dlr-note` / `.dlr-balance-due` (inyectadas por dlr-booking vía
 * wc_get_formatted_cart_item_data()) siguen las mismas clases que en
 * checkout.css, solo reescritas para el nuevo markup de tarjeta.
 */

/* ===== Título ===== */
.dynasty-cart__header {
    margin-bottom: 28px;
}
.dynasty-cart__title {
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: clamp(26px, 3.5vw, 36px);
    color: var(--dynasty-black-obsidian, #0A0A0A);
    margin: 0;
}

/* ===== Layout 2 columnas: items + sidebar de totales ===== */
.dynasty-cart__layout {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
}
@media (min-width: 901px) {
    .dynasty-cart__layout { flex-direction: row; }
    .dynasty-cart__main { flex: 1 1 0; min-width: 0; }
    .dynasty-cart__sidebar { flex: 0 0 380px; }
}
.dynasty-cart__sidebar { width: 100%; }
@media (min-width: 901px) {
    .dynasty-cart__sidebar { position: sticky; top: 24px; }
}

/* ===== Lista de items ===== */
.dynasty-cart__items {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Card de cada auto en el carrito. */
.dynasty-cart-item {
    position: relative;
    display: flex;
    gap: 20px;
    background: var(--dynasty-white, #FFFFFF);
    border: 1px solid #E8E8E8;
    border-radius: 14px;
    padding: 20px;
}

.dynasty-cart-item__remove {
    position: absolute;
    top: 12px;
    right: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #F7F7F7;
    color: var(--dynasty-gray-brand, #6D6E70);
    font-size: 18px;
    line-height: 1;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease;
    z-index: 2;
}
.dynasty-cart-item__remove:hover {
    background: var(--dynasty-black-obsidian, #0A0A0A);
    color: var(--dynasty-white, #FFFFFF);
}

.dynasty-cart-item__media {
    flex: 0 0 180px;
}
.dynasty-cart-item__media a { display: block; }
.dynasty-cart-item__media img {
    width: 180px;
    height: 124px;
    object-fit: cover;
    border-radius: 10px;
    display: block;
}

.dynasty-cart-item__body {
    flex: 1 1 0;
    min-width: 0;
    padding-right: 30px; /* espacio para el botón de sacar, arriba a la derecha */
}

.dynasty-cart-item__name a {
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-semibold, 600);
    font-size: 17px;
    color: var(--dynasty-black-obsidian, #0A0A0A);
    text-decoration: none;
}
.dynasty-cart-item__name a:hover { color: var(--dynasty-brand-gold, #D4AF37); }

/* ===== Detalle DLR (City/Pick-up/Drop-off/Note/precio) =====
   Pedido del cliente 2026-07-22: la tarjeta quedaba muy alargada con el
   desglose completo (Duration, fees, depósitos, impuestos, Total Due Now…)
   apilado en "label arriba / valor abajo" — cada línea ocupaba 2 renglones.
   Mismo criterio que el Price Summary del producto (.dlr-summary-line):
   "cargo a la izquierda, cobro a la derecha", una línea por dato. Se usa
   float (no CSS grid) a propósito: con grid, ocultar el dt del "Note" rompe
   la alineación de TODOS los pares siguientes (el auto-placement corre la
   cuenta de celdas); con float cada dt/dd se posiciona solo, así que ocultar
   uno no descuadra a los demás. */
.dynasty-cart-item__meta .variation {
    display: block;
    margin: 12px 0 0;
    padding: 0;
    overflow: hidden; /* clearfix de los dt flotantes */
}
.dynasty-cart-item__meta .variation dt {
    float: left;
    clear: left;
    width: 60%;
    box-sizing: border-box;
    margin: 0;
    padding: 5px 12px 5px 0;
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-semibold, 600);
    font-size: 12px;
    letter-spacing: 0.01em;
    line-height: 1.4;
    color: var(--dynasty-black-obsidian, #0A0A0A);
}
.dynasty-cart-item__meta .variation dd {
    margin: 0 0 0 60%;
    padding: 5px 0;
    border-bottom: 1px solid #F3F3F3;
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 13px;
    line-height: 1.4;
    color: var(--dynasty-gray-brand, #6D6E70);
    text-align: right;
}
.dynasty-cart-item__meta .variation dd p { display: inline; margin: 0; }

/* City/Pick-up/Drop-off (los primeros 3 pares) van a la izquierda, no a la
   derecha — son texto largo (ej. "Miami Office — Jul 23, 2026 5:18 pm"), no
   un monto. Se identifican por posición (siempre son los 3 primeros dt/dd
   que arma display_cart_meta() en class-dlr-cart.php, en ese orden) — antes
   se detectaban por "no tener .woocommerce-Price-amount", pero esa regla
   también agarraba "Duration: 2 days" (tampoco es un precio) y lo dejaba
   pegado a la izquierda en vez de alineado a la derecha como el resto. */
.dynasty-cart-item__meta .variation dd:nth-of-type(-n+3) {
    text-align: left;
}

/* Nota "delivery/pickup fees subject to change" — sin label "Note:", chica/
   itálica, ancho completo (no comparte la columna 42%/58% con el resto). */
.dynasty-cart-item__meta .variation dt:has(+ dd .dlr-note) { display: none; }
.dynasty-cart-item__meta .variation dd:has(.dlr-note) {
    margin-left: 0;
    border-bottom: 0;
    padding-top: 2px;
    text-align: left;
}
.dynasty-cart-item__meta .variation dd .dlr-note {
    display: block;
    font-style: italic;
    font-size: 12px;
    line-height: 1.4;
    color: var(--dynasty-gray-brand, #6D6E70);
}

/* "Balance Due at Pickup" — destacado un poco más que el resto. */
.dynasty-cart-item__meta .variation dt:has(+ dd .dlr-balance-due) {
    font-size: 14px;
    color: var(--dynasty-black-obsidian, #0A0A0A);
}
.dynasty-cart-item__meta .variation dd:has(.dlr-balance-due) { border-bottom: 0; padding-top: 8px; }
.dynasty-cart-item__meta .variation dd .dlr-balance-due {
    font-size: 15px;
    font-weight: var(--dynasty-fw-semibold, 600);
    color: var(--dynasty-black-obsidian, #0A0A0A);
}

/* ===== Qty / Price / Subtotal ===== */
.dynasty-cart-item__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 28px;
    align-items: flex-end;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid #F0F0F0;
}
.dynasty-cart-item__label {
    display: block;
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: 11px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--dynasty-gray-brand, #6D6E70);
    margin: 0 0 6px;
}
.dynasty-cart-item__price span:last-child,
.dynasty-cart-item__subtotal span:last-child {
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 15px;
    font-weight: var(--dynasty-fw-semibold, 600);
    color: var(--dynasty-black-obsidian, #0A0A0A);
}
.dynasty-cart-item__qty .quantity { display: block; }
.dynasty-cart-item__qty .quantity input.qty {
    min-height: 42px;
    width: 64px;
    padding: 8px;
    background: #F7F7F7;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    text-align: center;
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 14px;
    color: var(--dynasty-black-obsidian, #0A0A0A);
}

/* ===== Acciones: cupón + Update cart ===== */
.dynasty-cart__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #EDEDED;
}
.dynasty-cart__coupon label {
    display: block;
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 13px;
    font-weight: var(--dynasty-fw-medium, 500);
    color: var(--dynasty-gray-brand, #6D6E70);
    margin: 0 0 7px;
}
.dynasty-cart__coupon-row { display: flex; gap: 10px; }
.dynasty-cart__coupon-input {
    min-height: 46px;
    padding: 10px 14px;
    background: #F7F7F7;
    border: 1px solid #E5E5E5;
    border-radius: 8px;
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 14px;
    width: 180px;
    max-width: 100%;
}
.dynasty-cart__coupon-input:focus {
    border-color: var(--dynasty-brand-gold, #D4AF37);
    background: #FFFFFF;
    outline: none;
}

.dynasty-cart__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 13px 22px;
    border: 0;
    border-radius: 8px;
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: 13px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none !important;
    transition: background 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}
.dynasty-cart__btn--dark {
    background: var(--dynasty-black-obsidian, #0A0A0A);
    color: var(--dynasty-white, #FFFFFF) !important;
}
.dynasty-cart__btn--dark:hover {
    background: var(--dynasty-brand-gold, #D4AF37);
    color: var(--dynasty-black-obsidian, #0A0A0A) !important;
}
.dynasty-cart__btn--primary {
    background: var(--dynasty-brand-gold, #D4AF37);
    color: var(--dynasty-black-obsidian, #0A0A0A) !important;
}
.dynasty-cart__btn--primary:hover {
    background: var(--dynasty-black-obsidian, #0A0A0A);
    color: var(--dynasty-white, #FFFFFF) !important;
}
.dynasty-cart__btn[disabled] { opacity: 0.5; cursor: default; }

/* ===== Sidebar de totales (woocommerce_cart_totals() → .cart_totals) ===== */
.dynasty-cart__sidebar .cart_totals {
    background: var(--dynasty-white, #FFFFFF);
    border: 1px solid #E8E8E8;
    border-radius: 14px;
    padding: clamp(20px, 2vw, 28px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}
.dynasty-cart__sidebar .cart_totals h2 {
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: 20px;
    margin: 0 0 14px;
    padding: 0 0 12px;
    border-bottom: 1px solid #EDEDED;
}
.dynasty-cart__sidebar .cart_totals table { border: 0; margin: 0; width: 100%; }
.dynasty-cart__sidebar .cart_totals th,
.dynasty-cart__sidebar .cart_totals td {
    border: 0;
    border-bottom: 1px solid #F0F0F0;
    padding: 12px 0;
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 14px;
    text-align: left;
}
.dynasty-cart__sidebar .cart_totals td { text-align: right; }
.dynasty-cart__sidebar .cart_totals .order-total th,
.dynasty-cart__sidebar .cart_totals .order-total td {
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: 16px;
    border-bottom: 0;
}

/* Proceed to checkout — mismo botón gold Dynasty que ya funcionaba. */
.dynasty-cart__sidebar .wc-proceed-to-checkout { padding-top: 18px; }
.dynasty-cart__sidebar .wc-proceed-to-checkout a.checkout-button {
    display: block;
    width: 100%;
    text-align: center;
    background: var(--dynasty-brand-gold, #D4AF37);
    color: var(--dynasty-black-obsidian, #0A0A0A) !important;
    border: 0;
    border-radius: 8px;
    padding: 17px 24px;
    font-family: var(--dynasty-font-heading, "Montserrat", sans-serif);
    font-weight: var(--dynasty-fw-bold, 700);
    font-size: 15px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none !important;
}
.dynasty-cart__sidebar .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--dynasty-black-obsidian, #0A0A0A);
    color: var(--dynasty-white, #FFFFFF) !important;
}

/* ===== Cross-sells ("You may be interested in…") — misma card del home ===== */
body.woocommerce-cart .dynasty-crosssells { margin-top: 56px; clear: both; }
body.woocommerce-cart .dynasty-crosssells .dynasty-section-title {
    font-size: clamp(22px, 3vw, 30px);
    text-transform: none;
    margin: 0 0 28px;
}
body.woocommerce-cart .dynasty-crosssells__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
}
@media (min-width: 600px) {
    body.woocommerce-cart .dynasty-crosssells__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 992px) {
    body.woocommerce-cart .dynasty-crosssells__grid { grid-template-columns: repeat(3, 1fr); }
}
body.woocommerce-cart .dynasty-crosssells a,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card a,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card span,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card p,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card h3 {
    text-decoration: none;
}
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card__media { aspect-ratio: 16 / 9; overflow: hidden; background: #fff; }
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card__media img,
body.woocommerce-cart .dynasty-crosssells .dynasty-fleet-card__img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: cover;
    object-position: center;
    display: block;
    padding: 0;
}

/* ===== Carrito vacío ===== */
.dynasty-cart__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 16px;
    background: var(--dynasty-white, #FFFFFF);
    border: 1px solid #E8E8E8;
    border-radius: 14px;
    padding: 64px 24px;
    color: var(--dynasty-gray-brand, #6D6E70);
}
.dynasty-cart__empty-text {
    font-family: var(--dynasty-font-body, "Raleway", sans-serif);
    font-size: 16px;
    margin: 0;
}

/* ==========================================================================
   MOBILE (≤768px)
   ========================================================================== */
@media (max-width: 768px) {
    .dynasty-cart-item { flex-direction: column; }
    .dynasty-cart-item__media { flex: none; }
    .dynasty-cart-item__media img { width: 100%; height: auto; max-height: 220px; }
    .dynasty-cart-item__body { padding-right: 0; }

    .dynasty-cart-item__footer { gap: 16px 24px; }

    .dynasty-cart__actions { flex-direction: column; align-items: stretch; }
    .dynasty-cart__coupon-row { flex-direction: column; }
    .dynasty-cart__coupon-input { width: 100%; }
    .dynasty-cart__btn { width: 100%; }
}
