/* Tema Suporte — primary roxo (ADM=azul, Vendas=verde) */
:root {
    --suporte-primary: #2e183b;
    --suporte-primary-hover: #44285a;
    --suporte-primary-active: #22122c;
    --suporte-primary-dark: #180f20;
    --suporte-primary-soft: rgba(46, 24, 59, 0.15);
    --suporte-primary-soft-strong: rgba(46, 24, 59, 0.2);
    --suporte-primary-ring: rgba(46, 24, 59, 0.5);
    --suporte-primary-tint: #f2edf4;
    --suporte-selected: #513164;
    --suporte-selected-hover: #5f3a74;
    --suporte-selected-soft: #ebe4ef;
    --suporte-loading-bg: rgba(255, 255, 255, 0.92);
}

/* Tela normal: fundo branco (sem banner azul do CDN) */
.modus-body {
    background-color: #fff !important;
    background-image: url("https://resources.upmobb.tech/images/logo_upmobb_bw.png") !important;
    background-repeat: no-repeat !important;
    background-position: calc(100% - 50px) calc(100% - 50px) !important;
    background-size: 550px auto !important;
}

@media screen and (max-width: 1281px) {
    .modus-body {
        background-position: calc(100% - 30px) calc(100% - 30px) !important;
        background-size: 550px auto !important;
    }
}

@media screen and (max-width: 1024px) {
    .modus-body {
        background-position: calc(100% - 30px) calc(100% - 30px) !important;
        background-size: 550px auto !important;
    }
}

@media screen and (max-width: 768px) {
    .modus-body {
        background-position: calc(100% - 25px) calc(100% - 25px) !important;
        background-size: 103px auto !important;
    }
}

/* Loading: overlay lilás no lugar do azul do CDN */
.loading-absolute,
.color-mask {
    background-color: var(--suporte-loading-bg) !important;
}

.bg-primary {
    background-color: var(--suporte-primary) !important;
}

a.bg-primary:hover,
a.bg-primary:focus,
button.bg-primary:hover,
button.bg-primary:focus {
    background-color: var(--suporte-primary-hover) !important;
}

.btn-primary {
    color: #fff;
    fill: #fff;
    background-color: var(--suporte-primary);
    border-color: var(--suporte-primary);
}

.btn-primary:hover,
.btn-primary.hover {
    color: #fff;
    background-color: var(--suporte-primary-hover);
    border-color: var(--suporte-primary-hover);
}

.btn-primary:focus,
.btn-primary.focus {
    box-shadow: 0 0 0 0.2rem var(--suporte-primary-ring);
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    background-color: var(--suporte-primary-active);
    border-color: var(--suporte-primary-active);
}

.btn-primary.disabled,
.btn-primary:disabled {
    color: #fff;
    background-color: var(--suporte-primary);
    border-color: var(--suporte-primary);
    opacity: 1;
}

.btn-outline-primary {
    color: var(--suporte-primary);
    fill: var(--suporte-primary);
    border-color: var(--suporte-primary);
}

.btn-outline-primary:hover,
.btn-outline-primary.hover {
    color: var(--suporte-primary-hover);
    background-color: var(--suporte-primary-soft);
    border-color: var(--suporte-primary-hover);
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
    box-shadow: 0 0 0 0.2rem var(--suporte-primary-ring);
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: var(--suporte-primary);
    background-color: transparent;
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    color: var(--suporte-primary-active);
    background-color: var(--suporte-primary-soft-strong);
    border-color: var(--suporte-primary-active);
}

.badge-primary {
    color: #fff;
    background-color: var(--suporte-primary);
}

a.badge-primary:hover,
a.badge-primary:focus {
    color: #fff;
    background-color: var(--suporte-primary-dark);
}

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

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

a.text-primary:hover,
a.text-primary:focus {
    color: var(--suporte-primary-dark) !important;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--suporte-primary) !important;
    background-color: var(--suporte-primary) !important;
}

.custom-checkbox .custom-control-input:focus ~ .custom-control-label::before,
.custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: 0 0 0 0.2rem var(--suporte-primary-ring) !important;
}

.custom-checkbox .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: var(--suporte-primary) !important;
}

.box-filter .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before,
.form-filter .custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--suporte-primary) !important;
    background-color: var(--suporte-primary) !important;
}

.spinner-border.text-primary {
    color: var(--suporte-primary) !important;
}

#nav-header #group-buttons-actions .btn,
#nav-header #group-buttons-actions .material-icons {
    color: #fff;
}

.bg-active {
    background-color: var(--suporte-selected) !important;
}

.bg-active:hover,
a.bg-active:focus,
button.bg-active:hover,
button.bg-active:focus {
    background-color: var(--suporte-selected-hover) !important;
}

.page-item.active .page-link {
    color: #fff;
    background-color: var(--suporte-selected);
    border-color: var(--suporte-selected);
}

.modus-footer .badge-primary {
    background-color: var(--suporte-selected);
}

.support-panel legend.bg-primary,
fieldset legend.bg-primary {
    background-color: var(--suporte-selected) !important;
}

.support-panel .border-primary,
fieldset.border-primary {
    border-color: var(--suporte-selected) !important;
}

.ico-sort-table {
    color: var(--suporte-primary);
}

.btn-classifield {
    cursor: pointer;
    user-select: none;
}

.btn-classifield:hover .ico-sort-table,
.btn-classifield:focus .ico-sort-table {
    color: var(--suporte-selected);
}

.box-filter .border-primary,
.form-filter .border-primary {
    border-color: var(--suporte-primary) !important;
}

.box-filter .btn-primary,
.form-filter .btn-primary {
    background-color: var(--suporte-primary);
    border-color: var(--suporte-primary);
}