:root {
    --color-fondo-nav: #2A3342;
    --color-fondo-hover-nav: #475163;
    --color-texto-nav: #fff;
    --color-texto-hover-nav: #22c55e;
    --color-verde: #22c55e;
  }

::selection {
background: var(--color-texto-hover-nav);
}

a:hover::selection {
color: var(--color-fondo-nav);
background: var(--color-texto-hover-nav);
}

.link_app{
color: #0d8d3c;
}

A.linkOculto {
    color: #777; text-decoration: none 
}

A.linkOculto:hover {
    color: #777; text-decoration: underline; 
}

body {
    font-family: 'Lato';
}

.fa-btn {
    margin-right: 6px;
}

.btn-facebook
{
    color: #ffffff !important;
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 40px;
    background-color: #3b5998;
    border-radius: 100%;
    text-align: center;
}
.btn-facebook:hover
{
    background-color: #222222 !important;
}

.dropdown-submenu {
position: relative;
}

.dropdown-submenu .dropdown-menu {
top: 0;
left: 100%;
margin-top: -1px;
}

/* .btn-menu-bloqueado{
    color: #545454 !important;
}

.btn-menu-bloqueado:hover{
    color: #545454 !important;
    background-color: #ffff !important;
} */

/* Nav */



.nav-principal{
    background-color: var(--color-fondo-nav);
    border: none;
}


#app-layout > nav > div > div.navbar-header > a{
    color: var(--color-texto-nav);
    font-weight: bold;
}

/*
#app-layout > nav > div > div.navbar-header > a:hover{
    color: var(--color-texto-hover-nav);
}
*/

#app-navbar-collapse > ul > li > a{
    color: var(--color-texto-nav);
    font-size: 15px;
    font-family: 'Poppins';
}

#app-navbar-collapse > ul > li > a:hover:not(.nav-p-empresa),
#app-navbar-collapse > ul > li > a:focus:not(.nav-p-empresa),
#app-navbar-collapse > ul > li > a:active:not(.nav-p-empresa){
    color: var(--color-texto-hover-nav);
    
}

#app-navbar-collapse > ul:nth-child(2) > li.dropdown.open > a{
    background-color: var(--color-fondo-hover-nav);
}

#app-navbar-collapse > ul.nav.navbar-nav.navbar-right > li.dropdown.open > a{
    background-color: var(--color-fondo-hover-nav);
}

#app-layout > nav > div > div.navbar-header > button >span{
    background-color: var(--color-texto-nav);
}

#app-layout > nav > div > div.navbar-header > button:hover,
#app-layout > nav > div > div.navbar-header > button:focus,
#app-layout > nav > div > div.navbar-header > button:active {
    background-color: var(--color-texto-hover-nav);
}


#app-navbar-collapse > ul > li.dropdown.open > ul > li > a{
    color: var(--color-texto-nav);
    font-size: 15px;
    font-family: 'Poppins';
}

#app-navbar-collapse > ul > li.dropdown.open > ul > li > a:hover:not(.nav-p-empresa),
#app-navbar-collapse > ul > li.dropdown.open > ul > li > a:focus:not(.nav-p-empresa),
#app-navbar-collapse > ul > li.dropdown.open > ul > li > a:active:not(.nav-p-empresa){
    color: var(--color-texto-hover-nav);
    background-color: var(--color-fondo-hover-nav);
}

#app-navbar-collapse > ul > li.dropdown.open > ul > li > ul > li > a{
    color: var(--color-texto-nav);
    font-size: 15px;
    font-family: 'Poppins';
}

#app-navbar-collapse > ul > li.dropdown.open > ul > li > ul > li > a:hover:not(.nav-p-empresa),
#app-navbar-collapse > ul > li.dropdown.open > ul > li > ul > li > a:focus:not(.nav-p-empresa),
#app-navbar-collapse > ul > li.dropdown.open > ul > li > ul > li > a:active:not(.nav-p-empresa){
    color: var(--color-texto-hover-nav);
    background-color: var(--color-fondo-hover-nav);
}

#app-navbar-collapse > ul > li.dropdown.open > ul{
    background-color: var(--color-fondo-nav);
    border: none;
}

#app-navbar-collapse > ul > li.dropdown.open > ul > li > ul{
    background-color: var(--color-fondo-nav);
    border: none;
}

#app-navbar-collapse > ul > li.dropdown.open > a{
    background-color: var(--color-fondo-hover-nav);
}

/* .logo-empresa{
    position: absolute;
    display: inline-block;
    width: 32px;
    filter: brightness(0) invert(1);
    top: 8px;
    transform: translateX(-50px);
} */

.logo-empresa>img~p{
    display: inline-block;
    transform: translate(5px, -5px);
}

.logo-empresa>img{
    display: inline;
    width: 32px;
    filter: brightness(0) invert(1);
    top: 8px;
    transform: translateY(-6px);
}

/* Footer */

#app-layout > footer{
    background-color: var(--color-fondo-nav);
    color: var(--color-texto-nav);
}

#app-layout > footer > div > div > div > p{
    color: var(--color-texto-nav);
}

#app-layout > footer > div > div > div > p > a{
    color: var(--color-texto-nav);
}

#app-layout > footer > div > div > div > p > a:hover{
    color: var(--color-texto-hover-nav);
}

.dropdown-menu .divider {
    background-color: var(--color-fondo-hover-nav);
}


/* btn-primary */
.btn-primary {
    color: #fff;
    background-color: #1a9447;
    border-color: #197a3d;
    opacity: 0.9;
}

.btn-primary:hover, .btn-primary:active, .btn-primary:focus,
.btn-primary:active:focus{
    color: #fff;
    background-color: #19743a;
    border-color: #135c2e;
}

.btn-primary.active.focus, 
.btn-primary.active:focus, 
.btn-primary.active:hover, 
.btn-primary:active.focus, .btn-primary:active:focus, 
.btn-primary:active:hover, 
.open>.dropdown-toggle.btn-primary.focus, 
.open>.dropdown-toggle.btn-primary:focus, 
.open>.dropdown-toggle.btn-primary:hover {
    color: #fff;
    background-color: #20a04f;
    border-color: #198540;
}

/* btn */
.btn{
    font-weight: 600;
}

/* btn-success */
.btn-success {
    color: #fff;
    background-color: #2A3342;
    border-color: #475772;
    opacity: 0.9;
}

.btn-success:hover, .btn-success:active, .btn-success:focus,
.btn-success:active:focus{
    color: #fff;
    background-color: #32476b;
    border-color: rgb(70, 92, 129);
}

.btn-success.active.focus, 
.btn-success.active:focus, 
.btn-success.active:hover, 
.btn-success:active.focus, .btn-success:active:focus, 
.btn-success:active:hover, 
.open>.dropdown-toggle.btn-success.focus, 
.open>.dropdown-toggle.btn-success:focus, 
.open>.dropdown-toggle.btn-success:hover {
    color: #fff;
    background-color: #32476b;
    border-color: rgb(70, 92, 129);
}

/* btn-secondary */
.btn-secondary {
    color: #1c723b;
    background-color: #f9fffa;
    border-color: #1a9447;
    opacity: 0.9;
}

.btn-secondary:hover, .btn-secondary:active, .btn-secondary:focus,
.btn-secondary:active:focus{
    color: #fff;
    background-color: #1a9447;
    border-color: #197a3d;
}

.btn-secondary.active.focus, 
.btn-secondary.active:focus, 
.btn-secondary.active:hover, 
.btn-secondary:active.focus, .btn-secondary:active:focus, 
.btn-secondary:active:hover, 
.open>.dropdown-toggle.btn-secondary.focus, 
.open>.dropdown-toggle.btn-secondary:focus, 
.open>.dropdown-toggle.btn-secondary:hover {
    color: #fff;
    background-color: #22c55e;
    border-color: #22b457;
}


/* gpo-botones */

.gpo-botones-vertical{
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.gpo-botones-horizontal{
    display: flex;
    flex-direction: row;
    gap: 5px;
}

.gpo-botones-centrados{
    justify-content: center;
    justify-items: center;
    margin: auto;
}

/* alerts */

.alert-success {
    color: #3c763d;
    background-color: #bbffd4;
    border-color: #9cd7b2;
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fff4b8;
    border-color: #e1c68f;
}

.alert-danger {
    color: #732a29;
    background-color: #ff9b9b;
    border-color: #c96273;
}

.form-control:focus {
    border-color: #22c55e;
}

input[type=checkbox], input[type=radio] {
    accent-color: #20881c;
  }

  ul.nav-tabs > li > a{
    color: #208a1d;
    font-family: "Poppins";
    background-color: #f1f1f1;
  }

  ul.nav-tabs > li > a:hover{
    background-color: #bdbdbd;
  }

  /* Select2 */
  
.select2-selection--multiple{
    overflow: hidden !important;
    height: auto !important;
    padding-left: 5px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #22C55E;
    border: 1px solid #137738;
    color: #fff;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #fff;
    border-right: 1px solid #fff;
}

li.select2-selection__choice > span{
    padding-right: 3px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #22C55E;
    color: #fff;
  }

.select2-selection__clear {
    display: inline-block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    margin-top: 3px;
    background-color: #ccc;
    color: #333;
}

.select2-selection__clear:hover {
    background-color: #22C55E;
    color: white;
}