/*
 * Micgo — colores de la marca. Un solo :root; el resto de los CSS del plugin solo usa var(--mic-…).
 *
 * Los nombres son por función, no por color: si cambia el azul de los botones cambia --mic-primario, y el verde de
 * "Completado" o el rojo de "Cancelar" no se mueven. Los correos no entienden variables CSS: sus valores están en
 * src/Brand/Palette.php y una prueba unitaria revisa que coincidan con este archivo.
 * Estos son los únicos colores del panel, del admin de Micgo y de los correos; ningún negocio los cambia.
 */
:root {
	/* Marca */
	--mic-primario: #1d4ed8;
	--mic-primario-oscuro: #1942b8;
	--mic-sobre-primario: #fff;

	/* Base del panel */
	--mic-fondo: #f1f3f5;
	--mic-fondo-tenue: #e4e7eb;
	--mic-superficie: #fff;
	--mic-texto: #1f2a37;
	--mic-texto-suave: #52606d;
	--mic-borde: #d5dae0;
	--mic-borde-fuerte: #aab3bd;
	--mic-foco: #f59e0b;

	/* Cabecera del panel (también el color de la barra del celular) */
	--mic-cabecera: #1f2a37;
	--mic-sobre-cabecera: #fff;
	--mic-cabecera-activo: rgba(255, 255, 255, 0.2);

	/* Éxito */
	--mic-exito-fondo: #e3f4e8;
	--mic-exito-texto: #14532d;

	/* Peligro */
	--mic-peligro: #b42318;
	--mic-sobre-peligro: #fff;
	--mic-peligro-fondo: #fdecea;
	--mic-peligro-texto: #7a1810;

	/* Aviso */
	--mic-aviso: #fff4d6;
	--mic-aviso-borde: #d89b00;
	--mic-aviso-texto: #4a3500;
	--mic-alerta: #d97706;

	/* Info */
	--mic-info-fondo: #e0ecff;
	--mic-info-borde: #1d4ed8;
	--mic-info-texto: #12306e;

	/* Medidor de contraseña (débil usa --mic-alerta) */
	--mic-medidor-bueno: #65a30d;
	--mic-medidor-fuerte: #15803d;

	/* Superposiciones: fondo de las ventanas y visor del comprobante */
	--mic-velo: rgba(15, 23, 42, 0.55);
	--mic-visor: #000;
	--mic-visor-barra: rgba(0, 0, 0, 0.8);

	/* Estados de los pedidos en el panel (mismos tonos de Woo, oscurecidos donde el texto blanco no llega a contraste AA) */
	--mic-estado-pendiente: #f5c518;
	--mic-estado-pendiente-texto: #3b2f00;
	--mic-estado-programado: #7d3c98;
	--mic-estado-preparacion: #1f6aa5;
	--mic-estado-camino: #b45309;
	--mic-estado-listo: #0f766e;
	--mic-estado-completado: #1e8449;
	--mic-estado-rechazado: #c0392b;
	--mic-estado-cancelado: #5d6d6e;
	--mic-estado-reembolsado: #bdc3c7;
	--mic-estado-reembolsado-texto: #2c3e50;
	--mic-sobre-estado: #fff;

	/* Pedidos para recoger en el local: etiqueta de la tarjeta y del Historial */
	--mic-recoger: #0f766e;
	--mic-sobre-recoger: #fff;
	--mic-recoger-fondo: #ccfbf1;
	--mic-recoger-texto: #134e4a;

	/* Pedidos para la mesa (etapa 17): "Mesa 5" grande en la tarjeta, "Paga en caja" y el Historial */
	--mic-mesa: #7c3aed;
	--mic-sobre-mesa: #fff;
	--mic-mesa-fondo: #ede9fe;
	--mic-mesa-texto: #4c1d95;

	/* Canales de venta y Nuevo pedido (etapa 23): la etiqueta del canal en la tarjeta, "Ya pagado · no cobrar", la tarjeta recién creada y
	   el botón "+" de Pedidos. Todos apuntan a colores que ya existen. */
	--mic-canal-fondo: var(--mic-info-fondo);
	--mic-canal-borde: var(--mic-info-borde);
	--mic-canal-texto: var(--mic-info-texto);
	--mic-pagado-fondo: var(--mic-exito-fondo);
	--mic-pagado-texto: var(--mic-exito-texto);
	--mic-resaltada: var(--mic-primario);
	--mic-fab: var(--mic-primario);
	--mic-sobre-fab: var(--mic-sobre-primario);

	/* Etiquetas de estado en la lista de pedidos del admin de Woo (otros tonos que el panel) */
	--mic-admin-estado-pendiente-texto: #1a1a1a;
	--mic-admin-estado-programado: #9b59b6;
	--mic-admin-estado-preparacion: #3498db;
	--mic-admin-estado-camino: #e67e22;
	--mic-admin-estado-listo: #1abc9c;
	--mic-admin-estado-completado: #27ae60;
	--mic-admin-estado-rechazado: #e74c3c;
	--mic-admin-estado-cancelado: #7f8c8d;

	/* Admin de WordPress: sección Licencia y errores del checkout (los tonos de WordPress) */
	--mic-wp-gris: #646970;
	--mic-licencia-activa: #1e7e34;
	--mic-licencia-gracia: #b26a00;
	--mic-peligro-wp: #b32d2e;
	--mic-peligro-fondo-wp: #fcf0f1;

	/* Checkout */
	--mic-checkout-aviso-fondo: #fff8e5;
	--mic-checkout-aviso-borde: #dba617;
	--mic-checkout-requerido: #e2401c;
	--mic-checkout-texto-suave: #5c6670;

	/* Medida, no color: alto de la barra inferior del panel en el celular (1 px de borde + 8 px arriba + 56 px del ítem + abajo el mayor
	   entre 8 px y la zona segura del iPhone). La usan la barra y el contenido; el mínimo de ítem de 56 px está en panel.css. */
	--mic-nav-alto: calc(1px + 8px + 56px + max(8px, env(safe-area-inset-bottom, 0px)));

	/* Toppings en la página del producto: el texto y la fuente los hereda del tema; estas variables se pueden cambiar
	   desde el CSS personalizado de Elementor (por ejemplo --mic-toppings-borde en .mic-toppings). */
	--mic-toppings-borde: var(--mic-borde);
	--mic-toppings-borde-elegido: currentColor;
	--mic-toppings-fondo-agotado: var(--mic-fondo-tenue);
	--mic-toppings-texto-suave: var(--mic-texto-suave);
	--mic-toppings-aviso-fondo: var(--mic-aviso);
	--mic-toppings-aviso-borde: var(--mic-aviso-borde);
	--mic-toppings-aviso-texto: var(--mic-aviso-texto);
	--mic-toppings-foco: var(--mic-foco);

	/* Página Productos del panel (etapa 21): etiquetas de estado, fichas de categoría, foto sin imagen y aviso con "Deshacer". */
	--mic-prod-agotado-fondo: var(--mic-peligro-fondo);
	--mic-prod-agotado-texto: var(--mic-peligro-texto);
	--mic-prod-oculto-fondo: var(--mic-fondo-tenue);
	--mic-prod-oculto-texto: var(--mic-texto-suave);
	--mic-prod-tamanos-fondo: var(--mic-info-fondo);
	--mic-prod-tamanos-texto: var(--mic-info-texto);
	--mic-prod-quedan-fondo: var(--mic-aviso);
	--mic-prod-quedan-texto: var(--mic-aviso-texto);
	--mic-prod-ficha-fondo: var(--mic-superficie);
	--mic-prod-ficha-texto: var(--mic-texto);
	--mic-prod-ficha-borde: var(--mic-borde-fuerte);
	--mic-prod-ficha-activa-fondo: var(--mic-primario);
	--mic-prod-ficha-activa-texto: var(--mic-sobre-primario);
	--mic-prod-foto-fondo: var(--mic-fondo-tenue);
	--mic-prod-foto-texto: var(--mic-texto-suave);
	--mic-prod-precio-tachado: var(--mic-texto-suave);
	--mic-prod-interruptor-activo: var(--mic-medidor-fuerte);
	--mic-prod-interruptor-apagado: var(--mic-borde-fuerte);
	--mic-prod-interruptor-bola: var(--mic-superficie);
	--mic-prod-aviso-fondo: var(--mic-cabecera);
	--mic-prod-aviso-texto: var(--mic-sobre-cabecera);
	--mic-prod-aviso-accion: var(--mic-sobre-cabecera);

	/* Aviso de cookies de la tienda (etapa 20). Se cambian desde el CSS personalizado de Elementor (por ejemplo --mic-cookies-fondo en
	   .mic-cookies). Los dos botones llevan el mismo estilo: aceptar y rechazar pesan igual. */
	--mic-cookies-fondo: var(--mic-superficie);
	--mic-cookies-texto: var(--mic-texto);
	--mic-cookies-borde: var(--mic-borde-fuerte);
	--mic-cookies-enlace: var(--mic-primario);
	--mic-cookies-boton-fondo: var(--mic-primario);
	--mic-cookies-boton-texto: var(--mic-sobre-primario);
	--mic-cookies-boton-borde: var(--mic-primario-oscuro);
	--mic-cookies-foco: var(--mic-foco);
	/* Lo pone mic-analitica.js mientras la barra está a la vista (alto de la barra, para dejar libre el final de la página). */
	--mic-cookies-alto: 0px;

	/* Página /bienvenido (etapa 19): el fondo es el color por defecto del negocio (cada negocio elige el suyo y se pone en línea,
	   validado); el texto es blanco u oscuro según el contraste (Welcome\Contrast); el vidrio de los botones cambia de opacidad
	   según el texto. Estos tres hex también están en Palette.php. */
	--mic-bienvenido-fondo: #6b2d8f;
	--mic-bienvenido-texto-claro: #ffffff;
	--mic-bienvenido-texto-oscuro: #000000;
	--mic-bienvenido-vidrio-sobre-oscuro: rgba(255, 255, 255, 0.14);
	--mic-bienvenido-vidrio-sin-blur-sobre-oscuro: rgba(255, 255, 255, 0.24);
	--mic-bienvenido-borde-sobre-oscuro: rgba(255, 255, 255, 0.34);
	--mic-bienvenido-vidrio-sobre-claro: rgba(255, 255, 255, 0.55);
	--mic-bienvenido-vidrio-sin-blur-sobre-claro: rgba(255, 255, 255, 0.78);
	--mic-bienvenido-borde-sobre-claro: rgba(0, 0, 0, 0.14);
	--mic-bienvenido-sombra: rgba(0, 0, 0, 0.18);

	/* Cancelaciones, devoluciones y saldo (etapa 24, bloque C): todo apunta a los colores de arriba, sin hex nuevos. Lo usan la tarjeta del
	   panel (--mic-devolucion-*), la página "Mi pedido", las ventanas del cliente y las líneas del checkout y de Mi cuenta (--mic-mipedido-*). */
	--mic-devolucion-fondo: var(--mic-aviso);
	--mic-devolucion-borde: var(--mic-aviso-borde);
	--mic-devolucion-texto: var(--mic-aviso-texto);
	--mic-devolucion-cerrada-fondo: var(--mic-fondo-tenue);
	--mic-devolucion-cerrada-texto: var(--mic-texto);
	--mic-devolucion-hecha-fondo: var(--mic-exito-fondo);
	--mic-devolucion-hecha-texto: var(--mic-exito-texto);
	--mic-cancelado-cliente-fondo: var(--mic-peligro-fondo);
	--mic-cancelado-cliente-borde: var(--mic-peligro);
	--mic-cancelado-cliente-texto: var(--mic-peligro-texto);
	--mic-aviso-hoy-fondo: var(--mic-aviso);
	--mic-aviso-hoy-borde: var(--mic-aviso-borde);
	--mic-aviso-hoy-texto: var(--mic-aviso-texto);
	--mic-mipedido-fondo: var(--mic-superficie);
	--mic-mipedido-texto: var(--mic-texto);
	--mic-mipedido-suave: var(--mic-texto-suave);
	--mic-mipedido-borde: var(--mic-borde);
	--mic-mipedido-borde-fuerte: var(--mic-borde-fuerte);
	--mic-mipedido-primario: var(--mic-primario);
	--mic-mipedido-sobre-primario: var(--mic-sobre-primario);
	--mic-mipedido-peligro: var(--mic-peligro);
	--mic-mipedido-sobre-peligro: var(--mic-sobre-peligro);
	--mic-mipedido-peligro-fondo: var(--mic-peligro-fondo);
	--mic-mipedido-peligro-texto: var(--mic-peligro-texto);
	--mic-mipedido-aviso-fondo: var(--mic-aviso);
	--mic-mipedido-aviso-borde: var(--mic-aviso-borde);
	--mic-mipedido-aviso-texto: var(--mic-aviso-texto);
	--mic-mipedido-exito-fondo: var(--mic-exito-fondo);
	--mic-mipedido-exito-texto: var(--mic-exito-texto);
	--mic-mipedido-saldo-fondo: var(--mic-info-fondo);
	--mic-mipedido-saldo-borde: var(--mic-info-borde);
	--mic-mipedido-saldo-texto: var(--mic-info-texto);
	--mic-mipedido-velo: var(--mic-velo);
	--mic-mipedido-foco: var(--mic-foco);

	/* Etapa 25, tiempo estimado: la línea de la tarjeta del panel (a tiempo, por vencer con 5 minutos o menos, atrasado) y la hora que ve el
	   cliente. Siempre van con texto, no solo con color. */
	--mic-a-tiempo-texto: var(--mic-texto-suave);
	--mic-por-vencer-fondo: var(--mic-aviso);
	--mic-por-vencer-borde: var(--mic-aviso-borde);
	--mic-por-vencer-texto: var(--mic-aviso-texto);
	--mic-atraso-fondo: var(--mic-peligro-fondo);
	--mic-atraso-borde: var(--mic-peligro);
	--mic-atraso-texto: var(--mic-peligro-texto);
	--mic-atrasados-fondo: var(--mic-peligro-fondo);
	--mic-atrasados-texto: var(--mic-peligro-texto);
	--mic-tiempo-cliente-fondo: var(--mic-info-fondo);
	--mic-tiempo-cliente-borde: var(--mic-info-borde);
	--mic-tiempo-cliente-texto: var(--mic-info-texto);

	/* Correos y HTML en línea de PHP (estos solo los usa Palette.php) */
	--mic-correo-base: #7f54b3;
	--mic-correo-texto: #3c3c3c;
	--mic-correo-borde: #e5e5e5;
	--mic-correo-sobre-claro: #202020;
	--mic-borde-punteado: #ccc;
	--mic-borde-miniatura: #ccd0d4;
}
