/**
 * Innovium · Entry CSS
 *
 * Compila a public/assets/css/app.css con `npm run build` (minify) o
 * `npm run dev` (watch).
 *
 * Orden de carga:
 *   1. theme.css del design-kit — variables CSS, utility classes globales
 *   2. Tailwind base — reset + base styles
 *   3. Tailwind components — componentes registrados con @layer components
 *   4. Tailwind utilities — clases de utilidad
 *
 * NO agregar estilos arbitrarios acá. Para componentes nuevos:
 *   - tokens → design-kit/tailwind.config.js
 *   - utility classes globales → design-kit/theme.css
 *   - componentes específicos de la app → @layer components dentro de este archivo
 */

@import "../../design-kit/theme.css";

@tailwind base;
@tailwind components;
@tailwind utilities;

/**
 * Override global de <option> para dark mode.
 *
 * Chrome/Edge en Windows con dark mode renderea las options del dropdown
 * con fondo blanco + texto blanco (ilegible). Forzamos los colores del
 * design system. Solo el dropdown abierto se ve afectado — el select
 * cerrado ya hereda los estilos de `.input`.
 */
@layer base {
    option {
        background-color: var(--bg-input);
        color: var(--text-primary);
    }
    .dark option {
        /* En dark, --bg-input es rgba semi-transparente — el dropdown
           necesita sólido para que se lea sobre fondos varios. */
        background-color: #1A1A24;
        color: #FAFAFA;
    }
}
