/* Define las reglas de font-face para Chirp */
@font-face {
    font-family: 'Chirp';
    src: url('font/Chirp-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Chirp';
    src: url('font/Chirp-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Chirp';
    src: url('font/Chirp-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Chirp';
    src: url('font/Chirp-Heavy.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/* Aplica la nueva fuente globalmente */
body {
    font-family: 'Chirp', sans-serif;
    background-color: #f5fafc;
}

/* Aplica la nueva fuente globalmente */
html {
    font-family: 'Chirp', sans-serif;
    font-size: 14px !important;
}

.alert-info {
    background-color: #006877;
    color: #ffffff;
}
.card-header{
    background-color: #006877 !important;
    color: #ffffff !important;
}
.card-header.bg-primary {
    background-color: #006877 !important;
    color: #ffffff !important;
}

/* Para asegurar que el texto dentro del header también sea blanco */
.card-header.bg-primary h1,
.card-header.bg-primary h2,
.card-header.bg-primary h3,
.card-header.bg-primary h4,
.card-header.bg-primary h5,
.card-header.bg-primary h6 {
    color: #ffffff !important;
}

/* Estilo personalizado para btn-primary */
.btn-primary {
    background-color: #006877 !important;
    color: #ffffff !important;
    border-color: #006877 !important;
}

.btn-primary:hover {
    background-color: #005666 !important; /* Un tono más oscuro para hover */
    border-color: #005666 !important;
    color: #ffffff !important;
}

.btn-primary:active,
.btn-primary:focus {
    background-color: #004555 !important; /* Aún más oscuro para click */
    border-color: #004555 !important;
    color: #ffffff !important;
    box-shadow: 0 0 0 0.25rem rgba(0, 104, 119, 0.25) !important; /* Sombra con el color principal */
}

/* Para los dropdowns y otros elementos que usen bg-primary */
.bg-primary {
    background-color: #006877 !important;
}

/* Estilo personalizado para badge-primary y bg-primary */
.badge.bg-primary,
.badge.text-bg-primary {
    background-color: #006877 !important;
    color: #ffffff !important;
}

/* Para asegurar compatibilidad con diferentes variantes de badges */
.badge-primary {
    background-color: #006877 !important;
    color: #ffffff !important;
}

/* Estilo para los enlaces activos en la navegación */
.nav-link.active {
    color: #006877 !important;
    font-weight: 700 !important;
}

/* Aseguramos que el hover no cambie el color cuando está activo */
.nav-link.active:hover {
    color: #006877 !important;
}