/* ============================================================================
 * tema-v2 / carrito.css  —  Fase 7, PR-7.5 (carrito + modal-carrito)
 * ----------------------------------------------------------------------------
 * Toca CONVERSIÓN. Restila: filas del carrito, imagen, cantidad, botón eliminar,
 * tarjeta de totales/resumen, CTA de pedido y el mini-carrito (modal). El
 * carrusel de relacionados (`.card-item-carousel`) ya viene de 7.2.
 *
 * OVERRIDE-FIRST, scope acotado (`.container-carrito`, `.card-resultado`,
 * `#modal-carrito`). BARANDAS: 0 cambios de markup/JS. Hooks intactos —
 * cantidad `#cantidad-{i}`/`updateCantidadDB`/`updateCantidadCookie`, eliminar
 * `.btn-delete-product`/`deleteShoppingCart`, totales `#lb-*`, CTA `.btn-RP`/
 * `openLoadingRealizarPedido`/`#form-orden`, modal `#modal-carrito`/`#mcarrito-*`/
 * `.close-modal-carrito`/`.open-modal-carrito`. Sólo forma, sombra, micro-interacción.
 * ========================================================================== */

/* ===========================================================================
 * 1) FILAS DEL CARRITO  (cada producto = .list-group-item.PaddingnNew)
 *    `.list-group-flush` las deja sin borde → se vuelven cards separadas.
 * ========================================================================= */
.container-carrito .list-group-item.PaddingnNew {
	border: 1px solid var(--gris-200);
	border-radius: var(--radio);
	margin-bottom: var(--esp-3);
	box-shadow: var(--sombra-sm);
	transition: box-shadow var(--transicion), border-color var(--transicion);
}
.container-carrito .list-group-item.PaddingnNew:hover {
	box-shadow: var(--sombra-card);
	border-color: var(--gris-100);
}
/* Imagen de producto en el carrito. */
.container-carrito .imagen-producto {
	border-radius: var(--radio-btn);
}
/* Cantidad: número centrado (redondeo ya de 7.0). */
.container-carrito .input-cantidad {
	text-align: center;
}
/* Eliminar (papelera): rojo al hover. NO se toca `.btn-delete-product` (hook). */
.btn-delete-product .fa-trash,
.btn-accion-eliminar .fa-trash {
	transition: color var(--transicion);
}
.btn-delete-product:hover .fa-trash,
.btn-accion-eliminar:hover .fa-trash {
	color: var(--bosch-rojo);
}

/* ===========================================================================
 * 2) TARJETA DE TOTALES / RESUMEN  (.card-resultado)
 * ========================================================================= */
.card-resultado {
	border: 1px solid var(--gris-200);
	border-radius: var(--radio);
	box-shadow: var(--sombra-card);
	background-color: var(--blanco);
}

/* ===========================================================================
 * 3) CTA de pedido  (btn-group .btn-RP) — destacar como acción principal,
 *    salvo cuando está deshabilitado (carrito vacío).
 * ========================================================================= */
.btn-RP:not(.disabled) .btn-bosch-primary {
	box-shadow: var(--sombra-card);
}

/* ===========================================================================
 * 4) MINI-CARRITO  (#modal-carrito) — popup al agregar al carrito
 * ========================================================================= */
#modal-carrito.modal-carrito {
	border-radius: var(--radio);
	border: 1px solid var(--gris-100);
	box-shadow: var(--sombra-card-hover);
	overflow: hidden;
}
/* Separador suave entre el producto y el resumen del mini-carrito. */
#modal-carrito .block-product {
	border-bottom: 1px solid var(--gris-100);
}