/* ==========================================================================
   CART PAGE
   ========================================================================== */

.woocommerce-cart .emporio-main { padding-block: var(--space-10) var(--space-16); }

/* 2-column grid: items | resumen */
.cart-grid {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: var(--space-8);
    align-items: start;
}
.cart-grid[data-reveal] { transition-delay: .15s; }

/* ==========================================================================
   CART ITEMS (glass card)
   ========================================================================== */

.cart-items {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-xl);
    overflow: hidden;
}

/* Cabecera de columnas */
.cart-items__header {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    gap: var(--space-4);
    padding: var(--space-3) var(--space-6);
    background: rgba(255, 255, 255, .03);
    border-bottom: 1px solid var(--color-border);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--color-text-muted);
}

/* Fila de producto */
.cart-item {
    display: grid;
    grid-template-columns: 1fr auto auto auto;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-4) var(--space-6);
    border-bottom: 1px solid var(--color-border);
    transition: background-color var(--transition-fast);
}
.cart-item:last-of-type { border-bottom: none; }
.cart-item:hover { background: rgba(255, 255, 255, .02); }

/* Info: remove + thumb + nombre agrupados */
.cart-item__info {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
}

.cart-item__remove a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex-shrink: 0;
    border-radius: var(--radius-sm);
    color: var(--color-text-muted);
    font-size: 1.1rem;
    text-decoration: none;
    line-height: 1;
    transition: color var(--transition-fast), background-color var(--transition-fast);
}
.cart-item__remove a:hover { color: var(--color-error); background: rgba(239, 68, 68, .1); }

.cart-item__thumbnail { flex-shrink: 0; }
.cart-item__thumbnail img {
    width: 72px;
    height: 72px;
    object-fit: contain;
    border-radius: var(--radius-md);
    background: #1a1a1a;
    display: block;
}

.cart-item__name {
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-sm);
    min-width: 0;
    overflow-wrap: break-word;
}
.cart-item__name a { color: var(--color-text); text-decoration: none; }
.cart-item__name a:hover { color: var(--color-accent); }
.cart-item__name .variation { margin-top: var(--space-1); font-size: var(--font-size-xs); color: var(--color-text-muted); }
.cart-item__backorder { margin-top: var(--space-1); font-size: var(--font-size-xs); color: var(--color-warning); }

.cart-item__price,
.cart-item__subtotal {
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    white-space: nowrap;
    text-align: right;
}
.cart-item__price del { color: var(--color-text-muted); font-weight: var(--font-weight-normal); margin-right: var(--space-1); }
.cart-item__price { color: var(--color-text-secondary); }
.cart-item__subtotal { color: var(--color-accent); }

.cart-item__quantity .quantity input[type=number] {
    width: 60px;
    padding: var(--space-2);
    background: var(--glass-bg);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-sm);
    color: var(--color-text);
    text-align: center;
    font-size: var(--font-size-sm);
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.cart-item__quantity .quantity input[type=number]:focus {
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px var(--color-accent-glow);
    outline: none;
}

/* ==========================================================================
   CART FOOTER (cupon + actualizar dentro del glass card)
   ========================================================================== */

.cart-footer {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-3);
    padding: var(--space-4) var(--space-6);
    border-top: 1px solid var(--color-border);
    background: rgba(255, 255, 255, .02);
}

.cart-footer__coupon {
    display: flex;
    gap: var(--space-2);
    margin-right: auto;
    flex-wrap: wrap;
}

.cart-footer__coupon input {
    padding: var(--space-2) var(--space-3);
    background: var(--glass-bg);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    color: var(--color-text);
    font-size: var(--font-size-sm);
    min-width: 160px;
    transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.cart-footer__coupon input:focus {
    border-color: var(--color-accent);
    box-shadow: 0 0 0 3px var(--color-accent-glow);
    outline: none;
}
.cart-footer__coupon input::placeholder { color: var(--color-text-muted); }

/* ==========================================================================
   CART ASIDE (sidebar resumen, sticky)
   ========================================================================== */

.cart-aside {
    position: sticky;
    top: calc(var(--promo-bar-height, 0px) + var(--header-height) + var(--space-4));
}

.cart-summary {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-xl);
    padding: var(--space-6);
}

/* Titulo del resumen */
.cart_totals h2 {
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-semibold);
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--color-text-muted);
    margin-bottom: var(--space-5);
    padding-bottom: var(--space-3);
    border-bottom: 1px solid var(--color-border);
}

/* Tabla de totales */
.cart_totals table.shop_table {
    width: 100%;
    font-size: var(--font-size-sm);
    border-collapse: collapse;
}
.cart_totals table.shop_table th {
    font-weight: var(--font-weight-medium);
    color: var(--color-text-secondary);
    padding: var(--space-3) 0;
    text-align: left;
    width: 55%;
}
.cart_totals table.shop_table td {
    padding: var(--space-3) 0;
    text-align: right;
    color: var(--color-text-secondary);
}
.cart_totals .order-total th,
.cart_totals .order-total td {
    border-top: 1px solid var(--color-border);
    padding-top: var(--space-4);
    padding-bottom: 0;
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-extrabold);
}
.cart_totals .order-total th { color: var(--color-text); }
.cart_totals .order-total td { color: var(--color-accent); }

/* Boton finalizar compra */
.cart-summary__proceed { margin-top: var(--space-5); }

/* ==========================================================================
   CARRITO VACIO
   ========================================================================== */

.page-state {
    text-align: center;
    padding: var(--space-16) var(--space-8);
}
.page-state__icon {
    width: 64px;
    height: 64px;
    margin: 0 auto var(--space-5);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-full);
    background: var(--color-accent-subtle);
    border: 1px solid var(--color-border-accent);
    color: var(--color-accent);
}
.page-state__icon svg { width: 30px; height: 30px; fill: none !important; }
.page-state__title { font-size: var(--font-size-2xl); font-weight: var(--font-weight-extrabold); margin-bottom: var(--space-3); }
.page-state__text {
    font-size: var(--font-size-lg);
    color: var(--color-text-secondary);
    margin-bottom: var(--space-6);
}
.page-state__actions {
    display: flex;
    justify-content: center;
    gap: var(--space-3);
    flex-wrap: wrap;
}

/* Mensajes WC (cupon, errores) */
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error { margin-bottom: var(--space-4); }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */

@media (max-width: 1023px) {
    .cart-grid { grid-template-columns: 1fr; }
    .cart-aside { position: static; }
}

@media (max-width: 639px) {
    /* Ocultar cabecera de columnas en mobile */
    .cart-items__header { display: none; }

    /* Filas: info ocupa ancho completo; debajo: cantidad izq + subtotal der */
    .cart-item {
        grid-template-columns: 1fr auto;
        gap: var(--space-3);
        padding: var(--space-4);
    }
    .cart-item__info { grid-column: 1 / 3; }
    .cart-item__thumbnail img { width: 60px; height: 60px; }
    .cart-item__price { display: none; }
    .cart-item__quantity { grid-column: 1; }
    .cart-item__subtotal { grid-column: 2; align-self: center; }

    .cart-footer { flex-direction: column; padding: var(--space-4); }
    .cart-footer__coupon { margin-right: 0; width: 100%; }
    .cart-footer__coupon input { min-width: auto; width: 100%; }

    /* Tabla de totales en mobile: label + valor en la misma fila */
    .cart_totals .shop_table { display: block; }
    .cart_totals .shop_table tbody { display: block; }
    .cart_totals .shop_table tr {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        padding: var(--space-3) 0;
        border-bottom: 1px solid var(--color-border);
    }
    .cart_totals .shop_table th,
    .cart_totals .shop_table td { display: block; padding: 0; border: 0; width: auto; }
    .cart_totals .order-total th,
    .cart_totals .order-total td { border-top: none; padding-top: 0; }
}