:root {
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
}

@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/Poppins.woff2') format('woff2')
}

ul {
    list-style: none;
}

.transform-none {
    transform: none;
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.-translate-x-full {
    --tw-translate-x: -100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.overlay-sidebar {
    position: fixed;
    --tw-bg-opacity: 0.5;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity));
    inset: 0px;
    z-index: 30;
}

.sidebar__content {
    padding-top: 2rem;
    width: 260px;
    height: 100vh;
    z-index: 40;
    top: 0;
    left: 0;
    border-right-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity));
}

/* Active Menu */
.menu-sidebar .hover-link:hover,
.menu-sidebar .active-link {
    background-color: var(--orange) !important;
    border-radius: 10px;
    color: white !important;
}

.menu-sidebar .hover-link:hover svg>path,
.menu-sidebar .active-link svg>path {
    fill: white !important;
}

/**submnenu**/
.menu-sidebar .open-submenu .content-item_submenu .hover-link:hover,
.menu-sidebar .open-submenu .content-item_submenu .active-link {
    background-color: var(--yellow) !important;
    border-radius: 10px;
    color: var(--black) !important;
}

.menu-sidebar .open-submenu .content-item_submenu .hover-link:hover svg>path,
.menu-sidebar .open-submenu .content-item_submenu .active-link svg>path {
    fill: var(--black) !important;
}

.navbar-nav>li>a {
    padding: 10px 10px !important;
}

.dropdown-item.active,
.dropdown-item:active {
    background-color: var(--orange) !important;
}

.logo-login {
    width: 190px;
}

.trans {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

/*BORDER*/
.rounded-none {
    border-radius: 0px;
}

.rounded-sm {
    border-radius: 0.125rem;
}

.rounded {
    border-radius: 0.25rem;
}

.rounded-md {
    border-radius: 0.375rem;
}

.rounded-lg {
    border-radius: 0.5rem;
}

.rounded-xl {
    border-radius: 0.75rem;
}

.rounded-2xl {
    border-radius: 1rem;
}

.rounded-3xl {
    border-radius: 1.5rem;
}

.no-underline {
    text-decoration-line: none;
}

.border-bottom-orange {
    border-bottom-style: solid;
    border-bottom-color: var(--orange);
}

.border-wb1 {
    border-bottom-width: 1px;
}

.border-wb2 {
    border-bottom-width: 2px;
}

.border-wb3 {
    border-bottom-width: 3px;
}

.border-wb4 {
    border-bottom-width: 4px;
}

.border-orange {
    border-color: var(--orange) !important;
}

.border-orange:hover {
    border-color: var(--blue) !important;
}

.border-blue {
    border-color: var(--blue) !important;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.h-card_login {
    height: 100%;
}

.bg-inputs {
    background-color: #F5F5F5;
}

.bg-verde {
    background-color: #60D669;
}

.dropdown-notification {
    width: auto;
}

.dropdown-toggle::after {
    content: "" !important;
}

button,
input,
optgroup,
select,
textarea {
    font-family: CandidaProRoman, sans-serif;
}

.select-input {
    height: calc(3.5rem + calc(var(--bs-border-width)* 2));
    min-height: calc(3.5rem + calc(var(--bs-border-width)* 2));
    /* color: rgba(var(--bs-body-color-rgb), .65); */
    color: #535C67;
}

.form-floating>.form-control-plaintext~label::after,
.form-floating>.form-control:focus~label::after,
.form-floating>.form-control:not(:placeholder-shown)~label::after,
.form-floating>.form-select~label::after {
    background-color: transparent;
}

.form-floating.label-textarea>.form-control-plaintext~label::after,
.form-floating.label-textarea>.form-control:focus~label::after,
.form-floating.label-textarea>.form-control:not(:placeholder-shown)~label::after,
.form-floating.label-textarea>.form-select~label::after {
    background-color: #F5F5F5;
}

.form-floating>.form-control-plaintext~label,
.form-floating>.form-control:focus~label,
.form-floating>.form-control:not(:placeholder-shown)~label,
.form-floating>.form-select~label {
    transform: scale(.85) translateY(-.75rem) translateX(.15rem);
}

.form-floating.bg-label>.form-control:focus {
    background-color: #F5F5F5 !important;
}

.form-floating.label-textarea>.form-control-plaintext~label,
.form-floating.label-textarea>.form-control:focus~label,
.form-floating.label-textarea>.form-control:not(:placeholder-shown)~label,
.form-floating.label-textarea>.form-select~label {
    transform: scale(1) translateY(-1.3rem) translateX(0);
    font-size: 12px;
    width: 100%;
}

.form-floating>label {
    top: 4px;
}

.form-floating>.form-control.error,
.form-select.error {
    border-color: #dc3545;
    padding-right: calc(1.5em + .75rem);
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.form-floating>.form-control:focus.error {
    box-shadow: 0 0 0 .25rem rgb(253 13 13 / 25%);
}

.otp__input {
    width: 40px;
    height: 40px;
    text-align: center;
    outline: none;
    border-radius: 10px;
    border: 2px solid rgb(0, 0, 0, .1);
    background-color: white;
    color: #000;
    margin: auto 1px;
}

.otp__inputs {
    gap: 5px; 
}

.otp__input:focus {
    border: 2px solid var(--orange);
}

.disabled-link {
    pointer-events: none;
    color: var(--darkorange) !important;
}

.btn-orange {
    background-color: var(--orange) !important;
    color: white !important;
}

.btn-border-orange {
    background-color: white;
}
 
.btn-border-orange:hover {
    border: 2px solid var(--orange) !important;
    background-color: var(--orangehoverborder) !important;
    color: var(--orange);
}

.btn-orange:disabled {
    background-color: #F4F6F7 !important;  
    color: #a0a0a0 !important;          
    cursor: not-allowed;             
    border: 1px solid #cccccc;        
    opacity: 0.7;                     
}
.accordion-button {
    color: black !important;  /* Cambia el color a negro */
}
.accordion-button:focus {
    box-shadow: none !important;  /* Elimina la sombra */
    color: black !important;      /* Mantiene el color negro cuando tiene foco */
}

input[type="password"]::-ms-reveal {
    display: none;
}

select.form-select,
select.form-select option {
    background-color: #FFFFFF !important;
}

/* Cuando el select tiene un valor seleccionado */
select.form-select:not([value=""]),
select.form-select:not(:placeholder-shown) {
    background-color: #F5F5F5 !important; /* o el código exacto del gris que uses */
}

/* Para las opciones del dropdown */
select.form-select option {
    background-color: #FFFFFF !important;
}

/* Mantener la flecha del select */
select.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right 0.75rem center !important;
    background-size: 16px 12px !important;
}

.content-business_wrapper .h-resp {
    height: 400px;
}

.modal-dialog {
    max-width: var(--bs-modal-width);
}

.scroll-portal,
.modal-dialog-scrollable .modal-body {
    scrollbar-width: thin;
    scrollbar-color: var(--darkgray) #fff;
}

.scroll-portal::-webkit-scrollbar,
.modal-dialog-scrollable .modal-body::-webkit-scrollbar {
    width: 12px;
}

.box-content_wraper,
.box-subcontent_wraper {
    height: 100%;
}

.box-content_wraper .h-resp,
.box-subcontent_wraper .h-resp {
    height: 400px;
}

.card-item_content.active {
    border: 2px solid var(--orange) !important;
    background-color: rgba(255, 90, 10, 0.05);
}

.card-item_content.active .box-icon {
    background-color: white !important;
}

/*TABLES*/

.table-soporte {
    border-collapse: separate;
    border-spacing: 4px;
}

.table-soporte thead tr th,
.table-soporte tbody tr td {
    border-radius: .5rem;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    line-height: 1.2;
}

.table-soporte thead tr th {
    background-color: var(--orange);
    color: white;
}

.table-soporte tbody tr td {
    background-color: white;
}

.pe-7 {
    padding-right: 4rem;
}

.ps-7 {
    padding-left: 4rem;
}

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

.badge-verde {
    background-color: rgba(22, 163, 74, 0.2);
    color: #16A34A;
}

.badge-amarillo {
    background-color: rgba(202, 162, 4, 0.2);
    color: #CAA204;
}

.alert-blue {
    --bs-alert-bg: rgb(238, 246, 255);
    --bs-alert-border-color: #3485FD;
}

.table-facturacion thead>tr>th,
.table-facturacion tbody>tr>td {
    text-align: center;
    vertical-align: middle;
}

/*ACCORDION*/

.comprobantes_wraper .accordion-button:not(.collapsed)::after,
.comprobantes_wraper .accordion-button::after {
    background-image: none;
}

.comprobantes_wraper .box_subcontent .accordion-button:not(.collapsed)::after,
.comprobantes_wraper .box_subcontent .accordion-button::after {
    background-image: none;
    margin: 0;
    content: "";
}

.comprobantes_wraper .accordion-button::after {
    content: "\f054";
    font-family: 'Font Awesome 5 Pro';
    font-weight: 900;
}

.comprobantes_wraper .accordion-button:not(.collapsed)::after,
.comprobantes_wraper .box_subcontent .accordion-button:not(.collapsed) i {
    transform: rotate(90deg)
}

.comprobantes_wraper .accordion-button:not(.collapsed) {
    background-color: white !important;
}

.comprobantes_wraper .box_subcontent .accordion-button:not(.collapsed),
.tab-mfactlectura_wraper .accordion-button:not(.collapsed) {
    background-color: var(--gray) !important;
}

.w-6 {
    width: 1.5rem;
}

.h-6 {
    height: 1.5rem;
}

.w-7 {
    width: 1.75rem;
}

.h-7 {
    height: 1.75rem;
}

.w-8 {
    width: 2rem;
}

.h-8 {
    height: 2rem;
}

/*TABS*/
.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: var(--orange) !important;
    color: white !important;
}

.nav-fill .nav-item .nav-link,
.nav-justified .nav-item .nav-link {
    background-color: var(--gray);
}

/*TEXT*/
.text-xsmall {
    font-size: 11px !important;
}

.text-xnormal {
    font-size: 14px !important;
}

.text-xsnormal {
    font-size: 12px !important;
}
  .text-xxsnormal {
        font-size: 16px !important;
    }

.break-word {
    word-break: break-word;
}

.spinner-reload-portal {
    width: 11.2px;
    height: 11.2px;
    border-radius: 11.2px;
    box-shadow: 28px 0px 0 0 rgb(255, 90, 0, 0.2), 22.7px 16.5px 0 0 rgb(255, 90, 0, 0.4), 8.68px 26.6px 0 0 rgb(255, 90, 0, 0.6), -8.68px 26.6px 0 0 rgb(255, 90, 0, 0.8), -22.7px 16.5px 0 0 var(--orange);
    animation: spinner-b87k6z 1s infinite linear;
}

/*TOAST*/
.toast-custom.toast-check_success {
    background-color: #BBF7D1 !important;
    border-radius: 10px !important;
    color: #000 !important;
    opacity: 1 !important;
}

.toast-custom.toast-check_success .toast-close-button {
    color: #000 !important;
    /* transform: translateY(50%) !important; */
}

.toast-custom.toast-check_success .toast-message {
    line-height: 1.2 !important;
}

#toast-container>.toast-custom.toast-check_success.toast-success {
    background-image: url('../img/miportal/icon/check-circle.png') !important;
}

@media (min-width: 241px) and (max-width: 480px) {
    #toast-container>.toast-custom.toast-check_success.toast-success {
        min-width: 22em;
    }
}

@keyframes spinner-b87k6z {
    to {
        transform: rotate(360deg);
    }
}

@media (min-width: 768px) {
    .navbar-nav {
        /* z-index: 44 */
    }

    .overflow-sm-auto {
        overflow: auto;
    }

    .overlay-sidebar {
        display: none;
    }

    .translate-sm-x-0 {
        --tw-translate-x: 0px;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .main-panel {
        /* position: relative; */
        /* float: right; */
        /* width: calc(100% - 260px); */
        /* padding-left: 2rem; */
    }

    .navbar-expand-md .navbar-toggler {
        display: block;
    }

    .mt-md-6 {
        margin-top: 4rem;
    }

    .mt-md-n6 {
        margin-top: -4rem;
    }

    .dropdown-notification {
        width: 28rem;
    }

    .dropdown-notification .h-resp {
        max-height: calc(100% - 10rem);
    }

}

@media (min-width: 992px) {
    .people {
        bottom: -100px;
        left: -40px;
        z-index: 2;
        width: 300px;
    }

    .circle-3::before {
        position: absolute;
        content: "";
        width: 895px;
        height: 895px;
        left: -94px;
        top: -184px;
        background: url(../img/miportal/circle.webp), linear-gradient(230.75deg, rgba(237, 237, 237, 0.02) 15.24%, rgba(58, 63, 71, 0) 77.46%) !important;
        backdrop-filter: blur(66.581px);
        /* Note: backdrop-filter has minimal browser support */
        transform: rotate(90deg);
        border-radius: 999px;
        z-index: -1;
    }

    .h-card_login {
        min-height: 680px;
    }

    .content-business_wrapper {
        position: absolute;
        top: 0;
        right: 0;
        width: 600px;
    }

    .content-business_wrapper .h-resp {
        height: 100%;
    }

    .content-business_wrapper .h-resp.h-modal {
        min-height: 400px;
    }

    .box-content_wraper,
    .box-subcontent_wraper {
        height: 775px;
    }

    .box-content_wraper .h-resp,
    .box-subcontent_wraper .h-resp {
        height: 100%;
    }

    /*TEXT*/
  .text-xxsmall {
        font-size: 10px !important;
    }

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

    .text-normal,
    .text-xnormal {
        font-size: 16px !important;
    }

    .text-xsnormal {
        font-size: 14px !important;
    }

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


    /*TOAST*/
    #toast-container>div.toast-custom.toast-check_success {
        min-width: 400px !important;
    }
}

@media (min-width: 1024px) {
    .navbar-nav {
        z-index: 44
    }

    .main-panel {
        position: relative;
        float: right;
        width: calc(100% - 260px);
    }

    .translate-lg-x-0 {
        --tw-translate-x: 0px;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    }

    .navbar-expand-md .navbar-toggler {
        display: none;
    }
}

@media (min-width: 1300px) {
    .circle-3::before {
        width: 1195px;
        height: 1195px;
        left: -184px;
        top: -274px;
    }

    .text-normal {
        font-size: 20px !important;
    }

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

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