/* ═══════════════════════════════════════════════════════════════════════
   TEMA "CLÁSICO" — SOLO CORRECCIONES DE CONTRASTE (WCAG 2.x AA)
   ═══════════════════════════════════════════════════════════════════════

   El Clásico sigue viviendo en main.css + tailwind.css, sin tocar. Esta hoja
   solo sube el contraste de los textos que no se leían bien, medido con el
   escáner de contraste el 2026-09-22 (texto normal ≥ 4.5:1, grande ≥ 3:1).
   Cada valor es el más cercano al original que pasa, para no cambiar la
   identidad: mismo tono, solo más claro u oscuro.

   Ámbito: todo lo que NO es Pulida ni Retail. Así cubre también una página
   sin atributo de tema (JS desactivado o antes de que corra theme-boot.js).
   ═══════════════════════════════════════════════════════════════════════ */

/* Botones magenta con texto blanco: #ff00c2 daba 3.48:1. #da00a6 → 4.63:1. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .bg-brand {
    background-color: #da00a6;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .from-brand:not(.bg-clip-text) {
    --tw-gradient-from: #da00a6 var(--tw-gradient-from-position);
}

/* Magenta como TEXTO sobre fondo oscuro (4.05:1) → #ff3ed1 (4.61:1). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .text-brand {
    color: #ff3ed1;
}

/* Grises secundarios: gray-500 (#6b7280) y gray-600 (#4b5563) no llegaban a
   4.5:1 sobre las tarjetas oscuras (2.1–4.1:1). #8d94a0 pasa en todas. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) :is(.text-gray-500, .text-gray-600) {
    color: #8d94a0;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) :is(.placeholder-gray-500, .placeholder-gray-600)::placeholder {
    color: #8d94a0;
}

/* Rótulo "Tecni-Dynamics" de la cabecera del panel: morado al 50 % (2.65:1). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .text-purple-400\/50 {
    color: rgb(192 132 252 / 0.9);
}

/* Pestañas y filtros del panel en reposo: #4b5675 / #64748b (2.6–4.1:1).
   Solo en reposo: el estado activo y el hover conservan sus colores de main.css. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) :is(.admin-tab, .order-filter-btn, .finance-subtab):not(.active):not(:hover) {
    color: #8d94a0;
}

/* Cabecera del chat: "Asistente con IA" era verde sobre magenta (2.39:1). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) #chatbot-drag-handle .text-brand-accent {
    color: #ffffff;
}

/* Banner "Oferta Especial": el texto blanco caía sobre los tramos rosa y coral
   del degradado (2.1–2.6:1). Mismo recorrido de color, tramos claros oscurecidos. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .bg-banner-purple-gradient {
    background: linear-gradient(135deg, #1e0a3c, #2d1b69 30%, #b8008f 60%, #be123c 85%, #b3007f);
}
/* Su párrafo va en blanco al 80 %: aun con el degradado oscurecido daba 4.23:1. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .bg-banner-purple-gradient .text-white\/80 {
    color: #ffffff;
}

/* Iconos de la cabecera del chat (robot, vaciar, cerrar) sobre el degradado
   magenta: rosa claro y gris daban 1.7–1.8:1. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) #chatbot-drag-handle :is(.text-brand-light, .text-gray-400) {
    color: #ffffff;
}
/* Botones flotantes de WhatsApp e Instagram: icono blanco sobre verde #25D366
   (1.98:1) y sobre el naranja inicial del degradado (2.34:1). Mismo tono, más
   oscuro, para llegar a 3:1 (contraste de objetos gráficos). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .social-float-btn.bg-\[\#25D366\] {
    background-color: #198646;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .social-float-btn.from-\[\#f09433\] {
    --tw-gradient-from: #c8661a var(--tw-gradient-from-position);
}
/* Motivo de anulación de un pedido (panel): rojo al 70 % (3.8–4.0:1). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .text-red-400\/70 {
    color: #f87171;
}
/* Iconos decorativos casi invisibles (estados vacíos, "+" de los botones). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .text-gray-700 {
    color: #6b7280;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .text-brand\/50 {
    color: #ff3ed1;
}

/* Legal: su tarjeta es más clara (#352f5f) que los fondos de la tienda, así que
   el rosa, el gris y el violeta de los títulos quedaban en 4.0–4.5:1. Solo aquí. */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .legal-page .text-brand {
    color: #ff70dd;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .legal-page :is(.text-gray-500, .text-gray-600) {
    color: #a0a6b0;
}
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .legal-page .prose h3 {
    color: #b097fb;
}

/* Botón "Explorar Catálogo" de la portada: en móvil el texto cae sobre el tramo
   purple-500 del degradado (3.96:1). purple-600 aguanta blanco (5.4:1). */
html:not([data-web-theme="pulida"]):not([data-web-theme="retail"]) .hero-cta-btn.to-purple-500:not(:hover) {
    --tw-gradient-to: #9333ea var(--tw-gradient-to-position);
}