html, body { height: 100%; }

:root{
    --bs-link-color: #000000; --bs-link-hover-color: #666666; 
    --e-global-color-fee37d2: #46220f;
    --e-global-color-2d85faf: #000000;
    --e-global-color-8967d31: #46220f;
    --e-global-color-d5dd985: #46220f;
    --e-global-color-d41ee80: #46220f;
    --bs-secondary-rgb: 70, 34, 15;
}

.rounded-pill.bg-dark{
    background-color: var(--e-global-color-d41ee80) !important;
}

.selector-idioma{
    bottom: 20px;
    right: 10px;
    top: unset;
    z-index: 1021;
}

@media screen and (max-width: 768px){
    .selector-idioma{
        top: 20px;
        right: 20px;
        bottom: unset;
        z-index: 1021;
    }
}

.btn-outline-secondary{
    --bs-btn-color: var(--e-global-color-d41ee80);
    --bs-btn-border-color: var(--e-global-color-d41ee80);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--e-global-color-d41ee80);
    --bs-btn-hover-border-color: var(--e-global-color-d41ee80);
    --bs-btn-focus-shadow-rgb: 108, 117, 125;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--e-global-color-d41ee80);
    --bs-btn-active-border-color: var(--e-global-color-d41ee80);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--e-global-color-d41ee80);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--e-global-color-d41ee80);
    --bs-gradient: none;
}

.dropdown-item.active, .list-group-item.active {
    background-color: var(--e-global-color-d41ee80) !important; /* Color secondary de Bootstrap */
    border-color: var(--e-global-color-d41ee80) !important;
    color: #fff !important;
}
.dropdown-menu{
    --bs-dropdown-link-active-bg: var(--e-global-color-8967d31);
}

.table>:not(caption)>*>* {
    color: var(--bs-table-color-state, var(--bs-table-color-type, var(--e-global-color-d41ee80)));
}
.table-striped>tbody>tr:nth-of-type(odd)>* {
    --bs-table-color-type: var(--e-global-color-d41ee80);
    --bs-table-bg-type: rgb(85 58 46 / 5%);
}
.table-active {
    --bs-table-color-state: var(--e-global-color-d41ee80);
    --bs-table-bg-state: #52382d1c;
}

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

.btn-dark{ 
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--e-global-color-fee37d2);
    --bs-btn-border-color: var(--e-global-color-fee37d2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--e-global-color-2d85faf);
    --bs-btn-hover-border-color: var(--e-global-color-2d85faf);
    --bs-btn-focus-shadow-rgb: 66, 70, 73;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--e-global-color-2d85faf);
    --bs-btn-active-border-color: var(--e-global-color-2d85faf);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--e-global-color-fee37d2);
    --bs-btn-disabled-border-color: var(--e-global-color-fee37d2);

}

.btn-outline-dark {
    --bs-btn-color: var(--e-global-color-fee37d2);
    --bs-btn-border-color: var(--e-global-color-fee37d2);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--e-global-color-fee37d2);
    --bs-btn-hover-border-color: var(--e-global-color-fee37d2);
    --bs-btn-focus-shadow-rgb: 33, 37, 41;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--e-global-color-fee37d2);
    --bs-btn-active-border-color: var(--e-global-color-fee37d2);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--e-global-color-fee37d2);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--e-global-color-fee37d2);
    --bs-gradient: none;
}

.btn-secondary {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--e-global-color-8967d31);
    --bs-btn-border-color: var(--e-global-color-8967d31);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--e-global-color-d41ee80);
    --bs-btn-hover-border-color: var(--e-global-color-d41ee80);
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--e-global-color-d41ee80);
    --bs-btn-active-border-color: var(--e-global-color-d41ee80);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--e-global-color-8967d31);
    --bs-btn-disabled-border-color: var(--e-global-color-8967d31);
}

input[type=text]:focus,input[type=password]:focus,textarea:focus,select:focus,.input_formulario:focus,.input_formulario_2:focus { border: 1px solid var(--e-global-color-fee37d2); -webkit-box-shadow: 0px 0px 5px var(--e-global-color-2d85faf); -moz-box-shadow: 0px 0px 5px var(--e-global-color-2d85faf); box-shadow: 0px 0px 5px var(--e-global-color-2d85faf); }

.modal{

    h5.modal-title{
        color: var(--e-global-color-d5dd985);
        font-size: 2.3rem;
    }

    .h5{
        color: var(--e-global-color-fee37d2);
        font-size: 1.3rem;
    }
    
}

#main_bienvenida {
    .form-signin { max-width: 550px; padding: 1rem; }
    .form-signin .form-floating:focus-within { z-index: 2; }
    .form-signin input[type="text"] { margin-bottom: -1px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; }
    .form-signin input[type="password"] { margin-bottom: 10px; border-top-left-radius: 0; border-top-right-radius: 0; }
    #logotipo img{ max-width: 90%; }

    #contenido{
        height: 100vh;
        display: flex;
        align-items: center;

        @media screen and (min-width: 768px){
            form{  width: 480px; }
        }
    }
}

#main{
    .boo-dropdown.dropdown{ max-width: 340px; display: flex; align-items: center; justify-content: flex-end; }
    .boo-dropdown.dropdown::after{ content: "\F282"; display: inline-block; font-family: bootstrap-icons !important; font-style: normal; font-weight: 400 !important; font-variant: normal; text-transform: none; line-height: 1; vertical-align: -.125em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 6px; border: none; }
    .boo-dropdown.dropdown button { max-width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

    button.btn.dropdown-toggle{ width:400px; }
    button.btn.dropdown-toggle::after{ content: "\F282"; display: inline-block; font-family: bootstrap-icons !important; font-style: normal; font-weight: 400 !important; font-variant: normal; text-transform: none; line-height: 1; vertical-align: -.125em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; margin-left: 6px; border: none; }
    .dropdown-menu[data-bs-popper] {
        top: 94%;
        left: 20px;
        margin-top: var(--bs-dropdown-spacer);
    }
}