/* ============================================================================
   Paleta de marca por empresa (APP_TEMA_COLOR_*) enlazada a componentes.
   Las variables --app-* las setea AppInterop.applyPalette() en runtime.
   Aquí van los DEFAULTS (valores actuales) y el puente a Bootstrap para que
   botones/badges/textos tomen el color del tenant sin recompilar CSS.
   ============================================================================ */
:root {
    --app-primario:  #EF5E10;
    --app-secundario:#E65100;
    --app-fondo:     #FDFBF9;
    --app-superficie:#FFFFFF;
    --app-tono-1:    #FFF3E0;
    --app-tono-2:    #FF6411;
    --app-tono-3:    #EF5E10;
    --app-tono-4:    #E65100;
    --app-blanco:    #FFFFFF;
    --app-negro:     #000000;
    --app-gris-1:    #F5F5F5;
    --app-gris-2:    #757575;
    --app-gris-3:    #4B4949;
    --app-acento-1:  #FFEB3B;
    --app-acento-2:  #FF8A65;
    --app-acento-3:  #522E09;
    --app-info:      #1976D2;
    --app-exito:     #4CAF50;
    --app-advertencia:#FF9800;
    --app-error:     #F44336;
}

/* Botones */
.btn-primary {
    --bs-btn-bg: var(--app-primario);
    --bs-btn-border-color: var(--app-primario);
    --bs-btn-hover-bg: var(--app-tono-4);
    --bs-btn-hover-border-color: var(--app-tono-4);
    --bs-btn-active-bg: var(--app-tono-4);
    --bs-btn-active-border-color: var(--app-tono-4);
    --bs-btn-disabled-bg: var(--app-primario);
    --bs-btn-disabled-border-color: var(--app-primario);
}
.btn-secondary {
    --bs-btn-bg: var(--app-secundario);
    --bs-btn-border-color: var(--app-secundario);
    --bs-btn-hover-bg: var(--app-tono-4);
    --bs-btn-hover-border-color: var(--app-tono-4);
    --bs-btn-active-bg: var(--app-tono-4);
}
.btn-success { --bs-btn-bg: var(--app-exito);       --bs-btn-border-color: var(--app-exito); }
.btn-danger  { --bs-btn-bg: var(--app-error);       --bs-btn-border-color: var(--app-error); }
.btn-warning { --bs-btn-bg: var(--app-advertencia); --bs-btn-border-color: var(--app-advertencia); }
.btn-info    { --bs-btn-bg: var(--app-info);        --bs-btn-border-color: var(--app-info); }
.btn-outline-primary {
    --bs-btn-color: var(--app-primario);
    --bs-btn-border-color: var(--app-primario);
    --bs-btn-hover-bg: var(--app-primario);
    --bs-btn-hover-border-color: var(--app-primario);
    --bs-btn-active-bg: var(--app-primario);
    --bs-btn-active-border-color: var(--app-primario);
}

/* Fondos / textos / badges */
.bg-primary        { background-color: var(--app-primario) !important; }
.text-bg-primary   { background-color: var(--app-primario) !important; color: #fff !important; }
.text-primary      { color: var(--app-primario) !important; }
.badge.text-bg-primary { background-color: var(--app-primario) !important; }
.bg-success        { background-color: var(--app-exito) !important; }
.bg-danger         { background-color: var(--app-error) !important; }
.bg-warning        { background-color: var(--app-advertencia) !important; }
.bg-info           { background-color: var(--app-info) !important; }
.text-success      { color: var(--app-exito) !important; }
.text-danger       { color: var(--app-error) !important; }
.text-warning      { color: var(--app-advertencia) !important; }
.text-info         { color: var(--app-info) !important; }

/* Contraste canónico para iconos colocados sobre fondos sólidos o gradientes. */
.icon-on-color {
    --bs-bg-opacity: 1 !important;
    color: var(--app-blanco) !important;
}

.icon-on-color :is(.material-icons-outlined, .material-symbols-outlined, .bi) {
    color: var(--app-blanco) !important;
}

/* Enlaces y spinners de marca */
.spinner-border.text-primary { color: var(--app-primario) !important; }
.border-primary    { border-color: var(--app-primario) !important; }