html{
   height: 100%;
   overscroll-behavior: none;
}

body[data-sidebar=dark].vertical-collpsed {
   min-height: auto !important;
   overscroll-behavior: none;
}

body, #refresh, #layout-wrapper{
   height: 100%;
}

.navbar-header{
   padding: 0;
}

.app-search .form-control{
   width: 200px;
}

.main-content{
   display: flex;
   flex-direction: column;
   min-height: 100vh;
   margin-left: 230px;
}

.page-content {
   padding: 70px 5px 5px 5px;
   flex: 1;
}

.footer {
   position: relative;
   left: 0 !important;
   padding: 15px;
   height: 47px;
}

.hidden{
   display: none;
}

.vertical-menu{
   width: 230px;
   background: #305cf6;
}

.navbar-brand-box {
   width: 230px;
   height: 65px;
   background: #305cf6;
}

.mm-active>a {
   color: #060c29 !important;
}

.mm-active .active i {
   color: var(--bs-blue) !important;
}

a.waves-effect.mm-active, a.waves-effect.active{
   color: #ffffff !important;
   background: #050f1c;
}

#sidebar-menu ul li a:hover {
   color: #050f1c !important;
}

#sidebar-menu ul li ul.sub-menu li a {
   padding: .4rem 1.5rem .4rem 3.5rem;
   font-size: 13px;
   color: #ffffff;
}

.mm-active .active {
   color: #051129 !important;
   font-size: 13px;
   font-weight: 600;
}

ul.metismenu > li.mm-active > a{
   color: #ffffff !important;
   background: #051129;
}

a.has-arrow.mm-active{
   color: #051129 !important;
   font-weight: 600;
}

.box-shadow-1{
   box-shadow: var(--box-shadow-1);
}

.header-item {
   height: 60px;
   padding-top: 10px;
}

.bg-red{
   background: #dd4b39 !important;
}

.top-menu-btn {
    display: flex;
    align-content: center;
    flex-wrap: wrap;
    height: 65px;
}

#searchForm > .top-menu-btn > a {
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}

.text-red{
   color: #dd4b39 !important;
}

.text-orange{
   color: #f7a000 !important;
}

.text-justify{
   text-align: justify;
}

.blue-anikama{
   color: #305cf6 !important;
   font-weight: 500;
}

.btn-outline-primary {
   color: #305cf6;
   border-color: #305cf6;
}

.btn-outline-primary:hover {
   background-color: #305cf6;
}

.blue-bold-anikama{
   color: #305cf6 !important;
   font-weight: 600;
}

.swal2-popup{
   border-radius: 10px !important;
}

.swal2-actions{
   margin: 0.7em auto 0 !important;
}

.form-select:focus{
   box-shadow: 0 0 0 .05rem rgb(24 30 55 / 25%) !important;
}

.fs-11px{
   font-size: 11px !important;;
}

.fs-12px{
   font-size: 12px !important;;
}

.fs-13px{
   font-size: 13px;
}

.fs-14px{
   font-size: 14px;
}

.fs-15px{
   font-size: 15px !important;
}

.fs-16px{
   font-size: 16px !important;
}

.fs-17px{
   font-size: 17px !important;
}

.fs-18px{
   font-size: 18px !important;
}

.fs-20px{
   font-size: 20px;
}

.fs-25px {
   font-size: 25px;
}

.p-2px{
   padding: 2px;
}

.pt-2-5{
   padding-top: 0.6rem;
}

.pb-2-5{
   padding-bottom: 0.6rem;
}

.right-bar-enabled .rightbar-overlay {
   display: block;
   height: 100%;
   position: fixed;
}

.right-bar{
   width: 300px;
   right: -300px;
}

.flex-1{
   flex: 1;
}

.w-3{
   width: 3% !important;
}

.w-4{
   width: 4% !important;
}

.w-5{
   width: 5% !important;
}

.w-6{
   width: 6% !important;
}

.w-8{
   width: 8% !important;
}

.w-10{
   width: 10% !important;
}

.w-12{
   width: 12% !important;
}

.w-13{
   width: 13% !important;
}

.w-14{
   width: 14% !important;
}

.w-15{
   width: 15% !important;
}

.w-16{
   width: 16% !important;
}

.w-17{
   width: 17% !important;
}

.w-18{
   width: 18% !important;
}

.w-20{
   width: 20% !important;
}

.w-22{
   width: 22% !important;
}

.w-50{
   width: 50% !important;
}

.w-60{
   width: 60% !important;
}

.no-resize {
   resize: none;
}

.text-green{
   color: #309b30 !important;
}

.text-dark.comunicados {
   color: rgb(37 37 37) !important;
   font-weight: 600;
}

.text-box.consulta{
   height: auto;
   font-size: 13px;
   line-height: 1.5;
   cursor: default;
   background: #f6f6f6;
   color: #444547;
}

.text-box.consulta > p{
   margin-bottom: 3px;
}

button.toggle-password:focus{
   box-shadow: none;
}

/* BOXES INCIDENCIAS */
.text-box.consulta.incidencia{
   padding: 12px 15px !important;
}

.text-box.consulta.incidencia.rol-cliente {
   background: #f6f6f6;
   border-radius: 0px 8px 8px 8px;
}

.text-box.consulta.incidencia.rol-consultor {
   background: #d9fdd3;
   border-radius: 8px 0px 8px 8px;
}

/* ================================ COMUNICADOS ================================ */
.card-body.comunicados {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   height: calc(1vh - 100px);
   overflow-y: auto;
}

.mensaje-container {
   position: relative;
   overflow: hidden;
   /*max-height: 180px; /* Ajusta la altura inicial visible */
   transition: max-height 0.5s ease; /* Suaviza la expansión */
}

div.mensaje-container > div.mensaje-corto > center > figure.image,
div.mensaje-container > div.mensaje-corto > center > figure.easyimage{
   margin-bottom: 1px;
}

@media (min-width: 992px) {
   .mensaje-container {
      position: relative;
      overflow: hidden;
      /*max-height: 290px; /* Ajusta la altura inicial visible */
      transition: max-height 0.5s ease; /* Suaviza la expansión */
   }   

   div.mensaje-container > div.mensaje-corto > center > figure.image > img, 
   div.mensaje-container > div.mensaje-corto > center > figure.easyimage > img, 
   div.mensaje-container > div.mensaje-corto > figure.image > img
   div.mensaje-container > div.mensaje-corto > figure.easyimage > img {
      width: 100% !important;
   }

   .col-cyd{
      width: 16.5% !important;
   }

   .contador-circle {
      right: 22px !important;
   }

   .estado-circle {
      right: 3px !important;
   }
}

@media (min-width: 1600px) {
   .mensaje-container {
      position: relative;
      overflow: hidden;
      /*max-height: 320px; /* Ajusta la altura inicial visible */
      transition: max-height 0.5s ease; /* Suaviza la expansión */
   }

   .col-cyd{
      width: 16.5% !important;
   }

   .contador-circle {
      right: 22px !important;
   }

   .estado-circle {
      right: 3px !important;
   }
}

@media (min-width: 1920px) {
   .mensaje-container {
      position: relative;
      overflow: hidden;
      /*max-height: 680px; /* Ajusta la altura inicial visible */
      transition: max-height 0.5s ease; /* Suaviza la expansión */
   }

   div.mensaje-container > div.mensaje-corto > center > figure.image > img, 
   div.mensaje-container > div.mensaje-corto > center > figure.easyimage > img, 
   div.mensaje-container > div.mensaje-corto > figure.image > img
   div.mensaje-container > div.mensaje-corto > figure.easyimage > img,
   div.comunicado > div.mensaje-container > div.mensaje-corto > figure.image > img {
      text-align: center;
      width: 65% !important;
   }

   .col-cyd{
      width: 15% !important;
      padding-left: 15px !important;
      padding-right: 15px !important;
   }

   .contador-circle {
      right: 65px !important;
   }

   .estado-circle {
      right: 28px !important;
   }
}

.mensaje-container.expandido {
   max-height: none; /* Elimina la restricción de altura */
}

.leer-mas {
   cursor: pointer;
   font-weight: bold;
   display: inline-block;
   margin-top: 10px;
   transition: color 0.3s ease; /* Efecto visual al cambiar */
}

/* =============================== LOADING OVERLAY =============================== */
.loading-overlay {
   position: fixed !important; /* Fija el overlay a toda la pantalla */
   top: 0;
   opacity: 0.9 !important;
   left: 0;
   width: 100%;
   height: 100%;
   background-color: #305df6b8;
   z-index: 9998; /* Z-index para que esté por encima del contenido del body */
   display: none; /* Oculta el overlay por defecto */
}
.loader-image {
   position: fixed; /* Fija la imagen en la pantalla */
   width: 10%;
   opacity: 1 !important;
   top: 40% !important; /* Centra verticalmente */
   left: 50% !important; /* Centra horizontalmente */
   transform: translate(-50%, -50%); /* Ajusta para centrar la imagen */
   z-index: 99999; /* Asegura que la imagen esté encima de otros elementos */
   display: none; /* Oculta la imagen por defecto */
}

/* ============================= ESTADO DE CONSULTORES ============================= */
.estado-circle {
   width: 12px;
   height: 12px;
   border: 0px solid #fff;
   border-radius: 50%;
   background: #28a745;
   position: absolute;
   top: 10px;
   right: 5px;
   z-index: 2;
}
.contador-circle {
   width: 22px;
   height: 22px;
   border: 0px solid #fff;
   border-radius: 50%;
   background-color: var(--bs-blue);
   color: #fff;
   font-size: 12px;
   font-weight: 500;
   display: flex;
   align-items: center;
   justify-content: center;
   position: absolute;
   bottom: 22px;
   right: 30px;
   z-index: 2;
   align-content: center;
   flex-direction: column-reverse;
}
.position-relative {
   position: relative;
}
.rounded-circle {
   border-radius: 50%;
}

/* ================================ CKEDITOR 5 ================================ */
.ck-editor__editable {
   min-height: 500px !important;
   font-size: 13px !important;
}
.ck.ck-editor__main {
   min-height: 500px;
}
.ck.ck-editor__editable_inline {
   min-height: 500px;
   font-size: 13px;
}
.ck.ck-content.ck-editor__editable.ck-rounded-corners.ck-editor__editable_inline.ck-blurred {
   min-height: 500px !important;
   border-radius: 0px 0px 8px 8px;
}
.ck.ck-content.ck-editor__editable.ck-rounded-corners.ck-editor__editable_inline.ck-focused {
   border-radius: 0px 0px 8px 8px;
   border: 1px solid #abb9cd;
   box-shadow: none;
}
.ck.ck-balloon-panel.ck-powered-by-balloon[class*=position_border]{
   display: none;
}
.ck-rounded-corners .ck.ck-editor__top .ck-sticky-panel .ck-toolbar, .ck.ck-editor__top .ck-sticky-panel .ck-toolbar.ck-rounded-corners{
   border-radius: 8px 8px 0px 0px !important;
}

/* ================================ DATATABLES ================================ */
.table>:not(caption)>*>* {
   padding: .5rem .5rem;
}

tbody{
   font-size: 12px;
}

.table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control, table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
   padding-left: 35px;
   padding-top: 14px;
}

.botones-datatables .btn {
   margin-left: 0px;
   width: 70px !important;
   height: 35px;
}

.botones-datatables > .btn:has(i.mdi){
   padding-top: 4px !important;
}

.botones-datatables {
   display: flex;
   justify-content: flex-end;
   gap: 10px; /* Espaciado entre botones */
}

div.dataTables_wrapper div.dataTables_paginate{
   margin-top: 10px !important;
}

th.dt-input-search{
   text-align: center;
   padding: 5px 10px !important;
}

th.dt-input-search > input{
   width: 100%;
   border-radius: 8px;
   box-shadow: var(--box-shadow-1);
   border: 1px solid #d9d9e1;
   color: #4a5057;
   padding-left: 5px;
}

table {
   border-radius: 8px;
}

table.table-bordered.dataTable tbody th, table.table-bordered.dataTable tbody td{
   align-content: center;
}

.table-bordered {
    border: 1px solid #e4e7eb;
}

/* FIN */

.toast-header {
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
}

.toast-body {
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;
}

.pl0{
   padding-left: 0px;
}

figure.image > img, figure.easyimage > img{
   min-width: 45%;
   max-width: 100%;
   height: auto;
}

.form-control.text-box.consulta > p > img{
   min-width: 45%;
   max-width: 100%;
   height: auto;
}

.form-control.text-box.consulta.incidencia > p > img{
   min-width: 45%;
   max-width: 100%;
   height: auto;
}

.mdi{
   font-size: 14px;
}

.card-body{
   padding: 1.15rem 1.15rem;
}

.vertical-collpsed .vertical-menu{
   position: fixed;
}

.card.invoices-types{
   min-height: 275px;
   max-height: 275px;
}

.card.latest-invoices{
   min-height: 450px;
   /*max-height: 484px;*/
   overflow-y: auto;
}

#home_mycompanies{
   min-height: 153px; 
   max-height: 153px;
}

img.logo_icon{
   margin-left: 0px;
}

i.bx.bx-badge-check.green{
   color: #30b383;
   font-size: 15px;
   font-weight: 500;
}

div#datatable-buttons_filter.dataTables_filter{
   text-align: left;
}

.mrgb15{
   margin-bottom: 15px;
}

.header-profile-user {
   max-height: 32px;
   max-width: 32px;
}

::-webkit-scrollbar {
   width: 11px;
   height: 10px;
}
::-webkit-scrollbar-track {
   box-shadow: inset 0 0 3px #7684a1;; 
   border-radius: 5px;
}
::-webkit-scrollbar-thumb {
   background: #98a4aed1; 
   border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
   background: #8f9ca7d1;
}

div.home_no_companies{
   text-align: center;
}

div.home_no_payslip{
   padding-top: 5%;
   text-align: center;
}

div.payslips_no_payslip{
   padding-top: 5%;
   text-align: center;
   padding-bottom: 5%;
}

div.companies_no_companies{
   padding-top: 5%;
   text-align: center;
   padding-bottom: 5%;
}

.apexcharts-toolbar{
   right: 50px !important;
}

.apexcharts-menu{
   min-width: 115px !important;
}

b.number{
   font-weight: 600 !important;
}
.badge-soft-success{
   color: #299350;
}

.bg-primary {
   --bs-bg-opacity: 1;
   background-color: #305cf6 !important;
}

.bg-primary.bg-soft {
   background-color: #305cf696 !important;
}

.btn-primary {
   color: #fff;
   background-color: #305cf6 !important;
   border-color: #305cf6 !important;
}

.btn-primary:hover {
   color: #fff;
   background-color: #4f69f6 !important;
   border-color: #4f69f6 !important;
}

.btn-primary:focus{
   box-shadow: none;
}

.text-primary {
   --bs-text-opacity: 1;
   color: #305cf6 !important;
}

.text-white {
   color: rgb(255, 255, 255) !important;
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>#nuevaincidencia:hover>a, .vertical-collpsed .vertical-menu #sidebar-menu>ul>#nuevaincidencia:hover>a i {
   color: var(--bs-blue) !important;
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a, .vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a i {
   color: #323539 !important;
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul ul{
   padding: 0;
}

#sidebar-menu ul li a {
   padding: 0.94rem 1.4rem;
   color: #ffffff;
}

#sidebar-menu ul li a i {
   font-size: 23px;
   color: #ffffff !important;
}

#sidebar-menu ul li:hover a, #sidebar-menu ul li:hover a i {
   color: #305cf6;
}

#sidebar-menu ul li ul.sub-menu li a:hover, #sidebar-menu ul li ul.sub-menu li ul.sub-menu li a:hover{
   /*background: #f7f7f7;*/
   font-weight: 600;
}

.noti-icon .badge {
   position: absolute;
   top: 15px;
   right: 8px;
}

/*.metismenu li:hover{
   background: #f7f7f7;
}*/

.page-item.active .page-link {
   background-color: #305cf6 !important;
   border-color: #305cf6 !important;
}

.btn-primary.disabled, .btn-primary:disabled {
   background-color: #305cf6 !important;
   border-color: #305cf6 !important;
}

.form-check-primary .form-check-input:checked {
   background-color: #305cf6 !important;
   border-color: #305cf6 !important;
}

body.bodylogin{
   display: grid;
   align-content: center;
   background: radial-gradient(ellipse at center, #6a94b5, #305cf6);
   background-position: center;
   height: 100%;
}

.form-control.text-box.consulta > figure{
   max-width: 100%;
}

.bg-border-radius{
   border: 1px solid white;
   border-radius: 8px 8px 0px 0px;
}

.btn{
   border-radius: 8px;
}

.card{
   border-radius: 8px;
   border: 0px solid #bdbdbd;
   margin-bottom: 10px;
}

div#footer-login{
   color: white;
}

.dropdown-icon-item{
   padding: 0px;
}

.dropdown-icon-item img {
   height: 70px;
}

@media (min-width: 1180px) {
   .hidden-sm{
      display: none;
   }
}

@media (max-width: 1024px) {
   .hidden-xs{
      display: none;
   }
}

@media (max-width: 992px) {

   html#login>body>.account-pages.my-0.pt-sm-0 {
      height: 100%;
      margin: 0 !important;
   }

   html#login>body>.account-pages.my-0.pt-sm-0>.container {
      height: 100%;
      padding: 0;
   }

   html#login>body>.account-pages.my-0.pt-sm-0>.container>.row.justify-content-center {
      height: 100%;
   }

   html#login>body>.account-pages.my-0.pt-sm-0>.container>.row.justify-content-center>.col-md-8.col-lg-6.col-xl-5>.card.overflow-hidden {
      height: 100%;
   }

   body[data-sidebar=dark] .navbar-brand-box {
      background: #262b3c;
   }

   div.navbar-brand-box{
      width: 65px !important;
      height: 60px !important;
      background: white;
      padding-right: 0px;
      padding-left: 30px;
   }

   .header-profile-user{
      max-height: 28px !important;
      max-width: 28px !important;
   }

   .footer {
      text-align: center;
   }

   .card.invoices-types {
      min-height: inherit;
      max-height: inherit;
      overflow-y: hidden;
   }

   .card.latest-invoices {
      min-height: inherit;
      max-height: inherit;
      overflow-y: hidden;
   }

   #home_mycompanies{
      min-height: inherit; 
      max-height: inherit;
   }

   .pt-5 {
      padding-top: 1.3rem!important;
   }

   div.dt-buttons {
      margin-bottom: 3.2em;
   }

   div.dataTables_wrapper div.dataTables_info{
      font-size: 12px;
   }

   div.dataTables_wrapper div.dataTables_paginate{
      padding-top: 8px;
   }

   #datatable-buttons>tbody{
      font-size: 12px;
   }

   table.dataTable>tbody>tr.child ul.dtr-details{
      width: 100%;
   }

   table.dataTable>tbody>tr.child span.dtr-title {
      display: inline-block;
      min-width: 88px;
      font-weight: 600;
   }

   .table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control, table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
      padding: 15px;
   }

   .table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before, table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before{
      position: inherit;
      margin-top: 0px;
      left: 1px;
   }

   table.dataTable>thead .sorting_asc:after, table.dataTable>thead .sorting_asc:before{
      display: none;
   }

   .dtr-control{
      width: 20px;
   }

   .buttons-html5, .buttons-colvis{
      font-size: 12px;
   }

   #avatar-profile-xs{
      margin-top: -65px;
   }

   html#login{
      height: 100%;
   }

   html#login>body{
      height: 100%;
      overflow-x: hidden;
   }

   html#login>body>.account-pages.my-5.pt-sm-5{
      height: 100%;
      margin: 0 !important;
   }

   html#login>body>.account-pages.my-5.pt-sm-5>.container{
      height: 100%;
      padding: 0;
   }

   html#login>body>.account-pages.my-5.pt-sm-5>.container>.row.justify-content-center{
      height: 100%;
   }

   html#login>body>.account-pages.my-5.pt-sm-5>.container>.row.justify-content-center>.col-md-8.col-lg-6.col-xl-5>.card.overflow-hidden{
      height: 100%;
   }

   div#footer-login{
      position: fixed;
      bottom: 0;
      width: 100%;;
      color: #495057;
   }

   .apexcharts-toolbar {
      right: 10px !important;
   }

   #login{
      display: grid;
      justify-content: center;
      align-items: center;
      width: 100%;
   }

   body.bodylogin{
      display: block;
   }
}

@media (max-width: 480px) {
   
   img.logo_icon {
      margin-left: -5px;
   }

   #login {
      display: grid;
      align-content: stretch;
   }   
}

@media (max-width: 380px){
   
   .navbar-brand-box {
      display: block;
   }

   .col-12, .col-sm-7, .col-xl-4, .col-xl-8 {
      padding-top: 0;
   }

   img.logo_icon {
      margin-left: -15px !important;
   }
}

.ck-editor__editable {min-height: 500px;}

@media (max-width: 480px) {
   .col-xs-auto {
      -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
      width: auto; }
   .col-xs-1 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 8.33333%; }
   .col-xs-2 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 16.66667%; }
   .col-xs-3 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 25%; }
   .col-xs-4 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 33.33333%; }
   .col-xs-5 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 41.66667%; }
   .col-xs-6 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 50%; }
   .col-xs-7 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 58.33333%; }
   .col-xs-8 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 66.66667%; }
   .col-xs-9 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 75%; }
   .col-xs-10 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 83.33333%; }
   .col-xs-11 {
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 91.66667%; }
   .col-xs-12 {
   margin-bottom: 5px;
   -webkit-box-flex: 0;
         -ms-flex: 0 0 auto;
            flex: 0 0 auto;
   width: 100%; }

   .order-xs-first {
      -webkit-box-ordinal-group: 0 !important;
          -ms-flex-order: -1 !important;
              order: -1 !important; }
    .order-xs-0 {
      -webkit-box-ordinal-group: 1 !important;
          -ms-flex-order: 0 !important;
              order: 0 !important; }
    .order-xs-1 {
      -webkit-box-ordinal-group: 2 !important;
          -ms-flex-order: 1 !important;
              order: 1 !important; }
    .order-xs-2 {
      -webkit-box-ordinal-group: 3 !important;
          -ms-flex-order: 2 !important;
              order: 2 !important; }
    .order-xs-3 {
      -webkit-box-ordinal-group: 4 !important;
          -ms-flex-order: 3 !important;
              order: 3 !important; }
    .order-xs-4 {
      -webkit-box-ordinal-group: 5 !important;
          -ms-flex-order: 4 !important;
              order: 4 !important; }
    .order-xs-5 {
      -webkit-box-ordinal-group: 6 !important;
          -ms-flex-order: 5 !important;
              order: 5 !important; }
    .order-xs-last {
      -webkit-box-ordinal-group: 7 !important;
          -ms-flex-order: 6 !important;
              order: 6 !important; }

   .d-xs-block {
      display: block !important; }

   .ps-xs-2{
      padding-left: 2px;
   }

   .pe-xs-2{
      padding-right: 2px;
   }

   .ps-xs-5{
      padding-left: 5px;
   }

   .pe-xs-5{
      padding-right: 5px;
   }

   .psx-8{
      padding-left: calc(var(--bs-gutter-x)* .5) !important;
   }

   .navbar-brand-box{
      justify-content: center;
   }

   img.logo_icon{
      padding-left: 10px !important;
      padding-right: 10px !important;
      margin-left: 10px !important;
      padding-top: 7px !important;
      padding-bottom: 6px !important;
   }

   a.logo.logo-light{
      border-bottom: 0px solid #fff !important;
   }

   .card-body.comunicados{
      height: calc(1vh - -500px);
   }

   .container-fluid{
      padding-left: 0;
      padding-right: 0;
   }

   .navbar-header .dropdown .dropdown-menu {
      left: 0px !important;
      right: 0px !important;
   }

   div.dt-buttons {
      margin-bottom: 0px;
   }

   #datatable-buttons_filter > label > input{
      margin-bottom: 8px;
   }
}

@media (max-width: 620px) {
   .d-xs-none{
      display: none !important;
   }
}

body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a i, body[data-sidebar=dark].vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a span{
   color: #fff !important;
}

#datatable-buttons_wrapper > .row.mb-2{
   align-items: center;
}

#datatable-buttons_filter > label{
   margin-bottom: 0px;
   font-size: 14px;
}

#datatable-buttons_filter > label > input{
   width: 100%;
   font-size: 12px;
   border-radius: 8px;
}

.dt-buttons > .btn{
   line-height: 1.2;
}

.icon-hover-rotate {
   display: inline-block;
   transition: transform 0.3s ease;
}

.icon-hover-rotate:hover {
   transform: rotate(-360deg);
}

@keyframes slideOutLeft {
   0% { transform: translateX(0); }
   100% { transform: translateX(-100%); }
}

@keyframes slideInLeft {
   0% { transform: translateX(-100%); }
   100% { transform: translateX(0); }
}

.menu-closing {
   animation: slideOutLeft 0.3s forwards;
}

.menu-opening {
   animation: slideInLeft 0.3s forwards;
}

.dt-buttons .btn-nuevo {
   border-top-right-radius: 8px !important;
   border-bottom-right-radius: 8px !important;
}

.dt-buttons .btn-copiar {
   border-top-left-radius: 8px !important;
   border-bottom-left-radius: 8px !important;
}

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

.swal2-content{
   margin-top: 5px !important;
}

.swal2-select{
   font-size: 16px !important;
   border-radius: 10px !important;
   margin-top: 2px !important;
   margin-bottom: 2px !important;
}

.swal2-textarea{
   resize: none !important;
   margin-top: 3px !important;
   margin-bottom: 3px !important;
   font-size: 16px !important;
}

.swal2-select:focus,
.swal2-select:focus-visible,
.swal2-textarea:focus-visible {
  border: 1px solid #696969 !important;
  box-shadow: none !important;
  outline: none !important;
}

.swal2-confirm,
.swal2-deny,
.swal2-cancel {
   border-radius: 10px !important;
   font-size: 15px !important;
}

.navbar-center-title {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    pointer-events: none;
}

.accordion-button.faq-btn { background: #f9faff; font-weight: 500; }
.accordion-button.faq-btn:not(.collapsed) { background: #315CF6; color: white; }
.accordion-button::after { filter: grayscale(100%) brightness(40%); }
.accordion-button:not(.collapsed)::after { filter: brightness(0) invert(1); } 

.air-datepicker-global-container {
    z-index: 3000 !important;
}

.air-datepicker {
    z-index: 3000 !important;
}

.select2-container--bootstrap-5 .select2-selection {
   min-height: calc(1.5em + 0.75rem + 3px) !important;
   font-size: .8125rem !important;
   border-radius: 10px !important;
}
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection,
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus{
   border-color: #cccdd1 !important;
   box-shadow: 0 0 0 .15rem rgb(198 211 229 / 25%) !important;
}
.select2-container--bootstrap-5 .select2-results__option {
   font-size: .8125rem !important;
}
.select2-container--bootstrap-5 .select2-selection__placeholder {
   font-size: .8125rem !important;
}
.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option{
   font-size: .8125rem !important;
   color: #495057 !important;
}
.select2-container--bootstrap-5 .select2-dropdown{
   border-color: #cccdd1 !important;
   border-radius: 10px !important;
}
.select2-container--bootstrap-5 .select2-dropdown.select2-dropdown--below {
   border-top: 1px solid #cdced1 !important;
   border-top-left-radius: 10px !important;
   border-top-right-radius: 10px !important;
   margin-top: 1px !important;
}
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field{
   font-size: 13px !important;
   color: #495057 !important;
   border-radius: 10px !important;
}

/* Select2 dentro de SweetAlert */
.swal2-popup .select2-container .select2-selection--single {
   height: 38px;
   padding: 4px 10px;
   border-radius: 10px;
   border: 1px solid #ced4da;
   display: flex;
   align-items: center;
   font-size: 14px;
   color: #6c737b !important;
   margin-bottom: 7px;
}

.swal2-popup .select2-container--open .select2-dropdown--below{
   margin-top: -7px;
}

.swal2-popup .select2-container--default .select2-search--dropdown .select2-search__field {
   font-size: 13px !important;
   color: #495057 !important;
   border-radius: 10px !important;
}

.swal2-popup .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    border-color: #cccdd1 !important;
    box-shadow: 0 0 0 .15rem rgb(198 211 229 / 25%) !important;
}

.swal2-popup .select2-container--default .select2-selection--single .select2-selection__rendered {
   line-height: normal;
   padding-left: 0;
}

.swal2-popup .select2-container--default .select2-selection--single .select2-selection__arrow {
   height: 100%;
   right: 10px;
}

.swal2-popup .select2-dropdown {
   border-radius: 0.375rem;
   border: 1px solid #ced4da;
   font-size: 14px;
}

.swal2-popup .select2-search__field {
   padding: 6px;
}

.swal2-popup .select2-results__option {
   font-size: 14px;
}

.swal2-popup .select2-search__field {
   font-size: 14px;
}

.select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--selected{
   color: #fff !important;
}

/* OPCIONES */
.fab-options {
   position: absolute;
   bottom: 70px;
   right: 0;
   display: flex;
   flex-direction: column;
   align-items: flex-end;
   gap: 10px;
   opacity: 0;
   pointer-events: none;
   transform: translateY(10px);
   transition: all .3s ease;
}

.fab-options.show {
   opacity: 1;
   pointer-events: auto;
   transform: translateY(0);
}

/* ITEMS */
.fab-item {
   display: flex;
   align-items: center;
   gap: 10px;
   background: #fff;
   padding: 8px 12px;
   border-radius: 20px;
   text-decoration: none;
   color: #333;
   box-shadow: 0 2px 8px rgba(0,0,0,0.15);
   font-size: 16px;
   white-space: nowrap;
}

.fab-item i {
    background: #305cf6;
    color: #fff;
    border-radius: 50%;
    padding: 6px;
}

/* efecto */
.fab-overlay {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background: rgba(0,0,0,0.3);
   z-index: 1002;
   opacity: 0;
   pointer-events: none;
   transition: opacity .3s ease;
   backdrop-filter: blur(3px);
}

.fab-overlay.show {
   opacity: 1;
   pointer-events: auto;
}

.fab-item:active {
   transform: scale(0.95);
}

@media (min-width: 768px) {
   .fab-container {
      display: none;
   }
}

@media (max-width: 768px) {
   #searchForm > .top-menu-btn > a { 
      padding-top: 15px; 
      padding-bottom: 24px; 
      padding-right: 8px;
   }

   table.dataTable td {
      white-space: nowrap;
   }

   .filtros-scroll {
      overflow-x: auto;
      white-space: nowrap;
   }

   .filtros-row {
      display: inline-flex;
      flex-wrap: nowrap;
      gap: 1px;
      min-width: max-content;
   }

   .filtros-row > div {
      flex: 0 0 auto;
      width: 130px;
   }

   .filtros-row input {
      width: 100%;
      padding: 6px 8px;
      font-size: 13px;
   }

   .filtros-row button {
      width: 100%;
   }

   button:active {
      transform: scale(0.97);
   }
}

#datatable {
   white-space: nowrap;
}

table.dataTable {
   clear: both;
   margin-top: 6px !important;
   margin-bottom: 6px !important;
   max-width: none !important;
   border-collapse: separate !important;
   border-spacing: 0;
}

.dataTables_wrapper {
   -webkit-overflow-scrolling: touch;
}

.table-scroll {
   overflow-y: auto;
}

[type=search] {
   outline-offset: 0px;
}

#nprogress .bar {
   background: #305cf6 !important;
   height: 4px;
}

#nprogress .peg {
   box-shadow: 0 0 10px #305cf6, 0 0 5px #305cf6;
}

#nprogress .spinner {
   display: none !important;
}

#datatable thead input:focus {
   outline: none;
   box-shadow: 0 0 0 0.1rem rgba(168, 187, 255, 0.25);
   border-color: #949494;
}

.swal-modern {
   border-radius: 12px !important;
}

.select2-results__options {
   max-height: 250px !important;
   overflow-y: auto !important;
   -webkit-overflow-scrolling: touch !important;
   touch-action: pan-y !important;
}

.swal2-popup {
   touch-action: manipulation !important;
}

.swal2-select {
    display: block;
    width: 100% !important;
    padding: 0.5rem 0.75rem;
    font-size: 0.95rem;
    border: 1px solid #ced4da;
    border-radius: 0.5rem;
    background-color: #fff;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.swal2-select:focus {
    border-color: #9fa1a7;
    outline: 0;
    box-shadow: 0 0 0 0.1rem rgba(189, 214, 251, 0.25);
}

.swal2-textarea, .swal2-textarea:focus{
   transition: border-color .3s,box-shadow .3s;
   border: 1px solid #d9d9d9;
   box-shadow: inset 0 1px 1px rgb(0 0 0 / 6%);
}

.swal2-file:focus, .swal2-input:focus, .swal2-textarea:focus {
   border: 1px solid #819199 !important;
   outline: 0 !important;
   box-shadow: 0 0 0 1px rgb(62 109 156 / 50%) !important;    
}

.select2-container--open {
   z-index: 9999 !important;
}

#nprogress .spinner {
   display: block !important;
   position: fixed !important;
   top: 15px !important;
   right: 15px !important;
   z-index: 999999 !important;
}

#nprogress .spinner-icon {
   width: 18px !important;
   height: 18px !important;
   border: solid 3px transparent !important;
   border-top-color: #556ee6 !important;
   border-left-color: #556ee6 !important;
   border-radius: 50% !important;
}

#mobileTitleMenu{
   background: white;
   padding-top: 7px;
   padding-bottom: 7px;
   padding-left: 10px;
   padding-right: 10px;
   border-radius: 10px;
   border: 1px solid #e7e9ee;
}

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

.dt-button-collection {
   left: 0 !important;
   right: auto !important;
}

#btnCopiarDT, #btnExcelDT, #btnImprimirDT, #btnColVisDT{
   cursor: pointer !important;
}

#searchForm > .top-menu-btn > a:hover {
   background: #305cf6;
   color: white;
}