/* Alpine.js x-cloak */
[x-cloak] {
    display: none !important;
}

@media (min-width: 1180px) {
    .col-custom-large {
        flex: 0 0 auto;
        width: 30%;
        /* Example: Custom column width for this breakpoint */
    }

    .col-custom-large-2 {
        flex: 0 0 auto;
        width: 50%;
    }

    .col-custom-large-3 {
        flex: 0 0 auto;
        width: 70%;
    }

    .col-custom-large-not-c {
        flex: 0 0 auto;
        width: 70%;
    }
}

@media (max-width: 1289px) {
    .col-custom-large-4 {
        flex: 0 0 auto;
        width: 100%;
    }

    .font-size-custom {
        font-size: 0.875rem !important;
    }

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

.button-icon {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 10px;
}

.hide {
    opacity: 0 !important;
    visibility: hidden !important;
    transition:
        opacity 0.5s ease,
        visibility 0.5s ease;
}

.hide-block {
    display: none;
}

.text-profit,
.text-money-C {
    color: #2c48d8;
}

.text-loss,
.text-money-D {
    color: red;
}

.text-money-X {
    --ct-text-opacity: 1;
    color: rgba(var(--ct-primary-rgb), var(--ct-text-opacity)) !important;
    font-weight: normal;
}

.dHead .text-dark {
    color: unset !important;
}

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

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #727cf5 !important;
}

.ui-datepicker {
    z-index: 99999 !important;
}

.colored-toast.swal2-icon-success {
    background-color: #a5dc86 !important;
}

.colored-toast.swal2-icon-error {
    background-color: #f27474 !important;
}

.colored-toast.swal2-icon-warning {
    background-color: #f8bb86 !important;
}

.colored-toast.swal2-icon-info {
    background-color: #3fc3ee !important;
}

.colored-toast.swal2-icon-question {
    background-color: #87adbd !important;
}

.colored-toast .swal2-title {
    color: white;
}

.colored-toast .swal2-close {
    color: white;
}

.colored-toast .swal2-html-container {
    color: white;
}

.etc {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 100%;
    display: block;
}

.button-form {
    margin-top: 5px;
}

.autocomplete {
    position: absolute;
    background: white;
    width: 100%;
    list-style: none;
    display: flex;
    flex-direction: column;
    z-index: 100;
    left: 0;
    right: 0;
    padding-left: 0;
    max-height: 150px;
    overflow-y: auto;
    border-radius: 0 0 4px 4px;
    border-bottom: 1px solid #d2d2d2;
    border-top: none;
}

/* Solução final - forçar z-index alto para modais do autocomplete */
.autocomplete-modal {
    z-index: 99999 !important;
}

.autocomplete-modal + .modal-backdrop {
    z-index: 99998 !important;
}

/* Autocomplete dentro de qualquer modal */
.modal .autocomplete {
    z-index: 99999 !important;
}

/* Garantir que modais aninhados apareçam corretamente */
.modal .modal {
    z-index: 99999 !important;
}

.modal .modal + .modal-backdrop {
    z-index: 99998 !important;
}

.autocomplete .list-item {
    border-bottom: 1px solid #d2d2d2;
    border-right: 1px solid #d2d2d2;
    border-left: 1px solid #d2d2d2;
    padding: 8px;
    cursor: pointer;
}

.autocomplete .list-item:hover,
.autocomplete .list-item.active {
    background-color: #f1f1f1;
}

.autocomplete .list-item:last-child {
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

div[id*="item-"].child span:first-of-type {
    padding-left: 16px;
}

div[id*="item-"].child span:has([class*="btn-soft-danger"]),
div[id*="item-"].child span:has([class*="btn-soft-success"]) {
    padding-left: 0 !important;
}

div[id*="item-"] .remover-padding-left-X span:first-of-type {
    padding-left: 0 !important;
}

.child .aImage:not([class*="text-danger"]) {
    display: none !important;
}

.ganho-banner {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, #0acf97 60%, #029269 100%) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 1.1rem !important;
    display: flex;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 24px !important;
    border-radius: 12px 12px 0 0 !important;
    z-index: 10 !important;
    box-shadow: 0 2px 8px #2ecc7133 !important;
    animation: fadeInDown 0.5s !important;
}

.perda-banner {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, #fa5c7c 60%, #a1263e 100%) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 1.1rem !important;
    display: flex;
    flex-direction: column !important;
    align-items: start !important;
    justify-content: space-between !important;
    padding: 10px 24px !important;
    border-radius: 12px 12px 0 0 !important;
    z-index: 11 !important;
    box-shadow: 0 2px 8px #f4433633 !important;
    animation: fadeInDown 0.5s !important;
}

.standby-banner {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, #450acf 60%, #8365ca 100%) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 1.1rem !important;
    display: flex;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 24px !important;
    border-radius: 12px 12px 0 0 !important;
    z-index: 11 !important;
    box-shadow: 0 2px 8px #f4433633 !important;
    animation: fadeInDown 0.5s !important;
}

.inativo-banner {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, #cf0a0a 60%, #b21d1d 100%) !important;
    color: #fff !important;
    font-weight: bold !important;
    font-size: 1.1rem !important;
    display: flex;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 24px !important;
    border-radius: 12px 12px 0 0 !important;
    z-index: 11 !important;
    box-shadow: 0 2px 8px #f4433633 !important;
    animation: fadeInDown 0.5s !important;
}

.atencao-banner {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    background: linear-gradient(90deg, #ffee00 60%, #ffee00 100%) !important;
    color: #555555 !important;
    font-weight: bold !important;
    display: flex;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: start !important;
    padding: 10px 24px !important;
    z-index: 11 !important;
    box-shadow: 0 2px 8px #f4433633 !important;
    animation: fadeInDown 0.5s !important;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.btn-close-banner {
    background: transparent;
    border: none;
    color: #fff;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.7;
    margin-left: 12px;
}

.btn-close-banner:hover {
    opacity: 1;
}

.modal-blur {
    filter: blur(4px) grayscale(0.2);
    opacity: 0.6;
    pointer-events: none;
    transition:
        filter 0.2s,
        opacity 0.2s;
}

.modal-backdrop.duplo-backdrop {
    opacity: 0.92 !important;
    background-color: #000 !important;
    z-index: 1050 !important;
}

#modalPreviewAnexo,
#modalPreviewAnexo.modal.show {
    z-index: 1070 !important;
    /* maior que o backdrop e maior que o padrão do Bootstrap */
}

.fc-list .fc-list-event-dot {
    display: none !important;
}

.fc-list .fc-event-title {
    margin-right: 0;
    margin-left: 8px;
}

.custom-dot {
    min-width: 15px;
    min-height: 15px;
}

.porcentagem::after {
    content: " %";
}

.btn-round {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-new-round {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.contrato-status-C {
    display: none !important;
}

.contrato-status-A {
    display: none !important;
}
.contrato-status-G {
    display: none !important;
}
.contrato-status-P {
    display: none !important;
}
.contrato-status-R {
    display: none !important;
}
.contrato-status-V {
    display: none !important;
}
.contrato-status-E {
    display: none !important;
}
.contrato-text-status-C {
    color: red !important;
}

.contrato-text-status-A {
    color: green !important;
}

.contrato-text-status-G {
    color: #075eff !important;
}

.contrato-text-status-P {
    color: #ff0000 !important;
}

.contrato-text-status-V {
    color: #ffc35a !important;
}
.contrato-text-status-E {
    color: #ff0000 !important;
}

.scrollbar-custom::-webkit-scrollbar {
    width: 6px;
    height: 8px;
    visibility: hidden;
}

.scrollbar-custom:hover::-webkit-scrollbar {
    background-color: transparent;
    border-radius: 4px;
    visibility: visible;
}

.scrollbar-custom:hover::-webkit-scrollbar-thumb {
    background: #e9e9e9;
    border-radius: 10px;
    cursor: grab;
}

.btn-secondary {
    opacity: 0.75 !important;
}

.error {
    color: #f13232;
}

label.error {
    position: absolute;
    max-width: 320px;
}

.swal2-container {
    z-index: 99999 !important;
}

@media (max-width: 1200px) {
    label.error {
        position: relative;
        max-width: 100%;
    }
}

/* Notificação */

.notification-wrapper {
    position: relative;
    display: inline-block;
    overflow: visible;
}

.popover-box {
    position: absolute;
    right: 0;
    top: 120%;
    width: 450px;
    z-index: 1000;
    border: 1px solid #dee2e6;
    overflow-y: auto;
}

.notification-badge {
    position: absolute !important;
    top: -4px !important;
    /* ajuste vertical */
    left: 13px !important;
    /* ajuste horizontal */
    font-size: 0.7rem;
    padding: 4px 6px;
}

.etcAlp {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    min-width: 0;
    line-clamp: 3;
    max-height: 50px;
}

.hover-notificacao {
    border: 1px solid #f4f4f4;
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 20px !important;
    padding-bottom: 20px !important;
    transition: all 0.3s ease;
}

.hover-notificacao:hover {
    background-color: var(--ct-tertiary-bg) !important;
}

.see-all {
    border: 1px solid #f4f4f4;
    padding-left: 0px !important;
    padding-right: 0px !important;
    transition: all 0.3s ease;
    background-color: white;
}

.see-all:hover {
    background-color: var(--ct-tertiary-bg) !important;
}

.flip-icon {
    transform: rotate(180deg);
}

.light-hover {
    transition: color 0.1s ease-in-out;
    padding: 6px;
    color: #888080 !important;
    border-radius: 4px;
    cursor: pointer;
}

.mark-read-all {
    transition: color 0.1s ease-in-out;
    padding: 6px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888080;
    border-radius: 4px;
}

.light-hover:hover,
.mark-read-all:hover {
    color: #484848 !important;
    background-color: #f4f4f4 !important;
}

.close-icon {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 1.2rem;
    cursor: pointer;
    color: #6c757d;
}

.close-icon:hover {
    color: #000;
}

@media (max-width: 576px) {
    .popover-box {
        position: fixed !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        border-radius: 0 !important;
        z-index: 1050 !important;
        padding: 1rem;
        overflow-y: auto;
    }
}

.notification-overlay {
    transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.notification-overlay.show {
    opacity: 1;
}

.notification-overlay.hide {
    opacity: 0;
}

.notification-popover {
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: top right;
}

.notification-popover.show {
    transform: translateX(0) scale(1);
    opacity: 1;
}

.notification-popover.hide {
    transform: translateX(100%) scale(0.8);
    opacity: 0;
}

.notifications-scrollable {
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 5px;
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-top: -10px;
}

.notifications-scrollable::-webkit-scrollbar {
    width: 6px;
}

.notifications-scrollable::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.notifications-scrollable::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    border-radius: 3px;
}

.notifications-scrollable::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Para Firefox */
.notifications-scrollable {
    scrollbar-width: thin;
    scrollbar-color: #c1c1c1 #f1f1f1;
}

/* Notificação - Fim */

/* Feedback */

.tooltip {
    z-index: 10070 !important;
}

/* Feedback - Fim */

/* Highlight do incfFire */

@keyframes fade-highlight {
    0% {
        box-shadow: 0 0 0 3px rgba(174, 218, 190, 0.7);
        /* verde */
        opacity: 0;
    }

    5% {
        opacity: 0.5;
    }

    90% {
        opacity: 1;
    }

    100% {
        box-shadow: none;
        opacity: 1;
    }
}

.flash-highlight {
    animation: fade-highlight 3.5s;
}

/* Highlight do incfFire - Fim */

/* app content */

.content > * {
    display: none;
}

.content > :first-child {
    display: block;
}

/* app content - Fim */

.hover-bloco {
    cursor: pointer;
    transition: color 0.2s ease;
}

.hover-bloco:hover {
    color: #525151;
}

.mce-checklist {
    list-style-type: none;
}

.mce-checklist li {
    margin: 0.25em 0;
}

.mce-checklist li > input[type="checkbox"] {
    padding-left: 5px;
}

.mce-checklist-item::before {
    content: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-unchecked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2215%22%20height%3D%2215%22%20x%3D%22.5%22%20y%3D%22.5%22%20fill-rule%3D%22nonzero%22%20stroke%3D%22%234C4C4C%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A");
    cursor: pointer;
    height: 1em;
    margin-left: -1.5em;
    margin-top: 0.125em;
    position: absolute;
    width: 1em;
}

.mce-checklist-item.checked::before {
    content: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cg%20id%3D%22checklist-checked%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Crect%20id%3D%22Rectangle%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22%234099FF%22%20fill-rule%3D%22nonzero%22%20rx%3D%222%22%2F%3E%3Cpath%20id%3D%22Path%22%20fill%3D%22%23FFF%22%20fill-rule%3D%22nonzero%22%20d%3D%22M11.5703186%2C3.14417309%20C11.8516238%2C2.73724603%2012.4164781%2C2.62829933%2012.83558%2C2.89774797%20C13.260121%2C3.17069355%2013.3759736%2C3.72932262%2013.0909105%2C4.14168582%20L7.7580587%2C11.8560195%20C7.43776896%2C12.3193404%206.76483983%2C12.3852142%206.35607322%2C11.9948725%20L3.02491697%2C8.8138662%20C2.66090143%2C8.46625845%202.65798871%2C7.89594698%203.01850234%2C7.54483354%20C3.373942%2C7.19866177%203.94940006%2C7.19592841%204.30829608%2C7.5386474%20L6.85276923%2C9.9684299%20L11.5703186%2C3.14417309%20Z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E%0A");
}