/*
 * mi-pedido.css — "Mi pedido", las ventanas del cliente (cancelar, comprobante, devolución, eliminar mis datos) y las líneas de Micgo en
 * Mi cuenta, el checkout y la página de gracias (etapa 24, bloque C).
 *
 * Celular primero: todo cabe en 320 px sin desbordarse (nada de overflow-x en el body) y cada botón mide 44 px o más. Estas piezas viven en la
 * tienda, así que heredan la tipografía del tema; los colores salen solo de las variables --mic-mipedido-* de micgo-marca.css.
 */

/* Página "Mi pedido" */
.mic-mipedido {
	box-sizing: border-box;
	color: var(--mic-mipedido-texto);
	margin: 0 auto;
	max-width: 560px;
	padding: 16px;
	width: 100%;
}

.mic-mipedido *,
.mic-mipedido *::before,
.mic-mipedido *::after {
	box-sizing: border-box;
}

.mic-mipedido__titulo {
	margin: 0 0 4px;
	overflow-wrap: anywhere;
}

.mic-mipedido__estado {
	font-weight: 600;
	margin: 0 0 16px;
}

/* Etapa 25: la hora estimada mientras el pedido está en curso (también en Mi cuenta, como .mic-cuenta-tiempo). */
.mic-mipedido__tiempo,
.mic-cuenta-tiempo {
	background: var(--mic-tiempo-cliente-fondo);
	border: 1px solid var(--mic-tiempo-cliente-borde);
	border-radius: 8px;
	color: var(--mic-tiempo-cliente-texto);
	margin: 0 0 16px;
	overflow-wrap: anywhere;
	padding: 10px 12px;
}

.mic-mipedido__tiempo-hora,
.mic-cuenta-tiempo__hora {
	display: block;
	font-size: 1.05rem;
	font-weight: 700;
}

.mic-mipedido__tiempo-aviso,
.mic-cuenta-tiempo__aviso {
	display: block;
	font-size: 0.85rem;
}

.mic-mipedido__productos {
	border-bottom: 1px solid var(--mic-mipedido-borde);
	border-top: 1px solid var(--mic-mipedido-borde);
	list-style: none;
	margin: 0 0 12px;
	padding: 0;
}

.mic-mipedido__producto {
	border-bottom: 1px solid var(--mic-mipedido-borde);
	display: block;
	overflow-wrap: anywhere;
	padding: 10px 0;
}

.mic-mipedido__producto:last-child {
	border-bottom: 0;
}

.mic-mipedido__detalle {
	color: var(--mic-mipedido-suave);
	display: block;
}

.mic-mipedido__total {
	margin: 0 0 12px;
}

.mic-mipedido__ayuda {
	color: var(--mic-mipedido-suave);
	margin: 8px 0;
}

.mic-mipedido__comprobante {
	border-radius: 8px;
	margin: 0 0 12px;
	padding: 10px 12px;
}

.mic-mipedido__comprobante--falta {
	background: var(--mic-mipedido-aviso-fondo);
	border: 1px solid var(--mic-mipedido-aviso-borde);
	color: var(--mic-mipedido-aviso-texto);
}

.mic-mipedido__comprobante--listo {
	background: var(--mic-mipedido-exito-fondo);
	color: var(--mic-mipedido-exito-texto);
}

.mic-mipedido__devolucion,
.mic-mipedido__saldo {
	border-radius: 10px;
	margin: 0 0 12px;
	padding: 12px;
}

.mic-mipedido__devolucion {
	background: var(--mic-mipedido-aviso-fondo);
	border: 1px solid var(--mic-mipedido-aviso-borde);
	color: var(--mic-mipedido-aviso-texto);
}

.mic-mipedido__devolucion p,
.mic-mipedido__saldo p {
	margin: 0 0 6px;
}

.mic-mipedido__saldo {
	background: var(--mic-mipedido-saldo-fondo);
	border: 1px solid var(--mic-mipedido-saldo-borde);
	color: var(--mic-mipedido-saldo-texto);
}

.mic-mipedido__saldo-etiqueta {
	font-weight: 600;
}

.mic-mipedido__saldo-codigo {
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	overflow-wrap: anywhere;
}

.mic-mipedido__acciones {
	display: grid;
	gap: 8px;
	margin: 16px 0;
}

.mic-mipedido__mensaje {
	background: var(--mic-mipedido-exito-fondo);
	border-radius: 8px;
	color: var(--mic-mipedido-exito-texto);
	margin: 8px 0;
	padding: 10px 12px;
}

.mic-mipedido__mensaje[hidden] {
	display: none;
}

.mic-mipedido__politicas {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	margin: 16px 0 0;
}

.mic-mipedido__politicas a {
	display: inline-block;
	min-height: 44px;
	padding: 10px 0;
}

.mic-mipedido-mensaje {
	margin: 16px;
}

/* Botones */
.mic-mp-btn {
	align-items: center;
	background: var(--mic-mipedido-fondo);
	border: 1px solid var(--mic-mipedido-borde-fuerte);
	border-radius: 8px;
	color: var(--mic-mipedido-texto);
	cursor: pointer;
	display: inline-flex;
	font: inherit;
	font-weight: 600;
	justify-content: center;
	min-height: 44px;
	padding: 10px 16px;
	text-align: center;
	text-decoration: none;
}

.mic-mp-btn:focus-visible,
.mic-mp-ficha:focus-visible,
.mic-mp-opcion:focus-within,
.mic-mp-input:focus-visible {
	outline: 3px solid var(--mic-mipedido-foco);
	outline-offset: 2px;
}

.mic-mp-btn:disabled {
	cursor: progress;
	opacity: 0.6;
}

.mic-mp-btn--primario {
	background: var(--mic-mipedido-primario);
	border-color: var(--mic-mipedido-primario);
	color: var(--mic-mipedido-sobre-primario);
}

.mic-mp-btn--peligro {
	background: var(--mic-mipedido-peligro);
	border-color: var(--mic-mipedido-peligro);
	color: var(--mic-mipedido-sobre-peligro);
}

/* Ventana propia */
body.mic-mp-modal-abierto {
	overflow: hidden;
}

.mic-mp-modal {
	align-items: flex-end;
	background: var(--mic-mipedido-velo);
	bottom: 0;
	display: flex;
	justify-content: center;
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 100000;
}

.mic-mp-modal__caja {
	background: var(--mic-mipedido-fondo);
	border-radius: 14px 14px 0 0;
	box-sizing: border-box;
	color: var(--mic-mipedido-texto);
	display: grid;
	gap: 12px;
	max-height: 92vh;
	max-width: 520px;
	overflow-y: auto;
	padding: 16px 16px max(16px, env(safe-area-inset-bottom, 0px));
	width: 100%;
}

.mic-mp-modal__titulo {
	font-size: 1.15rem;
	margin: 0;
	overflow-wrap: anywhere;
}

.mic-mp-modal__subtitulo {
	font-weight: 600;
	margin: 0;
}

.mic-mp-modal__texto {
	margin: 0;
	overflow-wrap: anywhere;
}

.mic-mp-modal__error {
	background: var(--mic-mipedido-peligro-fondo);
	border-radius: 8px;
	color: var(--mic-mipedido-peligro-texto);
	margin: 0;
	overflow-wrap: anywhere;
	padding: 10px 12px;
}

.mic-mp-modal__error[hidden] {
	display: none;
}

.mic-mp-modal__acciones {
	display: grid;
	gap: 8px;
	grid-template-columns: minmax(0, 1fr);
}

.mic-mp-fichas {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.mic-mp-ficha {
	background: var(--mic-mipedido-fondo);
	border: 1px solid var(--mic-mipedido-borde-fuerte);
	border-radius: 999px;
	color: var(--mic-mipedido-texto);
	cursor: pointer;
	font: inherit;
	min-height: 44px;
	padding: 8px 14px;
}

.mic-mp-ficha[aria-pressed="true"] {
	background: var(--mic-mipedido-primario);
	border-color: var(--mic-mipedido-primario);
	color: var(--mic-mipedido-sobre-primario);
}

.mic-mp-input {
	background: var(--mic-mipedido-fondo);
	border: 1px solid var(--mic-mipedido-borde-fuerte);
	border-radius: 8px;
	box-sizing: border-box;
	color: var(--mic-mipedido-texto);
	font: inherit;
	padding: 10px;
	width: 100%;
}

.mic-mp-input[hidden] {
	display: none;
}

.mic-mp-opciones {
	border: 0;
	display: grid;
	gap: 8px;
	margin: 0;
	min-width: 0;
	padding: 0;
}

.mic-mp-opcion {
	align-items: center;
	border: 1px solid var(--mic-mipedido-borde-fuerte);
	border-radius: 10px;
	cursor: pointer;
	display: flex;
	flex-wrap: wrap;
	gap: 4px 10px;
	min-height: 44px;
	padding: 10px 12px;
}

.mic-mp-opcion input {
	flex: 0 0 auto;
	height: 22px;
	width: 22px;
}

.mic-mp-opcion__texto {
	flex: 1 1 0;
	min-width: 0;
	overflow-wrap: anywhere;
}

.mic-mp-opcion__nota {
	color: var(--mic-mipedido-primario);
	flex-basis: 100%;
	font-size: 0.9rem;
	font-weight: 600;
	padding-left: 32px;
}

.mic-mp-archivo {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	overflow: hidden;
	position: absolute;
	width: 1px;
}

.mic-mp-archivo:focus-visible + .mic-mp-archivo-nombre {
	outline: 3px solid var(--mic-mipedido-foco);
}

.mic-mp-barra {
	height: 12px;
	width: 100%;
}

.mic-mp-barra[hidden] {
	display: none;
}

/* Mi cuenta */
.mic-cuenta-acciones {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 16px 0;
}

.mic-cuenta-acciones .button,
.woocommerce-orders-table .button.mic_cancelar,
.woocommerce-orders-table .button.mic_subir_comprobante,
.woocommerce-orders-table .button.mic_elegir_devolucion {
	min-height: 44px;
}

.mic-politicas-cuenta {
	margin: 16px 0;
}

.mic-saldo__lista {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0 0 16px;
	padding: 0;
}

.mic-saldo__item {
	background: var(--mic-mipedido-saldo-fondo);
	border: 1px solid var(--mic-mipedido-saldo-borde);
	border-radius: 10px;
	color: var(--mic-mipedido-saldo-texto);
	display: grid;
	gap: 6px;
	padding: 12px;
}

.mic-saldo__codigo {
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	overflow-wrap: anywhere;
}

.mic-saldo__item .button {
	justify-self: start;
	min-height: 44px;
}

.mic-saldo-escritorio {
	margin: 8px 0;
}

.mic-eliminar-datos {
	border-top: 1px solid var(--mic-mipedido-borde);
	margin-top: 32px;
	padding-top: 16px;
}

.mic-eliminar-datos__boton {
	min-height: 44px;
	white-space: normal;
}

.mic-eliminar-datos__aviso {
	background: var(--mic-mipedido-aviso-fondo);
	border-radius: 8px;
	color: var(--mic-mipedido-aviso-texto);
	padding: 10px 12px;
}

/* Checkout y gracias */
.mic-politicas-checkout {
	font-size: 0.9rem;
	margin: 0 0 12px;
}

.mic-saldo-checkout {
	background: var(--mic-mipedido-saldo-fondo);
	color: var(--mic-mipedido-saldo-texto);
	padding: 10px 12px;
}

.mic-saldo-checkout__nota {
	display: block;
	margin-top: 4px;
}

.mic-saldo-usar {
	min-height: 44px;
}

.mic-gracias {
	margin: 24px 0;
}

.mic-gracias .mic-ver-pedido {
	min-height: 44px;
}

.mic-gracias__ayuda {
	color: var(--mic-mipedido-suave);
}

.mic-politica-enlace {
	margin: 4px 0;
}

@media (min-width: 640px) {
	.mic-mp-modal {
		align-items: center;
	}

	.mic-mp-modal__caja {
		border-radius: 14px;
	}

	.mic-mp-modal__acciones {
		grid-auto-flow: column;
		justify-content: end;
	}

	.mic-mipedido__acciones {
		grid-auto-flow: column;
		justify-content: start;
	}
}