/* === Variables globales para temas === */
:root {
    /* Bases originales conservadas */
    --color-principal: #f45b18; /* Naranja original */
    --color-secondary: #17447f; /* Azul original */

    /* Variantes de Principal (Naranja) */
    --color-principal-dark: #b64412;   /* Versión más oscura y profunda */
    --color-principal-light: #f78452;  /* Versión más clara/brillante */
    --color-principal-soft: #fdeee8;   /* Versión pastel/fondo */
    --color-principal-contrast: #17447f; /* Usando el azul secundario como contraste directo */

    /* Variantes de Secondary (Azul) */
    --color-secondary-dark: #0e2a4f;   /* Azul marino muy oscuro */
    --color-secondary-light: #4d82c4;  /* Azul más suave/celeste */

    /* Textos */
    --color-text: #2d1105;             /* Un "negro" cálido derivado del naranja oscuro */
    --color-text-light: #ffffff;       /* Blanco puro para fondos oscuros */
}

.principal {
    background-color: var(--color-principal) !important;
    color: var(--color-text-light) !important;
}

.principal-light {
    background-color: var(--color-principal-light) !important;
    color: var(--color-text-light) !important;
}
.principal-dark {
     background-color: var(--color-principal-dark) !important;
     color: var(--color-text-light) !important;
}

.principal-soft {
    background-color: var(--color-principal-soft) !important;
    color: var(--color-text-light) !important;
}

.secondary {
    background-color: var(--color-secondary) !important;
    color: var(--color-text-light) !important;
}
.secondary-light {
    background-color: var(--color-secondary-light) !important;
    color: var(--color-text-light) !important;
}

.text-principal {
    color: var(--color-text) !important;
}

.text-secondary {
    color: var(--color-secondary) !important;
}