:root {
    /* Django */
    --primary: #16254c;
    --secondary: #4495D1;
    --accent: var(--secondary);
    --header-bg: #fff;
    --header-color: var(--primary);
    --header-branding-color: var(--header-color);
    --header-link-color: var(--primary);
    --selected-row: #4495D130;
}

/* ---------- HEADER ----------- */

/* Cabecera principal y branding */
#header {
    border-bottom: 3.5px solid var(--secondary);
}

/* Branding y contenedores */
.branding-wrapper {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.5rem;    
}

.branding-wrapper, 
.navbar-brand {
    color: var(--secondary) !important;
    font-size: 1rem;
}

/* Navbar */
.nav-link,
.nav-link:active,
.navbar-nav .nav-link {
    display: flex;
    flex-direction: column;
    color: var(--primary);
    align-items: center;
    font-size: 1.2rem;
}

.nav-link:focus, .nav-link:hover {
    color: #0a58ca;
}

.nav-link i {
    font-size: 1.7rem;
}

/* ---------- MAIN ----------- */

/* Secciones de pagina principal */
caption a.section {
    color: #fff !important
}

/* ---------- FOOTER ----------- */

/* Footer */
footer {
    background-color: var(--primary);
    margin-top: 100px;
    color: #fff;
    font-size: 0.8rem;
}

/* ---------- PERSONALIZACION DE BOOTSTRAP Y HELPERS ----------- */

/* Helpers */
.bold {
    font-weight: bold !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

/* Personalizacion de tema */
.text-secondary {
    color: var(--secondary) !important;
}

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

/* Botones primarios */
.btn-primary,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}

/* Botones secundarios e info (incluido outline) */
.btn-info,
.btn-info:hover,
.btn-info:active,
.btn-info:focus,
.btn-outline-info:active,
.btn-outline-info:focus,
.btn-outline-info:hover,
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:active,
.btn-secondary:focus,
.btn-outline-secondary:active,
.btn-outline-secondary:focus,
.btn-outline-secondary:hover
 {
    color: #fff !important;
    background-color: var(--secondary);
    border-color: var(--secondary);
}

/* Botones outline */
.btn-outline-info,
.btn-outline-secondary {
    color: var(--secondary);
    border-color: var(--secondary);
}

/* Componente acordion */
.accordion-button, 
.accordion-button:not(.collapsed) {
    background-color: #fff;
    color: var(--primary);
    font-weight: bold;
}