/* * Audion — temas.css * Tema oscuro (definido en base.css :root) es el default. * - Si el usuario no eligió tema explícito ("sistema"), seguimos prefers-color-scheme. * - Si eligió "claro" u "oscuro" explícitamente, el atributo data-tema del manda. */ @media (prefers-color-scheme: light) { html:not([data-tema="oscuro"]) { --color-fondo: #FBF7F4; --color-fondo-elevado: #FFFFFF; --color-fondo-hover: #F1E8E1; --color-borde: #E7DCD2; --color-texto: #201A16; --color-texto-tenue: #6B5F57; --color-texto-difuso: #8A7F76; --color-acento: #E4552F; --color-acento-hover: #C94620; --color-acento-texto: #FFFFFF; --sombra-elevada: 0 8px 24px rgba(32, 26, 22, 0.12); color-scheme: light; } } html[data-tema="claro"] { --color-fondo: #FBF7F4; --color-fondo-elevado: #FFFFFF; --color-fondo-hover: #F1E8E1; --color-borde: #E7DCD2; --color-texto: #201A16; --color-texto-tenue: #6B5F57; --color-texto-difuso: #8A7F76; --color-acento: #E4552F; --color-acento-hover: #C94620; --color-acento-texto: #FFFFFF; --sombra-elevada: 0 8px 24px rgba(32, 26, 22, 0.12); color-scheme: light; } html[data-tema="oscuro"] { color-scheme: dark; }