/* ----------------------------------- */
/* navbar-overrides.css                */
/* ----------------------------------- */

/* 1) Base del navbar */
.navbar-graficas {
    background-color: #f9f9f9 !important;
    padding: 20px 0 !important;
    transition: all .3s !important;
}

/* 2) Shrink on scroll */
.top-nav-collapse {
    padding: 10px 0 !important;
}

/* 3) Marca (“Red Nacional de fenología”) */
.navbar-graficas .navbar-brand {
    font-family: 'Raleway', sans-serif !important;
    font-weight: 700 !important;
    font-size: 24px !important;
    color: #28a745 !important;
    margin-top: 6px !important;
    text-transform: uppercase !important;
    padding: 15px 0 !important;
}
.navbar-graficas .navbar-brand .logo-dec {
    color: #fc9540 !important;
}

/* 4) Alineación de los ítems */
.navbar-graficas .navbar-nav {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

/* 5) Links principales */
.navbar-graficas .nav-link {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    letter-spacing: 0.5px !important;
    line-height: 54px !important;
    text-transform: uppercase !important;
    color: #000 !important;
    padding: 5px 10px !important;
    white-space: nowrap !important;
    transition: color .2s ease-out !important;
    background-color: transparent !important;
}

/* 6) Hover / Active / Open */
.navbar-graficas .nav-item.active > .nav-link,
.navbar-graficas .nav-link:hover {
    color: #fd7e14 !important;
}
.navbar-graficas .dropdown.show > .nav-link {
    color: #000 !important;            /* misma que v1 */
    background-color: #e7e7e7 !important; /* gris claro al abrir */
}

/* 7) Dropdown menú */
.navbar-graficas .dropdown-menu {
    border: 1px solid rgba(0,0,0,0.15) !important;
    border-radius: .25rem !important;
    padding: .5rem 0 !important;
}

/* 8) Ítems del dropdown (mantener mayúsculas originales) */
.navbar-graficas .dropdown-menu .dropdown-item {
    font-family: 'Roboto', sans-serif !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    letter-spacing: 0.5px !important;
    line-height: 1.42857143 !important;
    text-transform: none !important;
    color: #000 !important;
    padding: 6px 15px !important;
    white-space: nowrap !important;
    background-color: transparent !important;
    transition: color .2s ease-out !important;
}

/* 9) Hover / Focus en dropdown */
.navbar-graficas .dropdown-menu .dropdown-item:hover,
.navbar-graficas .dropdown-menu .dropdown-item:focus {
    color: #fd7e14 !important;
    background-color: transparent !important;
}



/* 1) Eliminar el “margin-top” que empujaba hacia abajo la marca */
.navbar-graficas .navbar-brand {
    margin-top: 0 !important;
}


/* Dropdowns por hover (solo >= lg) */
@media (min-width: 992px){
    .navbar .dropdown-menu{
        display: block;               /* para poder animar */
        opacity: 0;
        visibility: hidden;
        transform: translateY(8px);
        transition: opacity .5s ease, transform .75s ease, visibility .75s ease;
        margin-top: 0;                /* alinear justo bajo el toggle */
    }
    .navbar .dropdown.show > .dropdown-menu{
        opacity: 1;
        visibility: visible;
        transform: none;
    }
}

html {
    min-height: 100%;
    position: relative;
}
body {
    margin: 0;
    margin-bottom: 90px;
}
footer {
    background-color: black;
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 80px;
    color: white;
}