/* Colores corporativos */

    /* #396667 Base Green */
    /* #BEDA7D Light Green */
    /* #EEF0F4 Light Gray */
    /* #gray Text Gray*/     

    :root {
        /* Navbar style */
        --navbar-bg-color: #396667;
        --text-color: #BEDA7D;
        --link-color: #EEF0F4;     
        /* Dropdowns style */
        --dropdown-bg-color: #396667;
        --dropdown-divider-color: #EEF0F4;
        --dropdown-link-color: #EEF0F4;
        --dropdown-link-hover-color:  #396667;
        --dropdown-link-hover-bg: #BEDA7D;
    }
    
    /* HMTL */
    html {
        overflow-y: scroll; /* Mantiene el espacio para la barra de scroll */
    }
    /* --------------------------------------------------------------------------- */
    
    /* Body */
    html, body {
        height: 100%;
        overflow-x: hidden;
    }
    /* --------------------------------------------------------------------------- */
    
    /* Main */
    main {
        justify-content: center; 
        align-items: center;
    }
    /* --------------------------------------------------------------------------- */
    
    /* Home Background */
    .bg-custom {
        background-image: url('/static/images/Waves_background.jpg');
        background-size: cover;       
        background-position: center;  
        background-repeat: no-repeat; 
        min-height: 100vh;            
    }
    /* --------------------------------------------------------------------------- */
    
    /* Background Color */
    .bg-color {
        background-color: #EEF0F4;
    }
    
    .bg-green {
        background-color: #396667;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Footer Background */
    .bg-footer {
        background-color: #EEF0F4;
    }
    /* --------------------------------------------------------------------------- */
    
    /* Inanis Footer */
    .no-style {
        text-decoration: none;
        color: inherit;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Logo */
    .logo {
        height: 55px;
        width: auto;
    }
    /* --------------------------------------------------------------------------- */
    
    /* Placeholders */
    ::placeholder {
        color: dimgray;
        opacity: 0.6;
        font-style: italic;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Navbar */
    .navbar {
        background-color: var(--navbar-bg-color) !important;
    }
    
    .navbar a {
        color: var(--link-color) !important;
    }
    
    .navbar a:hover {
        color: var(--text-color) !important;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Dropdowns */
    .dropdown-menu {
        background-color: var(--dropdown-bg-color) !important;
        border: none;
    }
    
    .dropdown-divider {
        border-color: var(--dropdown-divider-color) !important;
    }
    
    .dropdown-item {
        color: var(--dropdown-link-color) !important;
        transition: background-color 0.3s, color 0.3s; 
    }
    
    .navbar .dropdown-menu a:hover {
        color: var(--dropdown-link-hover-color) !important;
        background-color: var(--dropdown-link-hover-bg) !important;
    }
    
    .dropdown-item.active {
        background-color: var(--dropdown-link-hover-bg) !important;
        color: var(--dropdown-link-hover-color) !important;
    }
    /* --------------------------------------------------------------------------- */
    
    /* links */
    .link-custom {
        color: #396667;   
        text-decoration: underline;
    }
    
    .link-custom:hover {
        color: #BEDA7D;      
        text-decoration: none; 
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* buttons */
    .btn-light-green {
        background-color: #BEDA7D;
        color: #396667;
        border-color: #BEDA7D;
    }
    
    .btn-light-green:hover {
        background-color: #396667; 
        color: #EEF0F4;
        border-color: #a6c966;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Pagination */
    .page-item.active .page-link {
        z-index: 3;
        color: #fff;
        background-color: #BEDA7D;
        border-color: #BEDA7D;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* Ids and classes */
    #Bienvenido_text {
        color: #396667;
    }
    
    #label1, #label2 {
        color: #396667;
    }
    
    #hd_text {
        color: #396667;
        background-color: #BEDA7D;
    }
    
    .green_text {
        color: #396667;
    }
    
    .gray_text {
        color: dimgray;
    }
    
    .soft_gray_text {
        color: #EEF0F4;
    }
    
    /* --------------------------------------------------------------------------- */
    
    /* TextAreas */
    textarea {
        width: 100%;
        height: 50px;
        resize: vertical;
    }
    
    /* --------------------------------------------------------------------------- */

    .accordion-button:not(.collapsed) {
        background-color: #BEDA7D !important;
        color: dimgray !important;
        box-shadow: none !important;
        border: none !important;
    }

    .accordion .accordion-item .accordion-button:not(.collapsed) {
        background-color: #BEDA7D !important;
        color: dimgray !important;
        box-shadow: none !important;
        border: none !important;
    }