/* ==========================================================================
   SaaS FatoSeguro - Setor Administrativo (fs-admin.css)
   Dependência: fs-core-ui.css
   Version: 1.4.0 - Limpo (Sem Modais)
   ========================================================================== */

/* ==========================================================================
   1. CLASSES UTILITY (Inspiradas no Tailwind - Prefixadas)
   ========================================================================== */
.fs-text-brand-primary { color: var(--fs-color-brand-primary); }
.fs-text-fg-primary { color: var(--fs-color-fg-primary); }
.fs-text-fg-secondary { color: var(--fs-color-fg-secondary); }
.fs-text-fg-muted { color: var(--fs-color-fg-muted); }
.fs-text-status-critical { color: var(--fs-color-status-critical-text); }

.fs-bg-brand-primary { background-color: var(--fs-color-brand-primary); }
.fs-bg-brand-dark { background-color: var(--fs-color-brand-dark); }
.fs-bg-neutral-bg { background-color: var(--fs-color-neutral-bg); }
.fs-bg-neutral-card { background-color: var(--fs-color-neutral-card); }
.fs-hover-bg-brand-dark-hover:hover { background-color: var(--fs-color-brand-dark-hover); }

.fs-text-zinc-50 { color: var(--fs-zinc-50);}
.fs-text-zinc-100 { color: var(--fs-zinc-100);}
.fs-text-zinc-200 { color: var(--fs-zinc-200);}
.fs-text-zinc-300 { color: var(--fs-zinc-300);}
.fs-text-zinc-400 { color: var(--fs-zinc-400);}
.fs-text-zinc-500 { color: var(--fs-zinc-500);}
.fs-text-zinc-600 { color: var(--fs-zinc-600);}
.fs-text-zinc-700 { color: var(--fs-zinc-700);}
.fs-text-zinc-800 { color: var(--fs-zinc-800);}
.fs-text-zinc-800 { color: var(--fs-zinc-900);}
	
.fs-text-xs { font-size: var(--fs-text-xs); }
.fs-text-sm { font-size: var(--fs-text-sm); }
.fs-text-base { font-size: var(--fs-text-base); }
.fs-text-lg { font-size: var (--fs-text-lg); }
.fs-text-xl { font-size: var (--fs-text-xl); }
.fs-text-left { text-align: left; }
.fs-text-center { text-align: center; }
.fs-text-right { text-align: right; }
.fs-text-capitalize { text-transform: capitalize; }
.fs-font-normal { font-weight: var(--fs-font-normal); }
.fs-font-medium { font-weight: var(--fs-font-medium); }
.fs-font-semibold { font-weight: var(--fs-font-semibold); }
.fs-font-bold { font-weight: var(--fs-font-bold); }
.fs-uppercase { text-transform: uppercase; }


.fs-border-neutral { border: 1px solid var(--fs-color-neutral-border); }
.fs-border-b-neutral { border-bottom: 1px solid var(--fs-color-neutral-border); }
.fs-rounded-sm { border-radius: var(--fs-radius-sm); }
.fs-rounded-md { border-radius: var(--fs-radius-md); }
.fs-rounded-lg { border-radius: var(--fs-radius-lg); }
.fs-rounded-xl { border-radius: var(--fs-radius-xl); }
.fs-rounded-full { border-radius: var(--fs-radius-pill); }

.fs-shadow-sm { box-shadow: var(--fs-shadow-sm); }
.fs-shadow-md { box-shadow: var(--fs-shadow-md); }
.fs-shadow-lg { box-shadow: var(--fs-shadow-lg); }

.fs-p-4 { padding: var(--fs-space-4); }
.fs-p-6 { padding: var(--fs-space-6); }
.fs-px-4 { padding-left: var(--fs-space-4); padding-right: var(--fs-space-4); }
.fs-py-2 { padding-top: var(--fs-space-2); padding-bottom: var(--fs-space-2); }
.fs-mb-4 { margin-bottom: var(--fs-space-4); }
.fs-mb-6 { margin-bottom: var(--fs-space-6); }
.fs-w-full { width: 100%; }
.fs-max-w-xs { max-width: 200px; }
.fs-max-w-sm { max-width: 320px; }

.fs-flex { display: flex; }
.fs-inline-flex { display: inline-flex; }
.fs-flex-row { flex-direction: row; }
.fs-flex-col { flex-direction: column; }
.fs-justify-between { justify-content: space-between; }
.fs-items-center { align-items: center; }
.fs-flex-wrap { flex-wrap: wrap; }
.fs-gap-2 { gap: var(--fs-gap-2); }
.fs-gap-4 { gap: var(--fs-gap-4); }

/* ==========================================================================
   2. COMPONENTES NOVOS & BOTÕES REUTILIZÁVEIS
   ========================================================================== */
.fs-btn-dark {
    background-color: var(--fs-color-brand-dark) !important;
    color: #ffffff !important;
    padding: var(--fs-space-2) var(--fs-space-4) !important;
    border-radius: var(--fs-radius-md) !important;
    font-size: var(--fs-text-sm) !important;
    font-weight: var(--fs-font-medium) !important;
    /*display: inline-flex !important;*/
	text-align: center !important;
    align-items: center !important;
    gap: var(--fs-gap-2) !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}
.fs-btn-dark:hover { background-color: var(--fs-color-brand-dark-hover) !important; }
.fs-btn-dark:active { transform: scale(0.98); }

.fs-btn-outline {
    background-color: var(--fs-color-neutral-card) !important;
    border: 1px solid var(--fs-color-neutral-border) !important;
    color: var(--fs-color-brand-primary) !important;
    padding: var(--fs-space-2) var(--fs-space-3) !important;
    box-shadow: var(--fs-shadow-sm) !important;
    border-radius: var(--fs-radius-md) !important;
    font-size: var(--fs-text-xs) !important;
    font-weight: var(--fs-font-medium) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: var(--fs-gap-2) !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
}
.fs-btn-outline:hover {
    background-color: var(--fs-color-neutral-bg) !important;
    border-color: var(--fs-color-brand-primary) !important;
}

.fs-btn-nav {
    width: 100% !important;
    justify-content: flex-start !important;
    background: transparent !important;
    color: var(--fs-color-fg-secondary) !important;
    padding: var(--fs-space-3) var(--fs-space-4) !important;
    font-size: var(--fs-text-sm) !important;
    border-radius: var(--fs-radius-md) !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: var(--fs-gap-2) !important;
}
.fs-btn-nav:hover, .fs-btn-nav.active {
    background-color: var(--fs-color-brand-dark-hover) !important;
    color: #ffffff !important;
}

/* Sistema de Badges */
.fs-badge-ui {
    display: inline-flex;
    align-items: center;
    gap: var(--fs-space-2);
    padding: var(--fs-space-1) var(--fs-space-3);
    border-radius: var(--fs-radius-pill);
    font-size: var(--fs-text-sm);
    font-weight: var(--fs-font-normal);
    line-height: 1;
    border: 1px solid transparent;
}
.fs-badge-ui::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: var(--fs-radius-pill);
}

.fs-badge-critical {
    background-color: var(--fs-color-status-critical-bg);
    color: var(--fs-color-status-critical-text);
    border-color: rgba(239, 68, 68, 0.15);
}
.fs-badge-critical::before { background-color: var(--fs-color-status-critical-text); }

.fs-badge-high {
    background-color: var(--fs-color-status-high-bg);
    color: var(--fs-color-status-high-text);
    border-color: rgba(245, 158, 11, 0.15);
}
.fs-badge-high::before { background-color: var(--fs-color-status-high-text); }

.fs-badge-medium {
    background-color: var(--fs-color-status-medium-bg);
    color: var(--fs-color-status-medium-text);
    border-color: rgba(59, 130, 246, 0.15);
}
.fs-badge-medium::before { background-color: var(--fs-color-status-medium-text); }

.fs-badge-low {
    background-color: var(--fs-color-status-low-bg);
    color: var(--fs-color-status-low-text);
    border-color: rgba(34, 197, 94, 0.15);
}
.fs-badge-low::before { background-color: var(--fs-color-status-low-text); }

.fs-badge-neutral {
    background-color: var(--fs-color-status-neutral-bg);
    color: var(--fs-color-status-neutral-text);
    border-color: rgba(107, 114, 128, 0.15);
}
.fs-badge-neutral::before { background-color: var(--fs-color-status-neutral-text); }

/* ==========================================================================
   3. TABELA OPERACIONAL MASTER & FILTROS
   ========================================================================== */
.fs-table-wrapper {
    background: transparent;
    font-family: var(--fs-font-family);
    margin-top: 0.625rem;
    color: var(--fs-zinc-900);
}

.fs-table {
    width: 100%;
    border-collapse: collapse;
}

.fs-table th {
    border-bottom: 1px solid var(--fs-zinc-200);
    font-size: 1rem;
    font-weight: 700;
    color: var(--fs-zinc-700);
    padding: 1rem 0.5rem;
    text-align: center;
}

.fs-table td {
    border-bottom: 1px solid var(--fs-zinc-200);
    font-size: 0.9375rem;
    font-weight: 400;
    color: var(--fs-zinc-600);
    padding: 1.125rem 0.5rem;
    text-align: center;
    vertical-align: middle;
}

.fs-table th:first-child, .fs-table td:first-child { text-align: left; padding-left: 20px; }
.fs-table th:last-child, .fs-table td:last-child { text-align: center; padding-right: 0; }
.fs-table tr:hover td { background-color: var(--fs-zinc-50); }
.fs-table tr:last-child td { border-bottom: none; }
.fs-table-empty { text-align: center; padding: 2.5rem; color: var(--fs-zinc-500); }

/* SLA Typography */
.fs-sla-texto { color: var(--fs-zinc-500); font-size: (--fs-text-sm); line-height: 1.2; }
.fs-sla-hoje  { color: #16a34a; font-weight: 600; font-size: 0.875rem; }
.fs-sla-alerta { color: #d97706; font-weight: 600; font-size: 0.875rem; }
.fs-sla-atraso { color: #dc2626; font-weight: 600; font-size: 0.875rem; }

/* Filtros da Tabela Operacional */
.fs-filter-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
    gap: 1.25rem;
}

.fs-search-wrapper { flex: 1; min-width: 16rem; }
.fs-search-inner { position: relative; max-width: 21.875rem; }
.fs-search-icon { position: absolute; left: 0.75rem; top: 50%; transform: translateY(-50%); color: var(--fs-zinc-400); }
.fs-search-input { width: 100% !important; padding-left: 2.375rem !important; background: var(--fs-bg-surface) !important; }

.fs-filter-group { display: flex; gap: 1rem; align-items: center; flex-wrap: nowrap; }
.fs-filter-label { color: var(--fs-zinc-500); font-size: 0.875rem; display: flex; align-items: center; gap: 0.375rem; font-weight: 500; white-space: nowrap; }

/* Toggle Integrado */
.fs-toggle-wrapper {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
    user-select: none;
    margin-right: 0.5rem;
}

.fs-toggle-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--fs-zinc-500);
    white-space: nowrap;
}

.fs-switch {
    position: relative;
    display: inline-block;
    width: 2.5rem;
    height: 1.375rem;
    flex-shrink: 0;
}

.fs-switch input { opacity: 0; width: 0; height: 0; }

.fs-slider {
    position: absolute;
    cursor: pointer;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: var(--fs-zinc-300);
    transition: .2s ease;
    border-radius: 1.25rem;
}

.fs-slider:before {
    position: absolute;
    content: "";
    height: 1rem;
    width: 1rem;
    left: 0.1875rem;
    bottom: 0.1875rem;
    background-color: #ffffff !important;
    transition: .2s ease;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
}

.fs-switch input:checked + .fs-slider { background-color: var(--fs-brand) !important; }
.fs-switch input:checked + .fs-slider:before { transform: translateX(1.125rem) !important; }

/* Botão de Exportar CSV */
.fs-btn-icon-export {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    background: var(--fs-bg-surface) !important;
    border: 1px solid var(--fs-zinc-300) !important;
    border-radius: var(--fs-radius-xl) !important;
    color: var(--fs-brand) !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
}

.fs-btn-icon-export:hover {
    background: var(--fs-zinc-100) !important;
    color: var(--fs-brand-hover) !important;
    border-color: var(--fs-brand) !important;
}

/* ==========================================================================
   4. PAGINAÇÃO E RODAPÉ DA TABELA
   ========================================================================== */
.fs-pagination-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--fs-zinc-200);
    flex-wrap: wrap;
    gap: 1rem;
}

.fs-pagination-selector { 
    display: flex; 
    align-items: center; 
    gap: 0.5rem; 
    white-space: nowrap;
}

.fs-pagination-selector span { 
    font-size: 0.875rem; 
    color: var(--fs-zinc-500); 
    font-weight: 500;
    white-space: nowrap;
}

.fs-pagination-controls { 
    display: flex; 
    align-items: center; 
    gap: 1.25rem; 
}

.fs-pagination-info { 
    font-size: 0.875rem; 
    color: var(--fs-zinc-500); 
    font-weight: 500;
    white-space: nowrap;
}

.fs-pagination-info strong {
    color: var(--fs-zinc-800);
    font-weight: 600;
}

.fs-pagination-buttons { display: flex; gap: 0.5rem; }

.fs-btn-paginacao {
    height: 38px !important;
    padding: 0 0.875rem !important;
    border: 1px solid var(--fs-zinc-300) !important;
    background: var(--fs-bg-surface) !important;
    border-radius: var(--fs-radius-md) !important;
    cursor: pointer !important;
    font-size: 0.8125rem !important;
    color: var(--fs-zinc-700) !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
    outline: none !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.fs-btn-paginacao:hover:not(:disabled) { 
    background: var(--fs-zinc-100) !important; 
    color: var(--fs-zinc-900) !important; 
    border-color: var(--fs-zinc-400) !important;
}

.fs-btn-paginacao:disabled,
.fs-btn-paginacao[disabled] { 
    background: var(--fs-zinc-100) !important; 
    color: var(--fs-zinc-400) !important; 
    border-color: var(--fs-zinc-200) !important;
    cursor: not-allowed !important; 
    opacity: 0.7 !important;
    pointer-events: none !important;
}

.fs-btn-ghost {
    background: var(--fs-zinc-700) !important;
    border: none;
    color: var(--fs-zinc-100) !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.375rem 0.75rem !important;
    cursor: pointer;
    border-radius: var(--fs-radius-lg) !important;
    transition: background 0.2s ease;
}
.fs-btn-ghost:hover { background: var(--fs-zinc-400) !important; }

/* ==========================================================================
   5. BOTÕES DE AÇÃO DA TABELA
   ========================================================================== */
.fs-btn-table-action {
    width: 110px !important;
    height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    border-radius: var(--fs-radius-xl) !important;
    border: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    box-sizing: border-box !important;
    padding: 0 !important;
    margin: 0 auto !important;
}

.fs-btn-table-triar {
    background-color: var(--fs-brand) !important;
    color: #ffffff !important;
}
.fs-btn-table-triar:hover { background-color: var(--fs-brand-hover) !important; }

.fs-btn-table-tratar {
    background-color: var(--fs-zinc-600) !important;
    color: #ffffff !important;
}
.fs-btn-table-tratar:hover { background-color: var(--fs-zinc-800) !important; }

.fs-btn-table-dossie {
    background-color: var(--fs-zinc-200) !important;
    color: var(--fs-zinc-800) !important;
}
.fs-btn-table-dossie:hover { background-color: var(--fs-zinc-300) !important; }

.fs-btn-secondary {
    background: var(--fs-zinc-200);
    color: var(--fs-zinc-800);
    border: none;
    padding: 0.375rem 0.75rem;
    border-radius: var(--fs-radius-s);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
}
.fs-btn-secondary:hover { background: var(--fs-zinc-300); }

.fs-btn-table-edit {
    background: #e0e7ff;
    color: #3730a3;
    border: none;
    padding: 0.375rem 0.625rem;
    border-radius: var(--fs-radius-sm);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
}

.fs-btn-table-toggle {
    background: var(--fs-zinc-100);
    color: var(--fs-zinc-700);
    border: none;
    padding: 0.375rem 0.625rem;
    border-radius: var(--fs-radius-sm);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
}

.fs-btn-table-invite {
    background: #fef3c7;
    color: #92400e;
    border: none;
    padding: 0.375rem 0.625rem;
    border-radius: var(--fs-radius-sm);
    cursor: pointer;
    font-size: 0.75rem;
    font-weight: 600;
}

.fs-divider {
    border: 0;
    border-top: 1px solid var(--fs-zinc-200);
    margin: 1.25rem 0 !important;
}

.fs-actions-right { margin-top: 1.25rem; text-align: right; }
.fs-header-flex { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.25rem; }

.fs-form-grid-3 { display: grid !important; grid-template-columns: 1fr 1fr 1fr !important; gap: 1rem !important; }
.fs-grid-span-2 { grid-column: span 2 !important; }

@media (max-width: 768px) {
    .fs-form-grid-3 { grid-template-columns: 1fr !important; }
    .fs-grid-span-2 { grid-column: span 1 !important; }
}
/* ==========================================================================
   DROPDOWNS CUSTOMIZADOS GLOBAIS (EXIBIR, ORDENAR E CATEGORIA)
   ========================================================================== */

.fs-dropdown-multiselect {
    position: relative;
    display: inline-block;
    user-select: none;
}

/* Botão Trigger idêntico para todos os Dropdowns */
.fs-dropdown-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.625rem !important;
    padding: 0.625rem  !important;
    font-size: var(--fs-text-xs) !important;
    font-weight: 400 !important;
    font-family: var(--fs-font-family, 'Source Sans 3', system-ui, sans-serif) !important;
    color: var(--fs-zinc-900, #18181b) !important;
    background: var(--fs-bg-surface, #ffffff) !important;
    border: 1px solid var(--fs-border-dark, #d4d4d8) !important;
    border-radius: var(--fs-radius-xl, 0.375rem) !important;
    cursor: pointer !important;
    text-transform: none !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    outline: none !important;
    box-shadow: none !important;
}

.fs-dropdown-btn:hover {
    border-color: var(--fs-brand-hover) !important;
}
.fs-dropdown-btn:focus,
.fs-dropdown-btn[aria-expanded="true"] {
    border-color: var(--fs-brand-hover) !important;
    box-shadow: 0 0 0 2px rgba(6, 82, 89, 0.1) !important;
}

.fs-dropdown-btn span {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-transform: none !important;
    font-size: var(--fs-text-xs) !important;
    color: var(--fs-zinc-500) !important;
}

/* Animação da Seta de Chevron */
.fs-dropdown-arrow {
    transition: transform 0.2s ease;
    color: var(--fs-zinc-500, #71717a);
    flex-shrink: 0;
}

.fs-dropdown-btn[aria-expanded="true"] .fs-dropdown-arrow {
    transform: rotate(180deg);
}

/* Painel Popover */
.fs-dropdown-panel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 210px;
    background: #ffffff;
    border: 1px solid var(--fs-zinc-200, #e4e4e7);
    border-radius: var(--fs-radius-md, 8px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
    padding: 0.75rem;
    z-index: 999;
    display: none;
    flex-direction: column;
    box-sizing: border-box;
}

.fs-dropdown-panel.fs-open {
    display: flex !important;
}

/* Cabeçalho "EXIBIR", "ORDENAR", "CATEGORIA" */
.fs-dropdown-header {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--fs-zinc-700, #3f3f46);
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

.fs-dropdown-divider {
    height: 1px;
    background-color: var(--fs-zinc-200, #e4e4e7);
    margin: 0.375rem 0;
}

/* Items com Checkbox (Multi-seleção) */
.fs-dropdown-item {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.375rem 0.5rem !important;
    font-size: 0.8125rem !important;
    color: var(--fs-zinc-800, #27272a) !important;
    cursor: pointer !important;
    border-radius: var(--fs-radius-sm, 4px) !important;
    transition: background-color 0.15s ease !important;
}

.fs-dropdown-item:hover {
    background-color: var(--fs-zinc-100, #f4f4f5) !important;
}

.fs-dropdown-item input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    accent-color: var(--fs-brand, #036575) !important;
    cursor: pointer !important;
    margin: 0 !important;
}

/* Items de Seleção Única (Ordenar & Categoria) */
.fs-dropdown-single-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0.5rem 0.625rem !important;
    font-size: 0.8125rem !important;
    color: var(--fs-zinc-800, #27272a) !important;
    cursor: pointer !important;
    border-radius: var(--fs-radius-sm, 4px) !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}

.fs-dropdown-single-item:hover {
    background-color: var(--fs-zinc-100, #f4f4f5) !important;
    color: var(--fs-brand, #036575) !important;
}

.fs-dropdown-single-item.fs-selected {
    background-color: var(--fs-zinc-100, #f4f4f5) !important;
    font-weight: 600 !important;
    color: var(--fs-brand, #036575) !important;
}
/* Rótulos dos Filtros com Ícones Alinhados */
.fs-filter-label {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.375rem !important; /* Spacing entre o ícone e o texto */
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    color: var(--fs-zinc-600, #52525b) !important;
    white-space: nowrap !important;
    user-select: none !important;
}

.fs-filter-label-icon {
    color: var(--fs-zinc-500, #71717a);
    flex-shrink: 0;
}
/* Botão compacto exclusivo da paginação no rodapé */
.fs-dropdown-btn-perpage {
    min-width: 68px !important;
    padding: 0.375rem 0.625rem !important;
}

/* Painel de Abertura para Cima (Rodapé) */
.fs-dropdown-panel-up {
    top: auto !important;
    bottom: calc(100% + 6px) !important;
    min-width: 90px !important;
}
/* Rodapé dos Popovers dos Dropdowns */
.fs-dropdown-footer {
    display: flex !important;
    justify-content: flex-end !important;
    padding-top: 0.25rem !important;
}

/* Botão APLICAR alinhado à direita (Estilo do Print, sem o botão Cancelar) */
.fs-dropdown-btn-apply {
    background: transparent !important;
    border: none !important;
    color: var(--fs-brand, #036575) !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    padding: 0.375rem 0.625rem !important;
    border-radius: var(--fs-radius-sm, 4px) !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
    outline: none !important;
    box-shadow: none !important;
}

.fs-dropdown-btn-apply:hover {
    background-color: var(--fs-brand-light, #e0f2fe) !important;
    color: var(--fs-brand-hover, #065259) !important;
}

/* ==========================================================================
   MÓDULO DE AUTENTICAÇÃO, LOGIN & 2FA (Layout Dinâmico e Harmônico)
   ========================================================================== */

/* Container Centralizador */
.fs-login-container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(85vh - 60px);
    padding: var(--fs-spacing-6, 24px) var(--fs-spacing-4, 16px);
    width: 100%;
    box-sizing: border-box;
}

/* Card Principal de Login com Ajuste Automático de Altura (Fit-Content) */
.fs-login-card-box {
    background-color: var(--fs-color-bg-card, #ffffff);
    border: 1px solid var(--fs-color-border, #e4e4e7);
    border-radius: var(--fs-radius-xl, 12px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.05), 0 8px 10px -6px rgba(0, 0, 0, 0.01);
    width: 100%;
    max-width: 440px; /* Reduzido levemente para maior elegância visual */
    height: auto;
    padding: 36px 32px; /* Padding uniforme e proporcional */
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    transition: all 0.25s ease-in-out;
}

/* Estado Expandido Apenas para o Termo de Sigilo */
.fs-login-card-box.fs-card-expanded {
    max-width: 620px;
}

/* Transição Fluida entre as Telas (Panes) */
.fs-login-pane {
    display: none;
    width: 100%;
}

.fs-login-pane.fs-is-visible {
    display: flex;
    flex-direction: column;
    animation: fsFadeIn 0.2s ease-in-out;
}

@keyframes fsFadeIn {
    from { opacity: 0; transform: translateY(3px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Hierarquia de Títulos e Subtítulos */
.fs-login-pane .fs-modal-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--fs-color-fg, #18181b);
    margin: 0 0 6px 0;
    line-height: 1.25;
}

.fs-login-pane .fs-modal-subtitle {
    font-size: 14px;
    color: var(--fs-color-fg-muted, #71717a);
    margin: 0 0 24px 0;
    line-height: 1.5;
}

/* Grupos de Controle de Formulário */
.fs-login-pane .fs-control-group {
    margin-bottom: 20px;
}

.fs-login-pane .fs-control-group:last-of-type {
    margin-bottom: 24px;
}

/* CAMPO DE SENHA E BOTOES */
.fs-password-wrapper {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
}

.fs-password-wrapper .fs-control-input {
    width: 100% !important;
    padding-right: 48px !important;
    box-sizing: border-box !important;
}

.fs-password-toggle-btn {
    position: absolute !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    padding: 6px !important;
    margin: 0 !important;
    cursor: pointer !important;
    color: var(--fs-color-fg-muted, #71717a) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 5 !important;
    border-radius: var(--fs-radius-md, 6px) !important;
    transition: color 0.2s ease !important;
}

.fs-password-toggle-btn:hover {
    color: var(--fs-color-fg, #18181b) !important;
}

.fs-password-toggle-btn svg {
    width: 18px;
    height: 18px;
    display: block;
    stroke: currentColor;
}

.fs-password-toggle-btn svg.fs-is-hidden,
.fs-is-hidden {
    display: none !important;
}

/* GRID DO CÓDIGO 2FA (OTP) */
.fs-otp-grid {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 8px 0 24px 0 !important;
}

.fs-pwd-otp-digit {
    width: 46px !important;
    height: 50px !important;
    text-align: center !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    border-radius: var(--fs-radius-md, 6px) !important;
    border: 1px solid var(--fs-color-border, #e4e4e7) !important;
    background-color: var(--fs-color-bg, #ffffff) !important;
    color: var(--fs-color-fg, #18181b) !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
    padding: 0 !important;
}

.fs-pwd-otp-digit:focus {
    border-color: var(--fs-color-brand-primary, #0284c7) !important;
    box-shadow: 0 0 0 3px rgba(2, 132, 199, 0.15) !important;
}

.fs-otp-divider {
    font-size: 18px;
    font-weight: 600;
    color: var(--fs-color-fg-muted, #a1a1aa);
}

/* LINK DE RODAPÉ (REVIAR OU VOLTAR AO LOGIN) */
.fs-login-footer-link {
    margin-top: 20px;
    text-align: center;
    font-size: 14px;
    color: var(--fs-color-fg-muted, #71717a);
}

.fs-login-pane .fs-alert {
    margin-top: 18px;
    padding: 12px 16px;
    border-radius: var(--fs-radius-md, 6px);
    font-size: 13px;
    line-height: 1.4;
}