/**
 * Panza Llena - Frontend
 *
 * Estilos mínimos para los estados que agrega el JS (pllc-frontend.js).
 * Son a propósito genéricos y de baja especificidad: cualquier CSS que
 * agregues desde Elementor sobre estas mismas clases los va a pisar sin
 * necesidad de !important.
 */

.pllc-active {
	outline: 2px solid currentColor;
	font-weight: bold;
}

.pllc-added {
	opacity: 0.75;
}

.pllc-disabled {
	opacity: 0.4;
	pointer-events: none;
	cursor: not-allowed;
}

/* Controles generados por los shortcodes (class-pllc-shortcodes.php) */

.pllc-variant-options,
.pllc-meal-checkboxes,
.pllc-quantity-stepper {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.pllc-variant-option,
.pllc-meal-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
}

.pllc-variant-price {
	font-weight: bold;
}

/* Conserva visible en azul la variante elegida aunque el día esté bloqueado. */
body.pllc-page-colegios [data-pllc-role="variant"]:checked:disabled {
	-webkit-appearance: none;
	appearance: none;
	width: 13px;
	height: 13px;
	margin: 0;
	flex: 0 0 13px;
	border: 1px solid #1683ff;
	border-radius: 50%;
	background: radial-gradient(circle at center, #1683ff 0 3px, transparent 3.5px);
	opacity: 1;
}

.pllc-quantity-stepper input[type="number"] {
	width: 3em;
	text-align: center;
	-moz-appearance: textfield;
}

.pllc-quantity-stepper input[type="number"]::-webkit-outer-spin-button,
.pllc-quantity-stepper input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.pllc-qty-btn {
	cursor: pointer;
}

/* Formulario lateral (class-pllc-shortcodes.php > render_order_form) */

.pllc-order-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.pllc-field {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.pllc-field input[type="text"],
.pllc-field select,
.pllc-field textarea {
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 4px;
}

.pllc-inline-option {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin-right: 12px;
}

.pllc-submit-order {
	cursor: pointer;
	padding: 10px 16px;
	border: none;
	border-radius: 4px;
	background-color: #4caf50;
	color: #fff;
	font-weight: bold;
}

.pllc-submit-order:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

.pllc-form-message {
	color: #c0392b;
	font-size: 0.9em;
}

.pllc-form-message.pllc-form-message-info {
	color: #9a6700;
	font-weight: 600;
}

/* Carrito/Checkout agrupado por pedido (class-pllc-cart-groups.php) */

.pllc-cart-group-header {
	font-weight: bold;
	font-size: 1.3em;
	margin-bottom: 4px;
	color: #5bc0de;
}

.pllc-cart-group-summary {
	font-size: 0.9em;
	color: #555;
	margin-bottom: 10px;
}

/* El rótulo vacío del pedido (dt "pllc-group-header:") se oculta por
   JavaScript (hideGroupHeaderLabel en pllc-frontend.js) — WooCommerce en
   esta instalación imprime el campo "key" como texto visible en vez de
   usarlo solo como clase CSS, así que ocultarlo por clase no era confiable. */

/* Reordenar visualmente: que el bloque "Pedido para..." + resumen
   aparezca ARRIBA del nombre del producto, sin depender de en qué
   orden lo arma Elementor en el HTML real. */
.product-name {
	display: flex;
	flex-direction: column;
}

.product-name > a {
	order: 2;
}

.product-name dl.variation {
	order: 1;
	margin: 0;
}

.pllc-fixed-qty {
	display: inline-block;
	padding: 0 8px;
}

.pllc-cart-day-label {
	font-weight: 600;
	margin-top: 6px;
}

/* Botón "Update Cart": solo debe verse si hay productos de Particular en
   el carrito (son los únicos con cantidad editable) — oculto por defecto,
   el JS lo muestra si corresponde (toggleUpdateCartButton en pllc-frontend.js). */
button[name="update_cart"] {
	display: none;
}

/* Carrito 100% Colegios: Subtotal y Total muestran el mismo número (no
   hay envío), así que ocultamos el renglón de Subtotal para no repetirlo.
   Cubrimos varios nombres de clase posibles porque no tenemos confirmado
   cuál usa exactamente el widget de Totales de Elementor. */
body.pllc-colegios-only-cart .cart-subtotal,
body.pllc-colegios-only-cart tr.cart-subtotal,
body.pllc-colegios-only-cart .wc-block-components-totals-item--subtotal,
body.pllc-colegios-only-cart [class*="subtotal" i] {
	display: none;
}

.pllc-shipping-note {
	font-size: 0.85em;
	color: #555;
	font-style: italic;
	margin-bottom: 8px;
}

/* Fila propia (colspan completo) para "Pedido para..." + resumen, armada
   por JS (expandGroupHeadersFullWidth) para que ocupe todo el ancho de la
   tabla en vez de quedar apretada en la columna Producto. El !important
   es a propósito: las tablas de WooCommerce fuerzan display:block en las
   celdas dentro de un media query para mobile, y necesitamos ganarle esa
   regla para que se vea igual de prolijo en los dos tamaños. */
.pllc-cart-group-header-row td {
	display: table-cell !important;
	width: 100% !important;
	padding: 16px 0 8px !important;
	border-top: 1px solid #ddd;
}

.pllc-cart-group-header-row td::before {
	content: none !important;
}
.pllc-student-picker {
	margin: -4px 0 18px;
}

.pllc-student-picker-title {
	display: block;
	font-weight: 600;
	margin-bottom: 8px;
}

.pllc-student-options {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
}

.pllc-student-option {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
}

.pllc-existing-student [data-pllc-field]:disabled {
	opacity: .72;
	cursor: not-allowed;
}

[data-pllc-role="student-name-field"][hidden] {
	display: none !important;
}

/* El acceso al carrito debe permanecer visible incluso cuando Elementor
   tenga activada la opción de ocultarlo al estar vacío. */
.elementor-widget-woocommerce-menu-cart {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* En usuarios ITEO el importe del ícono nunca se muestra. PHP ya entrega
   "---" desde el HTML inicial y en cada fragmento AJAX; esta regla evita
   cualquier destello del importe si un widget conserva markup propio. */
body.pllc-iteo-price-masked .elementor-widget-woocommerce-menu-cart .woocommerce-Price-amount,
body.pllc-iteo-price-masked .elementor-menu-cart__toggle .woocommerce-Price-amount,
body.pllc-iteo-price-masked .elementor-button-text .woocommerce-Price-amount {
	font-size: 0 !important;
}

body.pllc-iteo-price-masked .elementor-widget-woocommerce-menu-cart .woocommerce-Price-amount::after,
body.pllc-iteo-price-masked .elementor-menu-cart__toggle .woocommerce-Price-amount::after,
body.pllc-iteo-price-masked .elementor-button-text .woocommerce-Price-amount::after {
	content: '---';
	font-size: 14px;
}

.pllc-update-pending {
	opacity: 1;
}

/* Botón de producto (la clase pllc-add-btn se asigna al widget de Elementor).
   Los selectores contemplan tanto el estado en el widget como en el botón
   interno, sin depender de cómo Elementor genere el HTML. */
body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn .elementor-button {
	width: 100%;
	min-height: 44px;
	padding: 11px 18px;
	border: 2px solid #009688 !important;
	border-radius: 6px;
	background-color: #009688 !important;
	color: #fff !important;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
	transition: all 0.2s ease;
}

body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn .elementor-button:hover {
	border-color: #009688 !important;
	background-color: #009688 !important;
	color: #fff !important;
}

body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn.pllc-added .elementor-button,
body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn .elementor-button.pllc-added {
	border-color: #d92d20 !important;
	background-color: #d92d20 !important;
	color: #fff !important;
	opacity: 1;
}

body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn.pllc-update-pending .elementor-button,
body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn .elementor-button.pllc-update-pending {
	border-color: #f79009 !important;
	background-color: #f79009 !important;
	color: #fff !important;
	opacity: 1;
}

body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn.pllc-disabled .elementor-button,
body:is(.pllc-page-iteo-pacientes, .pllc-page-iteo-personal) .pllc-add-btn .elementor-button.pllc-disabled {
	border-color: #ddd !important;
	background-color: #ddd !important;
	color: #888 !important;
	opacity: .7;
	cursor: default;
}

/* Botones de Colegios. Los estados se aplican al elemento que contiene
   data-pllc-role="add-btn"; el markup interno de Elementor se conserva. */
body.pllc-page-colegios [data-pllc-role="add-btn"],
body.pllc-page-colegios [data-pllc-role="add-btn"] .elementor-button {
	background-color: #009688 !important;
	border-color: #009688 !important;
	color: #fff !important;
}

body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added .elementor-button {
	background-color: #d92d20 !important;
	border-color: #d92d20 !important;
	color: #fff !important;
	opacity: 1;
}

body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending .elementor-button {
	background-color: #f79009 !important;
	border-color: #f79009 !important;
	color: #fff !important;
	opacity: 1;
}

body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-disabled,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-disabled .elementor-button {
	background-color: #ddd !important;
	border-color: #ddd !important;
	color: #888 !important;
	opacity: .7;
}

body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:hover,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:hover .elementor-button,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:focus,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:focus .elementor-button,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:active,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-added:active .elementor-button {
	background-color: #d92d20 !important;
	border-color: #d92d20 !important;
	color: #fff !important;
}

body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:hover,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:hover .elementor-button,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:focus,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:focus .elementor-button,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:active,
body.pllc-page-colegios [data-pllc-role="add-btn"].pllc-update-pending:active .elementor-button {
	background-color: #f79009 !important;
	border-color: #f79009 !important;
	color: #fff !important;
}

.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle,
.elementor-widget-woocommerce-menu-cart .elementor-menu-cart__toggle_button {
	display: flex !important;
	visibility: visible !important;
	opacity: 1 !important;
}

/* Finalizar compra: agrupación y columna de producto más ancha. */
body.woocommerce-checkout .woocommerce-checkout-review-order-table { table-layout: auto !important; width: 100% !important; }

/* En pedidos agrupados (Colegios, ITEO o mixtos), los encabezados de
   columnas quedan flotando sobre los títulos de cada pedido. El título
   "Tu pedido", los grupos y los importes alineados ya dan el contexto.
   Se conservan intactos en carritos 100% Particulares. */
body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table > thead {
	display: none !important;
}

body.woocommerce-checkout .woocommerce-checkout-review-order-table th.product-name,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name { width: auto !important; max-width: none !important; }
body.woocommerce-checkout .woocommerce-checkout-review-order-table th.product-total,
body.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total { width: 115px !important; min-width: 115px; white-space: nowrap; }
.pllc-checkout-group-header { display: block; width: 100% !important; max-width: none !important; box-sizing: border-box; margin: 18px 0 10px; padding-top: 14px; border-top: 1px solid #ddd; }
tbody tr:first-child .pllc-checkout-group-header { margin-top: 0; padding-top: 0; border-top: 0; }
.pllc-checkout-product-name { display: block; margin-top: 4px; }

/* ITEO: sin cupón ni referencias a precios/costos. */
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-form-coupon-toggle,
body.woocommerce-checkout.pllc-iteo-price-masked form.checkout_coupon,
body.woocommerce-checkout.pllc-iteo-price-masked .e-woocommerce-coupon-nudge,
body.woocommerce-checkout.pllc-iteo-price-masked [class*="coupon-box" i],
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table th.product-total,
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table td.product-total,
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table tfoot,
body.woocommerce-checkout.pllc-iteo-price-masked .wc-block-components-totals-wrapper,
body.woocommerce-checkout.pllc-iteo-price-masked [class*="order-total" i],
body.woocommerce-checkout.pllc-iteo-price-masked [class*="subtotal" i] { display: none !important; }
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table th.product-name,
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table td.product-name { width: 100% !important; }
body.woocommerce-checkout.pllc-iteo-price-masked .woocommerce-checkout-review-order-table tr { display: table-row !important; width: 100% !important; }

/* ITEO: en el cuadro final queda solamente Realizar pedido. */
body.woocommerce-checkout.pllc-iteo-only-cart #payment .wc_payment_methods,
body.woocommerce-checkout.pllc-iteo-only-cart #payment .woocommerce-privacy-policy-text,
body.woocommerce-checkout.pllc-iteo-only-cart #payment .woocommerce-terms-and-conditions-wrapper { display: none !important; }
body.woocommerce-checkout.pllc-iteo-only-cart #payment { background: transparent; }
body.woocommerce-checkout.pllc-iteo-only-cart #payment .place-order { margin: 0; padding: 0; }

/* Carrito: el día queda arriba y antes del nombre del plato. */
body.woocommerce-cart .pllc-cart-day-label-before-product { display: block; margin: 0 0 5px; order: -1; }

/* Checkout: encabezado del pedido en fila propia; precios alineados con platos. */
body.woocommerce-checkout .pllc-checkout-group-header-row > td {
	display: table-cell !important;
	width: 100% !important;
	max-width: none !important;
	padding: 18px 0 10px !important;
	vertical-align: top !important;
}
body.woocommerce-checkout .pllc-checkout-group-header-row > td::before { content: none !important; }
body.woocommerce-checkout .pllc-checkout-group-header-row .pllc-checkout-group-header {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td.product-name,
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td.product-total {
	vertical-align: top !important;
	padding-top: 12px !important;
	padding-bottom: 20px !important;
}
body.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td.product-total {
	text-align: right !important;
}

/* Checkout agrupado: bloques más legibles y totales estables. Elementor
   deja que el contenido calcule el ancho de las columnas; al ocultar el
   encabezado en un carrito mixto, Envío podía quedar dentro de una columna
   demasiado angosta. La grilla del pie evita ese desplazamiento. */
body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table {
	table-layout: fixed !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody tr.pllc-checkout-group-header-row > td {
	background: #f2f9fc !important;
	border-left: 4px solid #50bde3 !important;
	border-radius: 6px !important;
	padding: 14px 16px !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .pllc-checkout-group-header-row .pllc-cart-group-header {
	font-size: 1.15em;
	line-height: 1.25;
	margin-bottom: 5px !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .pllc-checkout-group-header-row .pllc-cart-group-summary {
	font-size: .9em;
	line-height: 1.5;
	color: #4f5d66;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody tr:not(.pllc-checkout-group-header-row) > td {
	background: #fff;
	border-bottom: 1px solid #e7edf0 !important;
	padding: 15px 12px 17px !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody td.product-name {
	width: auto !important;
	line-height: 1.45;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody td.product-total {
	width: 125px !important;
	min-width: 125px !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody .pllc-cart-day-label {
	display: inline-block;
	margin: 0 0 7px;
	padding: 3px 8px;
	background: #eef3f6;
	border-radius: 999px;
	font-size: .82em;
	line-height: 1.35;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot tr {
	display: grid !important;
	grid-template-columns: minmax(90px, 1fr) minmax(190px, 55%);
	column-gap: 18px;
	align-items: start;
	width: 100% !important;
	border-bottom: 1px solid #e7edf0;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot th,
body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot td {
	display: block !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	box-sizing: border-box;
	padding: 14px 0 !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot th {
	text-align: left !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot td {
	text-align: right !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot tr.shipping td {
	text-align: left !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot tr.pllc-shipping-note-row > td {
	display: table-cell !important;
	width: 100% !important;
	max-width: none !important;
	padding: 10px 12px !important;
	background: #fff8e8;
	border-left: 3px solid #f3a712;
	border-radius: 5px;
	text-align: left !important;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot tr.pllc-shipping-note-row {
	display: table-row !important;
	width: 100% !important;
}

body.woocommerce-checkout .pllc-shipping-note-row .pllc-shipping-note {
	margin: 0;
	color: #59636b;
}

body.woocommerce-cart .cart_totals tr.pllc-shipping-note-row > td {
	width: 100% !important;
	padding: 10px 12px !important;
	background: #fff8e8;
	border-left: 3px solid #f3a712;
	border-radius: 5px;
	text-align: left !important;
}

body.woocommerce-cart .pllc-shipping-note-row .pllc-shipping-note {
	margin: 0;
	color: #59636b;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot ul#shipping_method {
	width: 100%;
	margin: 0;
	padding: 0;
}

body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot ul#shipping_method li {
	margin: 0 0 8px;
	line-height: 1.4;
}

@media (max-width: 600px) {
	body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tfoot tr {
		grid-template-columns: 82px minmax(0, 1fr);
		column-gap: 12px;
	}

	body.woocommerce-checkout.pllc-grouped-order-cart .woocommerce-checkout-review-order-table tbody td.product-total {
		width: 92px !important;
		min-width: 92px !important;
	}
}