/*
|--------------------------------------------------------------------------
| COMPESAPREV — Design System Administrativo
| Identidade institucional premium
|--------------------------------------------------------------------------
*/

:root {
    --cp-blue: #27348B;
    --cp-blue-dark: #1D286F;
    --cp-blue-soft: #EDF0FC;
    --cp-green: #5ABA5E;
    --cp-green-soft: #EDF8EE;
    --cp-white: #FFFFFF;
    --cp-bg: #F3F5F9;
    --cp-border: #E6EAF1;
    --cp-text: #26324A;
    --cp-muted: #78849A;
    --cp-shadow: 0 5px 22px rgba(32, 48, 91, .055);
    --cp-shadow-hover: 0 12px 30px rgba(32, 48, 91, .10);
    --cp-radius: 16px;
}

/* Base */

.fi-layout,
.fi-main {
    background: var(--cp-bg) !important;
}

.fi-main-ctn,
.fi-page {
    width: 100% !important;
    max-width: none !important;
}

.fi-main .fi-page {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.fi-main .fi-page > .fi-page-content {
    gap: 22px !important;
}

.fi-main .fi-wi {
    margin-bottom: 8px;
}

/* Cabeçalho institucional */

.fi-topbar {
    min-height: 68px !important;
    background: var(--cp-white) !important;
    border-bottom: 1px solid var(--cp-border) !important;
    box-shadow: 0 2px 10px rgba(32, 48, 91, .035) !important;
}

.fi-topbar-start {
    gap: 18px !important;
}

.fi-topbar-start img {
    display: block;
    width: auto !important;
    max-width: 190px;
    height: auto !important;
    max-height: 42px;
    object-fit: contain;
}

.fi-topbar .fi-topbar-start button {
    color: var(--cp-blue) !important;
    border-radius: 10px !important;
}

.fi-topbar .fi-topbar-start button:hover {
    background: var(--cp-blue-soft) !important;
}

.fi-topbar .fi-user-menu-trigger {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 5px !important;
    border: 1px solid var(--cp-border) !important;
    border-radius: 12px !important;
    background: #FFFFFF !important;
    transition: background .18s ease, border-color .18s ease,
                box-shadow .18s ease;
}

.fi-topbar .fi-user-menu-trigger:hover,
.fi-topbar .fi-user-menu-trigger:focus-visible {
    background: var(--cp-blue-soft) !important;
    border-color: #C8D0F0 !important;
    box-shadow: 0 0 0 3px rgba(39, 52, 139, .08);
    outline: none;
}

.fi-topbar .fi-user-menu-trigger .fi-user-avatar {
    border: 2px solid #E5EAF8;
}

/* Navegação lateral */

.fi-sidebar {
    background: var(--cp-blue) !important;
    border-right: 0 !important;
    box-shadow: 4px 0 18px rgba(23, 35, 91, .08);
}

.fi-sidebar-header {
    background: var(--cp-blue-dark) !important;
    border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
}

.fi-sidebar-nav {
    background: transparent !important;
    padding: 16px 12px !important;
}

.fi-sidebar .fi-sidebar-group-label {
    color: rgba(255, 255, 255, .58) !important;
    font-size: .68rem !important;
    font-weight: 750 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase;
}

.fi-sidebar .fi-sidebar-group-btn {
    color: rgba(255, 255, 255, .80) !important;
}

.fi-sidebar .fi-sidebar-item-btn {
    min-height: 43px;
    border-radius: 10px !important;
    color: rgba(255, 255, 255, .86) !important;
    transition: background .18s ease, color .18s ease,
                transform .18s ease;
}

.fi-sidebar .fi-sidebar-item-btn .fi-sidebar-item-label,
.fi-sidebar .fi-sidebar-item-btn .fi-sidebar-item-icon {
    color: inherit !important;
}

.fi-sidebar .fi-sidebar-item-btn:hover {
    background: rgba(255, 255, 255, .11) !important;
    color: #FFFFFF !important;
    transform: translateX(2px);
}

.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background: rgba(90, 186, 94, .20) !important;
    color: #FFFFFF !important;
    box-shadow: inset 3px 0 0 var(--cp-green);
}

.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-icon {
    color: #8BE18E !important;
}

/* Títulos e hierarquia */

.fi-main .fi-header {
    margin: 0 0 26px !important;
}

.fi-main .fi-header-heading {
    color: var(--cp-blue) !important;
    font-size: 1.8rem !important;
    font-weight: 800 !important;
    letter-spacing: -.045em !important;
}

.fi-main .fi-header-subheading {
    color: var(--cp-muted) !important;
    font-size: .9rem !important;
}

/* Indicadores */

.fi-main .fi-wi-stats-overview {
    gap: 16px !important;
}

.fi-main .fi-wi-stats-overview-stat {
    position: relative;
    min-height: 148px !important;
    padding: 22px !important;
    overflow: hidden;
    border: 1px solid var(--cp-border) !important;
    border-top: 3px solid var(--cp-blue) !important;
    border-radius: var(--cp-radius) !important;
    background: var(--cp-white) !important;
    box-shadow: var(--cp-shadow) !important;
    transition: transform .2s ease, box-shadow .2s ease;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(2) {
    border-top-color: #D9A441 !important;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(3) {
    border-top-color: #58A8D8 !important;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(4) {
    border-top-color: var(--cp-green) !important;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(5) {
    border-top-color: #D16B70 !important;
}

.fi-main .fi-wi-stats-overview-stat:hover {
    transform: translateY(-3px);
    box-shadow: var(--cp-shadow-hover) !important;
}

.fi-main .fi-wi-stats-overview-stat-label {
    color: #68748A !important;
    font-size: .81rem !important;
    font-weight: 700 !important;
}

.fi-main .fi-wi-stats-overview-stat-value {
    margin-top: 12px !important;
    color: var(--cp-blue) !important;
    font-size: 2.1rem !important;
    font-weight: 850 !important;
    letter-spacing: -.055em !important;
}

.fi-main .fi-wi-stats-overview-stat-description {
    margin-top: 9px !important;
    color: #8993A5 !important;
    font-size: .75rem !important;
}

/* Gráficos */

.fi-main .fi-wi-chart {
    min-height: 370px !important;
    padding: 24px !important;
    border: 1px solid var(--cp-border) !important;
    border-radius: 18px !important;
    background: var(--cp-white) !important;
    box-shadow: var(--cp-shadow) !important;
    transition: box-shadow .2s ease;
}

.fi-main .fi-wi-chart:hover {
    box-shadow: var(--cp-shadow-hover) !important;
}

.fi-main .fi-wi-chart .fi-section-header {
    margin-bottom: 20px !important;
}

.fi-main .fi-wi-chart .fi-section-header-heading {
    color: var(--cp-blue) !important;
    font-size: 1.04rem !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
}

.fi-main .fi-wi-chart .fi-section-header-description {
    margin-top: 5px !important;
    color: var(--cp-muted) !important;
    font-size: .79rem !important;
}

.fi-main .fi-wi-chart canvas {
    max-width: 100%;
}

/* Tabelas */

.fi-main .fi-ta-ctn {
    overflow: hidden;
    border: 1px solid var(--cp-border) !important;
    border-radius: 16px !important;
    background: #FFFFFF !important;
    box-shadow: var(--cp-shadow) !important;
}

.fi-main .fi-ta-header {
    background: #FAFBFD !important;
}

.fi-main .fi-ta-header-cell {
    color: #65718A !important;
    font-size: .72rem !important;
    font-weight: 750 !important;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.fi-main .fi-ta-row {
    border-color: #EDF0F5 !important;
    transition: background .15s ease;
}

.fi-main .fi-ta-row:hover {
    background: #F8FAFE !important;
}

/* Formulários */

.fi-main .fi-input-wrp,
.fi-main .fi-select-input {
    border-color: #DCE2EC !important;
    border-radius: 9px !important;
    box-shadow: none;
}

.fi-main .fi-input-wrp:focus-within {
    border-color: #7182D0 !important;
    box-shadow: 0 0 0 3px rgba(39, 52, 139, .09) !important;
}

/* Botões */

.fi-main .fi-btn-color-primary {
    --btn-bg: var(--cp-blue);
}

.fi-main .fi-btn-color-success {
    --btn-bg: var(--cp-green);
}

/* Menu de usuário */

.fi-user-menu .fi-dropdown-list-item {
    border-radius: 9px !important;
}

/* Responsividade */

@media (min-width: 1280px) {
    .fi-main:has(.fi-ta-ctn) {
        width: 100% !important;
        max-width: none !important;
    }
}

@media (max-width: 1023px) {
    .fi-main .fi-page {
        padding-left: 22px !important;
        padding-right: 22px !important;
    }
}

@media (max-width: 767px) {
    .fi-topbar {
        min-height: 60px !important;
    }

    .fi-topbar-start {
        gap: 10px !important;
    }

    .fi-topbar-start img {
        max-width: 145px;
        max-height: 34px;
    }

    .fi-main .fi-page {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    .fi-main .fi-header-heading {
        font-size: 1.4rem !important;
    }

    .fi-main .fi-wi-stats-overview-stat {
        min-height: 125px !important;
        padding: 17px !important;
    }

    .fi-main .fi-wi-chart {
        min-height: 310px !important;
        padding: 17px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fi-main *,
    .fi-sidebar * {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}


/* COMPESAPREV — Central de Inteligência Executiva */

.fi-main:has(.fi-wi-stats-overview) .fi-header {
    position: relative;
    overflow: hidden;
    padding: 25px 28px !important;
    border: 1px solid #E4E9F2;
    border-radius: 20px;
    background:
        radial-gradient(circle at 94% 10%, rgba(90, 186, 94, .13), transparent 24%),
        linear-gradient(115deg, #FFFFFF 0%, #F7F8FD 72%, #F0F7F0 100%);
    box-shadow: 0 8px 28px rgba(32, 48, 91, .045);
}

.fi-main:has(.fi-wi-stats-overview) .fi-header-heading {
    position: relative;
    z-index: 1;
    font-size: 2rem !important;
    letter-spacing: -.055em !important;
}

.fi-main:has(.fi-wi-stats-overview) .fi-header-heading::before {
    display: block;
    margin-bottom: 7px;
    color: var(--cp-green);
    content: "COMPESAPREV  /  INTELIGÊNCIA OPERACIONAL";
    font-size: .65rem;
    font-weight: 800;
    letter-spacing: .13em;
}

.fi-main:has(.fi-wi-stats-overview) .fi-header-subheading {
    position: relative;
    z-index: 1;
    max-width: 720px;
    font-size: .9rem !important;
    line-height: 1.6;
}

.fi-main .fi-wi-stats-overview {
    gap: 15px !important;
}

.fi-main .fi-wi-stats-overview-stat {
    min-height: 154px !important;
    border-radius: 17px !important;
    background:
        linear-gradient(145deg, #FFFFFF 0%, #FBFCFE 100%) !important;
    box-shadow: 0 5px 20px rgba(32, 48, 91, .055) !important;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(5) {
    border-top-color: var(--cp-green) !important;
}

.fi-main .fi-wi-stats-overview-stat:nth-child(6) {
    border-top-color: #D16B70 !important;
}

.fi-main .fi-wi-stats-overview-stat-value {
    font-size: clamp(1.65rem, 2vw, 2.15rem) !important;
    font-variant-numeric: tabular-nums;
}

.fi-main .fi-wi-chart {
    border-radius: 19px !important;
    box-shadow: 0 6px 24px rgba(32, 48, 91, .05) !important;
}

.fi-main .fi-wi-chart .fi-section-header-heading {
    font-size: 1.08rem !important;
}

@media (max-width: 767px) {
    .fi-main:has(.fi-wi-stats-overview) .fi-header {
        padding: 19px !important;
        border-radius: 15px;
    }

    .fi-main:has(.fi-wi-stats-overview) .fi-header-heading {
        font-size: 1.55rem !important;
    }

    .fi-main:has(.fi-wi-stats-overview) .fi-header-heading::before {
        font-size: .57rem;
    }
}

/* COMPESAPREV — Radar de Atenção Gerencial */
.cp-radar {
    padding: 25px;
    overflow: hidden;
    border: 1px solid #E2E8F1;
    border-radius: 20px;
    background: radial-gradient(ellipse at 100% 0%, rgba(90,186,94,.09), transparent 34%), linear-gradient(135deg,#FFF,#F9FAFD);
    box-shadow: 0 8px 28px rgba(32,48,91,.055);
}
.cp-radar-heading {
    display:flex; align-items:center; justify-content:space-between;
    gap:20px; margin-bottom:22px;
}
.cp-radar-eyebrow {
    color:#5ABA5E; font-size:.65rem; font-weight:850; letter-spacing:.13em;
}
.cp-radar-heading h2 {
    margin:5px 0 4px; color:#27348B; font-size:1.22rem;
    font-weight:850; letter-spacing:-.035em;
}
.cp-radar-heading p { margin:0; color:#78849A; font-size:.8rem; }
.cp-radar-status {
    display:inline-flex; align-items:center; gap:8px; padding:9px 13px;
    border:1px solid #E6EAF1; border-radius:999px; background:#FFF;
    color:#59657A; font-size:.72rem; font-weight:700;
}
.cp-radar-status-dot {
    width:8px; height:8px; flex:0 0 8px; border-radius:50%; background:#D16B70;
}
.cp-radar-status.all-clear .cp-radar-status-dot { background:#5ABA5E; }
.cp-radar-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.cp-radar-card {
    min-width:0; min-height:165px; padding:17px; overflow:hidden;
    border:1px solid #E8ECF3; border-top:3px solid #27348B;
    border-radius:14px; background:#FFF;
    transition:transform .2s ease,box-shadow .2s ease;
}
.cp-radar-card:hover { transform:translateY(-3px); box-shadow:0 9px 22px rgba(32,48,91,.09); }
.cp-radar-card.tone-danger { border-top-color:#D16B70; }
.cp-radar-card.tone-warning { border-top-color:#E6AD42; }
.cp-radar-card.tone-attention { border-top-color:#27348B; }
.cp-radar-card.tone-info { border-top-color:#58A8D8; }
.cp-radar-card-top { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.cp-radar-symbol {
    display:inline-flex; align-items:center; justify-content:center;
    width:29px; height:29px; border-radius:9px;
    background:#EDF0FC; color:#27348B; font-size:1rem; font-weight:850;
}
.tone-danger .cp-radar-symbol { background:#FBEDEE; color:#B84E55; }
.tone-warning .cp-radar-symbol { background:#FFF5E3; color:#A87519; }
.tone-info .cp-radar-symbol { background:#EAF5FB; color:#347DA7; }
.cp-radar-indicator { color:#A0A9B8; font-size:.55rem; font-weight:800; letter-spacing:.08em; }
.cp-radar-value {
    margin-top:12px; color:#27348B; font-size:2rem; font-weight:850;
    letter-spacing:-.06em; line-height:1.1; font-variant-numeric:tabular-nums;
}
.tone-danger .cp-radar-value { color:#B84E55; }
.tone-warning .cp-radar-value { color:#A87519; }
.cp-radar-card h3 { margin:7px 0 4px; color:#26324A; font-size:.83rem; font-weight:800; }
.cp-radar-card p { margin:0; color:#8792A4; font-size:.68rem; line-height:1.5; }
@media(max-width:1100px) { .cp-radar-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) {
    .cp-radar { padding:18px; border-radius:15px; }
    .cp-radar-heading { align-items:flex-start; flex-direction:column; }
    .cp-radar-grid { gap:9px; }
    .cp-radar-card { min-height:150px; padding:13px; }
    .cp-radar-value { font-size:1.7rem; }
}
@media(max-width:390px) { .cp-radar-grid { grid-template-columns:1fr; } }



/* COMPESAPREV — Camada executiva do dashboard */
.fi-main .fi-wi-stats-overview {
    gap: 16px !important;
}
.fi-main .fi-wi-stats-overview-stat {
    min-height: 158px !important;
    padding: 22px !important;
    border: 1px solid #E4E9F2 !important;
    border-top: 3px solid #27348B !important;
    border-radius: 17px !important;
    background: linear-gradient(145deg, #FFFFFF, #F9FAFD) !important;
    box-shadow: 0 7px 24px rgba(32, 48, 91, .065) !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(2),
.fi-main .fi-wi-stats-overview-stat:nth-child(3) {
    border-top-color: #E6AD42 !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(4) {
    border-top-color: #58A8D8 !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(5) {
    border-top-color: #8790B9 !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(6) {
    border-top-color: #5ABA5E !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(7) {
    border-top-color: #D16B70 !important;
}
.fi-main .fi-wi-stats-overview-stat:nth-child(8) {
    border-top-color: #27348B !important;
}
.fi-main .fi-wi-stats-overview-stat-value {
    font-size: clamp(1.55rem, 2vw, 2.15rem) !important;
    font-weight: 850 !important;
    font-variant-numeric: tabular-nums;
}
.fi-main .fi-wi-chart {
    min-height: 390px !important;
    padding: 25px !important;
    border: 1px solid #E3E8F1 !important;
    border-radius: 19px !important;
    background: #FFFFFF !important;
    box-shadow: 0 7px 25px rgba(32, 48, 91, .055) !important;
}
.fi-main .fi-wi-chart .fi-section-header-heading {
    font-size: 1.12rem !important;
    font-weight: 850 !important;
}
@media (max-width: 767px) {
    .fi-main .fi-wi-stats-overview-stat {
        min-height: 130px !important;
        padding: 16px !important;
    }
    .fi-main .fi-wi-chart {
        min-height: 330px !important;
        padding: 17px !important;
    }
}

/* ==========================================================
   COMPESAPREV — SIDEBAR ADMINISTRATIVA
   Identidade visual alinhada à tela de login
   ========================================================== */

/* Largura proporcional ao conteúdo dos menus */
@media (min-width: 1024px) {
    .fi-layout {
        --sidebar-width: 17rem !important;
    }

    .fi-sidebar {
        width: 17rem !important;
        min-width: 17rem !important;
    }
}

/* Fundo contínuo: azul do login, escuro na base */
.fi-sidebar {
    position: relative !important;
    isolation: isolate;
    overflow: hidden;
    border: 0 !important;
    background:
        radial-gradient(
            ellipse at 15% 15%,
            rgba(0,119,182,.22),
            transparent 42%
        ),
        radial-gradient(
            ellipse at 90% 85%,
            rgba(39,52,139,.70),
            transparent 48%
        ),
        linear-gradient(
            145deg,
            #0077B6 0%,
            #075985 55%,
            #123A75 100%
        ) !important;
    box-shadow: 5px 0 24px rgba(15,35,85,.13) !important;
}

/* Trilhas tecnológicas de fundo */
.fi-sidebar::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    opacity: .42;
    background-image:
        linear-gradient(90deg, transparent 0 16%, rgba(143,217,245,.8) 16.1%, transparent 16.35%) 0 18% / 100% 2px no-repeat,
        linear-gradient(90deg, transparent 0 16%, rgba(143,217,245,.7) 16.1%, transparent 16.35%) 0 68% / 100% 2px no-repeat,
        linear-gradient(90deg, transparent 0 48%, rgba(143,217,245,.7) 48.1%, transparent 48.35%) 0 38% / 100% 2px no-repeat,
        linear-gradient(90deg, transparent 0 35%, rgba(143,217,245,.6) 35.1%, transparent 35.35%) 0 86% / 100% 2px no-repeat,
        linear-gradient(135deg, transparent 48%, rgba(143,217,245,.7) 49%, rgba(143,217,245,.7) 50%, transparent 51%) 16% 18% / 115px 65px no-repeat,
        linear-gradient(45deg, transparent 48%, rgba(143,217,245,.65) 49%, rgba(143,217,245,.65) 50%, transparent 51%) 48% 38% / 125px 75px no-repeat,
        linear-gradient(135deg, transparent 48%, rgba(143,217,245,.6) 49%, rgba(143,217,245,.6) 50%, transparent 51%) 35% 86% / 120px 65px no-repeat,
        radial-gradient(circle, #BCEBFC 0 2px, transparent 3px) 16% 18% / 100% 100% no-repeat,
        radial-gradient(circle, #BCEBFC 0 2px, transparent 3px) 48% 38% / 100% 100% no-repeat,
        radial-gradient(circle, #BCEBFC 0 2px, transparent 3px) 35% 86% / 100% 100% no-repeat;
}

/* Iluminação discreta na região inferior */
.fi-sidebar::after {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(7,35,91,.08) 48%,
            rgba(7,35,91,.38) 100%
        );
}

/* Cabeçalho integrado ao degradê */
.fi-sidebar-header {
    position: relative;
    z-index: 1;
    min-height: 88px !important;
    padding: 17px 22px !important;
    background: rgba(7,39,91,.18) !important;
    border-bottom: 1px solid rgba(255,255,255,.17) !important;
    box-shadow: 0 5px 18px rgba(5,28,75,.10);
}

/* Logomarca branca */
.fi-sidebar-header img {
    display: block;
    width: auto !important;
    max-width: 190px !important;
    height: auto !important;
    max-height: 46px !important;
    object-fit: contain;
    filter: drop-shadow(0 2px 5px rgba(0,0,0,.12));
}

/* Navegação */
.fi-sidebar-nav {
    position: relative;
    z-index: 1;
    padding: 20px 13px !important;
    background: transparent !important;
}

/* Grupos */
.fi-sidebar .fi-sidebar-group {
    margin-bottom: 13px;
}

.fi-sidebar .fi-sidebar-group-label {
    padding: 0 11px !important;
    color: rgba(222,243,255,.76) !important;
    font-size: .66rem !important;
    font-weight: 800 !important;
    letter-spacing: .105em !important;
}

.fi-sidebar .fi-sidebar-group-btn {
    color: rgba(255,255,255,.88) !important;
}

/* Itens e alinhamento */
.fi-sidebar .fi-sidebar-item-btn {
    display: flex !important;
    align-items: center !important;
    gap: 11px !important;
    min-height: 44px !important;
    padding: 9px 12px !important;
    border: 1px solid transparent !important;
    border-radius: 10px !important;
    color: rgba(255,255,255,.91) !important;
    transition:
        background .18s ease,
        border-color .18s ease,
        transform .18s ease !important;
}

.fi-sidebar .fi-sidebar-item-btn .fi-sidebar-item-label {
    min-width: 0;
    color: inherit !important;
    font-size: .84rem !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

.fi-sidebar .fi-sidebar-item-btn .fi-sidebar-item-icon {
    flex: 0 0 19px;
    width: 19px !important;
    height: 19px !important;
    color: rgba(207,237,252,.92) !important;
}

.fi-sidebar .fi-sidebar-item-btn:hover {
    transform: translateX(2px);
    border-color: rgba(255,255,255,.12) !important;
    background: rgba(255,255,255,.12) !important;
    color: #FFFFFF !important;
}

/* Item selecionado */
.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    border-color: rgba(255,255,255,.17) !important;
    background:
        linear-gradient(
            100deg,
            rgba(90,186,94,.27),
            rgba(255,255,255,.13)
        ) !important;
    color: #FFFFFF !important;
    box-shadow:
        inset 3px 0 0 #8CC63F,
        0 4px 13px rgba(5,28,75,.12) !important;
}

.fi-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-sidebar-item-icon {
    color: #A9E8A7 !important;
}

/* Indicadores de submenus */
.fi-sidebar .fi-sidebar-group-collapse-btn {
    color: rgba(255,255,255,.75) !important;
}

/* Rolagem sem esconder os elementos decorativos */
.fi-sidebar-nav {
    scrollbar-color: rgba(255,255,255,.28) transparent;
    scrollbar-width: thin;
}

/* Sidebar recolhida: preservar comportamento do Filament */
@media (min-width: 1024px) {
    .fi-sidebar.fi-sidebar-collapsed {
        width: 5rem !important;
        min-width: 5rem !important;
    }
}

/* Ajustes para telas menores */
@media (max-width: 1023px) {
    .fi-sidebar {
        box-shadow: 8px 0 28px rgba(10,28,75,.22) !important;
    }

    .fi-sidebar-header {
        min-height: 76px !important;
    }
}


/* ==========================================================
   COMPESAPREV — ESTRUTURA DEFINITIVA DO ADMIN
   Sidebar fixa + topbar independente + conteúdo responsivo
   ========================================================== */

@media (min-width: 1024px) {
    :root {
        --compesa-sidebar-width: 17rem;
        --compesa-topbar-height: 60px;
    }

    /* Topbar: está fora de .fi-layout no Blade do Filament. */
    .fi-topbar-ctn {
        position: fixed !important;
        top: 0 !important;
        left: var(--compesa-sidebar-width) !important;
        right: 0 !important;
        width: auto !important;
        max-width: none !important;
        height: var(--compesa-topbar-height) !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 20 !important;
        background: #FFFFFF !important;
        box-shadow: 0 2px 12px rgba(20, 39, 75, .07) !important;
    }

    .fi-topbar {
        display: flex !important;
        width: 100% !important;
        max-width: none !important;
        min-height: var(--compesa-topbar-height) !important;
        height: var(--compesa-topbar-height) !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #FFFFFF !important;
    }

    /* Grid: o Livewire da sidebar é um wrapper, não a sidebar direta. */
    .fi-layout {
        display: grid !important;
        grid-template-columns: var(--compesa-sidebar-width) minmax(0, 1fr) !important;
        align-items: stretch !important;
        width: 100% !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 0 !important;
    }

    /* Overlay é exclusivo do menu móvel. */
    .fi-layout > .fi-sidebar-close-overlay {
        display: none !important;
    }

    /* Wrapper raiz do componente Livewire que contém #fi-main-sidebar. */
    .fi-layout > div:has(> #fi-main-sidebar) {
        grid-column: 1 !important;
        grid-row: 1 !important;
        position: relative !important;
        display: block !important;
        width: var(--compesa-sidebar-width) !important;
        min-width: var(--compesa-sidebar-width) !important;
        max-width: var(--compesa-sidebar-width) !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        z-index: 110 !important;
    }

    /* Faixa azul contínua do topo ao fundo da janela. */
    #fi-main-sidebar.fi-sidebar {
        position: fixed !important;
        top: 0 !important;
        bottom: 0 !important;
        left: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        width: var(--compesa-sidebar-width) !important;
        min-width: var(--compesa-sidebar-width) !important;
        max-width: var(--compesa-sidebar-width) !important;
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border: 0 !important;
        border-radius: 0 !important;
        z-index: 110 !important;
    }

    /* Cabeçalho e marca antes do primeiro item de navegação. */
    #fi-main-sidebar .fi-sidebar-header-ctn {
        display: block !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        min-height: 92px !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: visible !important;
        opacity: 1 !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #fi-main-sidebar .fi-sidebar-header {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        height: 92px !important;
        min-height: 92px !important;
        margin: 0 !important;
        padding: 16px 18px !important;
        border: 0 !important;
        border-bottom: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #fi-main-sidebar .fi-sidebar-header-logo-ctn,
    #fi-main-sidebar .fi-sidebar-header-logo-ctn a {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        min-width: 0 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #fi-main-sidebar .fi-sidebar-header-logo-ctn .fi-logo,
    #fi-main-sidebar .fi-sidebar-header-logo-ctn img {
        display: block !important;
        width: auto !important;
        height: auto !important;
        max-width: 190px !important;
        max-height: 46px !important;
        object-fit: contain !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    #fi-main-sidebar .fi-sidebar-nav {
        display: block !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
        width: 100% !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding: 20px 13px !important;
        background: transparent !important;
    }

    /* Conteúdo ocupa a coluna à direita, abaixo da topbar. */
    .fi-layout > .fi-main-ctn {
        grid-column: 2 !important;
        grid-row: 1 !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 100vh !important;
        margin: 0 !important;
        padding: var(--compesa-topbar-height) 0 0 !important;
    }

    .fi-main-ctn > .fi-main {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin-inline: 0 !important;
    }

    /* Evita que o logo seja duplicado na barra superior. */
    .fi-topbar .fi-topbar-start .fi-logo,
    .fi-topbar .fi-topbar-start a:has(.fi-logo) {
        display: none !important;
    }
}

/* Mantém o menu móvel sob controle do próprio Filament. */
@media (max-width: 1023px) {
    .fi-layout {
        display: block !important;
        min-height: 100vh !important;
    }

    .fi-topbar-ctn {
        position: relative !important;
        inset: auto !important;
        width: 100% !important;
    }

    .fi-sidebar {
        height: 100vh !important;
        height: 100dvh !important;
        min-height: 100vh !important;
    }

    .fi-sidebar-header-ctn {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .fi-main-ctn {
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
    }

    .fi-main .fi-page {
        width: 100% !important;
        max-width: none !important;
    }
}

/* Expansão proporcional das páginas de relatórios e listagens.
   O dashboard aprovado permanece preservado. */
.fi-main:not(:has(.fi-wi-stats-overview)) {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.fi-main:not(:has(.fi-wi-stats-overview)) .fi-page {
    width: 100% !important;
    max-width: none !important;
    margin-inline: 0 !important;
    padding-left: clamp(18px, 2vw, 34px) !important;
    padding-right: clamp(18px, 2vw, 34px) !important;
}

.fi-main:not(:has(.fi-wi-stats-overview)) .fi-page-content,
.fi-main:not(:has(.fi-wi-stats-overview)) .fi-container,
.fi-main:not(:has(.fi-wi-stats-overview)) .fi-ta-ctn,
.fi-main:not(:has(.fi-wi-stats-overview)) .fi-section {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

.fi-main:not(:has(.fi-wi-stats-overview)) .fi-ta-ctn {
    overflow-x: auto !important;
}


/* COMPESAPREV — CENTRALIZACAO DA MARCA E NAVEGACAO */
@media (min-width: 1024px) {
    #fi-main-sidebar .fi-sidebar-header {
        justify-content: center !important;
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    #fi-main-sidebar .fi-sidebar-header-logo-ctn,
    #fi-main-sidebar .fi-sidebar-header-logo-ctn a {
        justify-content: center !important;
        text-align: center !important;
    }

    #fi-main-sidebar .fi-sidebar-header-logo-ctn img,
    #fi-main-sidebar .fi-sidebar-header-logo-ctn .fi-logo {
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #fi-main-sidebar .fi-sidebar-nav {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    #fi-main-sidebar .fi-sidebar-group,
    #fi-main-sidebar .fi-sidebar-item {
        width: 100% !important;
    }

    #fi-main-sidebar .fi-sidebar-item-btn {
        justify-content: flex-start !important;
        width: 100% !important;
    }
}

/* COMPESAPREV — SIMETRIA DAS MARGENS DOS MENUS */
@media (min-width: 1024px) {
    #fi-main-sidebar .fi-sidebar-nav {
        box-sizing: border-box !important;
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    #fi-main-sidebar .fi-sidebar-group,
    #fi-main-sidebar .fi-sidebar-item,
    #fi-main-sidebar .fi-sidebar-item-btn {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #fi-main-sidebar .fi-sidebar-item-btn {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    #fi-main-sidebar .fi-sidebar-group-label {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
}


/* COMPESAPREV — RECORTE QUADRADO COM TRILHAS NAS DUAS BORDAS */

@media (min-width: 1024px) {

    #fi-main-sidebar .fi-sidebar-nav {
        display: flex !important;
        flex-direction: column !important;
    }

    #fi-main-sidebar .fi-sidebar-nav-groups {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        width: 100% !important;
    }

    #fi-main-sidebar .fi-sidebar-nav .cp-sidebar-circuit {
        display: block !important;
        position: relative !important;
        flex: 0 0 340px !important;
        width: calc(100% + 80px) !important;
        height: 340px !important;
        min-height: 340px !important;
        margin: auto -40px 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        pointer-events: none !important;
        z-index: 0 !important;

        background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22330%22%20height%3D%22330%22%20viewBox%3D%22870%20500%20330%20330%22%20preserveAspectRatio%3D%22none%22%3E%3Csvg%20x%3D%220%22%20y%3D%220%22%20width%3D%221200%22%20height%3D%22900%22%20viewBox%3D%220%200%201200%20900%22%20preserveAspectRatio%3D%22none%22%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22%238FD9F5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%0A%3C%21--%20Trilhas%20principais%20--%3E%0A%3Cg%20stroke-width%3D%222.1%22%20opacity%3D%22.38%22%3E%0A%20%3Cpath%20d%3D%22M1200%2080%20H1110%20Q1080%2080%201080%20110%20V180%20H1035%20Q1005%20180%201005%20210%20V270%20H940%20Q915%20270%20915%20295%20V330%20H850%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20125%20H1160%20V190%20Q1160%20220%201130%20220%20H1090%20V275%20H1050%20Q1025%20275%201025%20300%20V350%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20335%20H1145%20Q1115%20335%201115%20365%20V420%20H1060%20Q1030%20420%201030%20450%20V495%20H965%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20390%20H1175%20V455%20Q1175%20480%201150%20480%20H1110%20V530%20H1065%20Q1040%20530%201040%20555%20V590%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20620%20H1140%20V585%20Q1140%20555%201110%20555%20H1075%20V620%20H1015%20Q985%20620%20985%20650%20V710%20H925%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20700%20H1165%20V665%20H1120%20Q1090%20665%201090%20695%20V760%20H1030%20Q1000%20760%201000%20790%20V830%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20700%20H65%20V660%20Q65%20630%2095%20630%20H150%20V580%20H205%20Q235%20580%20235%20550%20V515%20H285%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20765%20H35%20V735%20H85%20Q115%20735%20115%20705%20V680%20H165%22%2F%3E%0A%20%3Cpath%20d%3D%22M760%200%20V55%20Q760%2085%20790%2085%20H845%20V130%20H900%20Q930%20130%20930%20160%20V205%22%2F%3E%0A%20%3Cpath%20d%3D%22M855%200%20V25%20H900%20Q930%2025%20930%2055%20V85%20H980%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Ramifica%C3%A7%C3%B5es%20secund%C3%A1rias%20--%3E%0A%3Cg%20stroke-width%3D%221.25%22%20opacity%3D%22.32%22%3E%0A%20%3Cpath%20d%3D%22M1035%20180%20V145%20H1000%20V115%20H970%22%2F%3E%0A%20%3Cpath%20d%3D%22M915%20295%20H875%20V260%20H840%22%2F%3E%0A%20%3Cpath%20d%3D%22M1060%20420%20V385%20H1025%20V355%20H990%22%2F%3E%0A%20%3Cpath%20d%3D%22M965%20495%20H925%20V465%20H895%20V435%22%2F%3E%0A%20%3Cpath%20d%3D%22M1015%20620%20V585%20H980%20V555%20H950%22%2F%3E%0A%20%3Cpath%20d%3D%22M925%20710%20H885%20V675%20H850%20V645%22%2F%3E%0A%20%3Cpath%20d%3D%22M205%20580%20V620%20H245%20V650%20H280%22%2F%3E%0A%20%3Cpath%20d%3D%22M150%20630%20V600%20H120%20V570%20H90%22%2F%3E%0A%20%3Cpath%20d%3D%22M845%20130%20V165%20H810%20V195%20H780%22%2F%3E%0A%20%3Cpath%20d%3D%22M900%2085%20V115%20H935%20V145%20H970%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Circuitos%20finos%20e%20detalhes%20internos%20--%3E%0A%3Cg%20stroke-width%3D%22.85%22%20opacity%3D%22.23%22%3E%0A%20%3Cpath%20d%3D%22M1200%20175%20H1180%20V205%20H1150%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20250%20H1175%20V280%20H1145%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20465%20H1180%20V495%20H1150%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20555%20H1170%20V575%20H1140%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20800%20H1170%20V825%20H1140%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20600%20H30%20V575%20H60%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20825%20H45%20V800%20H75%22%2F%3E%0A%20%3Cpath%20d%3D%22M700%200%20V30%20H730%20V55%22%2F%3E%0A%20%3Cpath%20d%3D%22M950%200%20V20%20H980%20V45%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Terminais%20circulares%20--%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22%23BCEBFC%22%20stroke-width%3D%221.4%22%20opacity%3D%22.58%22%3E%0A%20%3Ccircle%20cx%3D%22850%22%20cy%3D%22330%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%22850%22%20cy%3D%22330%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22940%22%20cy%3D%22270%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22940%22%20cy%3D%22270%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22965%22%20cy%3D%22495%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%22965%22%20cy%3D%22495%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22925%22%20cy%3D%22710%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22925%22%20cy%3D%22710%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22285%22%20cy%3D%22515%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22285%22%20cy%3D%22515%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22780%22%20cy%3D%22195%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22780%22%20cy%3D%22195%22%20r%3D%221.7%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Pads%20retangulares%20e%20pequenos%20contatos%20--%3E%0A%3Cg%20fill%3D%22%23BCEBFC%22%20opacity%3D%22.36%22%3E%0A%20%3Crect%20x%3D%221030%22%20y%3D%22174%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%221057%22%20y%3D%22416%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%221009%22%20y%3D%22616%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%22145%22%20y%3D%22576%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%22840%22%20y%3D%22126%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Ccircle%20cx%3D%22970%22%20cy%3D%22115%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22990%22%20cy%3D%22355%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22895%22%20cy%3D%22435%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22850%22%20cy%3D%22645%22%20r%3D%222%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E%3C%2Fsvg%3E") !important;
        background-repeat: no-repeat !important;
        background-size: 100% 100% !important;
        background-position: right bottom !important;

        opacity: .95 !important;

        -webkit-mask-image: linear-gradient(
            to top,
            #000 0%,
            rgba(0,0,0,.96) 48%,
            rgba(0,0,0,.70) 76%,
            transparent 100%
        ) !important;

        mask-image: linear-gradient(
            to top,
            #000 0%,
            rgba(0,0,0,.96) 48%,
            rgba(0,0,0,.70) 76%,
            transparent 100%
        ) !important;
    }
}

@media (max-width: 1023px) {
    #fi-main-sidebar .cp-sidebar-circuit {
        display: none !important;
    }
}


/* =========================================================
   COMPESAPREV — MENU DE USUÁRIO ADMINISTRATIVO
   ========================================================= */

.fi-topbar .fi-user-menu-trigger {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 11px !important;
    min-height: 46px !important;
    padding: 5px 13px 5px 6px !important;
    border: 1px solid var(--cp-border) !important;
    border-radius: 12px !important;
    background: #FFFFFF !important;
    color: #27348B !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    transition: background .2s ease, border-color .2s ease,
                box-shadow .2s ease !important;
}

.fi-topbar .fi-user-menu-trigger::after {
    content: "Minha conta  ▾";
    white-space: nowrap;
    color: #27348B;
    font-size: 13px;
    font-weight: 600;
}

.fi-topbar .fi-user-menu-trigger:hover,
.fi-topbar .fi-user-menu-trigger:focus-visible {
    background: #F1F4FF !important;
    border-color: #C8D2F2 !important;
    box-shadow: 0 3px 10px rgba(39, 52, 139, .08) !important;
}

.fi-topbar .fi-user-menu-trigger .fi-user-avatar {
    flex-shrink: 0;
    border: 2px solid #E5EAF8 !important;
}

.fi-user-menu .fi-dropdown-panel {
    min-width: 230px !important;
    padding: 7px !important;
    border: 1px solid #E7EAF1 !important;
    border-radius: 14px !important;
    box-shadow: 0 12px 32px rgba(32, 48, 91, .14) !important;
}

.fi-user-menu .fi-dropdown-list {
    gap: 4px !important;
}

.fi-user-menu .fi-dropdown-list-item {
    min-height: 40px !important;
    border-radius: 9px !important;
    font-weight: 500 !important;
}

.fi-user-menu .fi-dropdown-list-item:hover {
    background: #F1F4FF !important;
}

.fi-user-menu .fi-dropdown-list-item-color-danger {
    margin-top: 5px !important;
    border-top: 1px solid #F0E5E5 !important;
    border-radius: 9px !important;
}

@media (max-width: 640px) {
    .fi-topbar .fi-user-menu-trigger {
        gap: 0 !important;
        padding: 5px !important;
    }

    .fi-topbar .fi-user-menu-trigger::after {
        content: "▾";
        margin-left: 5px;
    }
}



/* COMPESAPREV — BOTÃO DE USUÁRIO SOMENTE COM ÍCONE */

.fi-topbar .fi-user-menu-trigger {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid #DCE3F2 !important;
    border-radius: 13px !important;
    background: #FFFFFF !important;
    color: #27348B !important;
    box-shadow: 0 2px 7px rgba(39, 52, 139, .06) !important;
    transition: all .2s ease !important;
}

.fi-topbar .fi-user-menu-trigger::after {
    content: none !important;
    display: none !important;
}

.fi-topbar .fi-user-menu-trigger .cp-user-menu-icon {
    width: 25px !important;
    height: 25px !important;
    color: #27348B !important;
}

.fi-topbar .fi-user-menu-trigger:hover,
.fi-topbar .fi-user-menu-trigger:focus-visible {
    background: #F1F4FF !important;
    border-color: #AEBDEB !important;
    box-shadow: 0 4px 12px rgba(39, 52, 139, .13) !important;
    transform: translateY(-1px);
}

.fi-topbar .fi-user-menu-trigger .fi-user-avatar {
    display: none !important;
}

.fi-user-menu .fi-dropdown-panel {
    min-width: 220px !important;
}

.fi-user-menu .fi-dropdown-list-item {
    min-height: 42px !important;
    border-radius: 9px !important;
}

.fi-user-menu .fi-dropdown-list-item-color-danger {
    margin-top: 5px !important;
    border-top: 1px solid #F0E5E5 !important;
}



/* COMPESAPREV — CORREÇÃO DE ALINHAMENTO DO MENU */

.fi-topbar {
    padding-inline: 24px !important;
}

.fi-topbar nav,
.fi-topbar .fi-topbar-ctn {
    min-width: 0 !important;
}

.fi-topbar-end {
    margin-left: auto !important;
    justify-content: flex-end !important;
    padding-right: 0 !important;
}

.fi-topbar .fi-user-menu {
    margin-left: auto !important;
    margin-right: 0 !important;
}

@media (max-width: 768px) {
    .fi-topbar {
        padding-inline: 14px !important;
    }
}

/* COMPESAPREV — CORREÇÃO DEFINITIVA DO RECUO DA NAVEGAÇÃO */
@media (min-width: 1024px) {
    #fi-main-sidebar .fi-sidebar-nav-groups {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* COMPESAPREV — BARRA SUPERIOR CINZA CLARO SEM SOMBRA */
.fi-topbar {
    background-color: #f1f3f7 !important;
    box-shadow: none !important;
    border-bottom: 0 !important;
}

.fi-topbar::before,
.fi-topbar::after {
    box-shadow: none !important;
}

/* COMPESAPREV — FUNDO UNIFICADO DO DASHBOARD */
.fi-main:has(.fi-wi-stats-overview) {
    background-color: #f1f3f7 !important;
}

/* COMPESAPREV — UNIFICAÇÃO EXATA DO FUNDO DO ADMINISTRATIVO */
.fi-main:has(.fi-wi-stats-overview),
.fi-main:has(.fi-wi-stats-overview) .fi-page,
.fi-main:has(.fi-wi-stats-overview) .fi-page-content,
.fi-main:has(.fi-wi-stats-overview) .fi-main-ctn {
    background-color: #f1f3f7 !important;
}

/* COMPESAPREV — SOMBRA SUAVE NA BARRA SUPERIOR */
.fi-topbar {
    background-color: #f1f3f7 !important;
    box-shadow: 0 2px 8px rgba(31, 45, 61, 0.07) !important;
    border-bottom: 0 !important;
}

/* COMPESAPREV — SIDEBAR COMPACTA NATIVA FILAMENT 5 */

@media (min-width: 1024px) {

    /* Larguras nativas */
    .fi-layout {
        --sidebar-width: 17rem !important;
        --collapsed-sidebar-width: 5rem !important;
    }

    :root {
        --compesa-sidebar-width: 17rem;
    }

    /* Botão único visual: Alpine controla qual dos dois fica ativo */
    .fi-topbar .fi-topbar-open-collapse-sidebar-btn,
    .fi-topbar .fi-topbar-close-collapse-sidebar-btn {
        position: relative !important;
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        border-radius: 10px !important;
        color: #27348B !important;
    }

    .fi-topbar .fi-topbar-open-collapse-sidebar-btn svg,
    .fi-topbar .fi-topbar-close-collapse-sidebar-btn svg {
        opacity: 0 !important;
    }

    .fi-topbar .fi-topbar-open-collapse-sidebar-btn::before,
    .fi-topbar .fi-topbar-close-collapse-sidebar-btn::before {
        content: "" !important;
        position: absolute !important;
        width: 19px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: #27348B !important;
        box-shadow:
            0 -6px 0 #27348B,
            0 6px 0 #27348B !important;
    }

}

/* COMPESAPREV — HAMBURGUER MAIS À ESQUERDA */
@media (min-width: 1024px) {
    .fi-topbar-start {
        margin-left: -12px !important;
    }
}


/* COMPESAPREV — SVG DA SIDEBAR COM PROPORÇÃO PRESERVADA */
@media (min-width: 1024px) {
    #fi-main-sidebar .fi-sidebar-nav .cp-sidebar-circuit {
        background-size: 100% auto !important;
        background-repeat: no-repeat !important;
        background-position: right bottom !important;
    }
}

/* COMPESAPREV — SEM ROLAGEM HORIZONTAL NA ÁREA ADMINISTRATIVA */
html,
body,
.fi-layout,
.fi-main-ctn,
.fi-main,
.fi-page,
.fi-page-content {
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
}

@media (min-width: 1024px) {
    .fi-layout > .fi-main-ctn {
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        flex: 1 1 0% !important;
    }

    .fi-main-ctn {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
        animation: none !important;
    }
}


@media (max-width: 767px) {
    .fi-main .fi-ta-table tbody {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 12px !important;
    }
}

/* COMPESAPREV — CABEÇALHO AÇÕES ALINHADO À ESQUERDA */
.fi-main .fi-ta-table thead th:last-child {
    text-align: left !important;
}

.fi-main .fi-ta-table thead th:last-child > *,
.fi-main .fi-ta-table thead th:last-child .fi-ta-header-cell-label {
    justify-content: flex-start !important;
    text-align: left !important;
}

/* COMPESAPREV — LARGURA DINÂMICA PELO ESTADO NATIVO */
@media (min-width: 1024px) {
    :root:has(#fi-main-sidebar:not(.fi-sidebar-open)) {
        --compesa-sidebar-width: 5rem;
    }
}
\n


/* COMPESAPREV — SIDEBAR: ANIMAÇÃO EXCLUSIVA DO HAMBÚRGUER */
@media (min-width: 1024px) {
    .fi-layout,
    .fi-layout > div:has(> #fi-main-sidebar),
    #fi-main-sidebar.fi-sidebar,
    .fi-topbar-ctn {
        transition: none !important;
        animation: none !important;
    }

    :root.cp-sidebar-user-toggle .fi-layout {
        transition: grid-template-columns 300ms ease !important;
    }

    :root.cp-sidebar-user-toggle .fi-layout > div:has(> #fi-main-sidebar) {
        transition:
            width 300ms ease,
            min-width 300ms ease,
            max-width 300ms ease !important;
    }

    :root.cp-sidebar-user-toggle #fi-main-sidebar.fi-sidebar {
        transition:
            width 300ms ease,
            min-width 300ms ease,
            max-width 300ms ease !important;
    }

    :root.cp-sidebar-user-toggle .fi-topbar-ctn {
        transition: left 300ms ease !important;
    }
}

/* COMPESAPREV — LOGOMARCA COMPACTA NA SIDEBAR RECOLHIDA */
@media (min-width: 1024px) {
    :root:has(#fi-main-sidebar:not(.fi-sidebar-open))
    #fi-main-sidebar .fi-sidebar-header-logo-ctn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        min-width: 42px !important;
        max-width: 42px !important;
        height: 42px !important;
        min-height: 42px !important;
        overflow: hidden !important;
        margin-inline: auto !important;
    }

    :root:has(#fi-main-sidebar:not(.fi-sidebar-open))
    #fi-main-sidebar .fi-sidebar-header-logo-ctn img,
    :root:has(#fi-main-sidebar:not(.fi-sidebar-open))
    #fi-main-sidebar .fi-sidebar-header-logo-ctn .fi-logo {
        display: block !important;
        width: 168px !important;
        min-width: 168px !important;
        max-width: none !important;
        height: 42px !important;
        max-height: 42px !important;
        object-fit: cover !important;
        object-position: left center !important;
        flex: 0 0 168px !important;
    }
}

/* COMPESAPREV — LOGOMARCA RESPONSIVA DA SIDEBAR */
@media (min-width: 1024px) {

    #fi-main-sidebar .fi-sidebar-header-logo-ctn {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        overflow: hidden !important;
    }

    /* Sidebar expandida: logomarca horizontal */
    #fi-main-sidebar.fi-sidebar-open .fi-sidebar-header-logo-ctn img,
    #fi-main-sidebar.fi-sidebar-open .fi-sidebar-header-logo-ctn .fi-logo {
        display: block !important;
        max-width: 190px !important;
        width: auto !important;
        height: 42px !important;
        object-fit: contain !important;
    }

    #fi-main-sidebar.fi-sidebar-open .fi-sidebar-header-logo-ctn::before {
        display: none !important;
    }

    /* Sidebar recolhida: símbolo compacto */
    #fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-header-logo-ctn {
        width: 44px !important;
        min-width: 44px !important;
        max-width: 44px !important;
        height: 44px !important;
        margin-inline: auto !important;
    }

    #fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-header-logo-ctn img,
    #fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-header-logo-ctn .fi-logo {
        display: none !important;
    }

    #fi-main-sidebar:not(.fi-sidebar-open) .fi-sidebar-header-logo-ctn::before {
        content: "" !important;
        display: block !important;
        width: 40px !important;
        height: 40px !important;
        flex: 0 0 40px !important;
        background-image: url("/images/branding/icone-logo-comprev-branca-limpa.png") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: contain !important;
    }
}

/* COMPESAPREV — CORREÇÃO: OCULTAR LOGO HORIZONTAL RECOLHIDA */
@media (min-width: 1024px) {
    #fi-main-sidebar:not(.fi-sidebar-open)
    .fi-sidebar-header-logo-ctn > * {
        display: none !important;
    }

    #fi-main-sidebar:not(.fi-sidebar-open)
    .fi-sidebar-header-logo-ctn::before {
        display: block !important;
    }
}

/* COMPESAPREV — NAVEGAÇÃO SEM ANIMAÇÕES NOS CLIQUES */
@media (min-width: 1024px) {

    #fi-main-sidebar .fi-sidebar-nav,
    #fi-main-sidebar .fi-sidebar-nav *,
    #fi-main-sidebar .fi-sidebar-group,
    #fi-main-sidebar .fi-sidebar-item,
    #fi-main-sidebar .fi-sidebar-item-button,
    #fi-main-sidebar .fi-sidebar-item a,
    #fi-main-sidebar .fi-sidebar-item button {
        transition: none !important;
        animation: none !important;
        scroll-behavior: auto !important;
    }

    #fi-main-sidebar .fi-sidebar-item-button:active,
    #fi-main-sidebar .fi-sidebar-item a:active,
    #fi-main-sidebar .fi-sidebar-item button:active {
        transform: none !important;
        scale: none !important;
    }
}

/* COMPESAPREV — BLOQUEIO DAS TRANSIÇÕES INTERNAS FILAMENT */
@media (min-width: 64rem) {

    #fi-main-sidebar .fi-sidebar-item-label,
    #fi-main-sidebar .fi-sidebar-item-badge-ctn,
    #fi-main-sidebar .fi-sidebar-group-btn,
    #fi-main-sidebar .fi-sidebar-group-items,
    #fi-main-sidebar .fi-sidebar-group-items > li,
    #fi-main-sidebar .fi-transition-enter,
    #fi-main-sidebar .fi-transition-enter-start,
    #fi-main-sidebar .fi-transition-enter-end {
        transition: none !important;
        transition-property: none !important;
        transition-duration: 0s !important;
        animation: none !important;
    }

    #fi-main-sidebar .fi-sidebar-item-btn,
    #fi-main-sidebar .fi-sidebar-item-btn:hover,
    #fi-main-sidebar .fi-sidebar-item-btn:active {
        transform: none !important;
        translate: none !important;
        animation: none !important;
        transition: none !important;
    }
}


/* COMPESAPREV — NAVEGAÇÃO SPA E SIDEBAR SEM EFEITOS NOS ITENS */
@media (min-width: 64rem) {

    /* Rótulos e grupos: sem entrada gradual ou piscar */
    #fi-main-sidebar .fi-sidebar-item-label,
    #fi-main-sidebar .fi-sidebar-item-badge-ctn,
    #fi-main-sidebar .fi-sidebar-group-btn,
    #fi-main-sidebar .fi-sidebar-group-items,
    #fi-main-sidebar .fi-transition-enter,
    #fi-main-sidebar .fi-transition-enter-start,
    #fi-main-sidebar .fi-transition-enter-end {
        opacity: 1 !important;
        transition: none !important;
        transition-property: none !important;
        transition-duration: 0s !important;
        animation: none !important;
    }

    /* Grupos: mantém o recolhimento funcional, sem animação */
    #fi-main-sidebar .fi-sidebar-group-items {
        transition: none !important;
    }

    /* Links: sem deslocamento, escala ou animação ao clicar */
    #fi-main-sidebar .fi-sidebar-item-btn,
    #fi-main-sidebar .fi-sidebar-item-btn:hover,
    #fi-main-sidebar .fi-sidebar-item-btn:focus,
    #fi-main-sidebar .fi-sidebar-item-btn:active {
        transform: none !important;
        translate: none !important;
        scale: none !important;
        transition: none !important;
        animation: none !important;
    }
}


/* COMPESAPREV — SPA SEM TRANSICAO GLOBAL DA PAGINA */
@media (min-width: 1024px) {
    ::view-transition-group(root),
    ::view-transition-old(root),
    ::view-transition-new(root) {
        animation: none !important;
        transition: none !important;
    }
}



/* COMPESAPREV — FORMULÁRIOS DE CHAMADOS: NOVO E EDIÇÃO */

.fi-modal-window {
    border: 1px solid #E3E8F1 !important;
    border-radius: 20px !important;
    box-shadow: 0 24px 70px rgba(25, 39, 82, .20) !important;
    overflow: hidden !important;
}

.fi-modal-window .fi-modal-header {
    position: relative !important;
    isolation: isolate !important;
    padding: 24px 28px 20px !important;
    
    border-bottom: 3px solid #5ABA5E !important;

background-image: radial-gradient(
        ellipse 100% 180% at 0% 50%,
        #58C4EE 0%,
        #4265B5 35%,
        #35469F 70%,
        #27348B 100%
    ) !important;

background-position: left center !important;


    background-color: #27348B !important;
    background-image:
        linear-gradient(
            90deg,
            rgba(39, 52, 139, 0) 0%,
            rgba(39, 52, 139, 0) 34%,
            rgba(39, 52, 139, .35) 48%,
            #27348B 68%,
            #27348B 100%
        ),
        radial-gradient(ellipse at 15% 15%, rgba(0,119,182,.22), transparent 42%),
        radial-gradient(ellipse at 90% 85%, rgba(39,52,139,.7), transparent 48%),
        linear-gradient(145deg, #0077B6 0%, #075985 55%, #123A75 100%) !important;
    background-size: 100% 100% !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

}

.fi-modal-window .fi-modal-header::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .75;
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%20240%201200%20420%22%20preserveAspectRatio%3D%22xMidYMid%20meet%22%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22%238FD9F5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%0A%0A%3C%21--%20Trilhas%20principais%20--%3E%0A%3Cg%20stroke-width%3D%222.1%22%20opacity%3D%22.38%22%3E%0A%20%3Cpath%20d%3D%22M1200%2080%20H1110%20Q1080%2080%201080%20110%20V180%20H1035%20Q1005%20180%201005%20210%20V270%20H940%20Q915%20270%20915%20295%20V330%20H850%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20125%20H1160%20V190%20Q1160%20220%201130%20220%20H1090%20V275%20H1050%20Q1025%20275%201025%20300%20V350%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20335%20H1145%20Q1115%20335%201115%20365%20V420%20H1060%20Q1030%20420%201030%20450%20V495%20H965%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20390%20H1175%20V455%20Q1175%20480%201150%20480%20H1110%20V530%20H1065%20Q1040%20530%201040%20555%20V590%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20620%20H1140%20V585%20Q1140%20555%201110%20555%20H1075%20V620%20H1015%20Q985%20620%20985%20650%20V710%20H925%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20700%20H1165%20V665%20H1120%20Q1090%20665%201090%20695%20V760%20H1030%20Q1000%20760%201000%20790%20V830%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20700%20H65%20V660%20Q65%20630%2095%20630%20H150%20V580%20H205%20Q235%20580%20235%20550%20V515%20H285%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20765%20H35%20V735%20H85%20Q115%20735%20115%20705%20V680%20H165%22%2F%3E%0A%20%3Cpath%20d%3D%22M760%200%20V55%20Q760%2085%20790%2085%20H845%20V130%20H900%20Q930%20130%20930%20160%20V205%22%2F%3E%0A%20%3Cpath%20d%3D%22M855%200%20V25%20H900%20Q930%2025%20930%2055%20V85%20H980%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Ramifica%C3%A7%C3%B5es%20secund%C3%A1rias%20--%3E%0A%3Cg%20stroke-width%3D%221.25%22%20opacity%3D%22.32%22%3E%0A%20%3Cpath%20d%3D%22M1035%20180%20V145%20H1000%20V115%20H970%22%2F%3E%0A%20%3Cpath%20d%3D%22M915%20295%20H875%20V260%20H840%22%2F%3E%0A%20%3Cpath%20d%3D%22M1060%20420%20V385%20H1025%20V355%20H990%22%2F%3E%0A%20%3Cpath%20d%3D%22M965%20495%20H925%20V465%20H895%20V435%22%2F%3E%0A%20%3Cpath%20d%3D%22M1015%20620%20V585%20H980%20V555%20H950%22%2F%3E%0A%20%3Cpath%20d%3D%22M925%20710%20H885%20V675%20H850%20V645%22%2F%3E%0A%20%3Cpath%20d%3D%22M205%20580%20V620%20H245%20V650%20H280%22%2F%3E%0A%20%3Cpath%20d%3D%22M150%20630%20V600%20H120%20V570%20H90%22%2F%3E%0A%20%3Cpath%20d%3D%22M845%20130%20V165%20H810%20V195%20H780%22%2F%3E%0A%20%3Cpath%20d%3D%22M900%2085%20V115%20H935%20V145%20H970%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Circuitos%20finos%20e%20detalhes%20internos%20--%3E%0A%3Cg%20stroke-width%3D%22.85%22%20opacity%3D%22.23%22%3E%0A%20%3Cpath%20d%3D%22M1200%20175%20H1180%20V205%20H1150%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20250%20H1175%20V280%20H1145%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20465%20H1180%20V495%20H1150%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20555%20H1170%20V575%20H1140%22%2F%3E%0A%20%3Cpath%20d%3D%22M1200%20800%20H1170%20V825%20H1140%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20600%20H30%20V575%20H60%22%2F%3E%0A%20%3Cpath%20d%3D%22M0%20825%20H45%20V800%20H75%22%2F%3E%0A%20%3Cpath%20d%3D%22M700%200%20V30%20H730%20V55%22%2F%3E%0A%20%3Cpath%20d%3D%22M950%200%20V20%20H980%20V45%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Terminais%20circulares%20--%3E%0A%3Cg%20fill%3D%22none%22%20stroke%3D%22%23BCEBFC%22%20stroke-width%3D%221.4%22%20opacity%3D%22.58%22%3E%0A%20%3Ccircle%20cx%3D%22850%22%20cy%3D%22330%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%22850%22%20cy%3D%22330%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22940%22%20cy%3D%22270%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22940%22%20cy%3D%22270%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22965%22%20cy%3D%22495%22%20r%3D%226%22%2F%3E%3Ccircle%20cx%3D%22965%22%20cy%3D%22495%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22925%22%20cy%3D%22710%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22925%22%20cy%3D%22710%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22285%22%20cy%3D%22515%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22285%22%20cy%3D%22515%22%20r%3D%221.7%22%2F%3E%0A%20%3Ccircle%20cx%3D%22780%22%20cy%3D%22195%22%20r%3D%225%22%2F%3E%3Ccircle%20cx%3D%22780%22%20cy%3D%22195%22%20r%3D%221.7%22%2F%3E%0A%3C%2Fg%3E%0A%0A%3C%21--%20Pads%20retangulares%20e%20pequenos%20contatos%20--%3E%0A%3Cg%20fill%3D%22%23BCEBFC%22%20opacity%3D%22.36%22%3E%0A%20%3Crect%20x%3D%221030%22%20y%3D%22174%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%221057%22%20y%3D%22416%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%221009%22%20y%3D%22616%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%22145%22%20y%3D%22576%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Crect%20x%3D%22840%22%20y%3D%22126%22%20width%3D%227%22%20height%3D%223%22%20rx%3D%221%22%2F%3E%0A%20%3Ccircle%20cx%3D%22970%22%20cy%3D%22115%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22990%22%20cy%3D%22355%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22895%22%20cy%3D%22435%22%20r%3D%222%22%2F%3E%0A%20%3Ccircle%20cx%3D%22850%22%20cy%3D%22645%22%20r%3D%222%22%2F%3E%0A%3C%2Fg%3E%0A%3C%2Fsvg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center 52% !important;
    background-size: 100% auto !important;
}

.fi-modal-window .fi-modal-header > * {
    position: relative;
    z-index: 1;
}

.fi-modal-window .fi-modal-heading {
    color: #FFFFFF !important;
    font-size: 1.35rem !important;
    font-weight: 800 !important;
    letter-spacing: -.025em !important;
}

.fi-modal-window .fi-modal-description {
    color: rgba(255, 255, 255, .78) !important;
    font-size: .85rem !important;
    margin-top: 5px !important;
}

.fi-modal-window .fi-modal-content {
    padding: 24px 28px !important;
    background: #F5F7FB !important;
}

.fi-modal-window .fi-section {
    border: 1px solid #E5EAF2 !important;
    border-radius: 15px !important;
    background: #FFFFFF !important;
    box-shadow: 0 3px 13px rgba(32, 48, 91, .045) !important;
    overflow: hidden !important;
}

.fi-modal-window .fi-section + .fi-section {
    margin-top: 18px !important;
}

.fi-modal-window .fi-section-header {
    padding: 19px 22px 14px !important;
    border-bottom: 1px solid #EDF0F5 !important;
}

.fi-modal-window .fi-section-header-heading {
    color: #27348B !important;
    font-size: .98rem !important;
    font-weight: 800 !important;
    letter-spacing: -.015em !important;
}

.fi-modal-window .fi-section-header-description {
    color: #78849A !important;
    font-size: .8rem !important;
    margin-top: 4px !important;
}

.fi-modal-window .fi-section-content {
    padding: 21px 22px 23px !important;
}

.fi-modal-window .fi-input-wrp {
    border: 1px solid #DDE3ED !important;
    border-radius: 10px !important;
    background: #FFFFFF !important;
    box-shadow: 0 1px 2px rgba(32, 48, 91, .025) !important;
}

.fi-modal-window .fi-input-wrp:focus-within {
    border-color: #6575C4 !important;
    box-shadow: 0 0 0 3px rgba(39, 52, 139, .09) !important;
}

.fi-modal-window .fi-fo-field-label {
    color: #34415B !important;
    font-weight: 700 !important;
    font-size: .82rem !important;
}

.fi-modal-window .fi-fo-field-description {
    color: #8792A5 !important;
}

.fi-modal-window .fi-modal-footer {
    padding: 17px 28px !important;
    border-top: 1px solid #E8ECF3 !important;
    background: #FFFFFF !important;
}

.fi-modal-window .fi-btn-color-primary {
    box-shadow: 0 4px 10px rgba(39, 52, 139, .16) !important;
}

@media (max-width: 767px) {
    .fi-modal-window .fi-modal-header {
        padding: 19px 18px 16px !important;
    }

    .fi-modal-window .fi-modal-content {
        padding: 16px !important;
    }

    .fi-modal-window .fi-section-content {
        padding: 17px !important;
    }

    .fi-modal-window .fi-section-header {
        padding: 16px 17px 12px !important;
    }

    .fi-modal-window .fi-modal-footer {
        padding: 14px 17px !important;
    }
}


/* COMPESAPREV — MODAL ACIMA DA BARRA SUPERIOR */
.fi-modal {
    z-index: 10000 !important;
}

.fi-modal-window {
    position: relative !important;
    z-index: 10001 !important;
}



/* COMPESAPREV — ALINHAMENTO DOS BOTÕES DOS MODAIS */


/* COMPESAPREV — ÍCONE NATIVO DOS MODAIS */
.fi-modal-window .fi-modal-header::after {
    display: none !important;
}

/* Contêiner compacto: não aumenta desnecessariamente a altura do cabeçalho. */
.fi-modal-window .fi-modal-header .fi-modal-icon-ctn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    flex: 0 0 54px !important;
    margin: 0 !important;
}

/* Remove completamente o círculo e mantém o desenho livre. */
.fi-modal-window .fi-modal-header .fi-modal-icon-bg {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 54px !important;
    height: 54px !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Dimensiona o próprio Heroicon, não apenas o contêiner. */
.fi-modal-window .fi-modal-header .fi-modal-icon-bg > .fi-icon {
    display: block !important;
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
    max-width: 54px !important;
    max-height: 54px !important;
    font-size: 54px !important;
    color: #5ABA5E !important;
    stroke: currentColor !important;
    flex-shrink: 0 !important;
}

/* COMPESAPREV — CORREÇÃO DOS MENUS DOS SELECTS NOS MODAIS */
.fi-modal-window {
    overflow: visible !important;
}

.fi-modal-window .fi-modal-header {
    border-radius: 19px 19px 0 0 !important;
}

.fi-modal-window .fi-section {
    overflow: visible !important;
}

.fi-modal-window .fi-dropdown-panel {
    z-index: 10020 !important;
}

.fi-modal-window .fi-modal-footer {
    border-radius: 0 0 19px 19px !important;
}


/* =========================================================
   COMPESAPREV — RESPONSIVIDADE DOS MODAIS E SVG NO NOTEBOOK
   Mantém a sidebar fixa e utiliza somente a área disponível
   à direita dela para centralizar os modais.
   ========================================================= */

@media (min-width: 1024px) {

    /* Modal centralizado na área útil, sem ficar atrás da sidebar */
    .fi-modal {
        box-sizing: border-box !important;
        padding-left: calc(var(--compesa-sidebar-width, 17rem) + 1rem) !important;
        padding-right: 1rem !important;
    }

    .fi-modal-window {
        box-sizing: border-box !important;
        width: 100% !important;
        max-width: calc(100vw - var(--compesa-sidebar-width, 17rem) - 2rem) !important;
        min-width: 0 !important;
    }
}

/* SVG mais compacto em notebooks */
@media (min-width: 1024px) and (max-width: 1440px) {

    #fi-main-sidebar .fi-sidebar-nav .cp-sidebar-circuit {
        flex: 0 0 190px !important;
        height: 190px !important;
        min-height: 190px !important;
        width: calc(100% + 40px) !important;
        margin: auto -20px 0 !important;
        background-size: 100% auto !important;
        background-repeat: no-repeat !important;
        background-position: right bottom !important;
    }
}


/* COMPESAPREV — POSICIONAMENTO DEFINITIVO DOS MODAIS NO NOTEBOOK */
@media (min-width: 1024px) {
    .fi-modal {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .fi-modal .fi-modal-window {
        position: relative !important;
        left: 8.5rem !important;
        width: calc(100vw - 19rem) !important;
        max-width: calc(100vw - 19rem) !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
}


/* =========================================================
   COMPESAPREV — DENSIDADE VISUAL COMPACTA PARA NOTEBOOKS
   Aplicação exclusiva ao painel administrativo.
   ========================================================= */

@media (min-width: 1024px) and (max-width: 1440px) {

    /* Escala geral */
    html {
        font-size: 15px !important;
    }

    /* Área principal */
    .fi-main {
        font-size: .94rem !important;
    }

    .fi-page {
        gap: 1rem !important;
    }

    .fi-page-content {
        gap: 1rem !important;
    }

    .fi-page-header {
        gap: .75rem !important;
    }

    /* Títulos e descrições */
    .fi-header-heading {
        font-size: 1.45rem !important;
        line-height: 1.25 !important;
    }

    .fi-header-subheading {
        font-size: .88rem !important;
    }

    /* Cards, widgets e indicadores */
    .fi-section,
    .fi-wi,
    .fi-stats-overview-stat {
        border-radius: 12px !important;
    }

    .fi-section-content {
        padding: 1rem !important;
    }

    .fi-wi-stats-overview {
        gap: .75rem !important;
    }

    .fi-stats-overview-stat-value {
        font-size: 1.65rem !important;
    }

    .fi-stats-overview-stat-label {
        font-size: .78rem !important;
    }

    /* Gráficos */
    .fi-wi-chart {
        min-width: 0 !important;
    }

    /* Tabelas e listagens */
    .fi-ta-ctn {
        border-radius: 12px !important;
    }

    .fi-ta-header,
    .fi-ta-content,
    .fi-ta-footer {
        padding: .85rem !important;
    }

    .fi-ta-table th,
    .fi-ta-table td {
        padding: .65rem .75rem !important;
        font-size: .86rem !important;
    }

    /* Filtros e formulários */
    .fi-fo-field-wrp {
        gap: .3rem !important;
    }

    .fi-input-wrp,
    .fi-select-input,
    .fi-textarea {
        font-size: .88rem !important;
    }

    .fi-btn {
        font-size: .86rem !important;
        padding-top: .5rem !important;
        padding-bottom: .5rem !important;
    }

    /* Modais */
    .fi-modal .fi-modal-window {
        font-size: .92rem !important;
    }

    .fi-modal .fi-modal-header {
        padding: 1rem 1.25rem !important;
    }

    .fi-modal .fi-modal-content {
        padding: 1rem 1.25rem !important;
    }

    .fi-modal .fi-modal-footer {
        padding: .85rem 1.25rem !important;
    }

    .fi-modal .fi-section-content {
        padding: .9rem !important;
    }

    /* Menu lateral */
    #fi-main-sidebar .fi-sidebar-nav {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    #fi-main-sidebar .fi-sidebar-item-btn {
        min-height: 2.45rem !important;
        font-size: .88rem !important;
    }

    #fi-main-sidebar .fi-sidebar-group-label {
        font-size: .75rem !important;
    }

    /* Barra superior */
    .fi-topbar {
        font-size: .88rem !important;
    }
}


/* =========================================================
   COMPESAPREV — MODAIS COMPACTOS PARA NOTEBOOKS
   Não altera dashboard, tabelas, filtros ou sidebar.
   ========================================================= */

@media (min-width: 1024px) and (max-width: 1440px) {

    .fi-modal .fi-modal-window {
        font-size: .90rem !important;
        max-height: calc(100vh - 2rem) !important;
    }

    .fi-modal .fi-modal-header {
        padding: .85rem 1.15rem !important;
    }

    .fi-modal .fi-modal-header-heading {
        font-size: 1.15rem !important;
        line-height: 1.3 !important;
    }

    .fi-modal .fi-modal-header-description {
        font-size: .82rem !important;
        line-height: 1.4 !important;
    }

    .fi-modal .fi-modal-content {
        padding: .85rem 1.15rem !important;
    }

    .fi-modal .fi-section {
        border-radius: 12px !important;
    }

    .fi-modal .fi-section-header {
        padding: .8rem 1rem !important;
    }

    .fi-modal .fi-section-content {
        padding: .8rem 1rem !important;
    }

    .fi-modal .fi-fo-field-wrp {
        gap: .25rem !important;
    }

    .fi-modal .fi-fo-field-wrp label {
        font-size: .82rem !important;
    }

    .fi-modal .fi-input-wrp,
    .fi-modal .fi-select-input,
    .fi-modal .fi-textarea {
        font-size: .86rem !important;
    }

    .fi-modal .fi-input-wrp {
        min-height: 2.45rem !important;
    }

    .fi-modal .fi-modal-footer {
        padding: .75rem 1.15rem !important;
    }

    .fi-modal .fi-btn {
        font-size: .84rem !important;
        min-height: 2.35rem !important;
    }
}

/* COMPESAPREV — COMPACTAÇÃO EXTRA DOS MODAIS EM NOTEBOOKS */
@media (min-width: 1024px) and (max-width: 1440px) {

    .fi-modal .fi-modal-window {
        font-size: .84rem !important;
        max-height: calc(100vh - 1.5rem) !important;
    }

    .fi-modal .fi-modal-header {
        padding: .65rem .95rem !important;
    }

    .fi-modal .fi-modal-header-heading {
        font-size: 1.02rem !important;
        line-height: 1.2 !important;
    }

    .fi-modal .fi-modal-header-description {
        font-size: .76rem !important;
        line-height: 1.3 !important;
    }

    .fi-modal .fi-modal-content {
        padding: .65rem .95rem !important;
    }

    .fi-modal .fi-modal-content > * {
        gap: .65rem !important;
    }

    .fi-modal .fi-section {
        border-radius: 10px !important;
    }

    .fi-modal .fi-section-header {
        padding: .6rem .8rem !important;
    }

    .fi-modal .fi-section-header-heading {
        font-size: .88rem !important;
    }

    .fi-modal .fi-section-header-description {
        font-size: .74rem !important;
        line-height: 1.3 !important;
    }

    .fi-modal .fi-section-content {
        padding: .6rem .8rem !important;
    }

    .fi-modal .fi-fo-field-wrp {
        gap: .18rem !important;
    }

    .fi-modal .fi-fo-field-wrp label {
        font-size: .76rem !important;
    }

    .fi-modal .fi-input-wrp {
        min-height: 2.15rem !important;
    }

    .fi-modal .fi-input-wrp input,
    .fi-modal .fi-select-input,
    .fi-modal .fi-textarea {
        font-size: .80rem !important;
    }

    .fi-modal .fi-textarea {
        min-height: 5rem !important;
    }

    .fi-modal .fi-modal-footer {
        padding: .55rem .95rem !important;
        gap: .5rem !important;
    }

    .fi-modal .fi-btn {
        min-height: 2.05rem !important;
        padding: .35rem .75rem !important;
        font-size: .78rem !important;
    }
}


/* COMPESAPREV — COMPACTAÇÃO AVANÇADA DOS MODAIS */
@media (min-width: 1024px) and (max-width: 1440px) {

    .fi-modal .fi-modal-window {
        font-size: .80rem !important;
    }

    .fi-modal .fi-modal-header {
        padding: .5rem .8rem !important;
    }

    .fi-modal .fi-modal-header-heading {
        font-size: .95rem !important;
    }

    .fi-modal .fi-modal-header-description {
        font-size: .70rem !important;
    }

    .fi-modal .fi-modal-content {
        padding: .5rem .8rem !important;
    }

    .fi-modal .fi-modal-content > * {
        gap: .45rem !important;
    }

    .fi-modal .fi-section-header {
        padding: .45rem .7rem !important;
    }

    .fi-modal .fi-section-header-heading {
        font-size: .82rem !important;
    }

    .fi-modal .fi-section-header-description {
        font-size: .68rem !important;
    }

    .fi-modal .fi-section-content {
        padding: .45rem .7rem !important;
    }

    .fi-modal .fi-fo-field-wrp {
        gap: .12rem !important;
    }

    .fi-modal .fi-fo-field-wrp label {
        font-size: .70rem !important;
    }

    .fi-modal .fi-input-wrp {
        min-height: 1.95rem !important;
    }

    .fi-modal .fi-input-wrp input,
    .fi-modal .fi-select-input,
    .fi-modal .fi-textarea {
        font-size: .76rem !important;
    }

    .fi-modal .fi-textarea {
        min-height: 4.25rem !important;
    }

    .fi-modal .fi-modal-footer {
        padding: .45rem .8rem !important;
    }

    .fi-modal .fi-btn {
        min-height: 1.9rem !important;
        padding: .25rem .65rem !important;
        font-size: .74rem !important;
    }
}



/* COMPESAPREV — ÁREA DE ANEXOS NOS MODAIS */
.fi-modal .fi-section:has(.fi-fo-file-upload) {
    border-color: #dce3ef !important;
}

.fi-modal .fi-fo-file-upload {
    border: 1px dashed #b9c6d9 !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    padding: .85rem !important;
}

.fi-modal .fi-fo-file-upload .filepond--root {
    margin-bottom: 0 !important;
}

.fi-modal .fi-fo-file-upload .filepond--drop-label {
    min-height: 5rem !important;
}

/* COMPESAPREV — HIERARQUIA TIPOGRÁFICA DOS BLOCOS DOS MODAIS */
.fi-modal-window .fi-section-header-heading {
    font-size: 1.08rem !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
}

.fi-modal-window .fi-fo-field-label,
.fi-modal-window .fi-fo-field-wrp label {
    font-size: .76rem !important;
    font-weight: 650 !important;
}

@media (min-width: 1024px) and (max-width: 1440px) {
    .fi-modal-window .fi-section-header-heading {
        font-size: .94rem !important;
    }

    .fi-modal-window .fi-fo-field-label,
    .fi-modal-window .fi-fo-field-wrp label {
        font-size: .68rem !important;
    }
}

@media (max-width: 767px) {
    .fi-modal-window .fi-section-header-heading {
        font-size: 1rem !important;
    }

    .fi-modal-window .fi-fo-field-label,
    .fi-modal-window .fi-fo-field-wrp label {
        font-size: .72rem !important;
    }
}

/* COMPESAPREV — TEXTO AUXILIAR DOS ANEXOS */
.fi-modal-window .fi-fo-field-wrp:has(input[type="file"]) .fi-fo-field-description {
    font-size: .62rem !important;
    line-height: 1.25 !important;
    color: #8792A5 !important;
}


/* COMPESAPREV — AUXILIAR DOS ANEXOS COM MESMO TAMANHO DA DESCRIÇÃO DAS SEÇÕES */
.fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-wrp-hint,
.fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-hint {
    font-size: .8rem !important;
    line-height: 1.4 !important;
    color: #78849A !important;
}

@media (min-width: 1024px) and (max-width: 1440px) {
    .fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-wrp-hint,
    .fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-hint {
        font-size: .68rem !important;
    }
}

@media (max-width: 1023px) {
    .fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-wrp-hint,
    .fi-modal-window .fi-fo-field-wrp:has(.filepond--root) .fi-fo-field-hint {
        font-size: .74rem !important;
    }
}

/* COMPESAPREV — TEXTO AUXILIAR DOS ANEXOS */
.fi-modal-window .fi-fo-field-wrp .fi-sc-text {
    font-size: .8rem !important;
    line-height: 1.4 !important;
    color: #78849A !important;
}

@media (min-width: 1024px) and (max-width: 1440px) {
    .fi-modal-window .fi-fo-field-wrp .fi-sc-text {
        font-size: .68rem !important;
    }
}

/* COMPESAPREV — TAMANHO DO TEXTO ABAIXO DA ÁREA DE ANEXOS */
.fi-modal-window span.fi-sc-text,
.fi-modal span.fi-sc-text {
    font-size: .8rem !important;
    line-height: 1.4 !important;
    color: #78849A !important;
}

@media (min-width: 1024px) and (max-width: 1440px) {
    .fi-modal-window span.fi-sc-text,
    .fi-modal span.fi-sc-text {
        font-size: .68rem !important;
    }
}

/* COMPESAPREV — CONTORNO DOS CAMPOS DOS FILTROS DE CHAMADOS */
.fi-main .fi-ta-filters .fi-input-wrp,
.fi-main .fi-ta-filters .fi-select-input {
    border: 1px solid #DDE3ED !important;
    background-color: #FFFFFF !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

.fi-main .fi-ta-filters .fi-input-wrp:focus-within,
.fi-main .fi-ta-filters .fi-select-input:focus-within {
    border-color: #7182D0 !important;
    box-shadow: 0 0 0 2px rgba(39, 52, 139, .08) !important;
}


/* COMPESAPREV — DESTAQUE VISUAL DOS FILTROS DE CHAMADOS */
.fi-main .fi-ta-filters .fi-input-wrp,
.fi-main .fi-ta-filters .fi-select-input {
    border: 1px solid #C5CEE0 !important;
    background-color: #F3F6FC !important;
    border-radius: 10px !important;
    box-shadow: 0 1px 3px rgba(39, 52, 139, .07) !important;
    transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease !important;
}

.fi-main .fi-ta-filters .fi-input-wrp:hover,
.fi-main .fi-ta-filters .fi-select-input:hover {
    border-color: #8796C5 !important;
    background-color: #EDF1FA !important;
    box-shadow: 0 2px 5px rgba(39, 52, 139, .10) !important;
}

.fi-main .fi-ta-filters .fi-input-wrp:focus-within,
.fi-main .fi-ta-filters .fi-select-input:focus-within {
    border-color: #5367B2 !important;
    background-color: #FFFFFF !important;
    box-shadow: 0 0 0 3px rgba(39, 52, 139, .13) !important;
}

.fi-main .fi-ta-filters .fi-input-wrp svg,
.fi-main .fi-ta-filters .fi-select-input svg {
    color: #27348B !important;
    opacity: .95 !important;
}

.fi-main .fi-ta-filters .fi-select-input {
    color: #27348B !important;
    font-weight: 600 !important;
}

/* ==========================================================
   COMPESAPREV — MODAL DE FILTROS | IDENTIDADE VISUAL
   Escopo exclusivo: .fi-ta-filters
   ========================================================== */

/* Área completa do modal */
.fi-ta-filters {
    background: #F0F3F9 !important;
    border: 1px solid #D9E1EF !important;
    border-radius: 15px !important;
    padding: 16px !important;
}

/* Cabeçalho geral */
.fi-ta-filters .fi-ta-filters-header {
    padding: 2px 2px 13px !important;
    margin-bottom: 14px !important;
    border-bottom: 1px solid #D5DEEC !important;
}

.fi-ta-filters .fi-ta-filters-heading {
    color: #27348B !important;
    font-size: 1.08rem !important;
    font-weight: 800 !important;
    letter-spacing: -.02em !important;
}

/* Cartões das cinco seções */
.fi-ta-filters .fi-sc-section > .fi-section {
    background: #FFFFFF !important;
    border: 1px solid #D4DDEC !important;
    border-radius: 11px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 5px rgba(39, 52, 139, .055) !important;
    transition: border-color .18s ease, box-shadow .18s ease !important;
}

/* Faixa dos títulos */
.fi-ta-filters .fi-section-header {
    min-height: 53px !important;
    padding: 12px 15px !important;
    background: #E7EDF8 !important;
    border-left: 4px solid #5ABA5E !important;
    cursor: pointer !important;
    transition: background-color .18s ease !important;
}

/* Hover na faixa */
.fi-ta-filters .fi-section-header:hover {
    background: #DCE6F5 !important;
}

/* Texto dos títulos */
.fi-ta-filters .fi-section-header-heading {
    color: #27348B !important;
    font-size: .91rem !important;
    font-weight: 800 !important;
    letter-spacing: .005em !important;
}

/* Botão da seta */
.fi-ta-filters .fi-section-collapse-btn {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border: 1px solid #C5D1E5 !important;
    border-radius: 8px !important;
    background: #FFFFFF !important;
    color: #27348B !important;
    box-shadow: 0 1px 3px rgba(39, 52, 139, .08) !important;
    transition: background-color .18s ease, border-color .18s ease !important;
}

.fi-ta-filters .fi-section-collapse-btn:hover {
    background: #DDE7F7 !important;
    border-color: #879AC5 !important;
}

.fi-ta-filters .fi-section-collapse-btn svg {
    width: 17px !important;
    height: 17px !important;
    color: #27348B !important;
}

/* Seção expandida */
.fi-ta-filters .fi-section:not(.fi-collapsed) {
    border-color: #AEBEDB !important;
    box-shadow: 0 3px 9px rgba(39, 52, 139, .09) !important;
}

.fi-ta-filters .fi-section:not(.fi-collapsed) > .fi-section-header {
    background: #DCE6F6 !important;
    border-bottom: 1px solid #C9D5E8 !important;
}

/* Conteúdo interno */
.fi-ta-filters .fi-section-content-ctn {
    background: #FFFFFF !important;
}

.fi-ta-filters .fi-section-content {
    padding: 15px !important;
    background: #FFFFFF !important;
}

/* Ajuste dos textos dos campos */
.fi-ta-filters .fi-fo-field-label {
    color: #46536D !important;
    font-weight: 650 !important;
}

/* Link Limpar filtros */
.fi-ta-filters .fi-ta-filters-header [data-table-filter-action="reset"] {
    font-weight: 700 !important;
}

/* Notebook */
@media (min-width: 1024px) and (max-width: 1440px) {
    .fi-ta-filters {
        padding: 13px !important;
    }

    .fi-ta-filters .fi-section-header {
        min-height: 48px !important;
        padding: 10px 13px !important;
    }

    .fi-ta-filters .fi-section-content {
        padding: 12px !important;
    }
}

/* Celular */
@media (max-width: 767px) {
    .fi-ta-filters {
        padding: 10px !important;
        border-radius: 12px !important;
    }

    .fi-ta-filters .fi-section-header-heading {
        font-size: .86rem !important;
    }
}

/* COMPESAPREV — TABELA DE CHAMADOS | SOMENTE VISUAL */

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) {
    border: 1px solid #D7DFEC !important;
    border-radius: 13px !important;
    background: #FFFFFF !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table thead,
.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-header-cell {
    background: #E7EDF8 !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-header-cell,
.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table thead th {
    color: #27348B !important;
    border-bottom: 2px solid #5ABA5E !important;
    font-weight: 750 !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table tbody tr {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #E8ECF3 !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table tbody tr:nth-child(even) {
    background-color: #FAFBFE !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table tbody tr:hover {
    background-color: #EEF3FC !important;
}

.fi-ta-ctn:has(.fi-ta-header-cell-ticket-number) .fi-ta-table tbody td {
    border-bottom: 1px solid #E8ECF3 !important;
}


/* ==========================================================
   COMPESAPREV — PADRÃO VISUAL DAS TABELAS ADMINISTRATIVAS
   Chamados, Usuários e Categorias
   Somente apresentação: sem alterar dimensões ou layout.
   ========================================================== */

/* Contorno externo */
.fi-ta-ctn {
    border: 1px solid #D7DFEC !important;
    border-radius: 13px !important;
    background: #FFFFFF !important;
}

/* Cabeçalho de todas as colunas, inclusive Ações */
.fi-ta-table thead,
.fi-ta-table thead tr,
.fi-ta-table thead th,
.fi-ta-header-cell {
    background-color: #E7EDF8 !important;
}

.fi-ta-ctn .fi-ta-header-cell {
    color: #27348B !important;
    border-bottom: 2px solid #5ABA5E !important;
    font-weight: 750 !important;
}

/* Linhas alternadas */
.fi-ta-ctn .fi-ta-table tbody tr {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #E8ECF3 !important;
}

.fi-ta-ctn .fi-ta-table tbody tr:nth-child(even) {
    background-color: #FAFBFE !important;
}

/* Realce ao passar o mouse */
.fi-ta-ctn .fi-ta-table tbody tr:hover {
    background-color: #EEF3FC !important;
}

/* Divisórias das células */
.fi-ta-ctn .fi-ta-table tbody td {
    border-bottom: 1px solid #E8ECF3 !important;
}

/* Rodapé */
.fi-ta-ctn .fi-ta-footer,
.fi-ta-ctn .fi-ta-pagination {
    background-color: #F0F3F9 !important;
    border-top: 1px solid #D9E1EF !important;
}


/* Filtros: seta simples, sem moldura, alinhada ao título */
.fi-ta-filters .fi-section-header {
    display: flex !important;
    align-items: center !important;
}

.fi-ta-filters .fi-section-collapse-btn {
    align-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 4px !important;
    border: 0 !important;
    outline: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.fi-ta-filters .fi-section-collapse-btn:hover,
.fi-ta-filters .fi-section-collapse-btn:focus,
.fi-ta-filters .fi-section-collapse-btn:focus-visible {
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.fi-ta-filters .fi-section-collapse-btn svg {
    display: block !important;
    margin: 0 !important;
}

/* Modais Novo chamado e Editar chamado: remover linhas do contorno */
.fi-modal-window {
    border: 0 !important;
    outline: 0 !important;
}

.fi-modal-window::before {
    border: 0 !important;
    outline: 0 !important;
}