/**
 * Fecha y franja en la ficha de producto.
 *
 * Se carga SOLO en la ficha y solo si el módulo está activo para ese producto
 * — nunca en las páginas de categoría, que son las que traen el tráfico
 * orgánico (regla T-1 de docs/pdp-impacto-seo.md).
 *
 * Las trampas de Astra que hay resueltas aquí están documentadas en
 * skills/agente-frontend.md. Las dos que muerden en este bloque:
 *   · WooCommerce pinta el <input> como HERMANO del <label>, no como hijo.
 *   · El rem del tema es 14,59px, así que los px van en px.
 */

.lucilu-pdp-entrega {
	margin: 22px 0;
	padding: 18px;
	border: 1px solid #f2e4dc;
	border-radius: 10px;
	background: #fffaf7;
}

.lucilu-pdp-entrega__titulo {
	margin: 0 0 4px;
	font-size: 17px;
	line-height: 1.3;
}

.lucilu-pdp-entrega__aviso,
.lucilu-pdp-entrega__hoy {
	margin: 10px 0;
	padding: 10px 12px;
	border-left: 3px solid var(--lucilu-brand, #ff2971);
	background: #fff;
	font-size: 14px;
	color: #5a5a5a;
}

/* La franja que se movió sola. Se separa del aviso normal a propósito: aquí no
   se está informando de algo, se está diciendo que le cambiamos su elección.
   Ámbar, no rosa de marca — es una advertencia, no una promesa. */
.lucilu-pdp-entrega__movida {
	border-left-color: #b58b00;
	background: #fff8e1;
	color: #6b5200;
}

/* Vista previa de administrador: tiene que gritar que no está activo,
   o alguien dará por desplegado algo que solo él está viendo. */
.lucilu-pdp-entrega__previa {
	margin: 0 0 12px;
	padding: 8px 10px;
	border: 1px dashed #b58b00;
	border-radius: 6px;
	background: #fff8e1;
	font-size: 13px;
	color: #6b5200;
}

.lucilu-pdp-entrega__campo {
	margin: 14px 0 0;
}

.lucilu-pdp-entrega__campo label,
.lucilu-pdp-entrega__franjas legend {
	display: block;
	margin-bottom: 6px;
	font-weight: 700;
	font-size: 14px;
	color: #303438;
}

/* 16px reales, no 1rem: el rem del tema es 14,59px y Safari iOS haría zoom
   al enfocar el campo — un zoom que después no se revierte solo. */
.lucilu-pdp-entrega input[type="date"] {
	width: 100%;
	min-height: 48px;
	padding: 10px 12px;
	border: 1px solid #d8d8d8;
	border-radius: 6px;
	background: #fff;
	font-size: 16px;
	color: #303438;
}

.lucilu-pdp-entrega input[type="date"]:focus {
	border-color: var(--lucilu-brand, #ff2971);
	outline: 2px solid rgba(255, 41, 113, .18);
	outline-offset: 1px;
}

.lucilu-pdp-entrega__franjas {
	margin: 16px 0 0;
	padding: 0;
	border: 0;
}

.lucilu-pdp-entrega__lista {
	border-top: 1px solid #eee;
}

/* El radio nativo se oculta y el punto se dibuja: así da igual que Astra
   fuerce display o que el input sea hermano del label y no hijo. */
.lucilu-pdp-entrega__lista input.input-radio {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.lucilu-pdp-entrega__lista label.radio {
	position: relative;
	display: block;              /* no flex: da igual lo que fuerce el tema */
	margin: 0;
	padding: 14px 14px 14px 46px !important;
	min-height: 48px;            /* objetivo táctil */
	border-bottom: 1px solid #eee;
	font-size: 14px;
	line-height: 1.4;
	color: #303438;
	cursor: pointer;
}

.lucilu-pdp-entrega__lista label.radio::before {
	content: "";
	position: absolute;
	left: 14px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
	box-sizing: border-box;
	border: 2px solid #ccc;
	border-radius: 50%;
	background: #fff;
}

.lucilu-pdp-entrega__lista input:checked + label.radio {
	color: #001524;
	font-weight: 600;
}

.lucilu-pdp-entrega__lista input:checked + label.radio::before {
	border-color: var(--lucilu-brand, #ff2971);
	box-shadow: 0 0 0 5px var(--lucilu-brand, #ff2971) inset;
}

/* Foco visible con teclado: el radio real está oculto, así que el anillo
   tiene que pintarlo la etiqueta o la navegación por tabulador se pierde. */
.lucilu-pdp-entrega__lista input:focus-visible + label.radio::before {
	outline: 2px solid var(--lucilu-brand, #ff2971);
	outline-offset: 2px;
}

/* Franja imposible para la fecha elegida (hoy, con la mañana ya pasada). */
.lucilu-pdp-entrega__lista label.lucilu-pdp-entrega__no-disponible {
	opacity: .45;
	cursor: not-allowed;
	text-decoration: line-through;
}

.lucilu-pdp-entrega__promesa {
	margin: 14px 0 0;
	font-size: 13px;
	line-height: 1.5;
	color: #5a5a5a;   /* mínimo para cumplir 4.5:1 sobre el fondo cálido */
}

.lucilu-pdp-entrega .required {
	color: var(--lucilu-brand, #ff2971);
	border: 0;
	text-decoration: none;
}

@media (max-width: 480px) {
	.lucilu-pdp-entrega {
		padding: 14px;
	}
}

/* --- Plegado ---------------------------------------------------------------
 *
 * El bloque nace cerrado y enseña en una línea lo que va a pasar: la fecha y la
 * franja reales que se van a enviar. Se pliegan las ALTERNATIVAS, nunca la
 * decisión — un bloque cerrado que ocultara qué va a ocurrir sería peor que uno
 * alto.
 *
 * `<details>` nativo: abre y cierra sin JavaScript.
 * ------------------------------------------------------------------------ */

.lucilu-pdp-entrega__resumen {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	min-height: 44px;          /* objetivo táctil */
	padding: 4px 0;
	cursor: pointer;
	list-style: none;          /* fuera el triángulo por defecto */
}

.lucilu-pdp-entrega__resumen::-webkit-details-marker {
	display: none;
}

/* Un nodo de texto suelto dentro de un flex se vuelve un ítem propio y parte
   la frase en columnas. Por eso todo va envuelto en <span>. */
.lucilu-pdp-entrega__resumen-txt {
	display: block;
	font-size: 14px;
	line-height: 1.4;
	color: #303438;
}

.lucilu-pdp-entrega__resumen-rotulo {
	color: #5a5a5a;
}

.lucilu-pdp-entrega__resumen-hora {
	display: block;
	color: #5a5a5a;
	font-size: 13px;
}

/* No es un enlace, pero tiene que parecer accionable: si no, nadie descubre
   que las alternativas están ahí — que es el único riesgo de plegar. */
.lucilu-pdp-entrega__cambiar {
	flex: none;
	padding: 7px 14px;
	border: 1px solid var(--lucilu-brand, #ff2971);
	border-radius: 999px;
	color: var(--lucilu-brand, #ff2971);
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}

.lucilu-pdp-entrega[open] .lucilu-pdp-entrega__cambiar {
	border-color: #d8d8d8;
	color: #5a5a5a;
}

.lucilu-pdp-entrega[open] .lucilu-pdp-entrega__cambiar::before {
	content: "Cerrar ";
}

.lucilu-pdp-entrega[open] .lucilu-pdp-entrega__cambiar {
	font-size: 0;              /* se oculta "Cambiar" y queda solo "Cerrar" */
}

.lucilu-pdp-entrega[open] .lucilu-pdp-entrega__cambiar::before {
	font-size: 13px;
}

.lucilu-pdp-entrega__resumen:focus-visible {
	outline: 2px solid var(--lucilu-brand, #ff2971);
	outline-offset: 2px;
}

.lucilu-pdp-entrega__cuerpo {
	padding-top: 12px;
	margin-top: 10px;
	border-top: 1px solid #f0e5e9;
}

/* El descriptor de la franja, en su propia línea y más pequeño: ocupa la mitad
   y se lee igual. */
.lucilu-pdp-entrega__lista label.radio small {
	display: block;
	margin-top: 2px;
	color: #5a5a5a;
	font-size: 12px;
}
