﻿.avatar-img-initials {
    background: var(--dark);
    border-radius: 50%;
    padding: 5px 10px;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gray);
    font-size: 67.5px;
    width: 180px;
    height: 180px;
}

    .avatar-img-initials.small {
        font-size: 12px;
        width: 32px;
        height: 32px;
    }

.btn-primary {
    background-color: #4796e3;
}

.btn-default {
    background-color: #5d96d0;
    color: #fff !important;
}

    .btn-default:hover {
        background-color: #467db4 !important;
        color: #fff !important;
    }

.btn-navigate {
    background: #f4f5f8 !important;
    border-color: #e2e5ec !important;
    border-radius: 3px !important;
    color: #595d6e !important;
    padding: 8px;
}

.btn.m-btn--hover-brand:focus {
    background-color: var(--bg-info) !important;
    border-color: var(--bg-info) !important;
}

.btn.m-btn--hover-brand:hover {
    background-color: var(--bg-info) !important;
    border-color: var(--bg-info) !important;
}

.bg-btn-info {
    background-color: var(--bg-info) !important;
    border-color: var(--bg-info) !important;
    color: #fff !important;
}

.bg-btn-info-h:hover {
    background-color: var(--bg-info) !important;
    border-color: var(--bg-info) !important;
    color: #fff !important;
}

.bg-btn-info-transparent {
    background-color: var(--bg-info-transparent);
    border-color: var(--bg-info-transparent);
    color: #000 !important;
}

.bg-badge-info {
    background-color: var(--bg-info-transparent) !important;
    color: var(--bg-info) !important;
    font-weight: 700;
    padding: .45rem .8rem;
    white-space: nowrap;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
}

.bg-btn-navigate {
    background-color: var(--bg-navigate) !important;
    border-color: var(--bg-navigate) !important;
    color: #fff !important;
}

.bg-btn-navigate-h:hover {
    background-color: var(--bg-navigate) !important;
    border-color: var(--bg-navigate) !important;
    color: #fff !important;
}

.bg-btn-navigate-transparent {
    background-color: var(--bg-navigate-transparent);
    border-color: var(--bg-navigate-transparent);
    color: #000 !important;
}

.bg-badge-navigate {
    background-color: var(--bg-navigate-transparent);
    color: var(--bg-navigate);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-badge-action-yellow {
    background-color: var(--bg-yellow-transparent);
    color: var(--bg-yellow);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-badge-action-red {
    background-color: var(--bg-red-transparent);
    color: var(--bg-red);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-badge-action-blue {
    background-color: var(--bg-blue-transparent);
    color: var(--bg-blue);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-badge-action-grey {
    background-color: var(--bg-grey-transparent);
    color: var(--bg-grey);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-badge-action-green {
    background-color: var(--bg-green-transparent);
    color: var(--bg-green);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-btn-export {
    background-color: var(--bg-export) !important;
    border-color: var(--bg-export) !important;
    color: #fff !important;
}

.bg-btn-export-h:hover {
    background-color: var(--bg-export) !important;
    border-color: var(--bg-export) !important;
    color: #fff !important;
}

.bg-btn-export-transparent {
    background-color: var(--bg-export-transparent);
    border-color: var(--bg-export-transparent);
    color: #000 !important;
}

.bg-badge-export {
    background-color: var(--bg-export-transparent);
    color: var(--bg-export);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-btn-warning {
    background-color: var(--bg-warning) !important;
    border-color: var(--bg-warning) !important;
    color: #fff !important;
}

.bg-btn-warning-h:hover {
    background-color: var(--bg-warning) !important;
    border-color: var(--bg-warning) !important;
    color: #fff !important;
}

.bg-btn-warning-transparent {
    background-color: var(--bg-warning-transparent);
    border-color: var(--bg-warning-transparent);
    color: #000 !important;
}

.bg-badge-warning {
    background-color: var(--bg-warning-transparent);
    color: var(--bg-warning);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-btn-danger {
    background-color: #D11818 !important;
    border-color: #D11818 !important;
    color: #fff !important;
}

.bg-btn-danger-h:hover {
    background-color: var(--bg-danger) !important;
    border-color: var(--bg-danger) !important;
    color: #fff !important;
}

.bg-btn-danger-transparent {
    background-color: var(--bg-danger-transparent);
    border-color: var(--bg-danger-transparent);
    color: #000 !important;
}

.bg-badge-danger {
    background-color: var(--bg-danger-transparent);
    color: var(--bg-danger);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

.bg-btn-success {
    background-color: #00C794 !important;
    border-color: #00C794 !important;
    color: #fff !important
}

.bg-btn-success-h:hover {
    background-color: var(--bg-success) !important;
    border-color: var(--bg-success) !important;
    color: #fff !important;
}

.bg-btn-success-transparent {
    background-color: var(--bg-success-transparent);
    border-color: var(--bg-success-transparent);
    color: #000 !important;
}

.bg-badge-success {
    background-color: var(--bg-success-transparent);
    color: var(--bg-success);
    font-weight: 700;
    padding: .45rem .8rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem;
    white-space: nowrap;
}

input:checked + .slider {
    background-color: var(--bg-info) !important;
}

.alert {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    color: #6C757D !important;
    box-sizing: border-box;
    position: relative;
    font-size: 13px !important;
}

    .alert.card {
        align-items: flex-start;
    }

        .alert.card .card-body {
            padding: 0;
        }

            .alert.card .card-body .card-title {
                margin: 3px 0px 0px;
            }

            .alert.card .card-body .collapse {
                margin-top: 5px;
            }

    .alert::before {
        box-sizing: border-box;
        display: inline-block;
        background-size: 20px;
        width: 20px;
        height: 20px;
        content: "";
        min-width: 20px;
        min-height: 20px;
    }

.alert-info::before {
    background-image: url("/assets/images/app/alert-icons/info-novo.svg");
}

.alert.alert-info {
    background-color: #D6ECF4;
    border: 1px solid #42BBE8;
}

.alert-danger::before {
    background-image: url("/assets/images/app/alert-icons/warning-vermelho.svg");
}

.alert.alert-danger {
    background-color: #FEE2E7;
    border: 1px solid #D11818;
}

.alert.alert-guardrail::before {
    -webkit-mask: url("/assets/images/app/alert-icons/shield-exclamation.svg") no-repeat;
    background-color: #D11818;
    height: 24px;
    width: 24px;
}

.alert.alert-guardrail {
    background-color: #FEE2E7;
    border: 1px solid #D11818;
}

.icone-guardrail {
    -webkit-mask: url("/assets/images/app/alert-icons/shield-exclamation.svg") no-repeat;
    background-color: #D11818;
    height: 25px;
    width: 25px;
}

.alert.alert-guardrail > .card-body {
    display: flex;
    justify-content: start;
    align-items: center;
}

.content-none.alert::before {
    content: none;
}

.alert-warning::before {
    background-image: url("/assets/images/app/alert-icons/warning-novo.svg");
}

.alert.alert-warning {
    background-color: #FDF1D0;
    border: 1px solid #FFBA5C;
}


.alert-success::before {
    background-image: url("/assets/images/app/alert-icons/success.svg");
}

.alert.alert-success {
    background: rgba(119, 211, 83, 0.23);
    border: 1px solid #77D353;
}



.clr-danger {
    color: var(--bg-danger) !important;
}

.font-success {
    color: var(--bg-success) !important;
}

.font-info {
    color: var(--bg-info) !important;
}

.font-danger {
    color: var(--bg-danger) !important;
}

.page-item.active .page-link {
    z-index: 3;
    color: #fff;
    background-color: var(--bg-success);
    border-color: var(--bg-success);
}

.importantSpanTag {
    color: darkred !important;
}

.jexcel_content {
    z-index: 0 !important;
}

.circulo-icone {
    font-size: 45px !important;
    padding: 5px;
    margin-top: 20px;
    text-align: center;
    color: #D83A3A;
    width: 65px;
    height: 65px;
    border-width: 3px;
    border-color: #D83A3A;
    border-style: solid;
    display: inline-block;
    border-radius: 50%;
}

.h-85 {
    height: 85% !important;
}

/* ===============CUSTOMIZACAO ARKER=============== */
.arker-titulo-pagina {
    display: flex;
    gap: 8px;
    align-items: center;
}

    .arker-titulo-pagina i {
        font-size: 20px;
        color: #6C757D;
    }

/* ===BOTOES=============== */
:root {
    --arker-disabled-dark: #b8b5b6;
    --arker-disabled-border-dark: #e9e4e4;
    --arker-dark-background: #535c68;
    --arker-text-dark: #fefefe;
    --arker-blue: #0B99C9;
    --arker-blue-hover: #0987b1;
    --arker-blue-hover-border: #087397;
    --arker-blue-active: #087397;
    --arker-blue-active-border: #066180;
    --arker-blue-disabled: #75C3E4;
    --arker-blue-focus-border: #A4D3E7;
    --arker-blue-text: #066180;
    --arker-blue-outline: #B9E2F0;
    --arker-blue-dark: #74d4f4;
    --arker-blue-dark-hover: #13a2d1;
    --arker-blue-dark-text: #89cde3;
    --arker-red: #d11818;
    --arker-red-hover: #be1515;
    --arker-red-hover-border: #c11717;
    --arker-red-active: #8b1111;
    --arker-red-active-border: #b51515;
    --arker-red-disabled: #eb8d96;
    --arker-red-focus-border: #eca4a9;
    --arker-red-text: #d11818;
    --arker-red-outline: #f2bdbd;
    --arker-red-dark: #fa7272;
    --arker-red-dark-hover: #f63737;
    --arker-red-dark-text: #fa7272;
    --arker-download-background: #f4f5f8;
    --arker-download-focus-border: #90e3ce;
    --arker-download-focus-background: #f4f5f8;
    --arker-neutral-border: #e2e5ec;
    --arker-neutral-focus-border: #6c757d;
    --arker-neutral-focus-background: #f4f5f8;
    --arker-green: #05af7f;
    --arker-green-hover: #05af7f;
    --arker-green-hover-border: #009e76;
    --arker-green-active: #009e76;
    --arker-green-active-border: #069c76;
    --arker-green-disabled: #66ddbe;
    --arker-green-focus-border: #90e3ce;
    --arker-green-text: #069c76;
    --arker-green-outline: #90e3ce;
    --arker-green-dark-hover: #009e76;
    --arker-orange: #e2713f;
    --arker-orange-hover: #db612b;
    --arker-orange-hover-border: #df6f3d;
    --arker-orange-active: #bb5629;
    --arker-orange-active-border: #db612b;
    --arker-orange-disabled: #fc9568;
    --arker-orange-focus-border: #f6bea4;
    --arker-orange-text: #bb5629;
    --arker-orange-outline: #f6bea4;
    --arker-gray: #595d6e;
    --arker-gray-hover: #4c5060;
    --arker-gray-hover-border: #595d6e;
    --arker-gray-active: #393b47;
    --arker-gray-active-border: #4c4f5e;
    --arker-gray-disabled: #cfd2dc;
    --arker-gray-focus-border: #e2e6e8;
    --arker-gray-text: #393b47;
    --arker-gray-outline: #e2e6e8;
    --arker-secondary: #0b99c9;
    --arker-terciary: #e2e5ec;
    --arker-outline: #EFEFEF;
    --arker-outline-border: #CCCCCC;
    --bg-info: #0099cc;
    --bg-info-transparent: #0099cc1a;
    --bg-navigate: #4a6394c7;
    --bg-navigate-transparent: #4a63941a;
    --bg-export: #009966;
    --bg-export-transparent: #0099661a;
    --bg-warning: #ff6633;
    --bg-warning-transparent: #ff66331a;
    --bg-danger: #ac4545;
    --bg-danger-transparent: #ac45451a;
    --bg-success: #00c794;
    --bg-success-transparent: #00c7941a;
    --bg-yellow: #ffbc00;
    --bg-yellow-transparent: #ffbc001a;
    --bg-red: #DB2E58;
    --bg-red-transparent: #DB2E581a;
    --bg-blue: #39afd1;
    --bg-blue-transparent: #39afd11a;
    --bg-grey: #A7A6A7;
    --bg-grey-transparent: #A7A6A71a;
    --bg-green: #0acf97;
    --bg-green-transparent: #0acf971a;
    --bg-background-tags: #55B4DD;
    --bg-background-tags-remove: #E6717C;
    --bg-background-tag-cross-hover: #A6313C;
    --input-placeholder: #B7BEC6;
    --text-color-light: #6C757D;
    --arker-dd-icon-size: 20px;
    --arker-dd-icon-right: 12px;
}

.arker-button {
    min-width: 42px;
    color: #ffffff;
    transition: background-color 0.2s ease-in-out;
    text-align: center;
    border-radius: 8px;
    padding: 8px 16px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    height: 38px;
    font-size: .9rem;
    white-space: nowrap;
}

    .arker-button.p-small {
        padding: 8px 4px;
    }

    .arker-button.p-medium {
        padding: 8px 12px;
    }

    .arker-button.p-large {
        padding: 8px 36px;
    }

    .arker-button.h-small {
        height: 30px;
    }

    .arker-button.h-medium {
        height: 34px;
    }

    .arker-button.h-large {
        height: 38px;
    }


    /*LINK*/
    .arker-button.link, .arker-button.link-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: transparent !important;
        border: none !important;
        text-decoration: underline;
        width: auto !important;
    }

    .arker-button span {
        font-size: 13px;
        font-family: "Nunito", san-serif;
        line-height: 20px;
        font-weight: 600;
        text-overflow: ellipsis;
        white-space: nowrap;
        display: block;
        max-width: 150px;
        overflow: hidden;
    }

    .arker-button:disabled {
        pointer-events: none;
        cursor: not-allowed;
    }

    .arker-button.icon {
        min-width: 40px;
    }

        .arker-button.icon i, .arker-button.icon span {
            font-size: 16px;
        }
    /*
    .arker-button .arker-button-icon {
        width: 18px;
        height: 18px;
    }
*/


    /* ===AZUL=== */
    .arker-button.blue {
        background-color: var(--arker-blue);
        border: 1px solid var(--arker-blue);
    }

        .arker-button.blue:hover,
        .arker-button.blue.hover {
            background-color: var(--arker-blue-hover);
            border-color: var(--arker-blue-hover-border);
        }

        .arker-button.blue:active,
        .arker-button.blue.active {
            background-color: var(--arker-blue-active);
            border-color: var(--arker-blue-active-border);
        }

        .arker-button.blue:focus,
        .arker-button.blue.focus {
            background-color: var(--arker-blue-active);
            outline: 3px solid var(--arker-blue-focus-border);
        }

        .arker-button.blue:disabled,
        .arker-button.blue.disabled {
            background-color: var(--arker-blue-disabled);
            border-color: var(--arker-blue-disabled);
        }

    .arker-button.blue-outlined {
        background-color: transparent;
        border: 1px solid var(--arker-blue);
        color: var(--arker-blue);
    }

        .arker-button.blue-outlined:hover,
        .arker-button.blue-outlined.hover {
            background-color: var(--arker-blue-outline);
            border-color: #087397;
        }

        .arker-button.blue-outlined:active,
        .arker-button.blue-outlined.active {
            color: var(--arker-blue-text);
            background-color: var(--arker-blue-outline);
            border-color: var(--arker-blue-active-border);
        }

        .arker-button.blue-outlined:focus,
        .arker-button.blue-outlined.focus {
            border-color: var(--arker-blue-active-border);
            outline: 3px solid var(--arker-blue-focus-border);
        }

        .arker-button.blue-outlined:disabled,
        .arker-button.blue-outlined.disabled {
            color: var(--arker-outline-border);
            background-color: var(--arker-outline);
            border-color: var(--arker-outline-border);
        }

body.dark-mode .arker-button.blue-outlined:disabled, body.dark-mode .arker-button.blue-outlined.disabled {
    background-color: var(--arker-disabled-dark);
    border-color: var(--arker-disabled-border-dark);
}

.arker-button.blue.link {
    color: var(--arker-blue);
}

    .arker-button.blue.link:hover,
    .arker-button.blue.link.hover {
        color: var(--arker-blue-hover);
    }

    .arker-button.blue.link:active,
    .arker-button.blue.link.active {
        color: var(--arker-blue-text);
    }

    .arker-button.blue.link:disabled,
    .arker-button.blue.link.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }

body.dark-mode .arker-button.blue.link {
    color: var(--arker-blue-dark);
}

    body.dark-mode .arker-button.blue.link:hover,
    body.dark-mode .arker-button.blue.link.hover {
        color: var(--arker-blue-dark-hover);
    }

    body.dark-mode .arker-button.blue.link:active,
    body.dark-mode .arker-button.blue.link.active {
        color: var(--arker-blue-dark-text);
    }
/* ===FIM - AZUL=== */


/* ===VERDE=== */
.arker-button.green {
    background-color: var(--arker-green);
    border: 1px solid var(--arker-green);
}

    .arker-button.green:hover,
    .arker-button.green.hover {
        background-color: var(--arker-green-hover);
        border-color: var(--arker-green-hover-border);
    }

    .arker-button.green:active,
    .arker-button.green.active {
        background-color: var(--arker-green-active);
        border-color: var(--arker-green-active-border);
    }

    .arker-button.green:focus,
    .arker-button.green.focus {
        background-color: var(--arker-green-active);
        outline: 3px solid var(--arker-green-focus-border);
    }

    .arker-button.green:disabled,
    .arker-button.green.disabled {
        background-color: var(--arker-green-disabled);
        border-color: var(--arker-green-disabled);
    }

body.dark-mode .arker-button.green-outlined:disabled, body.dark-mode .arker-button.green-outlined.disabled {
    background-color: var(--arker-disabled-dark);
    border-color: var(--arker-disabled-border-dark);
}

.arker-button.green-outlined {
    background-color: transparent;
    border: 1px solid var(--arker-green);
    color: var(--arker-green);
}

    .arker-button.green-outlined:hover,
    .arker-button.green-outlined.hover {
        background-color: var(--arker-green-outline);
        border-color: var(--arker-green-hover);
    }

body.dark-mode .arker-button.green:hover, body.dark-mode .arker-button.green.hover {
    background-color: var(--arker-green-dark-hover);
    border-color: var(--arker-green-hover);
}

.arker-button.green-outlined:active,
.arker-button.green-outlined.active {
    color: var(--arker-green-text);
    background-color: var(--arker-green-outline);
    border-color: var(--arker-green-active-border);
}

.arker-button.green-outlined:focus,
.arker-button.green-outlined.focus {
    border-color: var(--arker-green-active-border);
    outline: 3px solid var(--arker-green-focus-border);
}

.arker-button.green-outlined:disabled,
.arker-button.green-outlined.disabled {
    color: var(--arker-outline-border);
    background-color: var(--arker-outline);
    border-color: var(--arker-outline-border);
}

.arker-button.green.link {
    color: var(--arker-green);
}

    .arker-button.green.link:hover,
    .arker-button.green.link.hover {
        color: var(--arker-green-hover);
    }

    .arker-button.green.link:active,
    .arker-button.green.link.active {
        color: var(--arker-green-text);
    }

    .arker-button.green.link:disabled,
    .arker-button.green.link.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }
/* ===FIM - VERDE=== */


/* ===DOWNLOAD=== */
.arker-button.download {
    background-color: var(--arker-download-background);
    border: 1px solid var(--arker-green);
    color: var(--arker-gray);
}

body.dark-mode .arker-button.download {
    background-color: var(--arker-dark-background);
    color: var(--arker-text-dark);
}

    .arker-button.download:hover,
    .arker-button.download.hover, body.dark-mode .arker-button.download:hover, body.dark-mode .arker-button.download.hover {
        background-color: var(--arker-blue-hover);
        border-color: var(--arker-blue-hover-border);
        color: #fff;
    }

    .arker-button.download:focus,
    .arker-button.download.focus, body.dark-mode .arker-button.download:focus, body.dark-mode .arker-button.download.focus {
        background-color: var(--arker-download-focus-background);
        outline: 3px solid var(--arker-download-focus-border);
        color: var(--arker-gray);
    }

    .arker-button.download:active,
    .arker-button.download[aria-expanded=true],
    .arker-button.download.active, body.dark-mode .arker-button.download:active,
    body.dark-mode .arker-button.download.active {
        background-color: var(--arker-blue-active);
        border-color: var(--arker-blue-active-border);
        color: #fff;
    }

    .arker-button.download:disabled,
    .arker-button.download.disabled, body.dark-mode .arker-button.download:disabled,
    body.dark-mode .arker-button.download.disabled {
        background-color: var(--arker-blue-disabled);
        border-color: var(--arker-blue-disabled);
        color: #fff;
    }

.arker-button.download ~ .dropdown-menu .dropdown-item {
    transition: all .2s ease-in-out;
    font-size: .9rem;
}

    .arker-button.download ~ .dropdown-menu .dropdown-item:hover {
        background-color: var(--arker-blue-hover);
        color: #fff;
    }
/* ===FIM - DOWNLOAD=== */

/* ===NEUTRO=== */
.arker-button.neutral {
    background-color: var(--arker-download-background);
    border: 1px solid var(--arker-neutral-border);
    color: var(--arker-gray);
}

body.dark-mode .arker-button.neutral {
    background-color: var(--arker-dark-background);
    color: var(--arker-text-dark);
}

    .arker-button.neutral:hover,
    .arker-button.neutral.hover, body.dark-mode .arker-button.neutral:hover, body.dark-mode .arker-button.neutral.hover {
        background-color: var(--arker-blue-hover);
        border-color: var(--arker-blue-hover-border);
        color: #fff;
    }

    .arker-button.neutral:focus,
    .arker-button.neutral.focus, body.dark-mode .arker-button.neutral:focus, body.dark-mode .arker-button.neutral.focus {
        background-color: var(--arker-neutral-focus-background);
        outline: 3px solid rgba(0, 0, 0, 0.10);
        color: var(--arker-gray);
    }

    .arker-button.neutral:active,
    .arker-button.neutral[aria-expanded=true],
    .arker-button.neutral.active, body.dark-mode .arker-button.neutral:active,
    body.dark-mode .arker-button.neutral.active {
        background-color: var(--arker-blue-active);
        border-color: var(--arker-blue-active-border);
        color: #fff;
    }

    .arker-button.neutral:disabled,
    .arker-button.neutral.disabled, body.dark-mode .arker-button.neutral:disabled,
    body.dark-mode .arker-button.neutral.disabled {
        background-color: var(--arker-blue-disabled);
        border-color: var(--arker-blue-disabled);
        color: #fff;
    }

.arker-button.neutral ~ .dropdown-menu .dropdown-item,
.arker-dropdown ~ .dropdown-menu .dropdown-item {
    transition: all .2s ease-in-out;
    font-size: .9rem;
}

    .arker-button.neutral ~ .dropdown-menu .dropdown-item:hover,
    .arker-dropdown ~ .dropdown-menu .dropdown-item:hover {
        background-color: var(--arker-blue-hover);
        color: #fff;
    }

.arker-button.neutral.link:hover {
    color: var(--arker-dark-background);
}
/* ===FIM - NEUTRO=== */


/* ===VERMELHO=== */
.arker-button.red {
    background-color: var(--arker-red);
    border: 1px solid var(--arker-red);
}

    .arker-button.red:hover,
    .arker-button.red.hover {
        background-color: var(--arker-red-hover);
        border-color: var(--arker-red-hover-border);
    }

    .arker-button.red:active,
    .arker-button.red.active {
        background-color: var(--arker-red-active);
        border-color: var(--arker-red-active-border);
    }

    .arker-button.red:focus,
    .arker-button.red.focus {
        background-color: var(--arker-red-active);
        outline: 3px solid var(--arker-red-focus-border);
    }

    .arker-button.red:disabled,
    .arker-button.red.disabled {
        background-color: var(--arker-red-disabled);
        border-color: var(--arker-red-disabled);
    }

.arker-button.red-outlined {
    background-color: transparent;
    border: 1px solid var(--arker-red);
    color: var(--arker-red);
}

    .arker-button.red-outlined:hover,
    .arker-button.red-outlined.hover {
        background-color: var(--arker-red-outline);
        border-color: #d11818;
    }

    .arker-button.red-outlined:active,
    .arker-button.red-outlined.active {
        color: var(--arker-red-text);
        background-color: var(--arker-red-outline);
        border-color: var(--arker-red-active-border);
    }

    .arker-button.red-outlined:focus,
    .arker-button.red-outlined.focus {
        border-color: var(--arker-red-active-border);
        outline: 3px solid var(--arker-red-focus-border);
    }

    .arker-button.red-outlined:disabled,
    .arker-button.red-outlined.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }

body.dark-mode .arker-button.red-outlined:disabled, body.dark-mode .arker-button.red-outlined.disabled {
    background-color: var(--arker-disabled-dark);
    border-color: var(--arker-disabled-border-dark);
}

.arker-button.red.link {
    color: var(--arker-red);
}

    .arker-button.red.link:hover,
    .arker-button.red.link.hover {
        color: var(--arker-red-hover);
    }

    .arker-button.red.link:active,
    .arker-button.red.link.active {
        color: var(--arker-red-text);
    }

    .arker-button.red.link:disabled,
    .arker-button.red.link.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }

body.dark-mode .arker-button.red.link {
    color: var(--arker-red-dark);
}

    body.dark-mode .arker-button.red.link:hover,
    body.dark-mode .arker-button.red.link.hover {
        color: var(--arker-red-dark-hover);
    }

    body.dark-mode .arker-button.red.link:active,
    body.dark-mode .arker-button.red.link.active {
        color: var(--arker-red-dark-text);
    }
/* ===FIM - VERMELHO=== */


/* ===LARANJA=== */
.arker-button.orange {
    background-color: var(--arker-orange);
    border: 1px solid var(--arker-orange);
}

    .arker-button.orange:hover,
    .arker-button.orange.hover {
        background-color: var(--arker-orange-hover);
        border-color: var(--arker-orange-hover-border);
    }

    .arker-button.orange:active,
    .arker-button.orange.active {
        background-color: var(--arker-orange-active);
        border-color: var(--arker-orange-active-border);
    }

    .arker-button.orange:focus,
    .arker-button.orange.focus {
        background-color: var(--arker-orange-active);
        outline: 3px solid var(--arker-orange-focus-border);
    }

    .arker-button.orange:disabled,
    .arker-button.orange.disabled {
        background-color: var(--arker-orange-disabled);
        border-color: var(--arker-orange-disabled);
    }

.arker-button.orange-outlined {
    background-color: transparent;
    border: 1px solid var(--arker-orange);
    color: var(--arker-orange);
}

    .arker-button.orange-outlined:hover,
    .arker-button.orange-outlined.hover {
        background-color: var(--arker-orange-outline);
        border-color: var(--arker-orange-hover);
    }

    .arker-button.orange-outlined:active,
    .arker-button.orange-outlined.active {
        color: var(--arker-orange-text);
        background-color: var(--arker-orange-outline);
        border-color: var(--arker-orange-active-border);
    }

    .arker-button.orange-outlined:focus,
    .arker-button.orange-outlined.focus {
        border-color: var(--arker-orange-active-border);
        outline: 3px solid var(--arker-orange-focus-border);
    }

    .arker-button.orange-outlined:disabled,
    .arker-button.orange-outlined.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }

body.dark-mode .arker-button.orange-outlined:disabled, body.dark-mode .arker-button.orange-outlined.disabled {
    background-color: var(--arker-disabled-dark);
    border-color: var(--arker-disabled-border-dark);
}

.arker-button.orange.link {
    color: var(--arker-orange);
}

    .arker-button.orange.link:hover,
    .arker-button.orange.link.hover {
        color: var(--arker-orange-hover);
    }

    .arker-button.orange.link:active,
    .arker-button.orange.link.active {
        color: var(--arker-orange-text);
    }

    .arker-button.orange.link:disabled,
    .arker-button.orange.link.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }
/* ===FIM - LARANJA=== */


/* ===CINZA=== */
.arker-button.gray {
    background-color: var(--arker-gray);
    border: 1px solid var(--arker-gray);
}

    .arker-button.gray:hover,
    .arker-button.gray.hover {
        background-color: var(--arker-gray-hover);
        border-color: var(--arker-gray-hover-border);
    }

    .arker-button.gray:active,
    .arker-button.gray.active {
        background-color: var(--arker-gray-active);
        border-color: var(--arker-gray-active-border);
    }

    .arker-button.gray:focus,
    .arker-button.gray.focus {
        background-color: var(--arker-gray-active);
        outline: 3px solid var(--arker-gray-focus-border);
    }

    .arker-button.gray:disabled,
    .arker-button.gray.disabled {
        background-color: var(--arker-gray-disabled);
        border-color: var(--arker-gray-disabled);
    }

.arker-button.gray-outlined {
    background-color: transparent;
    border: 1px solid var(--arker-gray);
    color: var(--arker-gray);
}

    .arker-button.gray-outlined:hover,
    .arker-button.gray-outlined.hover {
        background-color: var(--arker-gray-outline);
        border-color: var(--arker-gray-hover);
    }

    .arker-button.gray-outlined:active,
    .arker-button.gray-outlined.active {
        color: var(--arker-gray-text);
        background-color: var(--arker-gray-outline);
        border-color: var(--arker-gray-active-border);
    }

    .arker-button.gray-outlined:focus,
    .arker-button.gray-outlined.focus {
        border-color: var(--arker-gray-active-border);
        outline: 3px solid var(--arker-gray-focus-border);
    }

    .arker-button.gray-outlined:disabled,
    .arker-button.gray-outlined.disabled {
        color: var(--arker-outline-border);
        background-color: var(--arker-outline);
        border-color: var(--arker-outline-border);
    }

body.dark-mode .arker-button.gray-outlined:disabled, body.dark-mode .arker-button.gray-outlined.disabled {
    background-color: var(--arker-disabled-dark);
    border-color: var(--arker-disabled-border-dark);
}

.arker-button.gray.link {
    color: var(--arker-gray);
}

body.dark-mode .arker-button.gray.link {
    color: var(--arker-outline-border)
}

.arker-button.gray.link:hover,
.arker-button.gray.link.hover {
    color: var(--arker-gray-hover);
}

body.dark-mode .arker-button.gray.link:hover,
body.dark-mode .arker-button.gray.link.hover {
    color: var(--arker-outline-border);
}

.arker-button.gray.link:active,
.arker-button.gray.link.active {
    color: var(--arker-gray-text);
}

body.dark-mode .arker-button.gray.link:active,
body.dark-mode .arker-button.gray.link.active {
    color: var(--arker-outline-border);
}

.arker-button.gray.link:disabled,
.arker-button.gray.link.disabled {
    color: var(--arker-outline-border);
    background-color: var(--arker-outline);
    border-color: var(--arker-outline-border);
}

body.dark-mode .arker-button.gray.link:disabled,
body.dark-mode .arker-button.gray.link.disabled {
    color: var(--arker-outline-border);
    background-color: var(--arker-outline-border);
    border-color: var(--arker-outline-border);
}
/* === FIM - CINZA=== */





.arker-button.terciary {
    background-color: #f4f5f8;
    border: 1px solid #e2e5ec;
    color: #595d6e;
}



    .arker-button.terciary:hover,
    .arker-button.terciary:active,
    .arker-button.terciary.hover,
    .arker-button.terciary.active {
        background-color: #087397;
        border: 1px solid #087397;
        color: #ffffff;
    }



    .arker-button.terciary:active,
    .arker-button.terciary.active {
        border-color: #087397;
    }



.arker-button.terciary-outlined {
    background-color: transparent;
    border: 1px solid #ddd;
    color: #595d6e;
}



    .arker-button.terciary-outlined:hover,
    .arker-button.terciary-outlined:active,
    .arker-button.terciary-outlined.hover,
    .arker-button.terciary-outlined.active {
        background-color: #087397;
        border: 1px solid #087397;
        color: #ffffff;
    }



    .arker-button.terciary-outlined:active,
    .arker-button.terciary-outlined.active {
        border-color: #087397;
    }



.arker-button.dark {
    background-color: #595d6e;
    border: 1px solid #4a4e5e;
    color: #fff;
}



    .arker-button.dark:hover,
    .arker-button.dark:active,
    .arker-button.dark.hover,
    .arker-button.dark.active {
        background-color: #4a4e5e;
        border: 1px solid #4a4e5e;
        color: #fff;
    }



    .arker-button.dark:active,
    .arker-button.dark.active {
        border-color: #4a4e5e;
    }



.arker-button.dark-outlined {
    background-color: transparent;
    border: 1px solid #595d6e;
    color: #595d6e;
}



    .arker-button.dark-outlined:hover,
    .arker-button.dark-outlined:active,
    .arker-button.dark-outlined.hover,
    .arker-button.dark-outlined.active {
        background-color: #4a4e5e;
        border: 1px solid #4a4e5e;
        color: #ffffff;
    }

    .arker-button.dark-outlined:active,
    .arker-button.dark-outlined.active {
        border-color: #4a4e5e;
    }


/* ===ALERTAS=============== */
.arker-alert.small {
    width: calc(425px - 48px);
}

.arker-alert.medium {
    width: calc(600px - 48px);
}

.arker-alert.large {
    width: calc(648px - 48px);
}

.arker-alert .btn {
    /*font-size: 1.0625em;*/
    font-size: 13px;
    height: 36px;
    min-width: 70px;
}

.arker-alert .arker-subtitulo {
    white-space: pre-line;
    margin-bottom: 24px;
    font-size: 14px;
    max-height: 320px;
    overflow-y: auto;
}

.arker-alert .arker-titulo {
    padding-bottom: 4px;
    font-size: 24px;
}

.arker-alert .alert-icon {
    margin-bottom: 8px;
}

.arker-alert .button-spacing {
    gap: 8px;
}

.arker-alert .btn-outline-primary {
    color: #0B99C9;
    background-color: #fff;
    border-color: #0B99C9;
}

    .arker-alert .btn-outline-primary:hover {
        background-color: #B9E2F0;
        border-color: #087397;
        color: #087397;
    }

    .arker-alert .btn-outline-primary:active {
        background-color: #B9E2F0;
        border-color: #087397;
        color: #087397;
    }

.arker-alert .btn-primary {
    background-color: #0B99C9;
    border-color: #0B99C9;
}

    .arker-alert .btn-primary:hover {
        background-color: #087397;
        border-color: #087397;
    }

    .arker-alert .btn-primary:active {
        background-color: #087397;
        border-color: #087397;
    }

.arker-alert .btn-link {
    text-decoration: underline;
    color: #0B99C9;
    background-color: transparent;
    box-shadow: none !important;
    outline: none !important;
    padding: 0;
    border: none;
    background: none;
}

    .arker-alert .btn-link:hover {
        color: #087397;
        background-color: transparent;
        box-shadow: none !important;
    }

    .arker-alert .btn-link:active {
        color: #087397;
        background-color: transparent;
        box-shadow: none !important;
    }

.arker-alert .btn-danger {
    background-color: #D83A3A;
    border-color: #D83A3A;
}

    .arker-alert .btn-danger:hover {
        background-color: #9D1212;
        border-color: #D11818;
    }

    .arker-alert .btn-danger:active {
        background-color: #9D1212;
        border-color: #D11818;
    }

.arker-alert .alert-button-icon {
    padding-right: 5px;
}

.ajuste-alerta {
    display: flex !important;
    gap: 5px !important;
}

input.error {
    border-color: #F64E60 !important;
    padding-right: calc(1.5em + 1.3rem) !important;
    background-image: url("/assets/images/app/alert-icons/warning-vermelho.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: calc(0.75em + 0.65rem) calc(0.75em + 0.65rem) !important;
    background-color: #fff !important
}

.help-block {
    display: block !important;
    color: #F64E60 !important;
    font-style: italic !important;
}


.was-validated .form-control:invalid {
    border-color: #fa5c7c !important;
    padding-right: 5.25rem !important;
    background-image: url("/assets/images/app/alert-icons/warning-vermelho.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}

.form-group.is-invalid .invalid-feedback {
    display: block;
}

.form-control.is-valid, .was-validated .form-control:valid {
    border-color: #0acf97 !important;
    padding-right: 2.25rem !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%230acf97' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") !important;
    background-position: right 12px center !important;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}


/*
    estilos do novo Farol SLA
*/
:root {
    --dot--SLA: 9px;
    --borda--SLA: #94989B;
    --width-farol--SLA: 38px;
    --height-farol--SLA: 19px;
    --background--SLA: #3E4347;
    --vermelho--SLA: #FB3B4E;
    --amarelo--SLA: #FFE62E;
    --verde--SLA: #93DE52;
    --nao-vigente--SLA: #5E5E5E;
}

.farol-sla {
    display: flex;
    width: var(--width-farol--SLA);
    height: var(--height-farol--SLA);
    border: 2px solid var(--borda--SLA);
    background-color: var(--background--SLA);
    border-radius: var(--width-farol--SLA);
    align-items: center;
    justify-content: space-around;
}

    .farol-sla.clicavel {
        cursor: pointer;
    }

    .farol-sla .item {
        width: var(--dot--SLA);
        height: var(--dot--SLA);
        border-radius: var(--dot--SLA);
        opacity: 0.25;
    }

        .farol-sla .item:nth-child(1) {
            background-color: var(--verde--SLA);
        }

        .farol-sla .item:nth-child(2) {
            background-color: var(--amarelo--SLA);
        }

        .farol-sla .item:nth-child(3) {
            background-color: var(--vermelho--SLA);
        }

    .farol-sla.verde .item:nth-child(1) {
        background-color: var(--verde--SLA);
        transform: scale(1);
        opacity: 1;
    }

    .farol-sla.amarelo .item:nth-child(2) {
        background-color: var(--amarelo--SLA);
        transform: scale(1);
        opacity: 1;
    }

    .farol-sla.vermelho .item:nth-child(3) {
        background-color: var(--vermelho--SLA);
        transform: scale(1);
        opacity: 1;
    }

    .farol-sla.nao-vigente .item:nth-child(1),
    .farol-sla.nao-vigente .item:nth-child(2),
    .farol-sla.nao-vigente .item:nth-child(3) {
        background-color: var(--nao-vigente--SLA);
        transform: scale(1);
        opacity: 1;
    }

.farol-widget {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 5px;
    color: #6c757d;
    font-family: Nunito, system;
}

    .farol-widget > span {
        /*margin-top: 5px;*/
        font-weight: bold;
    }

    .farol-widget .farol-container {
        display: flex;
        flex-direction: row;
        gap: 10px;
        align-items: center;
    }

        .farol-widget .farol-container span {
            font-size: 13px;
            font-style: italic;
        }


.centralizarConteudoTabela {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.dataTables_length select, .dataTables_filter input, .alinhar-filtro > div, .alinhar-filtro select {
    display: inline-block;
    width: auto;
}

.dataTables_length select {
    width: 70px !important;
}

.dataTables_filter input {
    margin-left: 8px;
    border: 1px solid #ccc;
}

.alinharTotalGagdetPrecisamosDeVoce {
    margin: 0 80px 0 40px;
}

.alinharTotalGagdetPrecisamosDeVocePlanejamento {
    margin: 0 180px 0 20px;
}

@media (min-width: 1280px) {
    .alinharTotalGagdetPrecisamosDeVoce {
        margin: 0 200px 0 60px;
    }

    .alinharTotalGagdetPrecisamosDeVocePlanejamento {
        margin: 0 260px 0 40px;
    }
}

.gadgetMargin {
    margin-top: 5px;
    margin-bottom: 5px;
}

.arker-btn-outline-primary {
    color: #0B99C9;
    background-color: #fff;
    border-color: #0B99C9;
}

    .arker-btn-outline-primary:hover {
        background-color: #B9E2F0;
        border-color: #087397;
        color: #087397;
    }

.btn-outline-primary:active {
    background-color: #B9E2F0;
    border-color: #087397;
    color: #087397;
}

.arker-btn-primary {
    background-color: #0B99C9;
    border-color: #0B99C9;
    color: #fff
}

    .arker-btn-primary:hover {
        background-color: #087397;
        border-color: #087397;
        color: #fff
    }

    .arker-btn-primary:active {
        background-color: #087397;
        border-color: #087397;
        color: #fff
    }

.loading-overlay {
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
}

    .loading-overlay.vertical {
        flex-direction: column;
    }

    .loading-overlay.horizontal {
        flex-direction: row;
    }

}

/* [SignOff] TABLE RESUME */
.tr-resume-1 {
    background-color: #F8F8F8;
}

.tr-resume-2 {
    background-color: #F4F4F4;
}

.tr-resume-total {
    background-color: #F4F4F4 !important;
}

    .tr-resume-total:hover {
        background-color: #F4F4F4 !important;
    }

.table-resume-2 {
    width: 37vw !important;
}

.table-resume {
    border: none !important;
    display: inline-flex;
    overflow-x: auto;
}


.table-pendingToApprove tr:nth-child(odd) {
    background-color: #F7F8FC !important;
}

.table-pendingToApprove tr:nth-child(even) {
    background-color: #fff !important;
}


.table-forecast-2 tr:nth-child(n + 5) {
    overflow-y: auto !important;
}

}

.max-content {
    width: max-content;
}

#divMenuFiltro .multiselect-container {
    max-height: 300px !important;
}

.filtro-tamanho-min {
    min-width: 190px !important;
}

.filtro-tamanho {
    /*min-width: 200px !important;*/
    /*display: grid;*/
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

.min-width-100 {
    min-width: 100px;
}


#tablePromocional.table tbody tr input {
    min-width: 80px;
}

#tablePromocional.table td, #tablePromocional.table th {
    padding: 0.8rem 0.40rem !important;
}

#tablePromocional.table tbody tr .precoMinimoPromocao input {
    min-width: 100px;
}

/* 
    estilos multiselectarker
*/

:root {
    --tagify-dd-color-primary: #DEE2E6;
    --tagify-dd-bg-color: white;
    --tagify-dd-item-pad: .3em .5em
}


.tagify__dropdown__item {
    /*background: #464f5b !important;*/
    width: 100%;
    white-space: normal;
    word-break: break-all;
}

.unicoSeletor {
    right: var(--arker-dd-icon-right) !important;
    display: none;
}

.titulos-estilos {
    margin-bottom: 0px !important;
    padding-left: 8px;
}

.tagify__dropdown__item--active {
    background: var(--bg-background-tags) !important;
}

.arker-autocomplete {
    width: 100% !important;
    border-radius: 10px !important;
    min-height: 36px !important;
    border: 1px solid #dee2e6;
    outline: none;
}

.tagify {
    width: 100%;
    border-radius: .25rem;
    --tags-disabled-bg: #F1F1F1;
    --tags-border-color: #DDD;
    --tags-hover-border-color: #DDD;
    --tags-focus-border-color: #3595f6;
    --tag-border-radius: 5px;
    --tag-bg: var(--bg-background-tags);
    --tag-hover: #3E87A6;
    --tag-text-color: #FFF;
    --tag-text-color--edit: #FFF;
    --tag-pad: 0.3em 0.5em;
    --tag-inset-shadow-size: 1.1em;
    --tag-invalid-color: #6C757D;
    --tag-invalid-bg: #F7CFD3;
    --tag-remove-bg: var(--bg-background-tags-remove);
    --tag-remove-btn-color: #FFF;
    --tag-remove-btn-bg: none;
    --tag-remove-btn-bg--hover: var(--bg-background-tag-cross-hover);
    --input-color: inherit;
    --tag--min-width: 1ch;
    --tag--max-width: auto;
    --tag-hide-transition: 0.3s;
    --placeholder-color: var(--input-placeholder);
    --placeholder-color-focus: #B7BEC6;
    --loader-size: .8em;
    --readonly-striped: 1;
    display: inline-flex;
    align-items: flex-start;
    flex-wrap: wrap;
    border: 1px solid var(--tags-border-color);
    padding: 0;
    line-height: 0;
    cursor: text;
    outline: 0;
    position: relative;
    box-sizing: border-box;
    transition: .1s
}

    .tagify.tagify--focus, .tagify:focus-within {
        border-color: var(--tags-focus-border-color);
    }

body.dark-mode .tag.tagify__tag.tagify--notAllowed {
    --tag-invalid-bg: #A6313C;
    color: #fff;
}

tag.tagify__tag.tagify--notAllowed {
    --tag-invalid-bg: #F7CFD3;
    --tag-text-color: #6C757D !important;
    --tag-remove-btn-color: #6C757D !important;
    font-weight: bold;
}

body.dark-mode .titulos-estilos {
    padding-left: 8px;
    font-weight: bold;
}

body.dark-mode .titulos-estilos {
    background: #464f5b !important;
    margin: 0px;
    border-radius: 0px;
}

body.dark-mode tags.tagify.arker-autocomplete {
    background-color: #47515D;
}

body.dark-mode :root {
    --tagify-dd-color-primary: #47515D;
    --tagify-dd-bg-color: #47515D;
    --tagify-dd-item-pad: .3em .5em
}

body.dark-mode .tagify__dropdown__item {
    background: #464f5b !important;
    margin: 0px;
    border-radius: 0px;
}

body.dark-mode .tagify__dropdown__item--active {
    background: var(--bg-background-tags) !important;
}

body.dark-mode .tagify__dropdown__wrapper {
    border: 0px;
    background: unset;
}


body.dark-mode .tagify__tag__removeBtn.singleSelect {
    color: white;
}

body.dark-mode .tagify {
    border-radius: 10px;
    --tags-disabled-bg: #F1F1F1;
    --tags-border-color: #47515d;
    --tags-hover-border-color: #47515d;
    --tags-focus-border-color: #47515d;
    --tag-border-radius: 5px;
    --tag-bg: var(--bg-background-tags);
    --tag-hover: #3E87A6;
    --tag-text-color: #FFF;
    --tag-text-color--edit: #FFF;
    --tag-pad: 0.3em 0.5em;
    --tag-inset-shadow-size: 1.1em;
    --tag-invalid-color: #6C757D;
    --tag-invalid-bg: #F7CFD3;
    --tag-remove-bg: #E6717C;
    --tag-remove-btn-color: #FFF;
    --tag-remove-btn-bg: none;
    --tag-remove-btn-bg--hover: #A6313C;
    --input-color: inherit;
    --tag--min-width: 1ch;
    --tag--max-width: auto;
    --tag-hide-transition: 0.3s;
    --placeholder-color: #8391A2;
    --placeholder-color-focus: #8391A2;
    --loader-size: .8em;
    --readonly-striped: 1;
    display: inline-flex;
    align-items: flex-start;
    flex-wrap: wrap;
    border: 1px solid var(--tags-border-color);
    padding: 0;
    line-height: 0;
    cursor: text;
    outline: 0;
    position: relative;
    box-sizing: border-box;
    transition: .1s
}

.tagify__input {
    margin: 4px;
}

.tagify__tag {
    margin: 4px;
    font-size: 11px;
    /*height: 23px;*/
    /*margin: 8px 0px 8px 8px;*/
}

.tagify__tag__removeBtn:hover + div > span {
    opacity: 1;
}

.tagify__dropdown .remove-all-tags {
    float: right;
    font-size: .8em;
    padding: .2em .3em;
    border-radius: 3px;
    z-index: 999999999 !important;
}

    .tagify__dropdown .remove-all-tags:hover {
        color: white;
        background: #DE4150 !important;
        z-index: 999999999 !important;
    }


.tagify__tag__removeBtn.singleSelect {
    color: black;
}


    .tagify__tag__removeBtn.singleSelect:hover {
        color: white;
    }


.is-invalid tags {
    border-color: #fa5c7c !important;
    padding-right: 5.25rem !important;
    background-image: url("/assets/images/app/alert-icons/warning-vermelho.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 28px center !important;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}

    .is-invalid tags.singleBotaoAcao {
        background-position: right 15px center !important;
    }

.is-invalid .tagifyBotoesAcao {
    right: var(--arker-dd-icon-right);
}

    .is-invalid .tagifyBotoesAcao.single {
        right: var(--arker-dd-icon-right);
    }

.tagify.tagify--select--arrow[aria-expanded=true]::after {
    transform: translate(-150%,-50%) rotate(270deg) scaleY(1.2)
}

.tagify__tag > div::before {
    background: var(--tag-bg) !important;
}

.tagify__tag__removeBtn:hover + div::before {
    background: var(--tag-remove-bg) !important;
}

.tagifyBotoesAcao {
    font-size: large;
    color: #c5c7cb;
    top: 0px;
    height: -webkit-fill-available;
    max-width: inherit;
    position: absolute;
    right: var(--arker-dd-icon-right);
    cursor: pointer;
    align-items: center;
    overflow-x: hidden;
    box-sizing: border-box;
    z-index: 10; /* Garante que fique visualmente na frente */
}

    .tagifyBotoesAcao.single {
        right: var(--arker-dd-icon-right);
    }

    .tagifyBotoesAcao > .tagifyClearAll:hover, .tagifyArrow:hover {
        color: var(--arker-gray-hover);
    }

.tagifyParentDiv {
    position: relative;
    max-height: 70px;
    width: auto;
    overflow: hidden;
}

    .tagifyParentDiv tags[aria-expanded=true] ~ .tagifyBotoesAcao > .tagifyArrow i::before {
        transform: rotate(270deg);
        transition-duration: 0.5s;
        transform-origin: 55% 50%;
    }

.tagifyArrow, .tagifyClearAll {
    font-size: var(--arker-dd-icon-size);
}

    .tagifyArrow i::before {
        transform: rotate(90deg);
        transition-duration: 0.5s;
    }

span.tagify__input {
    min-width: fit-content;
    align-self: center;
    min-height: auto;
    padding-left: 0px;
}

tags.tagify {
    background-color: #fff;
    align-items: center !important;
    padding-top: 0px !important;
    padding-bottom: 1px !important;
    padding-left: 5px !important;
    min-height: 36px;
    max-height: 70px;
    overflow-x: hidden;
    overflow-y: auto;
}
/* 
    end estilos multiselectarker
*/
/*
    Estilos Select2
*/
.select2-container .select2-selection--single {
    height: 37px;
    border-radius: 10px;
}


/*
    End Estilos Select2
*/


/*
    Estilos chosen-choices
*/

.chosen-container {
    border-radius: 10px !important;
    box-shadow: none;
}

.chosen-container-multi .chosen-choices {
    height: 37px !important;
    padding: 0px 8px !important;
    display: flex;
    align-items: center;
}


/*
    End Estilos chosen-choices
*/

/*
    Estilos card comprovação/acordo
*/
body {
    font-family: 'Nunito'
}

.container-acordos {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 13px;
}

    .container-acordos .mdi {
        font-size: 1.3em;
    }

.card-title-icon {
    font-size: 1.3em;
}

.card-acordo {
    width: 180px;
    min-width: 180px;
    height: 250px;
    border: 2px solid #F0F1F2;
    border-radius: 5px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

    .card-acordo .topo {
        height: 110px;
    }

        .card-acordo .topo.capa {
            display: flex;
            align-items: center;
            justify-content: center;
            background-position: center;
            background-size: cover;
        }

        .card-acordo .topo.imagem {
            display: flex;
            align-items: center;
            justify-content: center;
        }

            .card-acordo .topo.imagem > img {
                height: 60px;
                width: 50px;
            }


        .card-acordo .topo.capa > img {
            height: 110px;
        }


    .card-acordo .acoes {
        height: 30px;
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
    }

    .card-acordo .conteudo {
        padding: 5px 10px;
        flex-grow: 1;
    }

        .card-acordo .conteudo .titulo {
            font-weight: bold;
            color: #6C757D;
        }

        .card-acordo .conteudo .descricao {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
            color: #6C757D;
        }

    .card-acordo .link-texto {
        color: #0B99C9;
        text-decoration: underline;
    }

        .card-acordo .link-texto:hover {
            color: #0B99C9;
            text-decoration: underline;
        }

    .card-acordo .rodape {
        padding: 5px 13px;
    }

.icone-vermelho {
    color: #d11818;
}

.fill-space-img {
    object-fit: cover;
    width: 100%;
}

/*STATUS TAG*/
.status {
    font-size: 12px;
    font-weight: bold;
    padding: 2px 8px;
    border-radius: 10px
}

    .status.cancelado {
        background-color: #D11818;
        color: #fff;
    }

    .status.assinado {
        background-color: #0ACF97;
        color: #fff;
    }

    .status.pendente {
        background-color: #f4dd65;
        color: #6E767D;
    }

    .status.aguardando {
        background-color: #E0E0E0;
        color: #6E767D;
    }

    .status.anulado {
        background-color: #DB2E59;
        color: #fff;
    }

    .status.recusado {
        background-color: #D11818;
        color: #fff;
    }

    .status.aguardando-envio {
        background-color: #F17844;
        color: #fff;
    }

/*
    Estilos card comprovação/acordo
*/

.texto-truncate {
    display: inline-block !important;
    vertical-align: bottom;
    white-space: nowrap;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-choice-close {
    position: absolute;
    top: 7px !important;
    right: 3px;
    display: block;
    width: 12px;
    height: 12px;
    background: url("/assets/images/chosen-sprite.png") -42px 1px no-repeat !important;
    font-size: 1px;
}

.form-control-sm {
    height: auto !important;
}

.jvrAgrupadorEstilo {
    border: 0px;
}

/*
    Modal Arker
*/

:root {
    --arker-modal-header-height: 60px;
    --arker-modal-footer-height: 70px;
    --arker-modal-fullwidth-margin: 42.5px;
}

.arker-modal .modal-header {
    padding: 12px 16px !important;
    height: var(--arker-modal-header-height);
    align-items: center;
}

    .arker-modal .modal-header .btn-close {
        margin: 0px;
    }

    .arker-modal .modal-header .modal-title {
        font-size: 16px;
        font-weight: 700;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.arker-modal .modal-footer {
    height: var(--arker-modal-footer-height);
    padding: 10px 16px;
    gap: 0px;
}

.arker-modal .modal-body {
    padding: 16px;
    overflow: auto;
}

.arker-modal.iframe .modal-body {
    padding: 0;
    height: 650px;
    overflow: hidden; /*iframe já possui scroll por default*/
}

.arker-modal .modal-body iframe {
    width: 100%;
    /*position: absolute;*/
    height: 100%;
    border: none;
}

.arker-modal.fullwidth.iframe .modal-body iframe {
    width: 100%;
    /*position: absolute;*/
    height: 100%;
    border: none;
}


/*TAMANHOS*/
.arker-modal .modal-content {
    height: auto !important;
    max-height: 650px;
}

.arker-modal.iframe .modal-content {
    height: 100% !important;
    max-height: 650px;
}

/*--------XSMALL*/
.arker-modal.xs .modal-content {
    max-height: 450px;
}

.arker-modal.xs .modal-dialog {
    max-width: 400px;
}
/*--------SMALL*/
.arker-modal.sm .modal-dialog {
    max-width: 500px;
}
/*--------MEDIUM*/
.arker-modal.md .modal-dialog {
    max-width: 750px;
}
/*--------LARGE*/
.arker-modal.lg .modal-dialog {
    max-width: 950px;
}
/*--------XLARGE*/
.arker-modal.xl .modal-dialog {
    max-width: 1100px;
}
/*--------FULLWIDTH*/
.arker-modal.fullwidth .modal-dialog {
    max-width: 100%;
    margin: var(--arker-modal-fullwidth-margin);
}

.arker-modal.fullwidth .modal-content {
    min-height: calc(100vh - (var(--arker-modal-fullwidth-margin)*2));
}

/*
    Modal Arker - fim
*/



/*
    Arker Agrupador
*/

.arker-input-agrupador > ::-webkit-scrollbar {
    width: 7px !important;
    height: 7px !important;
}

.arker-input-agrupador > .treeselect-input {
    width: 100% !important;
    border-radius: 10px;
    min-height: 36px !important;
    max-height: 70px;
    border: 1px solid #dee2e6 !important;
    outline: none;
    overflow-y: overlay !important;
}

.arker-input-agrupador:focus-within {
    outline: none;
}

    .arker-input-agrupador:focus-within > .treeselect-input,
    .treeselect-input--focused {
        border-color: #3595f6 !important; 
        box-shadow: none !important; 
        outline: 0; 
    }

.treeselect-list--focused {
    border: 1px solid #dee2e6 !important; 
}

.is-invalid .arker-input-agrupador > .treeselect-input {
    border: 1px solid #fa5c7c !important;
    background-image: url('/assets/images/app/alert-icons/warning-vermelho.svg');
    background-repeat: no-repeat !important;
    background-position: right 28px center !important;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;
}

.is-invalid .arker-input-agrupador .treeselect-input__clear {
    display: none;
}

.treeselect-list__item--checked {
    background-color: transparent !important;
}

.treeselect-list__item--focused {
    background-color: var(--bg-background-tags) !important;
    color: #fff;
}

.treeselect-input__tags {
    margin: 4px;
}

body.dark-mode .arker-input-agrupador > .treeselect-input, body.dark-mode .treeselect-input--value-not-selected .treeselect-input__edit,
body.dark-mode .treeselect-input__edit, body.dark-mode .treeselect-list {
    background-color: #47515D;
    border-color: #47515D !important;
}

.treeselect-input__edit::placeholder {
    color: var(--input-placeholder);
}

.treeselect-list__item-label {
    margin-bottom: 0;
    font-size: .9rem !important;
}

.treeselect-list__item-checkbox {
    height: 1px !important;
    width: 1px !important;
}

.treeselect-list {
    z-index: 1161 !important;
    max-height: 250px !important;
}

.treeselect-input__tags-element {
    background-color: var(--bg-background-tags) !important;
    color: #fff;
    transition: .13s ease-out;
    font-size: .9rem !important;
    border-radius: 4px !important;
    font-size: 11px !important;
    /*pointer-events: none;*/
}

    .treeselect-input__tags-element:hover {
        background-color: var(--bg-background-tags-remove) !important;
    }

.treeselect-input__tags-cross {
    margin-left: 5px !important;
    pointer-events: auto;
    transition: .13s ease-out;
    border-radius: 50%;
}

    .treeselect-input__tags-cross svg {
        stroke: #fff !important;
    }

    .treeselect-input__tags-cross:hover {
        background-color: var(--bg-background-tag-cross-hover);
    }

        .treeselect-input__tags-cross:hover ~ .treeselect-input__tags-element {
        }

.treeselect-input__operators {
    top: 0px;
    height: -webkit-fill-available;
    max-width: inherit;
    position: absolute;
    right: 12px !important;
    align-items: center;
    overflow-x: hidden;
    box-sizing: border-box;
    margin-right: 0px;
}

.mrp-pop {
    position: absolute;
    z-index: 1050;
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .08);
    width: 620px;
    padding: 12px;
    display: none;
}

.mrp-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 6px 8px 14px;
    font-weight: 600;
}

body.dark-mode .mrp-body {
    background-color: #404954;
}

body.dark-mode .mrp-pop {
    background-color: #404954;
}

.mrp-body {
    display: flex;
    gap: 12px;
    padding: 0 6px 8px;
}

.mrp-col {
    flex: 1;
    min-width: 140px;
    border-radius: 10px;
    background: #f8fafc;
    padding: 10px;
}

.col-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.year-label {
    font-weight: 600;
    color: #374151;
}

.year-prev,
.year-next {
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 18px;
    padding: 4px 8px;
    color: #007bff;
    transition: color 0.2s ease, transform 0.2s ease;
}

    .year-prev:hover,
    .year-next:hover {
        color: #0056b3;
        transform: scale(1.2);
    }

    .year-prev:disabled,
    .year-next:disabled {
        color: #ccc;
        cursor: not-allowed;
        transform: none;
    }

.months {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

.month {
    border: 1px solid var(--border);
    background: #fff;
    padding: 8px 0;
    text-align: center;
    border-radius: 10px;
    font-size: 13px;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.2s, color 0.2s;
}

    .month:hover {
        background: #f3f4f6;
    }

    .month.active {
        background: var(--primary);
        color: #fff;
        border-color: var(--primary);
    }

    .month.in-range {
        background: var(--primary-ghost);
        border-color: transparent;
        border-radius: 0; /* Faz a seleção parecer contínua */
    }

    /* Ajustes para o primeiro e último item do range */
    .month.active.in-range:first-of-type {
        border-radius: 10px 0 0 10px;
    }

    .month.active.in-range:last-of-type {
        border-radius: 0 10px 10px 0;
    }


.mrp-footer {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 10px 8px 4px;
    border-top: 1px solid var(--border);
}

.mrp-btn {
    border: 1px solid var(--border);
    background: #fff;
    border-radius: 8px;
    height: 32px;
    padding: 0 10px;
    cursor: pointer;
    font-size: 13px;
}

    .mrp-btn.primary {
        background: var(--primary);
        color: #fff;
        border-color: var(--primary);
    }

    .mrp-btn:disabled {
        opacity: .5;
        cursor: not-allowed;
    }

.jvrAgrupadorEstilo > .treeselect-input__operators {
    height: -webkit-fill-available;
    max-width: inherit;
    position: absolute;
    right: 12px !important; 
    align-items: center;
    overflow-x: hidden;
    box-sizing: border-box;
    margin-right: 0px; 
}

.jvrAgrupadorEstilo > .treeselect-input {
    max-height: 70px;
    overflow-y: scroll;
    overflow-x: hidden;
}

._jrvControl.form-control.jvrAgrupadorEstilo.treeselect > ::-webkit-scrollbar {
    width: 7px !important;
    height: 7px !important;
}

._jrvControl.form-control.jvrAgrupadorEstilo.treeselect {
    height: -webkit-fill-available !important;
}

.treeselect-list__item.disabled-by-limit {
    opacity: 0.5;
    pointer-events: none;
}

body.dark-mode .treeselect.treeselect--disabled .treeselect-input {
    background-color: #47515D;
    cursor: not-allowed;
    border-color: #47515D;
    --placeholder-color: #8391A2;
    --placeholder-color-focus: #8391A2;
}

body.dark-mode .treeselect .treeselect-input {
    background-color: #47515D;
    border: 1px solid rgb(71, 81, 93) !important;
}

body.dark-mode .treeselect.treeselect--disabled .treeselect-input {
    background-color: #47515D;
    cursor: not-allowed;
    border-color: #47515D;
    filter: saturate(0);
    opacity: .5;
}

.treeselect.treeselect--disabled .treeselect-input {
    background-color: #F1F1F1;
    cursor: not-allowed;
    border-color: #F1F1F1;
    filter: saturate(0);
    opacity: .5;
    border: 1px solid #d7dde4;
}

body.dark-mode .treeselect-input__edit::placeholder {
    color: #8391A2;
}

.treeselect .treeselect-list__item.ag-select-all {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    background: #fff !important;
    color: #374151 !important;
    padding: 8px 12px !important;
    min-height: 44px !important;
    border-bottom: 1px solid #e5e7eb !important;
    cursor: pointer;
    user-select: none;
    margin-bottom: 0 !important;
    gap: 4px;
}

    .treeselect .treeselect-list__item.ag-select-all:hover {
        background: var(--bg-background-tags,#0B99C9) !important;
        color: #fff !important;
    }

        .treeselect .treeselect-list__item.ag-select-all:hover .ag-selall-sub {
            color: #fff !important;
        }

/*
    Arker Agrupador - FIM
*/
/*
    Componentes UI - INICIO
*/
.arker-seletor-acoes {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 15px;
    left: 50%;
    transform: translate(-50%, 0%);
    z-index: 1001; /*acima do z-index do menu*/
}

    .arker-seletor-acoes .arker-seletor-conteudo {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: white;
        border-radius: 10px;
        width: fit-content;
        box-shadow: 2px 4px 4px 4px rgba(0, 0, 0, 0.2);
    }

    .arker-seletor-acoes .arker-seletor-informacoes {
        padding: 10px 16px;
        display: grid;
        align-items: center;
        justify-content: space-between;
        flex-direction: row;
    }

    .arker-seletor-acoes .arker-seletor-quantidade {
        white-space: nowrap;
    }

    .arker-seletor-acoes .arker-seletor-botoes {
        gap: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px 16px;
    }

/*
    Componentes UI - FIM
*/


/*
    OffCanvas Arker
*/
.offcanvas-arker {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: 1160;
    display: flex;
    flex-direction: column;
    max-width: 100%;
    background-color: white;
    background-clip: padding-box;
    outline: 0;
    transition: transform .5s ease-in-out;
    width: 400px;
    height: 100vh;
    transform: translateX(400px);
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

    .offcanvas-arker .uil-times {
        font-size: 24px !important;
    }

    .offcanvas-arker.show {
        transform: translateX(0);
    }

    .offcanvas-arker.lado-direito {
        top: 0;
        right: 0;
        width: 400px;
    }

.offcanvas-arker-header {
    padding: 16px 20px;
    font-size: 16px;
    color: #6E767D;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #eef2f7;
}

body.dark-mode .offcanvas-arker-header {
    background-color: #37404a;
}

.offcanvas-arker .ucFiltros.card {
    height: 100vh;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.offcanvas-arker .ucFiltros.offcanvas .card-footer {
    width: 100%
}

/*
    OffCanvas Arker
*/

/*Tamanho ícone padrão de tooltip*/
.uil-info-circle {
    font-size: 13px !important;
}


.tooltip.tooltip-ucfiltros {
    z-index: 1160;
}

.tooltip-inner {
    text-align: left !important;
}

/* ARKER TABLE */

.arker-table {
    /*width: 100%;*/
    border-spacing: 0px;
    /*table-layout: fixed;*/
    /*word-wrap: break-word;*/
    border: 1px solid #E0E0E0;
}

    .arker-table td, .arker-table th {
        white-space: nowrap;
        text-align: center;
        padding: 4px 12px !important;
    }

    .arker-table > thead th, .arker-table > tfoot td {
        background-color: #EFF3F6;
        height: 30px;
        font-weight: 700;
        color: #6C757D;
        font-size: 13px;
    }

    .arker-table.sticky > thead th {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .arker-table.sticky > tfoot td {
        position: sticky;
        bottom: -1px;
        z-index: 1;
    }

    .arker-table > thead th, .arker-table > tbody td, .arker-table > tfoot td {
        padding: 4px 6px;
        height: 40px;
        vertical-align: central;
    }

    .arker-table > tbody tr {
        position: relative;
        border: 1px solid #E0E0E0;
    }

    .arker-table > thead th, .arker-table > tbody td {
        border: 0px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .arker-table input[type=checkbox] {
        margin: 0 !important; /*Necessário por conta do jarvisforms1*/
    }


body.dark-mode .arker-table {
    color: #aab8c5;
    border: 1px solid #464f5b;
}

    body.dark-mode .arker-table > thead th, body.dark-mode .arker-table > tfoot td {
        color: #aab8c5;
        background-color: #37404a;
    }

    body.dark-mode .arker-table > tbody tr {
        border: 1px solid #464f5b;
    }

        body.dark-mode .arker-table > tbody tr.even td {
            background-color: #3e4853;
        }

        body.dark-mode .arker-table > tbody tr.odd td {
            background-color: #37404a;
        }

        body.dark-mode .arker-table > tbody tr:hover td {
            color: #21282f;
            background-color: #727b84 !important;
        }

/* Arker Checkbox */
input[type="checkbox"].arker-checkbox {
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: 0;
    height: 18px;
    width: 18px;
    border: 1px solid lightgray;
    color: white;
    border-radius: 4px;
}

    input[type="checkbox"].arker-checkbox:checked {
        background-color: var(--arker-blue);
        border-color: var(--arker-blue);
        color: white;
        background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
    }

    input[type="checkbox"].arker-checkbox:indeterminate {
        background-color: var(--arker-blue);
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" ><line x1="6" y1="10" x2="14" y2="10"  stroke="%23fff" stroke-linecap="round" stroke-width="3"/></svg>');
        border-color: var(--arker-blue);
        color: white;
    }



    input[type="checkbox"].arker-checkbox:checked:after {
    }



/*ARKER POPOVER*/
.popover[x-out-of-boundaries] {
    display: none;
}



/*Estilo card BigNumber*/
.title-big-number {
    font-size: 13px;
    font-weight: bold;
    white-space: nowrap;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
}

.divCardBigNumber {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 24px;
}

.card-big-number {
    flex: 1 1 200px; /* flex-grow: 1, flex-shrink: 1, flex-basis: 200px */
    background-color: #fff;
    border-radius: 9px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
    min-width: 200px;
}

    .card-big-number:last-child {
        margin-right: 0; /* Remover margem direita do último card */
    }

    .card-big-number.total-investiment {
        background: #ACA7A70A !important;
    }

    .card-big-number.committed {
        background: #D7D2EB1A !important;
    }

    .card-big-number.in-analysis {
        background: #FFEF9C1A !important;
    }

    .card-big-number.paid-and-scheduled {
        background: #80E3C91A !important;
    }

    .card-big-number.rejected {
        background: #F7CFD31A !important;
    }

.dark-mode.card-big-number {
    background-color: #464f5b;
    box-shadow: 0 0 35px 0 rgba(49, 57, 66, 0.5);
}

.total-big-number {
    color: #6C757D;
    font-size: 24px;
    font-weight: bold;
    white-space: nowrap;
}

.dark-mode .total-big-number {
    color: #AAB8C5;
}

.committed .title-big-number {
    color: #8878C4;
}

.dark-mode .committed .title-big-number {
    color: #B9AFE0;
}

.in-analysis .title-big-number {
    color: #F6940F;
}

.paid-and-scheduled .title-big-number {
    color: #05AF7F;
}

.rejected .title-big-number {
    color: #DE4150;
}

.dark-mode .rejected .title-big-number {
    color: #ED727D;
}

.title-big-number i {
    color: #6C757D;
}

.dark-mode .title-big-number i {
    color: #AAB8C5;
}


/*ESTILO SPINNER*/

.uil-spinner-alt {
    display: inline-block;
    width: 1em;
    height: 1em;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M6.804 15a1 1 0 0 0-1.366-.366l-1.732 1a1 1 0 0 0 1 1.732l1.732-1A1 1 0 0 0 6.804 15M3.706 8.366l1.732 1a1 1 0 1 0 1-1.732l-1.732-1a1 1 0 0 0-1 1.732M6 12a1 1 0 0 0-1-1H3a1 1 0 0 0 0 2h2a1 1 0 0 0 1-1m11.196-3a1 1 0 0 0 1.366.366l1.732-1a1 1 0 1 0-1-1.732l-1.732 1A1 1 0 0 0 17.196 9M15 6.804a1 1 0 0 0 1.366-.366l1-1.732a1 1 0 1 0-1.732-1l-1 1.732A1 1 0 0 0 15 6.804m5.294 8.83l-1.732-1a1 1 0 1 0-1 1.732l1.732 1a1 1 0 0 0 1-1.732m-3.928 1.928a1 1 0 1 0-1.732 1l1 1.732a1 1 0 1 0 1.732-1ZM21 11h-2a1 1 0 0 0 0 2h2a1 1 0 0 0 0-2m-9 7a1 1 0 0 0-1 1v2a1 1 0 0 0 2 0v-2a1 1 0 0 0-1-1m-3-.804a1 1 0 0 0-1.366.366l-1 1.732a1 1 0 0 0 1.732 1l1-1.732A1 1 0 0 0 9 17.196M12 2a1 1 0 0 0-1 1v2a1 1 0 0 0 2 0V3a1 1 0 0 0-1-1'/%3E%3C/svg%3E");
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

    /*ESTILO SPINNER - ACAO EM PROCESSAMENTO*/
    .uil-spinner-alt.spin {
        animation: girar 2s infinite linear;
    }

.spinnerProcessamento {
    position: absolute;
    color: #0B99C9;
    font-size: 30px;
}

@keyframes girar {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}



.dz-progress {
    height: 8px;
    background-color: #f5f5f5;
    border-radius: 4px;
    position: relative;
    width: 100%;
}

.dz-upload {
    height: 100%;
    background-color: #FFBA5C; /* Cor inicial da barra de progresso */
    border-radius: 25px;
    width: 0; /* Inicialmente o progresso é zero */
    transition: width 0.4s ease, background-color 0.4s ease; /* Transição suave */
}

    .dz-upload.dz-success {
        background-color: #77D353; /* Cor quando o upload é concluído */
    }

    .dz-upload.dz-error {
        background-color: #D11818; /* Cor quando ocorre um erro */
    }

.arker-upload-text-error {
    color: #D11818;
    font-weight: bold;
    display: none;
}

.dz-image-preview a {
    color: #6c757d;
}

.dz-image-preview p {
    color: #6c757d;
}

.dz-image-preview .btn-link:hover {
    color: #6c757d;
}

.arker-upload-text-error {
    color: #D11818 !important;
}

.dz-image-preview-upload-error {
    color: #D11818;
    background-color: #FEE2E7;
    border-color: #D11818 !important;
}

    .dz-image-preview-upload-error .btn-link {
        color: #D11818;
    }

.tpr {
    /*width: 815px;*/
}
    /*!--CONSIDERAR O LAYOUT A PARTIR DAQUI--!*/
    .tpr h4 {
        margin: 0;
        font-size: 16px;
    }

    .tpr input {
        max-width: 150px !important;
        font-size: 13px;
    }

    .tpr .collapsable {
        padding: 5px;
        cursor: pointer;
        color: #0B99C9;
        font-size: 20px;
        transition: transform .2s ease-in-out;
    }

    .tpr .negativo, .obrigatorio {
        color: #D11818;
    }

    .tpr .positivo {
        color: #05AF7F;
    }

    .tpr .tpr-grupo .tpr-grupo-linha .tpr-informacoes {
        transition: all 0.5s ease-in-out;
        max-height: 9999px;
        overflow: hidden;
    }

    .tpr .tpr-grupo .tpr-grupo-linha.collapsed .tpr-informacoes {
        max-height: 0px;
    }

    .tpr .tpr-grupo .tpr-grupo-linha.collapsed .collapsable {
        transform: rotate(180deg)
    }

    .tpr .tpr-grupo.impar {
        background-color: #F1F3FA;
    }

    .tpr .tpr-data-sellin {
        display: flex;
        gap: 2px;
        align-items: center;
    }

    .tpr .tpr-header {
        padding: 5px 10px;
        background: #597887;
        color: #fff;
        height: 38px;
        display: flex;
        align-items: center;
    }



    .tpr .tpr-destaque, .tpr .tpr-informacoes-linha {
        display: flex;
        gap: 10px;
        border-bottom: 2px solid #DEE2E6;
        padding: 5px 10px;
        align-items: center;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .tpr .tpr-informacoes-linha {
        border-bottom: 1px solid #DEE2E6;
    }

    .tpr .tpr-destaque h4 {
        flex-grow: 1;
        font-weight: bold;
    }

    .tpr .tpr-destaque .tpr-destaque-metrica {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-weight: normal;
    }

        .tpr .tpr-destaque .tpr-destaque-metrica span {
            font-size: .8rem;
            font-weight: bold;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .tpr .tpr-destaque .tpr-destaque-metrica h4 {
            font-weight: 400;
        }


    .tpr .tpr-informacoes-linha .tpr-info {
        display: flex;
        flex-direction: column;
        font-size: 13px;
    }

        .tpr .tpr-informacoes-linha .tpr-info .titulo {
            text-wrap: nowrap;
            font-weight: bold;
            display: flex;
            align-items: center;
            gap: 5px;
        }

        .tpr .tpr-informacoes-linha .tpr-info span.valor {
            height: 36px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

/* NON TPR */

.estimativa-roi td.mesAno, .estimativa-roi td.total {
    text-transform: uppercase;
    text-align: center;
}

.estimativa-roi .estimativa-roi-container-group .estimativa-roi-container-body {
    transition: all 0.5s ease-in-out;
    max-height: 9999px;
    overflow: hidden;
}

.estimativa-roi .estimativa-roi-container-group.collapsed .estimativa-roi-container-body {
    max-height: 0px;
}

.estimativa-roi .estimativa-roi-container-group.collapsed i {
    transform: rotate(180deg)
}

.estimativa-roi .estimativa-roi-container-group .estimativa-roi-container-header {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

.estimativa-roi .estimativa-roi-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #eef2f7;
}

.estimativa-roi .negativo {
    color: #D11818;
}

.estimativa-roi .positivo {
    color: #05AF7F;
}

.estimativa-roi img.loading {
    margin: auto;
    display: block;
    width: 150px;
}

/*FIM NON TPR*/


/* LIMITE DESCONTO */

.desconto-limite {
    width: 100%;
    /*border: 1px solid #DEE2E6;*/
}

.desconto-limite-header h4 {
    padding-top: 16px;
}

.desconto-limite-container > .loading-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 250px;
}

.desconto-limite .desconto-limite-card .desconto-limite-card-header {
    font-weight: bold;
    min-height: 44px;
}

    .desconto-limite .desconto-limite-card .desconto-limite-card-header > * {
        padding: 0px 10px;
        white-space: normal;
        word-wrap: break-word;
        /*white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;*/
    }


.desconto-limite-tipovolume-container {
    padding-bottom: 16px;
}

    .desconto-limite-tipovolume-container select {
        max-width: 300px;
        width: 100%;
    }

        .desconto-limite-tipovolume-container select.is-invalid {
            border-color: #F64E60 !important;
            padding-right: calc(1.5em + 1.3rem) !important;
            background-image: url("/assets/images/app/alert-icons/warning-vermelho.svg") !important;
            background-repeat: no-repeat !important;
            background-position: right 12px center !important;
            background-size: calc(0.75em + 0.65rem) calc(0.75em + 0.65rem) !important;
            background-color: #fff !important
        }

.desconto-limite-card .desconto-limite-subheader {
    background-color: #F4F7F9;
    border-bottom: 1px solid #DEE2E6;
    display: flex;
    cursor: pointer;
    align-items: center;
    width: 100%;
}

    .desconto-limite-card .desconto-limite-subheader i {
        color: #0B99C9;
        width: 40px;
        height: 40px;
        padding: 5px;
        font-size: 20px;
        align-items: center;
        justify-content: center;
        display: flex;
        font-size: 28px;
        transform: rotate(180deg);
        transition: transform ease-in-out .2s;
    }

    .desconto-limite-card .desconto-limite-subheader .titulo {
        text-transform: uppercase;
        margin: 0;
        padding: 0;
        line-height: 1;
        width: 100%;
    }

    .desconto-limite-card .desconto-limite-subheader .total {
        display: none;
        gap: 2px;
        margin: 0 10px;
        font-weight: bold;
        white-space: nowrap;
    }

.desconto-limite-card .desconto-limite-secao .desconto-limite-conteudo {
    transition: all 0.2s ease-in-out;
    max-height: 9999px;
    overflow: hidden;
    display: grid;
    grid-template-rows: auto;
}


.desconto-limite-card .desconto-limite-secao.collapsed .desconto-limite-conteudo {
    max-height: 0px;
}

.desconto-limite-card .desconto-limite-secao.collapsed .desconto-limite-subheader i {
    transform: rotate(90deg)
}

.desconto-limite-card .desconto-limite-secao.collapsed .desconto-limite-subheader .total {
    display: flex;
}

.desconto-limite-card .desconto-limite-card-header,
.desconto-limite-card .desconto-limite-linha {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    min-height: 52px;
    border-bottom: 1px solid #DEE2E6;
    align-items: center;
}

.desconto-limite-linha div {
    padding: 5px 10px;
}

.desconto-limite-footer .numerico,
.desconto-limite-linha .numerico,
.desconto-limite-linha .numerico input {
    text-align: right;
    justify-content: end;
}

    .desconto-limite-linha .numerico input {
        min-width: 60px;
    }

.desconto-limite-card .desconto-limite-linha .volume {
    display: flex;
    align-items: center;
    gap: 5px;
}

.desconto-limite-card .desconto-limite-linha .produto,
.desconto-limite-card .desconto-limite-linha .investimento {
    font-weight: bold;
}

.desconto-limite-card .desconto-limite-linha .execucao span {
    display: block;
    white-space: nowrap;
}

.desconto-limite-card .desconto-limite-linha.titulo span {
    word-break: break-word;
    padding: 2px;
}

.desconto-limite-secao.opaco .desconto-limite-linha span,
.desconto-limite-secao.opaco .desconto-limite-footer h4 {
    color: rgb(108 117 125 / 60%);
}

.desconto-limite .desconto-limite-card .desconto-limite-footer {
    min-height: 44px;
    display: grid;
    align-items: center;
    grid-template-columns: repeat(9, 1fr);
    font-weight: bold;
}

    .desconto-limite .desconto-limite-card .desconto-limite-footer .titulo {
        grid-column: span 8;
    }

    .desconto-limite .desconto-limite-card .desconto-limite-footer .titulo {
        text-align: right;
    }

    .desconto-limite .desconto-limite-card .desconto-limite-footer .valor {
        font-weight: bold;
    }

    .desconto-limite .desconto-limite-card .desconto-limite-footer > .numerico.valor {
        padding: 5px 10px;
    }

.estimativa-roi .estimativa-roi-container-group .estimativa-roi-container-header {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

.estimativa-roi .estimativa-roi-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #eef2f7;
}

.estimativa-roi .negativo {
    color: #D11818;
}

.estimativa-roi .positivo {
    color: #05AF7F;
}

.estimativa-roi img.loading {
    margin: auto;
    display: block;
    width: 150px;
}

/*FIM NON TPR*/

/* RateioInvestimentoPorGrupoSKU */
/*:root {
    --disabled: #C4C4C4;
}*/

.arker-rateio-investimento .color-red {
    color: red;
}

.arker-rateio-investimento .no-border {
    border: none;
}

.arker-rateio-investimento .cabecalho {
    font-weight: bold;
}

.arker-rateio-investimento .card {
    margin-bottom: 0;
}

.arker-rateio-investimento hr {
    margin: 8px 0;
}

.arker-rateio-investimento h4 {
    margin: 4px 0px;
}

.arker-rateio-investimento [id^="arrow-"]::before {
    content: "uil-angle-down";
    font-family: 'iconify';
}

.arker-rateio-investimento #icone-accordion-planejado, .arker-rateio-investimento #icone-accordion-realizado {
    font-size: 24px;
    color: var(--arker-blue);
}

.arker-rateio-investimento .accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    margin: 8px -20px;
    background-color: #f4f7f9;
    padding: 1px 15px;
}



.arker-rateio-investimento .accordion-button {
    display: flex;
    align-items: center;
    flex-grow: 1;
    gap: 8px;
}

.accordion-header .accordion-button:not(.collapsed) .accordion-header-subtitulo-total {
    display: none;
}

.arker-rateio-investimento .accordion-collapse.somenteLeitura {
    opacity: 0.5;
}

.arker-rateio-investimento .produtos {
    align-items: center;
}

.arker-rateio-investimento .opcional {
    font-size: 10px;
    font-weight: 400;
}

.arker-rateio-investimento input, .arker-rateio-investimento .text-end {
    text-align: end;
}

.arker-rateio-investimento .total {
    font-weight: bold;
}

.arker-rateio-investimento .card-header {
    display: flex;
    align-items: center;
}

    .arker-rateio-investimento .card-header i {
        font-size: 24px;
    }

.arker-rateio-investimento .titulo {
    color: #ffffff;
    background-color: #4e7889;
}

.arker-rateio-investimento .subtitulo {
    margin-bottom: 18px;
}

.arker-rateio-investimento .icon-eraser {
    height: 18px;
    cursor: pointer;
}

.arker-rateio-investimento .coluna-limpar {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 6px;
}


/* TABELA DE VALORES */

.tabela-valores {
    display: grid;
    /* repete --colunas vezes 1fr, depois fixa 100px + 100px */
    grid-template-columns: repeat(var(--colunas), 1fr) 200px 200px;
    gap: 1px;
    font-family: sans-serif;
}

    .tabela-valores .cell {
        align-items: center;
        display: flex;
        padding: 10px;
        min-height: 60px;
    }

    .tabela-valores .percentual, .tabela-valores .valor {
        text-align: right;
        justify-content: right;
        white-space: nowrap;
    }

    .tabela-valores .valor {
        font-weight: bold;
    }


    .tabela-valores > .striped-row:nth-child(2n) .cell {
        background: #f1f3fa;
    }

    .tabela-valores .striped-row:hover .cell {
        background: #f1f1f1;
    }

    /* estilo de cabeçalho */
    .tabela-valores .header {
        font-weight: bold;
        padding: 10px;
    }

    .tabela-valores .row {
        display: contents;
    }

    .tabela-valores > .footer-row .cell {
        border-top: 1px solid #eef2f7;
    }

    .tabela-valores .footer-row .total-label {
        grid-column: 1 / span var(--rowspan);
        font-weight: bold;
        display: flex;
        justify-content: flex-end;
    }

    .tabela-valores .footer-row .percentual {
        display: flex;
        justify-content: flex-end;
        font-weight: bold;
    }

.card-tmpl-tabela-valores {
    margin-top: 24px;
    box-shadow: none !important;
}

/* FIM TABELA DE VALORES */



/* Componente de status fase contrato */
.cmpntStatusContrato {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

    .cmpntStatusContrato .bolinhas {
        display: flex;
        flex-direction: row;
        gap: 0.5rem;
    }

    .cmpntStatusContrato span {
        color: var(--text-color-light);
        font-size: 0.7rem;
    }

    .cmpntStatusContrato .bolinhaStatusContrato {
        width: 0.875rem;
        height: 0.875rem;
        border-radius: 50%;
    }

.bolinhaStatusContrato.etapaParcial {
    background-color: var(--arker-gray-outline);
    border-color: var(--arker-blue);
    border-width: 0.1rem;
    border-style: solid;
}

.bolinhaStatusContrato.etapaConcluida {
    background-color: var(--arker-blue);
}

.bolinhaStatusContrato.etapaNaoIniciada {
    background-color: var(--arker-gray-outline);
}

.bolinhaStatusContrato.etapaRecusada {
    background-color: var(--arker-red);
}


/* Componente de Proposta de Negocio Automatica */
.pna {
    display: flex;
    flex-direction: column;
}

    .pna .pna-header {
    }

    .pna .pna-container {
        display: flex;
        flex-direction: column;
    }

        .pna .pna-container .pna-card {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

    .pna .pna-tipo-proposta {
        display: flex;
        align-items: center;
        gap: 10px;
    }

        .pna .pna-tipo-proposta .pna-tipo-proposta-seletor {
            max-width: 300px;
        }

        .pna .pna-tipo-proposta label {
            white-space: nowrap;
            margin: 0;
        }


    .pna .box-contato {
        padding: 10px;
        border-radius: 5px;
        background-color: #f7f7f7;
        display: grid;
        grid-template-columns: 1fr 1fr;
        position: relative;
        gap: 10px;
        margin-bottom: 10px;
    }

    .pna .pna-contatos .pna-contatos-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 5px;
    }

    .pna .box-contato .actions {
        position: absolute;
        right: 0;
        top: 0;
    }

        .pna .box-contato .actions #btnRemoverContato i {
            color: var(--arker-red);
        }

/* FIM - Componente de Proposta de Negocio Automatica*/






/* INICIO - Componente arker accordion */

.arker-accordion-section {
    cursor: pointer;
    border: none;
    margin-bottom: 8px;
    border-radius: 6px;
    overflow: hidden;
    background: var(--arker-download-focus-background); /* fundo cinza claro */
}

.arker-accordion-header {
    padding: 12px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: Nunito, sans-serif;
    font-weight: 600;
    color: #6c757d /* cinza do texto */
}

    .arker-accordion-header:hover {
        background: var(--arker-gray-focus-border); /* um pouco mais escuro no hover */
    }

    .arker-accordion-header i {
        font-size: 18px; /* ajusta o tamanho do ícone */
        margin-left: 2px; /* espaço entre texto e ícone */
        vertical-align: middle; /* mantém alinhado com a linha do texto */
        cursor: pointer;
        color: #6c757d; /* cor cinza padrão */
    }

/*.arker-accordion-toggle {
    font-weight: bold;
    font-size: 18px;
    color: #6c757d;*/ /* cinza mais escuro */
/*transition: transform 0.2s ease;
}*/

.arker-accordion-content {
    display: none;
    padding: 14px 16px;
    background: #ffffff;
}

/* FIM - Componente arker accordion */





/* SELETOR PRODUTOS */

.seletor-container {
    margin-bottom: 20px;
    /*padding: 20px;*/
}

    .seletor-container h4 {
        margin-bottom: 15px;
        color: #0d6efd;
        font-weight: bold;
    }

    .seletor-container .lista {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 5px;
    }

    .seletor-container .lista-resultado {
        display: grid;
        flex-direction: column;
        gap: 10px;
    }

.seletor-produtos .container-produtos {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 20px;
}

.seletor-produtos .item {
    position: relative;
    overflow: hidden;
    display: flex;
    border-radius: 8px;
    justify-content: space-between;
}

    .seletor-produtos .item .arker-button {
        justify-content: flex-start;
        display: flex;
        align-items: center;
        width: auto;
        background-color: transparent;
        border: 0;
        flex: 1;
    }

        .seletor-produtos .item .arker-button span {
            max-width: unset;
            text-align: left;
            color: #6C757D;
        }

.seletor-produtos .container-busca-inteligente .card-header {
    display: inline-flex;
    gap: 10px;
}

.seletor-produtos .card-header .tipo-pesquisa {
    display: flex;
    align-items: center;
    gap: 3em;
}

.seletor-produtos .item .acoes-container {
    top: 0;
    transition: all .3s ease-in-out;
    margin-right: -140px;
    height: 38px;
    font-weight: bold;
    color: #fff;
    display: flex;
    align-items: center;
    cursor: pointer;
    outline: none;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    overflow: hidden;
}

.seletor-produtos .item[data-tipo='Sku'] .acoes-container {
    margin-right: -70px;
}

.seletor-produtos .item.selecionado .acoes-container button {
    background-color: #00C693;
}

.seletor-produtos .item.selecionado:hover {
    background-color: #FEE2E7;
}

    .seletor-produtos .item.selecionado:hover i.icon-add {
        display: none;
    }

    .seletor-produtos .item.selecionado:hover i.icon-remove {
        display: unset !important;
    }

    .seletor-produtos .item.selecionado:hover .acoes-container .remover-selecao {
        background-color: #D11818;
    }

.seletor-produtos .item:hover .acoes-container:not(.selecionado), .seletor-produtos .item.selecionado .acoes-container {
    margin-right: 0;
}

.seletor-produtos .item .acoes-container button {
    appearance: none;
    background: #0B99C9;
    color: #fff;
    border: 0;
    outline: none;
    box-shadow: none;
    width: 70px;
}

    .seletor-produtos .item .acoes-container button.remover-selecao:hover {
        background-color: #fa5c7c;
    }

    .seletor-produtos .item .acoes-container button i {
        transition: transform .2s ease-in-out;
        display: block;
    }

    .seletor-produtos .item .acoes-container button:hover i {
        transform: scale(1.2);
    }



.seletor-produtos .item[data-tipo='SubCategoria'] {
    background: #D6F0FA;
    border: none;
}

.seletor-produtos .item[data-tipo='Marca'] {
    background: #E1DEFE;
    border: none;
}

.seletor-produtos .item[data-tipo='GrupoSku'] {
    background: #EDD2F2;
    border: none;
}

.seletor-produtos .item[data-tipo='Sku'] {
    background: #FFF8D0;
    border: none;
}



.selector-list {
    max-height: 300px;
    overflow-y: auto;
    border: 1px solid #dee2e6;
    border-radius: 5px;
    padding: 10px;
    background-color: white;
}


.selector-item:hover {
    background-color: #e9ecef;
}


.seletor-produtos .painel-resultados {
    position: sticky;
    top: 20px;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

.selected-item {
    padding: 10px;
    margin: 8px 0;
    background: white;
    border-radius: 5px;
    border-left: 3px solid #0d6efd;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

    .selected-item .item-info {
        flex: 1;
    }

    .selected-item .item-name {
        font-weight: bold;
        color: #212529;
    }

    .selected-item .item-type {
        font-size: 0.85em;
        color: #6c757d;
        margin-left: 8px;
    }

    .selected-item .remove-btn {
        cursor: pointer;
        color: #dc3545;
        font-size: 1.2em;
        padding: 5px;
    }

        .selected-item .remove-btn:hover {
            color: #bb2d3b;
        }

.seletor-produtos .empty-state {
    width: 100%;
    grid-column: span 4;
    text-align: center;
    padding: 40px;
    color: #6c757d;
}

.selector-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.selector-count {
    font-size: 0.9em;
    color: #6c757d;
}

.search-container {
    margin-bottom: 30px;
    padding: 20px;
    border: 1px solid #0d6efd;
    border-radius: 8px;
    background: linear-gradient(135deg, #e7f1ff 0%, #f0f7ff 100%);
}

    .search-container h4 {
        color: #0d6efd;
        margin-bottom: 15px;
    }

.search-textarea {
    width: 100%;
    min-height: 60px;
    padding: 4px;
    border: 0;
    font-size: 0.98em;
    resize: vertical;
}

    .search-textarea:focus {
        outline: none;
    }

.search-button {
    margin-top: 10px;
}

.search-info {
    margin-top: 10px;
    font-size: 0.9em;
    color: #6c757d;
}

.search-results {
    margin-top: 15px;
    padding: 10px;
    background: white;
    border-radius: 5px;
    border: 1px solid #dee2e6;
    font-size: 0.9em;
}

/* FIM - SELETOR PRODUTOS */


/* ARKER BADGE */
.arker-badge {
    padding: 10px 10px;
    border-radius: 10px;
    font-weight: bold;
    height: 30px;
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
}

/* ---------------- COMPROMETIDO ---------------- */
.status-roxo {
    background: #D7D2EB1A; /* variação 1 */
    color: #8878C4; /* cor principal */
}

    .status-roxo.substatus {
        background: #EBEBFF; /* variação 2 */
    }

/* ---------------- EM ANÁLISE ---------------- */
.status-amarelo {
    background: #FFEF9C1A; /* variação 1 */
    color: #F6940F; /* cor secundária (fonte) */
    /* cor principal do tema: #FFDB1A */
}

    .status-amarelo.substatus {
        background: #FFF9DB; /* variação 2 */
    }

/* ---------------- PAGO E PROGRAMADO ---------------- */
.status-verde {
    background: #80E3C91A; /* variação 1 */
    color: #05AF7F; /* cor principal */
}

    .status-verde.substatus {
        background: #E9FFF9; /* variação 2 */
    }

/* ---------------- SOLICITAÇÕES ---------------- */
.status-azul {
    background: #A9DAEE1A; /* variação 1 */
    color: #3E87A6; /* cor principal */
}

    .status-azul.substatus {
        background: #EBF9FF; /* variação 2 */
    }

/* ---------------- RECUSADO ---------------- */
.status-vermelho {
    background: #F7CFD31A; /* variação 1 */
    color: #DE4150; /* cor principal */
}

    .status-vermelho.substatus {
        background: #FFF4F5; /* variação 2 */
    }

/* FIM - ARKER BADGE */

/* ARKER RADIO */
.arker-radio {
    display: inline-flex;
    align-items: normal;
    margin: 0px;
    gap: 5px;
}

    .arker-radio input {
        display: none;
    }

    .arker-radio span {
        width: 18px;
        height: 18px;
        border: 2px solid #6c757d;
        border-radius: 50%;
        display: inline-block;
        position: relative;
    }

        .arker-radio span::after {
            content: "";
            width: 10px;
            height: 10px;
            background: var(--arker-blue);
            border-radius: 50%;
            position: absolute;
            top: 2px;
            left: 2px;
            opacity: 0;
            transition: .2s;
        }

    .arker-radio input:checked + span::after {
        opacity: 1;
    }
/* FIM - ARKER RADIO*/



/* DATATABLE CUSTOM PAGINATION */

.datatable-custom .dataTables_filter {
    margin-right: .75rem;
}

.datatable-custom div.dataTables_wrapper {
    margin: 0 auto;
}

.datatable-custom .dataTables_info {
    float: left;
    margin: 10px;
}

.datatable-custom .dataTables_paginate {
    float: right;
    margin: 20px;
}

.datatable-custom .dataTables_info,
.datatable-custom .dataTables_paginate {
    display: inline-flex !important;
}

    .datatable-custom .dataTables_paginate .paginate_button {
        padding: 10px;
        border: 1px solid #E0E0E0;
        cursor: pointer;
        height: 40px;
        display: inline-block;
    }

        .datatable-custom .dataTables_paginate .paginate_button:hover {
            color: #fff;
            background-color: var(--arker-blue);
            border: 1px solid #E0E0E0;
        }

        .datatable-custom .dataTables_paginate .paginate_button.active,
        .datatable-custom .dataTables_paginate .paginate_button.current {
            color: #fff;
            background-color: var(--arker-blue);
            border-color: var(--arker-blue);
        }

        .datatable-custom .dataTables_paginate .paginate_button:not(:first-child) {
            border-left: 0;
        }

    .datatable-custom .dataTables_paginate > .paginate_button:first-child {
        border-radius: 8px 0 0 8px;
    }

    .datatable-custom .dataTables_paginate > .paginate_button:last-child {
        border-radius: 0 8px 8px 0;
    }

.datatable-custom .dataTables_length select {
    height: 40px;
    border-radius: 8px;
    border: 1px solid #E0E0E0;
}

/* FIM DATATABLES CUSTOM PAGINATION */

/* TEXTAREA ARKER */
.textarea-arker {
    position: relative;
    max-width: 400px;
}

    .textarea-arker textarea {
        width: 100%;
        min-height: 100px;
        padding: 10px;
        box-sizing: border-box;
        border: 1px solid #ccc;
        font-size: 14px;
    }

        .textarea-arker textarea.error {
            border-color: red;
        }

.info {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.textarea-counter {
    font-size: 12px;
}

    .textarea-counter.error {
        color: red;
    }

.textarea-error {
    font-size: 12px;
    color: red;
    display: none;
}