:root{
    --mi-primary: #29235C;
    --mi-primaryHover: #3F365D;
    --mi-primaryDisabled: #B1AAC5;

    --mi-secondary: #5F5F5E;
    --mi-secondaryHover: #575756;
    --mi-secondaryDisabled: #C6C4C4;

    --mi-success: #00A19A;
    --mi-successHover: #589894;
    --mi-successDisabled: #CCE2E0;

    --mi-danger: #D21C19;
    --mi-dangerHover: #B44A31;
    --mi-dangerDisabled: #F0C1AE;

    --mi-warning: #E6B628;
    --mi-warningHover: #C5A54D;
    --mi-warningDisabled: #F8E8C5;

    --mi-info: #1D71B8;
    --mi-infoHover: #5278AA;
    --mi-infoDisabled: #C5D0EC;

    --mi-light: #DADADA;
    --mi-lightHover: #B9B9B9;
    --mi-lighDisabled: #F4F3F4;

    --mi-dark: #2D2E2D;
    --mi-darkHover: #000000;
    --mi-darkDisabled: #B0ADAD;

}



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* BODY */
body{
    font-family: 'Jost', sans-serif;
    color: var(--mi-dark);
    font-size: 17px;
    box-sizing: border-box;
    margin: 0; /* Evitar los márgenes por defecto del body */
    padding: 0;
}


/***********************************************************/
/***********************************************************/
/***********************************************************/
/* GRADIENT */
.bg-gr1 {
    background-image: linear-gradient(180deg, var(--mi-danger) 0%, var(--mi-warning) 100%) !important;
    color: white !important;
}
.bg-gr2 {
    background-image: linear-gradient(180deg, var(--mi-danger) 0%, var(--mi-primary) 100%) !important;
    color: white !important;
}
.bg-gr3 {
    background-image: linear-gradient(180deg, var(--mi-warning) 0%, var(--mi-primary) 100%) !important;
    color: white !important;
}



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* botones bootstrap */
a {
    text-decoration: none !important;
}
/* PRIMARY */
.btn-primary {
    color: #fff;
    background-color: var(--mi-primary);
    border-color: var(--mi-primary);}
.btn-primary:hover{
    color: #fff;
    background-color: var(--mi-primaryHover);
    border-color: var(--mi-primaryHover);}
.btn-primary:focus,
.btn-primary.focus{
    box-shadow: 0 0 0 0 rgba(93, 157, 253, 0.5);}
.btn-primary.disabled,
.btn-primary:disabled{
    color: #fff;
    background-color: var(--mi-primaryDisabled);
    border-color: var(--mi-primaryDisabled);}
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle{
    color: #fff;
    background-color: var(--mi-primaryHover);
    border-color: var(--mi-primaryHover);}
.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus{
    box-shadow: 0 0 0 0 rgba(93, 157, 253, 0.5);}
.btn-primary.btn-shadow{
    box-shadow: 0 0.125rem 0.625rem rgba(13, 109, 253, 0.4), 0 0.0625rem 0.125rem rgba(13, 109, 253, 0.5);}
.btn-primary.btn-shadow:hover{
    box-shadow: 0 0.125rem 0.625rem rgba(13, 109, 253, 0.5), 0 0.0625rem 0.125rem rgba(13, 109, 253, 0.6);}

/* SECONDARY */
.btn-secondary{
    color: #fff;
    background-color: var(--mi-secondary);
    border-color: var(--mi-secondary)}
.btn-secondary:hover{
    color: #fff;
    background-color: var(--mi-secondaryHover);
    border-color: var(--mi-secondaryHover); }
.btn-secondary:focus, .btn-secondary.focus {
    box-shadow: 0 0 0 0 rgba(157, 163, 170, 0.5); }
.btn-secondary.disabled,
.btn-secondary:disabled {
    color: #fff;
    background-color: var(--mi-secondaryDisabled);
    border-color: var(--mi-secondaryDisabled); }
.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-secondaryHover);
    border-color: var(--mi-secondaryHover); }
.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(157, 163, 170, 0.5); }
.btn-secondary.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(113, 122, 132, 0.4), 0 0.0625rem 0.125rem rgba(113, 122, 132, 0.5); }
.btn-secondary.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(113, 122, 132, 0.5), 0 0.0625rem 0.125rem rgba(113, 122, 132, 0.6); }

/* SUCCESS */
.btn-success {
    color: #fff !important;
    background-color: var(--mi-success) !important;
    border-color: var(--mi-success) !important;}
.btn-success:hover {
    color: #fff !important;
    background-color: var(--mi-successHover) !important;
    border-color: var(--mi-successHover) !important;}
.btn-success:focus,
.btn-success.focus {
    box-shadow: 0 0 0 0 rgba(168, 233, 188, 0.5);}
.btn-success.disabled,
.btn-success:disabled {
    color: var(--mi-secondary);
    background-color: var(--mi-successDisabled);
    border-color: var(--mi-successDisabled);}
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
    color: #fff !important;
    background-color: var(--mi-successHover) !important;
    border-color: var(--mi-successHover) !important;}
.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(168, 233, 188, 0.5); }
.btn-success.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(108, 218, 141, 0.4), 0 0.0625rem 0.125rem rgba(108, 218, 141, 0.5); }
.btn-success.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(108, 218, 141, 0.5), 0 0.0625rem 0.125rem rgba(108, 218, 141, 0.6); }

/* INFO */
.btn-info {
    color: #fff !important;
    background-color: var(--mi-info);
    border-color: var(--mi-info); }
.btn-info:hover {
    color: white;
    background-color: var(--mi-infoHover);
    border-color: var(--mi-infoHover); }
.btn-info:focus, .btn-info.focus {
    box-shadow: 0 0 0 0 rgba(139, 231, 249, 0.5); }
.btn-info.disabled, 
.btn-info:disabled {
    color: var(--mi-secondary);
    background-color: var(--mi-infoDisabled);
    border-color: var(--mi-infoDisabled); }
.btn-info:not(:disabled):not(.disabled):active, 
.btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
    color: var(--mi-sec);
    background-color: var(--mi-infoHover);
    border-color: var(--mi-infoHover); }
.btn-info:not(:disabled):not(.disabled):active:focus, 
.btn-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(139, 231, 249, 0.5); }
.btn-info.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(61, 214, 245, 0.4), 0 0.0625rem 0.125rem rgba(61, 214, 245, 0.5); }
.btn-info.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(61, 214, 245, 0.5), 0 0.0625rem 0.125rem rgba(61, 214, 245, 0.6); }

/* WARNING */
.btn-warning {
    color: white;
    background-color: var(--mi-warning);
    border-color: var(--mi-warning); }
.btn-warning:hover {
    color: white;
    background-color: var(--mi-warningHover);
    border-color: var(--mi-warningHover); }
.btn-warning:focus, 
.btn-warning.focus {
    box-shadow: 0 0 0 0 rgba(243, 249, 87, 0.5); }
.btn-warning.disabled, .btn-warning:disabled {
    color: var(--mi-secondary);
    background-color: var(--mi-warningDisabled);
    border-color: var(--mi-warningDisabled); }
.btn-warning:not(:disabled):not(.disabled):active, 
.btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
    color: var(--mi-secondary);
    background-color: var(--mi-warningHover);
    border-color: var(--mi-warningHover); }
.btn-warning:not(:disabled):not(.disabled):active:focus, 
.btn-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(243, 249, 87, 0.5); }
.btn-warning.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(210, 217, 8, 0.4), 0 0.0625rem 0.125rem rgba(210, 217, 8, 0.5); }
.btn-warning.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(210, 217, 8, 0.5), 0 0.0625rem 0.125rem rgba(210, 217, 8, 0.6); }

/* DANGER */
.btn-danger {
    color: #fff;
    background-color: var(--mi-danger);
    border-color: var(--mi-danger); }
.btn-danger:hover {
    color: #fff;
    background-color: var(--mi-dangerHover);
    border-color: var(--mi-dangerHover); }
.btn-danger:focus, .btn-danger.focus {
    box-shadow: 0 0 0 0 rgba(244, 15, 98, 0.5); }
.btn-danger.disabled, .btn-danger:disabled {
    color: #fff;
    background-color: var(--mi-dangerDisabled);
    border-color: var(--mi-dangerDisabled); }
.btn-danger:not(:disabled):not(.disabled):active, 
.btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-dangerHover);
    border-color: var(--mi-dangerHover); }
.btn-danger:not(:disabled):not(.disabled):active:focus, 
.btn-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(244, 15, 98, 0.5); }
.btn-danger.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(175, 8, 70, 0.4), 0 0.0625rem 0.125rem rgba(175, 8, 70, 0.5); }
.btn-danger.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(175, 8, 70, 0.5), 0 0.0625rem 0.125rem rgba(175, 8, 70, 0.6); }

/* LIGHT */
.btn-light {
color: var(--mi-dark);
background-color: var(--mi-light);
border-color: var(--mi-light); }
.btn-light:hover {
    color: var(--mi-dark);
    background-color: var(--mi-lightHover);
    border-color: var(--mi-lightHover); }
.btn-light:focus, .btn-light.focus {
    box-shadow: 0 0 0 0 rgba(207, 208, 208, 0.5); }
.btn-light.disabled, .btn-light:disabled {
    color: var(--mi-secondary);
    background-color: var(--mi-light);
    border-color: var(--mi-secondary); }
.btn-light:not(:disabled):not(.disabled):active, 
.btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
    color: var(--mi-dark);
    background-color: var(--mi-lightHover);
    border-color: var(--mi-secondary); }
.btn-light:not(:disabled):not(.disabled):active:focus, 
.btn-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(207, 208, 208, 0.5); }
.btn-light.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(238, 238, 238, 0.4), 0 0.0625rem 0.125rem rgba(238, 238, 238, 0.5); }
.btn-light.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(238, 238, 238, 0.5), 0 0.0625rem 0.125rem rgba(238, 238, 238, 0.6); }

/* DARK */
.btn-dark {
    color: var(--mi-light);
    background-color: var(--mi-dark);
    border-color: var(--mi-dark); }
.btn-dark:hover {
    color: var(--mi-light);
    background-color: var(--mi-darkHover);
    border-color: var(--mi-darkHover); }
.btn-dark:focus, 
.btn-dark.focus {
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5); }
.btn-dark.disabled, 
.btn-dark:disabled {
    color: var(--mi-secondary);
    background-color: var(--mi-dark);
    border-color: var(--mi-dark); }
.btn-dark:not(:disabled):not(.disabled):active, 
.btn-dark:not(:disabled):not(.disabled).active,
.show > .btn-dark.dropdown-toggle {
    color: var(--mi-light);
    background-color: var(--mi-darkHover);
    border-color: var(--mi-darkHover); }
.btn-dark:not(:disabled):not(.disabled):active:focus, 
.btn-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5); }
.btn-dark.btn-shadow {
    box-shadow: 0 0.125rem 0.625rem rgba(52, 58, 64, 0.4), 0 0.0625rem 0.125rem rgba(52, 58, 64, 0.5); }
.btn-dark.btn-shadow:hover {
    box-shadow: 0 0.125rem 0.625rem rgba(52, 58, 64, 0.5), 0 0.0625rem 0.125rem rgba(52, 58, 64, 0.6); }



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* Botones | OUTLINE */
/* PRIMARY */
.btn-outline-primary {
    color: var(--mi-primary);
    border-color: var(--mi-primary); }
.btn-outline-primary:hover {
    color: #fff;
    background-color: var(--mi-primary);
    border-color: var(--mi-primary); }
.btn-outline-primary:focus, .btn-outline-primary.focus {
    box-shadow: 0 0 0 0 rgba(93, 157, 253, 0.5); }
.btn-outline-primary.disabled, .btn-outline-primary:disabled {
    color: var(--mi-primary);
    background-color: transparent; }
.btn-outline-primary:not(:disabled):not(.disabled):active, 
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-primary);
    border-color: var(--mi-primary); }
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, 
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(93, 157, 253, 0.5); }
      
/* SECONDARY */
.btn-outline-secondary {
    color: var(--mi-secondary);
    border-color: var(--mi-secondary); }
.btn-outline-secondary:hover {
    color: #fff;
    background-color: var(--mi-secondary);
    border-color: var(--mi-secondary); }
.btn-outline-secondary:focus, .btn-outline-secondary.focus {
    box-shadow: 0 0 0 0 rgba(157, 163, 170, 0.5); }
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled {
    color: var(--mi-secondary);
    background-color: transparent; }
.btn-outline-secondary:not(:disabled):not(.disabled):active, 
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-secondary);
    border-color: var(--mi-secondary); }
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, 
.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(157, 163, 170, 0.5); }

/* SUCCESS */
.btn-outline-success {
    color: var(--mi-secondary);
    border-color: var(--mi-success); }
.btn-outline-success:hover {
    color: #fff;
    background-color: var(--mi-success);
    border-color: var(--mi-success); }
.btn-outline-success:focus, .btn-outline-success.focus {
    box-shadow: 0 0 0 0 rgba(168, 233, 188, 0.5); }
.btn-outline-success.disabled, .btn-outline-success:disabled {
    color: var(--mi-success);
    background-color: transparent; }
.btn-outline-success:not(:disabled):not(.disabled):active, 
.btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-success);
    border-color: var(--mi-success); }
.btn-outline-success:not(:disabled):not(.disabled):active:focus, 
.btn-outline-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(168, 233, 188, 0.5); }

/* INFO */
.btn-outline-info {
    color: var(--mi-info);
    border-color: var(--mi-info); }
.btn-outline-info:hover {
    color: #fff;
    background-color: var(--mi-info);
    border-color: var(--mi-info); }
.btn-outline-info:focus, .btn-outline-info.focus {
    box-shadow: 0 0 0 0 rgba(139, 231, 249, 0.5); }
.btn-outline-info.disabled, .btn-outline-info:disabled {
    color: var(--mi-info);
    background-color: transparent; }
.btn-outline-info:not(:disabled):not(.disabled):active, 
.btn-outline-info:not(:disabled):not(.disabled).active,
.show > .btn-outline-info.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-info);
    border-color: var(--mi-info); }
.btn-outline-info:not(:disabled):not(.disabled):active:focus, 
.btn-outline-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(139, 231, 249, 0.5); }

/* WARNING */
.btn-outline-warning {
    color: var(--mi-warning);
    border-color: var(--mi-warning); }
.btn-outline-warning:hover {
    color: var(--mi-dark);
    background-color: var(--mi-warning);
    border-color: var(--mi-warning); }
.btn-outline-warning:focus, .btn-outline-warning.focus {
    box-shadow: 0 0 0 0 rgba(243, 249, 87, 0.5); }
.btn-outline-warning.disabled, 
.btn-outline-warning:disabled {
    color: var(--mi-warning);
    background-color: transparent; }
.btn-outline-warning:not(:disabled):not(.disabled):active, 
.btn-outline-warning:not(:disabled):not(.disabled).active,
.show > .btn-outline-warning.dropdown-toggle {
    color: var(--mi-dark);
    background-color: var(--mi-warning);
    border-color: var(--mi-warning); }
.btn-outline-warning:not(:disabled):not(.disabled):active:focus, 
.btn-outline-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(243, 249, 87, 0.5); }

/* DANGER */
.btn-outline-danger {
    color: var(--mi-danger);
    border-color: var(--mi-danger); }
.btn-outline-danger:hover {
    color: #fff;
    background-color: var(--mi-danger);
    border-color: var(--mi-danger); }
.btn-outline-danger:focus, .btn-outline-danger.focus {
    box-shadow: 0 0 0 0 rgba(244, 15, 98, 0.5); }
.btn-outline-danger.disabled, 
.btn-outline-danger:disabled {
    color: var(--mi-danger);
    background-color: transparent; }
.btn-outline-danger:not(:disabled):not(.disabled):active, 
.btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-outline-danger.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-danger);
    border-color: var(--mi-danger); }
.btn-outline-danger:not(:disabled):not(.disabled):active:focus, 
.btn-outline-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(244, 15, 98, 0.5); }

/* LIGTH */
.btn-outline-light {
    color: var(--mi-light);
    border-color: var(--mi-light); }
.btn-outline-light:hover {
    color: var(--mi-dark);
    background-color: var(--mi-light);
    border-color: var(--mi-light); }
.btn-outline-light:focus, 
.btn-outline-light.focus {
    box-shadow: 0 0 0 0 rgba(207, 208, 208, 0.5); }
.btn-outline-light.disabled, 
.btn-outline-light:disabled {
    color: var(--mi-light);
    background-color: transparent; }
.btn-outline-light:not(:disabled):not(.disabled):active, 
.btn-outline-light:not(:disabled):not(.disabled).active,
.show > .btn-outline-light.dropdown-toggle {
    color: var(--mi-dark);
    background-color: var(--mi-light);
    border-color: var(--mi-light); }
.btn-outline-light:not(:disabled):not(.disabled):active:focus, 
.btn-outline-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(207, 208, 208, 0.5); }

/* DARK */
.btn-outline-dark {
    color: var(--mi-dark);
    border-color: var(--mi-dark); }
.btn-outline-dark:hover {
    color: #fff;
    background-color: var(--mi-dark);
    border-color: var(--mi-dark); }
.btn-outline-dark:focus, 
.btn-outline-dark.focus {
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5); }
.btn-outline-dark.disabled, 
.btn-outline-dark:disabled {
    color: var(--mi-dark);
    background-color: transparent; }
.btn-outline-dark:not(:disabled):not(.disabled):active, 
.btn-outline-dark:not(:disabled):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle {
    color: #fff;
    background-color: var(--mi-dark);
    border-color: var(--mi-dark); }
.btn-outline-dark:not(:disabled):not(.disabled):active:focus, 
.btn-outline-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 rgba(82, 88, 93, 0.5); }



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* Botones | Boton con icono en notificaciones */
.btn-link {
    text-decoration: none !important;
}
.btn-link-danger{
    color: var(--mi-danger);
    text-decoration: none !important;
}
.btn-link-danger:hover{
    color: var(--mi-dangerHover);
    text-decoration: none !important;
}



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* Badege */
.badge-primary {
    color: #fff;
    background-color: var(--mi-primary); }
a.badge-primary:hover, 
a.badge-primary:focus {
    color: #fff;
    background-color: var(--mi-primaryHover); }
.badge-secondary {
    color: #fff;
    background-color: var(--mi-secondary); }
a.badge-secondary:hover, 
a.badge-secondary:focus {
    color: #fff;
    background-color: var(--mi-secondaryHover); }
.badge-success {
    color: #fff;
    background-color: var(--mi-success); }
a.badge-success:hover, 
a.badge-success:focus {
    color: #fff;
    background-color: var(--mi-successHover); }
.badge-info {
    color: #fff;
    background-color: var(--mi-info); }
a.badge-info:hover, 
a.badge-info:focus {
    color: #fff;
    background-color: var(--mi-infoHover); }
.badge-warning {
    color: var(--mi-secondary);
    background-color: var(--mi-warning); }
a.badge-warning:hover, 
a.badge-warning:focus {
    color: var(--mi-secondary);
    background-color: var(--mi-warningHover); }
.badge-danger {
    color: #fff;
    background-color: var(--mi-danger); }
a.badge-danger:hover, 
a.badge-danger:focus {
    color: #fff;
    background-color: var(--mi-dangerHover); }
.badge-light {
    color: var(--mi-lightHover);
    background-color: var(--mi-light); }
a.badge-light:hover, 
a.badge-light:focus {
    color: var(--mi-dark);
    background-color: var(--mi-lightHover); }
.badge-dark {
    color: #fff;
    background-color: var(--mi-dark); }
a.badge-dark:hover, 
a.badge-dark:focus {
    color: #fff;
    background-color: var(--mi-darkHover); }



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* TEXTOS */
.text-primary {
    color: var(--mi-primary) !important; }
  
a.text-primary:hover, a.text-primary:focus {
    color: var(--mi-primaryHover) !important; }
  
.text-secondary {
    color: var(--mi-secondary) !important; }
  
a.text-secondary:hover, a.text-secondary:focus {
    color: var(--mi-secondaryHover) !important; }
  
.text-success {
    color: var(--mi-success) !important; }
  
a.text-success:hover, a.text-success:focus {
    color: var(--mi-successHover) !important; }
  
.text-info {
    color: var(--mi-info) !important; }
  
a.text-info:hover, a.text-info:focus {
    color: var(--mi-infoHover) !important; }
  
.text-warning {
    color: var(--mi-warning) !important; }
  
a.text-warning:hover, a.text-warning:focus {
    color: var(--mi-warningHover) !important; }
  
.text-danger {
    color: var(--mi-danger) !important; }
  
a.text-danger:hover, a.text-danger:focus {
    color: var(--mi-dangerHover) !important; }
  
.text-light {
    color: var(--mi-light) !important; }
  
a.text-light:hover, a.text-light:focus {
    color: var(--mi-lightHover) !important; }
  
.text-dark {
    color: var(--mi-dark) !important; }
  
a.text-dark:hover, a.text-dark:focus {
    color: var(--mi-darkHover) !important; }



/***********************************************************/
/***********************************************************/
/***********************************************************/
/* BACKGROUND */
.bg-primary {
    background-color: var(--mi-primary) !important; }
  
a.bg-primary:hover, a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
background-color: var(--mi-primaryHover) !important; }

.bg-secondary {
background-color: var(--mi-secondary) !important; }

a.bg-secondary:hover, a.bg-secondary:focus,
button.bg-secondary:hover,
button.bg-secondary:focus {
background-color: var(--mi-secondaryHover) !important; }

.bg-success {
background-color: var(--mi-success) !important; }

a.bg-success:hover, a.bg-success:focus,
button.bg-success:hover,
button.bg-success:focus {
background-color: var(--mi-successHover) !important; }

.bg-info {
background-color: var(--mi-info) !important; }

a.bg-info:hover, a.bg-info:focus,
button.bg-info:hover,
button.bg-info:focus {
background-color: var(--mi-infoHover) !important; }

.bg-warning {
background-color: var(--mi-warning) !important; }

a.bg-warning:hover, a.bg-warning:focus,
button.bg-warning:hover,
button.bg-warning:focus {
background-color: var(--mi-warningHover) !important; }

.bg-danger {
background-color: var(--mi-danger) !important; }

a.bg-danger:hover, a.bg-danger:focus,
button.bg-danger:hover,
button.bg-danger:focus {
background-color: var(--mi-dangerHover) !important; }

.bg-light {
background-color: var(--mi-light) !important; }

a.bg-light:hover, a.bg-light:focus,
button.bg-light:hover,
button.bg-light:focus {
background-color: var(--mi-lightHover) !important; }

.bg-dark {
background-color: var(--mi-dark) !important; }

a.bg-dark:hover, a.bg-dark:focus,
button.bg-dark:hover,
button.bg-dark:focus {
background-color: var(--mi-darkHover) !important; }