﻿/* ============================================================
   HIRED — Estilo Global
   Variáveis de cor no :root para fácil manutenção.
   Se quiser mudar a cor principal, basta alterar --roxo-principal
   ============================================================ */

:root {
    /* Paleta roxa principal */
    --roxo-escuro:     #1A0A2E;   /* fundo sidebar e login */
    --roxo-medio:      #2D1354;   /* campos, hover */
    --roxo-principal:  #7C3AED;   /* botões, destaques, bordas ativas */
    --roxo-claro:      #EDE9FE;   /* fundos leves, badges */
    --roxo-texto:      #9D7BC4;   /* textos secundários no fundo escuro */

    /* Cores de status */
    --verde:  #059669;
    --amarelo:#D97706;
    --vermelho:#DC2626;

    /* Tipografia e neutros */
    --cinza-bg:    #F4F0FB;   /* fundo geral do dashboard */
    --cinza-card:  #FFFFFF;   /* fundo dos cards e tabelas */
    --texto-escuro:#1A0A2E;   /* títulos */
    --texto-medio: #374151;   /* corpo de texto */
    --texto-fraco: #6B7280;   /* labels e dicas */
    --borda:       #EDE9FE;   /* divisores */

    --fonte: 'Inter', -apple-system, sans-serif;
    --raio: 10px;             /* arredondamento padrão */
}

/* Reset mínimo */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: var(--fonte);
    font-size: 14px;
    color: var(--texto-medio);
    background: var(--cinza-bg);
    /* Resolve o problema de cache do LugarH:
       headers HTTP farão o browser sempre verificar arquivos */
    -webkit-font-smoothing: antialiased;
}

/* ---- COMPONENTES COMPARTILHADOS ---- */

/* Logo */
.logo, .sidebar-logo {
    display: flex;
    align-items: center;
    gap: 10px;
}
.logo-mark {
    width: 34px; height: 34px;
    background: var(--roxo-principal);
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    color: white;
    font-size: 18px;
}
.logo-text {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: blueviolet;
}

/* Botão principal */
.btn-primary {
    background: var(--roxo-principal);
    color: white;
    border: none;
    border-radius: var(--raio);
    padding: 10px 20px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    transition: background 0.15s;
}
.btn-primary:hover { background: #6D28D9; }
.btn-primary.btn-sm { padding: 7px 14px; font-size: 12px; }

/* Badges de status */
.badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 99px;
    font-size: 11px;
    font-weight: 500;
}
.badge.pendente  { background: #FEF3C7; color: #92400E; }
.badge.concluido { background: #D1FAE5; color: #065F46; }
.badge.assinado  { background: var(--roxo-claro); color: #5B21B6; }

/* Spinner de loading */
@keyframes girar { to { transform: rotate(360deg); } }
.spinner { display: inline-block; animation: girar 0.8s linear infinite; }

/* Mensagem de erro */
.erro-msg {
    background: #FEE2E2;
    color: #991B1B;
    border-radius: var(--raio);
    padding: 10px 14px;
    font-size: 13px;
    margin-bottom: 12px;
}

/* ---- PÁGINA DE LOGIN ---- */
.login-page {
    background: #F2F5F7;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-container {
    display: flex;
    width: 820px;
    min-height: 500px;
    background: #230C3D;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5);
}

/* Lado esquerdo do login */
.login-form-side {
    flex: 1;
    padding: 52px 48px;
    display: flex;
    flex-direction: column;
}
.login-form-side .logo { margin-bottom: 44px; }

.login-title {
    font-size: 24px;
    font-weight: 600;
    color: white;
    margin-bottom: 6px;
}
.login-subtitle {
    font-size: 13px;
    color: var(--roxo-texto);
    margin-bottom: 32px;
}

/* Campos do formulário */
.form-group { margin-bottom: 16px; }
.form-group label {
    display: block;
    font-size: 12px;
    color: var(--roxo-texto);
    margin-bottom: 6px;
}
.form-group input {
    width: 100%;
    background: var(--roxo-medio);
    border: 1px solid #4B2882;
    border-radius: 8px;
    padding: 11px 14px;
    color: white;
    font-size: 14px;
    font-family: var(--fonte);
    outline: none;
    transition: border-color 0.15s;
}
.form-group input:focus { border-color: var(--roxo-principal); }
.form-group input::placeholder { color: #5A3878; }

.login-form-side .btn-primary { width: 100%; justify-content: center; margin-top: 8px; padding: 13px; }

.link-esqueci {
    color: var(--roxo-principal);
    font-size: 12px;
    text-decoration: none;
    text-align: right;
    margin-top: 12px;
    margin-left: auto;
    padding: 0;
    border: 0;
    background: transparent;
    font-family: var(--fonte);
    cursor: pointer;
}

/* Assinatura eletrônica no portal do candidato */
.candidate-area-tabs {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-bottom: 16px;
    padding: 5px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #FFFFFF;
}
.candidate-area-tabs button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 14px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--texto-medio);
    font: 600 13px var(--fonte);
    cursor: pointer;
}
.candidate-area-tabs button:hover { background: #F7F5FA; color: var(--texto-escuro); }
.candidate-area-tabs button.active { background: var(--roxo-claro); color: var(--roxo-principal); }
.candidate-area-tabs i { font-size: 18px; }
.candidate-area-tabs small {
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #FFFFFF;
    color: inherit;
    font-size: 10px;
    font-weight: 800;
}
.candidate-contract-layout {
    display: grid;
    grid-template-columns: 300px minmax(460px, 1fr) 330px;
    gap: 16px;
    align-items: stretch;
}
.candidate-contract-list,
.candidate-contract-preview,
.candidate-sign-panel {
    min-height: 640px;
    max-height: 640px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #FFFFFF;
}
.candidate-contract-list { overflow-y: auto; }
.candidate-contract-item {
    width: 100%;
    min-height: 78px;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding: 13px 12px;
    border: 0;
    border-bottom: 1px solid var(--borda);
    background: #FFFFFF;
    color: var(--texto-escuro);
    text-align: left;
    cursor: pointer;
}
.candidate-contract-item:last-child { border-bottom: 0; }
.candidate-contract-item:hover { background: #FAF9FC; }
.candidate-contract-item.active { background: #F0E7FF; box-shadow: inset 3px 0 0 var(--roxo-principal); }
.candidate-contract-item > i { color: var(--roxo-principal); font-size: 20px; }
.candidate-contract-item span { min-width: 0; }
.candidate-contract-item strong { display: block; overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.candidate-contract-item small { display: block; margin-top: 5px; color: var(--texto-fraco); font-size: 10px; }
.candidate-contract-item .badge { font-size: 9px; }
.candidate-contract-preview { overflow: hidden; }
.candidate-contract-preview iframe { width: 100%; height: 100%; min-height: 638px; border: 0; background: #FFFFFF; }
.candidate-sign-panel { overflow-y: auto; padding: 20px; }
.candidate-sign-heading { padding-bottom: 18px; border-bottom: 1px solid var(--borda); }
.candidate-sign-heading h2 { margin: 12px 0 4px; font-size: 19px; overflow-wrap: anywhere; }
.candidate-sign-heading p { color: var(--texto-fraco); font-size: 12px; }
.candidate-contract-meta { margin: 18px 0; }
.candidate-contract-meta > div { display: grid; gap: 4px; padding: 10px 0; border-bottom: 1px solid var(--borda); }
.candidate-contract-meta dt { color: var(--texto-fraco); font-size: 11px; }
.candidate-contract-meta dd { margin: 0; color: var(--texto-escuro); font-size: 12px; font-weight: 700; }
.candidate-contract-meta code { display: block; overflow: hidden; color: #4B5563; text-overflow: ellipsis; white-space: nowrap; }
.signature-requirements { display: grid; gap: 10px; margin: 18px 0; }
.signature-requirements > strong { font-size: 12px; }
.signature-requirements > span { display: flex; align-items: center; gap: 8px; color: var(--texto-medio); font-size: 12px; }
.signature-requirements i { color: var(--roxo-principal); font-size: 17px; }
.candidate-sign-start { width: 100%; justify-content: center; }
.signature-complete { display: grid; justify-items: center; gap: 7px; margin-top: 22px; padding: 20px 14px; border: 1px solid #A7F3D0; border-radius: 8px; background: #ECFDF5; text-align: center; }
.signature-complete i { color: #047857; font-size: 34px; }
.signature-complete strong { color: #065F46; }
.signature-complete span { color: #047857; font-size: 11px; line-height: 1.45; }
.candidate-contract-list .empty-state,
.candidate-sign-panel .empty-state { min-height: 100%; }

body.signature-modal-open { overflow: hidden; }
.signature-modal[hidden],
.signature-camera[hidden],
.signature-camera video[hidden],
.signature-camera img[hidden],
.signature-consent[hidden],
.signature-camera-actions button[hidden] { display: none !important; }
.signature-modal {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(20, 12, 35, .64);
    backdrop-filter: blur(3px);
}
.signature-modal-panel {
    width: min(680px, 100%);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    border: 1px solid #DDD6FE;
    border-radius: 8px;
    background: #FFFFFF;
    box-shadow: 0 24px 70px rgba(24, 12, 45, .28);
}
.signature-modal-panel > header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 22px;
    border-bottom: 1px solid var(--borda);
}
.signature-modal-panel h2 { margin-top: 3px; font-size: 21px; }
.signature-kicker { color: var(--roxo-principal); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.signature-modal-panel .icon-btn {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    border: 1px solid var(--borda);
    border-radius: 6px;
    background: #FFFFFF;
    color: var(--texto-medio);
    cursor: pointer;
}
.signature-document-summary {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 12px;
    margin: 18px 22px 0;
    padding: 13px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #FAF9FC;
}
.signature-document-summary > i { color: #DC2626; font-size: 30px; }
.signature-document-summary strong { display: block; overflow-wrap: anywhere; }
.signature-document-summary span { display: block; margin-top: 5px; color: var(--texto-fraco); font-size: 10px; }
.signature-document-summary code { overflow-wrap: anywhere; }
.signature-validation-status {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 10px;
    margin: 14px 22px;
    padding: 12px 14px;
    border: 1px solid #DDD6FE;
    border-radius: 8px;
    background: #F5F3FF;
}
.signature-validation-status > i { color: var(--roxo-principal); font-size: 20px; }
.signature-validation-status strong,
.signature-validation-status span { display: block; }
.signature-validation-status strong { font-size: 12px; }
.signature-validation-status span { margin-top: 3px; color: var(--texto-medio); font-size: 11px; line-height: 1.4; }
.signature-validation-status.ok { border-color: #A7F3D0; background: #ECFDF5; }
.signature-validation-status.ok > i { color: #047857; }
.signature-validation-status.erro { border-color: #FECACA; background: #FEF2F2; }
.signature-validation-status.erro > i { color: #DC2626; }
.signature-camera { margin: 14px 22px; }
.signature-camera video,
.signature-camera > img {
    width: 100%;
    height: min(44vh, 390px);
    display: block;
    border-radius: 8px;
    background: #111827;
    object-fit: contain;
}
.signature-camera video { transform: scaleX(-1); }
.signature-camera-actions { display: flex; justify-content: center; gap: 8px; margin-top: 10px; }
.signature-consent {
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 10px;
    margin: 14px 22px;
    padding: 13px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    color: var(--texto-medio);
    font-size: 11px;
    line-height: 1.5;
    cursor: pointer;
}
.signature-consent input { width: 17px; height: 17px; margin-top: 1px; accent-color: var(--roxo-principal); }
.signature-modal-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 16px 22px 20px; border-top: 1px solid var(--borda); }
.signature-modal-actions .btn-primary:disabled { opacity: .5; cursor: not-allowed; }

@media (max-width: 1180px) {
    .candidate-contract-layout { grid-template-columns: 280px minmax(420px, 1fr); }
    .candidate-sign-panel { grid-column: 1 / -1; min-height: auto; max-height: none; }
}
@media (max-width: 820px) {
    .candidate-area-tabs { align-items: stretch; flex-direction: column; }
    .candidate-area-tabs button { width: 100%; justify-content: flex-start; }
    .candidate-contract-layout { grid-template-columns: 1fr; }
    .candidate-contract-list { min-height: auto; max-height: 280px; }
    .candidate-contract-preview { min-height: 520px; max-height: 520px; }
    .candidate-contract-preview iframe { min-height: 518px; }
    .candidate-sign-panel { grid-column: auto; }
}
@media (max-width: 560px) {
    .signature-modal { align-items: flex-end; padding: 0; }
    .signature-modal-panel { width: 100%; max-height: 94vh; border-radius: 8px 8px 0 0; }
    .signature-modal-actions { align-items: stretch; flex-direction: column-reverse; }
    .signature-modal-actions button { width: 100%; justify-content: center; }
    .signature-camera video,
    .signature-camera > img { height: 42vh; }
}

/* Lado direito do login (stats) */
.login-stats-side {
    width: 220px;
    background: linear-gradient(160deg, #3B0F80, var(--roxo-principal));
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px 24px;
    gap: 16px;
}
.stat-card {
    background: rgba(255,255,255,0.12);
    border-radius: 12px;
    padding: 16px;
    width: 100%;
    text-align: center;
}
.stat-numero { font-size: 28px; font-weight: 700; color: white; }
.stat-desc   { font-size: 11px; color: rgba(255,255,255,0.65); margin-top: 2px; }
.tagline     { font-size: 12px; color: rgba(255,255,255,0.5); text-align: center; line-height: 1.6; }

/* ---- DASHBOARD ---- */
.dashboard-page {
    display: flex;
    min-height: 100vh;
}

/* Sidebar */
.sidebar {
    width: 210px;
    background: #F2F5F7;
    display: flex;
    flex-direction: column;
    padding: 24px 0;
    flex-shrink: 0;
    position: sticky;
    top: 0;
    height: 100vh;
}
.sidebar-logo { padding: 0 20px 28px; }

.sidebar-nav { flex: 1; overflow-y: auto; }

.nav-secao {
    display: block;
    font-size: 10px;
    color: #5A3878;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    padding: 16px 20px 6px;
}
.nav-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 20px;
    font-size: 13px;
    color: var(--roxo-texto);
    text-decoration: none;
    transition: background 0.12s;
}
.nav-item:hover  { background: #2D1354; color: white; }
.nav-item.active { background: #2D1354; color: white; border-right: 3px solid var(--roxo-principal); }
.nav-item i      { font-size: 16px; }

/* Usuário no rodapé da sidebar */
.sidebar-user {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 16px 20px;
    border-top: 1px solid #2D1354;
}
.user-avatar {
    width: 32px; height: 32px;
    background: var(--roxo-principal);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 600; color: white;
    flex-shrink: 0;
}
.user-info { flex: 1; overflow: hidden; }
.user-nome  { display: block; font-size: 12px; color: white; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-cargo { display: block; font-size: 10px; color: var(--roxo-texto); }
#btn-logout { background: none; border: none; color: var(--roxo-texto); cursor: pointer; font-size: 16px; padding: 4px; }
#btn-logout:hover { color: white; }

/* Conteúdo principal */
.main-content {
    flex: 1;
    min-width: 0;
    padding: 28px 32px;
    overflow-y: visible;
}

.topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}
.page-title { font-size: 20px; font-weight: 600; color: var(--texto-escuro); }

/* Métricas */
.metrics-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
    margin-bottom: 24px;
}
.metric-card {
    background: var(--cinza-card);
    border-radius: var(--raio);
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid var(--borda);
}
.metric-label { font-size: 11px; color: var(--texto-fraco); }
.metric-valor { font-size: 26px; font-weight: 700; color: var(--texto-escuro); }
.metric-delta { font-size: 11px; }
.metric-delta.positivo { color: var(--verde); }
.metric-delta.alerta   { color: var(--amarelo); }

/* Tabela */
.section-header { margin-bottom: 12px; }
.section-title { font-size: 14px; font-weight: 600; color: var(--texto-escuro); }

.table-container {
    background: var(--cinza-card);
    border-radius: var(--raio);
    border: 1px solid var(--borda);
    overflow: hidden;
}
.tabela { width: 100%; border-collapse: collapse; }
.tabela thead th {
    background: #F9F7FF;
    color: #5A3878;
    font-weight: 600;
    font-size: 12px;
    padding: 10px 16px;
    text-align: left;
    border-bottom: 1px solid var(--borda);
}
.tabela tbody td {
    padding: 10px 16px;
    color: var(--texto-medio);
    font-size: 13px;
    border-bottom: 1px solid #F9F7FF;
}
.tabela tbody tr:last-child td { border-bottom: none; }
.tabela tbody tr:hover td { background: #FAFAFA; }

.funcionario-cell { display: flex; align-items: center; gap: 8px; }
.mini-avatar {
    width: 28px; height: 28px;
    background: var(--roxo-claro);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 10px; font-weight: 600;
    color: var(--roxo-principal);
    flex-shrink: 0;
}

.loading-row { text-align: center; color: var(--texto-fraco); padding: 32px !important; }

/* ---- MODAL ---- */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.modal-box { background: white; border-radius: 16px; width: 600px; max-width: 95vw; max-height: 90vh; display: flex; flex-direction: column; box-shadow: 0 24px 60px rgba(0,0,0,0.2); }
.modal-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--borda); }
.modal-titulo { font-size: 16px; font-weight: 600; color: var(--texto-escuro); }
.modal-fechar { background: none; border: none; font-size: 20px; color: var(--texto-fraco); cursor: pointer; padding: 4px; border-radius: 6px; }
.modal-fechar:hover { background: var(--cinza-bg); color: var(--texto-escuro); }
.modal-body { padding: 24px; overflow-y: auto; flex: 1; }
.modal-footer { padding: 16px 24px; border-top: 1px solid var(--borda); display: flex; justify-content: flex-end; gap: 10px; }

/* ---- DIÁLOGO DE CONFIRMAÇÃO HIRED ---- */
body.hired-dialog-open { overflow: hidden; }
.hired-dialog-overlay[hidden] { display: none; }
.hired-dialog-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(26, 10, 46, .58);
    backdrop-filter: blur(2px);
    opacity: 0;
    transition: opacity .15s ease;
}
.hired-dialog-overlay.visible { opacity: 1; }
.hired-dialog {
    width: min(460px, 100%);
    overflow: hidden;
    border: 1px solid rgba(124, 58, 237, .16);
    border-radius: 8px;
    background: #FFFFFF;
    box-shadow: 0 24px 64px rgba(26, 10, 46, .28);
    transform: translateY(8px) scale(.985);
    transition: transform .15s ease;
}
.hired-dialog-overlay.visible .hired-dialog { transform: translateY(0) scale(1); }
.hired-dialog-content { display: grid; grid-template-columns: 42px minmax(0, 1fr) 30px; align-items: start; gap: 14px; padding: 22px 22px 20px; }
.hired-dialog-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; background: var(--roxo-claro); color: var(--roxo-principal); font-size: 22px; }
.hired-dialog-overlay[data-tipo="success"] .hired-dialog-icon { color: #047857; background: #D1FAE5; }
.hired-dialog-overlay[data-tipo="warning"] .hired-dialog-icon { color: #B45309; background: #FEF3C7; }
.hired-dialog-overlay[data-tipo="danger"] .hired-dialog-icon { color: #B91C1C; background: #FEE2E2; }
.hired-dialog-copy { min-width: 0; padding-top: 1px; }
.hired-dialog-copy h2 { margin: 0 0 7px; color: var(--texto-escuro); font-size: 16px; font-weight: 700; line-height: 1.3; }
.hired-dialog-copy p { margin: 0; color: var(--texto-medio); font-size: 13px; line-height: 1.55; white-space: pre-line; }
.hired-dialog-copy small { display: block; margin-top: 9px; color: var(--texto-fraco); font-size: 11px; line-height: 1.45; overflow-wrap: anywhere; user-select: text; cursor: text; }
.hired-dialog-close { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 7px; background: transparent; color: var(--texto-fraco); cursor: pointer; font-size: 18px; }
.hired-dialog-close:hover { color: var(--texto-escuro); background: var(--cinza-bg); }
.hired-dialog-actions { display: flex; justify-content: flex-end; gap: 9px; padding: 14px 22px; border-top: 1px solid var(--borda); background: #FCFBFF; }
.hired-dialog-button { min-height: 38px; padding: 8px 16px; border-radius: 8px; font: 600 12px var(--fonte); cursor: pointer; }
.hired-dialog-button.secondary { border: 1px solid var(--borda); background: #FFFFFF; color: var(--texto-medio); }
.hired-dialog-button.secondary:hover { border-color: #D8CFF4; background: #F8F5FF; }
.hired-dialog-button.primary { border: 1px solid var(--roxo-principal); background: var(--roxo-principal); color: #FFFFFF; }
.hired-dialog-button.primary:hover { background: #6D28D9; }
.hired-dialog-button.primary.danger { border-color: #DC2626; background: #DC2626; }
.hired-dialog-button.primary.danger:hover { background: #B91C1C; }
.hired-dialog-button:focus-visible,
.hired-dialog-close:focus-visible { outline: 3px solid rgba(124, 58, 237, .22); outline-offset: 2px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.modal-body .form-group { margin-bottom: 14px; }
.modal-body .form-group label { display: block; font-size: 12px; color: var(--texto-fraco); margin-bottom: 5px; font-weight: 500; }
.modal-body .form-group input, .input-select { width: 100%; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 9px 12px; color: var(--texto-medio); font-size: 13px; font-family: var(--fonte); outline: none; transition: border-color 0.15s; }
.modal-body .form-group input:focus, .input-select:focus { border-color: var(--roxo-principal); }
.btn-secondary { background: white; color: var(--texto-medio); border: 1px solid var(--borda); border-radius: var(--raio); padding: 9px 18px; font-size: 13px; font-weight: 500; cursor: pointer; transition: background 0.15s; }
.btn-secondary:hover { background: var(--cinza-bg); }
.page-subtitle { font-size: 13px; color: var(--texto-fraco); margin-top: 2px; }
.table-toolbar { padding: 12px 16px; border-bottom: 1px solid var(--borda); }
.input-busca { width: 280px; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 12px; font-size: 13px; font-family: var(--fonte); outline: none; }
.input-busca:focus { border-color: var(--roxo-principal); }

/* ---- FILIAIS ---- */
.modal-large { width: 680px; }
.filiais-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 16px; }
.filiais-desc { font-size: 13px; color: var(--texto-fraco); }
.filiais-vazio { text-align: center; color: var(--texto-fraco); padding: 24px; font-size: 13px; }
.filial-item { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border: 1px solid var(--borda); border-radius: var(--raio); margin-bottom: 8px; background: white; }
.filial-nome { font-size: 13px; font-weight: 500; color: var(--texto-escuro); display: flex; align-items: center; gap: 8px; }
.filial-detalhe { font-size: 11px; color: var(--texto-fraco); margin-top: 3px; }
.form-filial-box { background: var(--cinza-bg); border-radius: var(--raio); padding: 16px; margin-top: 16px; border: 1px solid var(--borda); }
.form-filial-titulo { font-size: 14px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 14px; }
.form-filial-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 8px; }
.btn-secondary.btn-sm { padding: 5px 10px; font-size: 12px; }

/* ---- AUTOCOMPLETE ---- */
.autocomplete-dropdown { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 1px solid var(--borda); border-radius: var(--raio); box-shadow: 0 4px 16px rgba(0,0,0,0.1); z-index: 100; max-height: 200px; overflow-y: auto; }
.autocomplete-item { padding: 8px 12px; font-size: 13px; color: var(--texto-medio); cursor: pointer; }
.autocomplete-item:hover { background: var(--roxo-claro); color: var(--roxo-principal); }
.autocomplete-aviso { color: var(--texto-fraco); cursor: default; font-style: italic; }

/* ---- EXPAND / FILIAIS INLINE ---- */
.btn-expand { background: none; border: none; cursor: pointer; color: var(--texto-fraco); padding: 4px; border-radius: 4px; transition: transform 0.2s, color 0.15s; display: flex; align-items: center; }
.btn-expand:hover { color: var(--roxo-principal); }
.btn-expand.aberto { transform: rotate(90deg); color: var(--roxo-principal); }
.tr-filiais td { background: #FAFAFA; }
.filiais-inline { padding: 12px 16px 16px 48px; border-top: 1px solid var(--borda); }
.filiais-inline-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.filiais-inline-titulo { font-size: 12px; font-weight: 600; color: var(--texto-fraco); text-transform: uppercase; letter-spacing: 0.06em; display: flex; align-items: center; gap: 6px; }
.filiais-lista { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.filial-row { display: flex; align-items: center; justify-content: space-between; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 12px; }
.filial-row-info { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filial-row-nome { font-size: 13px; font-weight: 500; color: var(--texto-escuro); }
.filial-row-detalhe { font-size: 11px; color: var(--texto-fraco); }
.filiais-vazio-inline { font-size: 12px; color: var(--texto-fraco); padding: 8px 0; font-style: italic; }
.form-filial-inline { background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px; margin-top: 10px; }
.form-filial-inline-titulo { font-size: 13px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 12px; }
.form-filial-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.btn-danger { background: white; color: #DC2626; border: 1px solid #FCA5A5; border-radius: var(--raio); padding: 7px 12px; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; transition: background 0.15s; }
.btn-danger:hover { background: #FEE2E2; }
.btn-danger.btn-sm { padding: 5px 8px; }
.btn-xs { padding: 3px 6px !important; font-size: 11px !important; }

/* ---- EXPAND / FILIAIS INLINE ---- */
.btn-expand { background: none; border: none; cursor: pointer; color: var(--texto-fraco); padding: 4px; border-radius: 4px; transition: transform 0.2s, color 0.15s; display: flex; align-items: center; }
.btn-expand:hover { color: var(--roxo-principal); }
.btn-expand.aberto { transform: rotate(90deg); color: var(--roxo-principal); }
.tr-filiais td { background: #FAFAFA; }
.filiais-inline { padding: 12px 16px 16px 48px; border-top: 1px solid var(--borda); }
.filiais-inline-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.filiais-inline-titulo { font-size: 12px; font-weight: 600; color: var(--texto-fraco); text-transform: uppercase; letter-spacing: 0.06em; display: flex; align-items: center; gap: 6px; }
.filiais-lista { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.filial-row { display: flex; align-items: center; justify-content: space-between; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 12px; }
.filial-row-info { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filial-row-nome { font-size: 13px; font-weight: 500; color: var(--texto-escuro); }
.filial-row-detalhe { font-size: 11px; color: var(--texto-fraco); }
.filiais-vazio-inline { font-size: 12px; color: var(--texto-fraco); padding: 8px 0; font-style: italic; }
.form-filial-inline { background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 14px; margin-top: 10px; }
.form-filial-inline-titulo { font-size: 13px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 12px; }
.form-filial-acoes { display: flex; justify-content: flex-end; gap: 8px; margin-top: 10px; }
.btn-danger { background: white; color: #DC2626; border: 1px solid #FCA5A5; border-radius: var(--raio); padding: 7px 12px; font-size: 12px; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; transition: background 0.15s; }
.btn-danger:hover { background: #FEE2E2; }
.btn-danger.btn-sm { padding: 5px 8px; }
.btn-xs { padding: 3px 6px !important; font-size: 11px !important; }

/* ---- TOGGLE SITUACAO ---- */
.toggle-group { display: flex; gap: 10px; }
.toggle-opt { display: flex; align-items: center; gap: 6px; padding: 8px 16px; border: 1px solid var(--borda); border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--texto-medio); transition: all 0.15s; }
.toggle-opt:has(input:checked) { border-color: var(--roxo-principal); background: var(--roxo-claro); color: var(--roxo-principal); font-weight: 500; }
.toggle-opt input { display: none; }

/* ---- NOVA ADMISSAO ---- */
.admissao-layout { display: flex; gap: 24px; align-items: flex-start; }
.admissao-form-card { flex: 1; background: white; border-radius: var(--raio); border: 1px solid var(--borda); padding: 24px; }
.admissao-info-card { width: 280px; flex-shrink: 0; background: var(--roxo-escuro); border-radius: var(--raio); padding: 24px; }
.form-bloco { margin-bottom: 24px; padding-bottom: 24px; border-bottom: 1px solid var(--borda); }
.form-bloco:last-child { border-bottom: none; margin-bottom: 0; }
.form-bloco-titulo { font-size: 13px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.form-bloco-titulo i { color: var(--roxo-principal); font-size: 16px; }
.form-bloco-sub { font-size: 11px; color: var(--texto-fraco); font-weight: 400; margin-left: 4px; }
.form-acoes { display: flex; justify-content: flex-end; margin-top: 24px; }
.btn-lg { padding: 12px 28px; font-size: 14px; }
.modal-body .form-group input, .modal-body .form-group select, .admissao-form-card .form-group input, .admissao-form-card .form-group select { width: 100%; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 9px 12px; color: var(--texto-medio); font-size: 13px; font-family: var(--fonte); outline: none; transition: border-color 0.15s; }
.admissao-form-card .form-group input:focus, .admissao-form-card .form-group select:focus { border-color: var(--roxo-principal); }
.admissao-form-card .form-group label { display: block; font-size: 12px; color: var(--texto-fraco); margin-bottom: 5px; font-weight: 500; }
.admissao-form-card .form-group { margin-bottom: 14px; flex: 1; }
.form-row { display: flex; gap: 14px; }
.info-titulo { font-size: 13px; font-weight: 600; color: white; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.info-steps { display: flex; flex-direction: column; gap: 14px; margin-bottom: 20px; }
.info-step { display: flex; gap: 12px; align-items: flex-start; }
.info-step-num { width: 24px; height: 24px; background: var(--roxo-principal); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: white; flex-shrink: 0; margin-top: 1px; }
.info-step-txt { font-size: 12px; color: rgba(255,255,255,0.7); line-height: 1.5; }
.info-step-txt strong { color: white; display: block; margin-bottom: 2px; }
.info-aviso { background: rgba(255,255,255,0.08); border-radius: 8px; padding: 10px 12px; font-size: 11px; color: rgba(255,255,255,0.5); display: flex; align-items: center; gap: 8px; }

/* ---- SUCESSO ADMISSAO ---- */
.sucesso-card { display: flex; flex-direction: column; align-items: center; background: white; border-radius: var(--raio); border: 1px solid var(--borda); padding: 48px 32px; text-align: center; max-width: 560px; margin: 0 auto; }
.sucesso-icone { font-size: 56px; color: var(--verde); margin-bottom: 16px; }
.sucesso-titulo { font-size: 20px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 8px; }
.sucesso-desc { font-size: 13px; color: var(--texto-fraco); margin-bottom: 20px; }
.sucesso-link-box { display: flex; gap: 8px; width: 100%; margin-bottom: 24px; }
.sucesso-link-box input { flex: 1; background: var(--cinza-bg); border: 1px solid var(--borda); border-radius: 8px; padding: 10px 14px; font-size: 12px; color: var(--texto-medio); outline: none; font-family: var(--fonte); }
.sucesso-acoes { display: flex; gap: 10px; }

/* ---- CADASTROS ---- */
.cadastros-empresa-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 12px 16px; }
.tabs-bar { display: flex; gap: 4px; margin-bottom: 16px; background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 6px; }
.tab-btn { background: none; border: none; padding: 8px 16px; font-size: 13px; font-weight: 500; color: var(--texto-fraco); cursor: pointer; border-radius: 8px; display: flex; align-items: center; gap: 6px; transition: all 0.15s; }
.tab-btn:hover { background: var(--cinza-bg); color: var(--texto-escuro); }
.tab-btn.active { background: var(--roxo-claro); color: var(--roxo-principal); }
.tab-content { display: none; }
.tab-content.ativa { display: block; }
.cadastro-card { background: white; border-radius: var(--raio); border: 1px solid var(--borda); overflow: hidden; }
.cadastro-card-header { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--borda); font-size: 14px; font-weight: 600; color: var(--texto-escuro); }
.cadastro-lista { min-height: 80px; }
.cadastro-vazio { text-align: center; color: var(--texto-fraco); padding: 32px; font-size: 13px; font-style: italic; }
.form-inline-cadastro { display: flex; align-items: center; gap: 8px; padding: 10px 16px; background: var(--cinza-bg); border-bottom: 1px solid var(--borda); flex-wrap: wrap; }
.input-inline { background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 7px 10px; font-size: 13px; font-family: var(--fonte); outline: none; transition: border-color 0.15s; }
.input-inline:focus { border-color: var(--roxo-principal); }

/* ---- CSV ---- */
.csv-instrucoes { background: var(--cinza-bg); border-radius: var(--raio); padding: 14px; margin-bottom: 8px; }
.csv-titulo { font-size: 13px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 6px; display: flex; align-items: center; gap: 6px; }
.csv-desc { font-size: 12px; color: var(--texto-fraco); margin-bottom: 8px; }
.csv-exemplo { font-family: monospace; font-size: 12px; background: white; border: 1px solid var(--borda); border-radius: 6px; padding: 6px 10px; margin-bottom: 8px; color: var(--roxo-principal); }
.csv-tipos { font-size: 12px; color: var(--texto-medio); line-height: 1.8; margin-bottom: 8px; }
.csv-tipos code { background: var(--roxo-claro); color: var(--roxo-principal); padding: 1px 5px; border-radius: 4px; font-size: 11px; }
.csv-exemplo-linhas { font-family: monospace; font-size: 11px; background: #1A0A2E; color: #C4B5FD; border-radius: 6px; padding: 10px 12px; line-height: 1.8; white-space: pre; }
.input-file { width: 100%; border: 2px dashed var(--borda); border-radius: 8px; padding: 12px; font-size: 13px; cursor: pointer; }
.input-file:hover { border-color: var(--roxo-principal); }
.csv-preview-titulo { font-size: 13px; font-weight: 600; color: var(--texto-escuro); margin: 12px 0 8px; }
.csv-preview-lista { display: flex; flex-direction: column; gap: 4px; }
.csv-preview-item { font-size: 12px; color: var(--texto-medio); display: flex; align-items: center; gap: 8px; }
.csv-resultado { margin-top: 12px; }
.csv-ok { background: #D1FAE5; color: #065F46; border-radius: 8px; padding: 10px 14px; font-size: 13px; display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.csv-erros { background: #FEE2E2; color: #991B1B; border-radius: 8px; padding: 10px 14px; font-size: 12px; line-height: 1.8; }

/* ---- PAINEL SISTEMA ---- */
.sistema-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.sys-empresa-card { background: white; border-radius: var(--raio); border: 1px solid var(--borda); padding: 16px; }
.sys-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.sys-card-id { font-size: 11px; font-weight: 700; color: var(--roxo-principal); background: var(--roxo-claro); padding: 2px 8px; border-radius: 99px; }
.sys-card-nome { font-size: 15px; font-weight: 600; color: var(--texto-escuro); margin-bottom: 2px; }
.sys-card-razao { font-size: 11px; color: var(--texto-fraco); margin-bottom: 10px; }
.sys-card-info { font-size: 12px; color: var(--texto-medio); margin-bottom: 4px; display: flex; align-items: center; gap: 6px; }
.sys-card-filiais-titulo { font-size: 11px; font-weight: 600; color: var(--texto-fraco); text-transform: uppercase; letter-spacing: 0.06em; margin: 10px 0 6px; display: flex; align-items: center; gap: 6px; }
.sys-card-filiais { display: flex; flex-direction: column; gap: 4px; }
.sys-filial-row { display: flex; align-items: center; gap: 8px; background: var(--cinza-bg); border-radius: 6px; padding: 5px 8px; }
.sys-filial-id { font-size: 10px; font-weight: 700; color: var(--roxo-principal); background: var(--roxo-claro); padding: 1px 6px; border-radius: 99px; flex-shrink: 0; }
.sys-filial-nome { font-size: 12px; color: var(--texto-medio); flex: 1; }
.sys-id-badge { display: inline-block; background: var(--roxo-claro); color: var(--roxo-principal); font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 99px; }
.sys-token { font-family: monospace; font-size: 11px; background: #F3F4F6; padding: 2px 6px; border-radius: 4px; color: var(--texto-fraco); }
.sys-filtros { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.sys-cadastros-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
/* ---- FUNCIONARIOS ---- */
.page-subtitle { font-size: 13px; color: var(--texto-fraco); margin-top: 4px; }
.btn-secondary { background: white; color: var(--texto-medio); border: 1px solid var(--borda); border-radius: var(--raio); padding: 10px 16px; font-size: 13px; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; }
.btn-secondary:hover { border-color: var(--roxo-principal); color: var(--roxo-principal); }
.btn-secondary.btn-sm { padding: 7px 12px; font-size: 12px; }
.func-toolbar { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.check-row { display: inline-flex; align-items: center; gap: 8px; color: var(--texto-escuro); font-weight: 600; }
.check-row input, .func-check { width: 16px; height: 16px; accent-color: var(--roxo-principal); }
.icon-action { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--borda); background: white; color: var(--texto-escuro); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; font-size: 18px; }
.input-busca { width: 360px; max-width: 100%; border: 1px solid var(--borda); border-radius: 8px; background: white; padding: 10px 14px; font-size: 13px; color: var(--texto-medio); outline: none; font-family: var(--fonte); }
.input-busca:focus { border-color: var(--roxo-principal); }
.func-status-tabs { display: inline-flex; background: white; border: 1px solid var(--borda); border-radius: 8px 8px 0 0; overflow: hidden; margin-bottom: -1px; }
.func-status-tab { border: none; border-right: 1px solid var(--borda); background: white; color: #1D4ED8; padding: 16px 32px; font-weight: 700; cursor: pointer; display: inline-flex; gap: 10px; align-items: center; }
.func-status-tab:last-child { border-right: none; }
.func-status-tab.active { background: #DBEAFE; }
.func-status-tab span { background: #DBEAFE; color: #1D4ED8; border-radius: 99px; padding: 2px 10px; font-size: 11px; }
.funcionarios-table { border-top-left-radius: 0; }
.func-row { cursor: pointer; }
.func-list-cell { display: flex; align-items: center; gap: 12px; min-width: 300px; }
.func-photo { width: 44px; height: 44px; border-radius: 50%; background: var(--roxo-claro); color: var(--roxo-principal); display: flex; align-items: center; justify-content: center; font-weight: 700; flex-shrink: 0; }
.func-photo-button { position: relative; width: 48px; height: 48px; flex: 0 0 48px; border: 0; background: transparent; padding: 0; cursor: pointer; }
.func-photo-button .func-photo { overflow: hidden; border: 2px solid #FFFFFF; box-shadow: 0 0 0 1px #DDD6FE; }
.func-photo img { width: 100%; height: 100%; display: block; object-fit: cover; }
.func-photo-edit { position: absolute; right: 0; bottom: 0; width: 19px; height: 19px; border: 2px solid #FFFFFF; border-radius: 50%; background: var(--roxo-principal); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 10px; }
.func-photo-button:hover .func-photo { box-shadow: 0 0 0 2px #C4B5FD; }
.func-name { font-weight: 700; color: #111827; }
.func-company { color: #2563EB; font-size: 12px; font-weight: 600; margin-top: 2px; }
.func-role { color: #111827; font-size: 12px; margin-top: 2px; }
.stage-pill, .qual-pill { min-width: 150px; display: inline-flex; justify-content: center; border-radius: 99px; padding: 9px 16px; background: #F3F4F6; color: #6B7280; font-size: 11px; font-weight: 800; text-transform: uppercase; box-shadow: inset 0 0 0 1px #E5E7EB; }
.qual-pill { background: #F0F0F3; color: #9CA3AF; box-shadow: none; }
.stage-select + .custom-select { width: 190px; min-width: 190px; }
.stage-select + .custom-select .custom-select-trigger { height: 38px; border-radius: 8px; font-size: 11px; text-transform: uppercase; }
.stage-select + .custom-select[data-stage="em_admissao"] .custom-select-trigger { border-color: #FDE68A; background: #FFFBEB; color: #A16207; }
.stage-select + .custom-select[data-stage="ativo"] .custom-select-trigger { border-color: #A7F3D0; background: #ECFDF5; color: #047857; }
.stage-select + .custom-select[data-stage="desligado"] .custom-select-trigger { border-color: #D1D5DB; background: #F3F4F6; color: #4B5563; }
.stage-select + .custom-select[data-stage="admissao_cancelada"] .custom-select-trigger { border-color: #FECACA; background: #FEF2F2; color: #B91C1C; }
.funcionarios-table.stage-menu-open { overflow: visible; position: relative; z-index: 40; }
.funcionarios-table.stage-menu-open .custom-select.open { z-index: 80; }
.func-cause-cell { min-width: 220px; max-width: 280px; }
.inactivation-cause { display: inline-flex; align-items: center; max-width: 100%; min-height: 30px; padding: 6px 10px; border-left: 3px solid #64748B; border-radius: 6px; background: #F1F5F9; color: #334155; font-size: 11px; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
.inactivation-cause.cancelled { border-left-color: #DC2626; background: #FEF2F2; color: #B91C1C; }
.stage-cause-dialog { width: min(560px, 100%); overflow: visible; }
.stage-cause-dialog .hired-dialog-content { padding-bottom: 22px; }
.stage-cause-field { display: block; margin-top: 18px; }
.stage-cause-field > span { display: block; margin-bottom: 7px; color: var(--texto-medio); font-size: 11px; font-weight: 700; }
.stage-cause-field .custom-select { width: 100%; }
.stage-cause-field .custom-select-trigger { min-height: 42px; }
.stage-cause-field .custom-select.open { z-index: 120; }
.stage-cause-field small { display: block; margin-top: 7px; color: #B91C1C; font-size: 11px; font-weight: 600; }
body.stage-cause-open { overflow: hidden; }
.config-delete-locked { min-width: 38px; justify-content: center; opacity: 0.58; }

/* ---- FICHA FUNCIONARIO ---- */
.ficha-main { padding: 20px 24px 28px; }
.ficha-hero { background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 16px; margin-bottom: 16px; }
.ficha-hero-body { display: flex; align-items: center; gap: 20px; margin-top: 16px; }
.ficha-avatar { width: 104px; height: 104px; border-radius: 50%; background: var(--roxo-claro); color: var(--roxo-principal); display: flex; align-items: center; justify-content: center; font-size: 26px; font-weight: 800; }
.ficha-avatar-button { position: relative; flex: 0 0 104px; border: 3px solid #FFFFFF; padding: 0; cursor: pointer; box-shadow: 0 0 0 1px #DDD6FE; overflow: visible; }
.ficha-avatar-button > img { width: 100%; height: 100%; border-radius: 50%; display: block; object-fit: cover; }
.ficha-avatar-button > strong { font-size: 26px; }
.ficha-avatar-edit { position: absolute; right: -1px; bottom: 2px; width: 30px; height: 30px; border: 3px solid #FFFFFF; border-radius: 50%; background: var(--roxo-principal); color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.ficha-avatar-button:hover { box-shadow: 0 0 0 3px #C4B5FD; }
.ficha-identidade h1 { color: var(--texto-escuro); font-size: 22px; margin-bottom: 4px; }
.ficha-subtitulo { color: var(--texto-fraco); font-size: 13px; margin-bottom: 10px; }
.ficha-tags { display: flex; gap: 8px; }
.ficha-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 16px; align-items: start; }
.ficha-tabs { background: white; border: 1px solid var(--borda); border-radius: var(--raio); overflow: hidden; }
.ficha-tab { width: 100%; border: none; background: white; border-bottom: 1px solid var(--borda); padding: 14px 16px; text-align: left; display: flex; align-items: center; gap: 10px; color: var(--texto-medio); cursor: pointer; font-weight: 600; }
.ficha-tab:last-child { border-bottom: none; }
.ficha-tab i { font-size: 18px; }
.ficha-tab.active { background: #EAF2FF; color: #0B63CE; }
.ficha-content { min-width: 0; }
.ficha-panel { display: none; background: white; border: 1px solid var(--borda); border-radius: var(--raio); padding: 22px 24px; min-height: 420px; }
.ficha-panel.ativa { display: block; }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.panel-header h2 { color: var(--texto-escuro); font-size: 20px; }
.info-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.info-field { border: 1px solid var(--borda); border-radius: 8px; padding: 12px; background: #FCFCFF; min-height: 70px; }
.info-field span { display: block; color: var(--texto-fraco); font-size: 11px; margin-bottom: 8px; }
.info-field strong { color: var(--texto-escuro); font-size: 13px; overflow-wrap: anywhere; }
.empty-state { border: 1px dashed var(--borda); border-radius: 8px; padding: 26px; color: var(--texto-fraco); text-align: center; }
.empty-state.compact { padding: 14px; text-align: left; }
.document-list { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: 8px; overflow: hidden; }
.document-row { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--borda); }
.document-row:last-child { border-bottom: none; }
.document-row strong { display: block; color: var(--texto-escuro); margin-bottom: 4px; }
.document-row span { color: var(--texto-fraco); font-size: 12px; }
.document-row > div:first-child { min-width: 0; flex: 1; }
.document-row > div:first-child strong { overflow-wrap: anywhere; }
.document-row .table-actions { flex-shrink: 0; }
.doc-workspace { display: grid; grid-template-columns: 250px minmax(460px, 1.6fr) 280px; gap: 14px; min-height: 430px; align-items: stretch; }
.doc-list { display: flex; flex-direction: column; border: 1px solid var(--borda); border-radius: 8px; overflow-y: auto; max-height: 430px; background: white; }
.doc-item { border: none; border-bottom: 1px solid var(--borda); background: white; padding: 11px 12px; text-align: left; cursor: pointer; display: grid; grid-template-columns: 20px 1fr; column-gap: 9px; row-gap: 2px; color: var(--texto-medio); }
.doc-item:last-child { border-bottom: none; }
.doc-item i { grid-row: span 2; font-size: 18px; color: var(--roxo-principal); }
.doc-item span { font-weight: 700; color: var(--texto-escuro); }
.doc-item small { color: var(--texto-fraco); }
.doc-item.active { background: #EAF2FF; }
.doc-preview { border: 1px solid var(--borda); border-radius: 8px; background: #F9FAFB; min-height: 430px; max-height: 430px; display: flex; align-items: center; justify-content: center; overflow: auto; }
.doc-preview-empty { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; color: var(--texto-fraco); padding: 24px; }
.doc-preview-empty i { font-size: 44px; color: var(--roxo-principal); }
.doc-preview-empty strong { color: var(--texto-escuro); }
.ocr-panel { border: 1px solid var(--borda); border-radius: 8px; padding: 14px; background: white; max-height: 430px; overflow-y: auto; }
.ocr-panel h3 { font-size: 14px; color: var(--texto-escuro); margin-bottom: 14px; }
.ocr-field { display: block; margin-bottom: 12px; }
.ocr-field span { display: block; font-size: 11px; color: var(--texto-fraco); margin-bottom: 5px; }
.ocr-field input { width: 100%; border: 1px solid var(--borda); border-radius: 8px; padding: 9px 10px; font-size: 13px; outline: none; }
.timeline { display: flex; flex-direction: column; gap: 14px; }
.timeline-item { display: flex; gap: 12px; align-items: flex-start; }
.timeline-item > span { width: 10px; height: 10px; border-radius: 50%; background: var(--roxo-principal); margin-top: 5px; flex-shrink: 0; }
.timeline-item strong { display: block; color: var(--texto-escuro); margin-bottom: 2px; }
.timeline-item small { color: var(--texto-fraco); }

.erp-conversion-card { margin-top: 16px; }
.erp-conversion-card .erp-list-title p { color: var(--texto-fraco); font-size: 12px; margin-top: 3px; }
.erp-conversion-form { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(230px, 1.5fr) minmax(150px, 0.8fr) auto; gap: 12px; align-items: end; }
.erp-conversion-form label { margin-bottom: 0; }
.erp-conversion-form button { min-height: 42px; margin-bottom: 0; }
.erp-conversion-origin .custom-select { width: 100%; }
.erp-conversion-manual { width: 100%; margin-top: 8px; }
.erp-conversion-list { display: flex; flex-direction: column; gap: 8px; margin-top: 14px; max-height: 300px; overflow-y: auto; }
.erp-conversion-row { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(180px, 1.4fr) 24px minmax(90px, .7fr) auto; align-items: center; gap: 10px; border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; background: #FBFAFF; }
.erp-conversion-row strong, .erp-conversion-row b { color: var(--texto-escuro); font-size: 13px; }
.erp-conversion-row span { color: var(--texto-medio); font-size: 13px; }
.erp-conversion-row > i { color: var(--roxo-principal); text-align: center; }

@media (max-width: 1100px) {
    .erp-conversion-form, .erp-conversion-row { grid-template-columns: 1fr; }
    .erp-conversion-row > i { transform: rotate(90deg); }
}

@media (max-width: 1100px) {
    .ficha-layout { grid-template-columns: 1fr; }
    .ficha-tabs { display: grid; grid-template-columns: repeat(2, 1fr); }
    .doc-workspace { grid-template-columns: 1fr; }
    .info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.doc-obrigatoriedade { width: max-content; border-radius: 99px; padding: 1px 6px; font-size: 9px; line-height: 1.35; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; }
.doc-obrigatoriedade.obrigatorio { background: #FEE2E2; color: #991B1B; }
.doc-obrigatoriedade.opcional { background: #E0F2FE; color: #075985; }
.personal-data-header,
.contract-data-header { margin: -2px -4px 8px; padding: 0 4px 16px; border-bottom: 1px solid #EDE9FE; }
.personal-data-title,
.contract-data-title { display: flex; align-items: center; gap: 10px; }
.personal-data-title > span,
.contract-data-title > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 7px; background: #EDE9FE; color: var(--roxo-principal); font-size: 18px; }
.personal-data-title h2,
.contract-data-title h2 { margin: 0; }
.info-grid-pessoais,
.info-grid-contratuais { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; border-top: 1px solid #F1EEF9; }
.info-grid-pessoais .info-field,
.info-grid-contratuais .info-field { position: relative; min-width: 0; min-height: 68px; padding: 14px 10px 13px 16px; border: 0; border-bottom: 1px solid #F1EEF9; border-radius: 0; background: #FFFFFF; }
.info-grid-pessoais .info-field::before,
.info-grid-contratuais .info-field::before { content: ''; position: absolute; top: 16px; bottom: 16px; left: 0; width: 3px; border-radius: 2px; background: #C4B5FD; }
.info-grid-pessoais .info-field.is-empty::before,
.info-grid-contratuais .info-field.is-empty::before { background: #E2E8F0; }
.info-grid-pessoais .info-field span,
.info-grid-contratuais .info-field span { margin-bottom: 5px; color: #64748B; font-size: 10px; font-weight: 700; line-height: 1.25; text-transform: uppercase; letter-spacing: 0; }
.info-grid-pessoais .info-field strong,
.info-grid-contratuais .info-field strong { display: block; color: #1F2937; font-size: 13px; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.info-grid-pessoais .info-field.is-empty strong,
.info-grid-contratuais .info-field.is-empty strong { color: #94A3B8; font-weight: 600; }

@media (max-width: 1280px) {
    .info-grid-pessoais,
    .info-grid-contratuais { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
    .ficha-hero-body { align-items: flex-start; flex-direction: column; gap: 14px; }
    .ficha-identidade { width: 100%; min-width: 0; }
    .ficha-identidade h1,
    .ficha-subtitulo { overflow-wrap: anywhere; }
    .ficha-tags { flex-wrap: wrap; }
    .ficha-tabs { grid-template-columns: minmax(0, 1fr); }
    .ficha-tab { min-width: 0; }
    .ficha-panel { padding: 18px 14px; }
    .ficha-panel .panel-header { align-items: flex-start; flex-wrap: wrap; }
    .ficha-avatar { width: 84px; height: 84px; font-size: 22px; }
    .ficha-avatar-button { flex-basis: 84px; }
    .ficha-avatar-button > strong { font-size: 22px; }
    .ficha-avatar-edit { width: 26px; height: 26px; font-size: 12px; }
    .info-grid-pessoais,
    .info-grid-contratuais { grid-template-columns: 1fr; }
}
.edit-grid { display: grid; grid-template-columns: repeat(2, minmax(260px, 1fr)); gap: 14px 20px; }
.edit-grid label { display: flex; flex-direction: column; gap: 6px; }
.edit-grid label span { font-size: 11px; font-weight: 700; color: var(--texto-fraco); text-transform: uppercase; letter-spacing: 0.03em; }
.edit-grid input, .edit-grid select { width: 100%; border: 1px solid var(--borda); border-radius: 8px; padding: 9px 10px; font-size: 13px; font-family: var(--fonte); color: var(--texto-medio); background: white; outline: none; }
.edit-grid input:focus, .edit-grid select:focus { border-color: var(--roxo-principal); }
.edit-grid input:disabled { background: #F3F4F6; color: var(--texto-fraco); cursor: not-allowed; }
.edit-actions { grid-column: 1 / -1; display: flex; justify-content: flex-end; padding-top: 8px; }
.activity-change { margin-top: 6px; font-size: 12px; color: var(--texto-medio); background: #F9FAFB; border: 1px solid var(--borda); border-radius: 8px; padding: 8px 10px; line-height: 1.6; }
.activity-change em { color: var(--texto-fraco); font-style: normal; font-weight: 700; }

.filtro-select {
    width: 220px;
    min-width: 180px;
    height: 42px;
}

.func-toolbar {
    flex-wrap: wrap;
}

@media (max-width: 900px) {
    .filtro-select,
    .func-toolbar .input-busca {
        width: 100%;
    }
}


/* ---- PORTAL DO CANDIDATO: DOCUMENTOS ---- */
.candidate-doc-page { min-height: 100vh; background: #F4F0FB; color: var(--texto-escuro); }
.candidate-header { height: 84px; display: flex; align-items: center; justify-content: space-between; padding: 0 32px; background: white; border-bottom: 1px solid var(--borda); }
.candidate-header .sidebar-logo { padding: 0; }
.candidate-person { display: flex; flex-direction: column; align-items: flex-end; gap: 3px; }
.candidate-person span { font-weight: 700; }
.candidate-person small { color: var(--texto-fraco); }
.candidate-shell { padding: 28px 32px 40px; max-width: 1500px; margin: 0 auto; }
.candidate-intro { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; margin-bottom: 22px; }
.candidate-intro h1 { font-size: 26px; margin-bottom: 6px; }
.candidate-intro p { max-width: 680px; color: var(--texto-medio); line-height: 1.5; }
.candidate-progress { background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 14px 18px; min-width: 170px; }
.candidate-progress strong { display: block; font-size: 26px; color: var(--roxo-principal); }
.candidate-progress span { font-size: 12px; color: var(--texto-fraco); }
.candidate-doc-layout { display: grid; grid-template-columns: 310px 340px minmax(420px, 1fr); gap: 16px; align-items: stretch; }
.candidate-doc-list { background: white; border: 1px solid var(--borda); border-radius: 8px; overflow-y: auto; max-height: 640px; }
.candidate-doc-item { width: 100%; border: none; border-bottom: 1px solid var(--borda); background: white; padding: 14px; display: grid; grid-template-columns: 22px 1fr auto; gap: 4px 10px; text-align: left; cursor: pointer; align-items: center; }
.candidate-doc-item:last-child { border-bottom: none; }
.candidate-doc-item.active { background: #F0E7FF; box-shadow: inset 3px 0 0 var(--roxo-principal); }
.candidate-doc-item i { color: var(--roxo-principal); font-size: 18px; }
.candidate-doc-item span { font-weight: 700; color: var(--texto-escuro); }
.candidate-doc-item small { border-radius: 999px; padding: 3px 8px; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.candidate-doc-item small.obrigatorio, #doc-obrigatorio.obrigatorio { background: #FEE2E2; color: #B91C1C; }
.candidate-doc-item small.opcional, #doc-obrigatorio.opcional { background: #EDE9FE; color: var(--roxo-principal); }
.candidate-doc-item em { grid-column: 2 / 4; color: var(--texto-fraco); font-size: 12px; font-style: normal; }
.candidate-upload-panel { background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 18px; }
.upload-doc-title { display: flex; justify-content: space-between; gap: 12px; align-items: center; margin-bottom: 16px; }
.upload-doc-title span { font-size: 17px; font-weight: 800; }
#doc-obrigatorio { border-radius: 999px; padding: 4px 9px; font-size: 10px; font-weight: 800; text-transform: uppercase; white-space: nowrap; }
.upload-drop { min-height: 210px; border: 1.5px dashed #BFA7F5; border-radius: 8px; background: #FAF8FF; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; cursor: pointer; padding: 20px; }
.upload-drop input { display: none; }
.upload-drop i { font-size: 42px; color: var(--roxo-principal); }
.upload-drop strong { font-size: 16px; }
.upload-drop span, .arquivo-info { color: var(--texto-fraco); font-size: 13px; }
.arquivo-info { margin-top: 12px; padding: 10px 12px; background: #F9FAFB; border: 1px solid var(--borda); border-radius: 8px; word-break: break-word; }
.candidate-actions { margin-top: 16px; display: flex; justify-content: flex-end; }
.candidate-actions .btn-primary:disabled { opacity: .55; cursor: not-allowed; }
.upload-msg { margin-top: 12px; border-radius: 8px; padding: 10px 12px; font-size: 13px; font-weight: 600; }
.upload-msg.ok { background: #DCFCE7; color: #166534; }
.upload-msg.erro { background: #FEE2E2; color: #991B1B; }
.candidate-preview { background: white; border: 1px solid var(--borda); border-radius: 8px; min-height: 640px; max-height: 640px; overflow: auto; display: flex; align-items: center; justify-content: center; }
.candidate-preview iframe { width: 100%; height: 638px; border: none; background: white; }
.candidate-preview img { max-width: 100%; height: auto; display: block; }
@media (max-width: 1120px) {
    .candidate-doc-layout { grid-template-columns: 1fr; }
    .candidate-preview { min-height: 460px; max-height: 460px; }
    .candidate-preview iframe { height: 458px; }
}
@media (max-width: 720px) {
    .candidate-header, .candidate-intro { flex-direction: column; align-items: flex-start; }
    .candidate-person { align-items: flex-start; }
    .candidate-shell { padding: 20px 16px 32px; }
}


.candidate-auth {
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(320px, 420px);
    gap: 28px;
    align-items: start;
    background: white;
    border: 1px solid var(--borda);
    border-radius: 8px;
    padding: 24px;
    margin-bottom: 22px;
}
.candidate-auth h1 { font-size: 24px; margin-bottom: 8px; }
.candidate-auth p { color: var(--texto-medio); line-height: 1.5; }
.candidate-auth-form { display: grid; gap: 12px; }
.candidate-auth-form label span { display: block; font-size: 12px; color: var(--texto-fraco); font-weight: 700; margin-bottom: 5px; }
.candidate-auth-form input { width: 100%; background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; color: var(--texto-medio); font-size: 13px; font-family: var(--fonte); outline: none; }
.candidate-auth-form input:focus { border-color: var(--roxo-principal); }
.candidate-auth-form .btn-primary { justify-content: center; }
.panel-actions { display: flex; gap: 8px; flex-wrap: wrap; }
@media (max-width: 760px) {
    .candidate-auth { grid-template-columns: 1fr; }
}


.docs-metrics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-bottom: 18px;
}
.table-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}
@media (max-width: 900px) {
    .docs-metrics {
        grid-template-columns: 1fr;
    }
}


/* ---- FILTROS / SELECTS MODERNOS ---- */
.func-toolbar {
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(124, 58, 237, 0.10);
    border-radius: 8px;
    padding: 10px;
    box-shadow: 0 10px 28px rgba(17, 24, 39, 0.04);
}

.input-select,
.filtro-select {
    appearance: none;
    -webkit-appearance: none;
    background-color: #FFFFFF;
    background-image:
        linear-gradient(45deg, transparent 50%, var(--roxo-principal) 50%),
        linear-gradient(135deg, var(--roxo-principal) 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 18px,
        calc(100% - 13px) 18px;
    background-size: 5px 5px, 5px 5px;
    background-repeat: no-repeat;
    border: 1px solid #E4DDF7;
    border-radius: 8px;
    color: var(--texto-escuro);
    cursor: pointer;
    font-weight: 600;
    height: 42px;
    line-height: 1.2;
    padding: 10px 38px 10px 14px;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}

.input-select:hover,
.filtro-select:hover {
    border-color: #C4B5FD;
    background-color: #FCFAFF;
}

.input-select:focus,
.filtro-select:focus {
    border-color: var(--roxo-principal);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14);
}

.input-select:disabled,
.filtro-select:disabled {
    background-color: #F5F3FA;
    color: var(--texto-fraco);
    cursor: not-allowed;
    opacity: 0.85;
}

.input-select option,
.filtro-select option {
    color: var(--texto-escuro);
    font-weight: 500;
}

.func-toolbar .input-busca {
    height: 42px;
    border-color: #E4DDF7;
    background: #FFFFFF;
    box-shadow: none;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.func-toolbar .input-busca:hover {
    border-color: #C4B5FD;
    background-color: #FCFAFF;
}

.func-toolbar .input-busca:focus {
    border-color: var(--roxo-principal);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14);
}


/* ---- TRANSICOES DAS LISTAGENS ---- */
.funcionarios-table {
    position: relative;
    overflow: hidden;
}

.funcionarios-table .tabela tbody {
    transition: opacity 0.18s ease, transform 0.18s ease, filter 0.18s ease;
}

.funcionarios-table.is-loading .tabela tbody {
    opacity: 0.42;
    transform: translateY(4px);
    filter: blur(0.4px);
    pointer-events: none;
}

.funcionarios-table::after {
    content: "Atualizando lista...";
    position: absolute;
    top: 14px;
    right: 16px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid #E4DDF7;
    border-radius: 999px;
    box-shadow: 0 10px 24px rgba(17, 24, 39, 0.08);
    color: var(--roxo-principal);
    font-size: 12px;
    font-weight: 800;
    opacity: 0;
    padding: 8px 12px;
    pointer-events: none;
    transform: translateY(-6px);
    transition: opacity 0.18s ease, transform 0.18s ease;
    z-index: 3;
}

.funcionarios-table.is-loading::after {
    opacity: 1;
    transform: translateY(0);
}

.tabela tbody tr {
    animation: rowFadeIn 0.22s ease both;
}

@keyframes rowFadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.select-loading {
    background-color: #F7F2FF;
    color: var(--roxo-principal);
}


/* ---- CUSTOM SELECTS FLUIDOS ---- */
.native-select-hidden {
    position: absolute !important;
    width: 1px !important;
    min-width: 1px !important;
    max-width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.custom-select {
    position: relative;
    width: 220px;
    min-width: 180px;
}

.custom-select-trigger {
    width: 100%;
    height: 42px;
    border: 1px solid #E4DDF7;
    border-radius: 8px;
    background: #FFFFFF;
    color: var(--texto-escuro);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 12px 0 14px;
    cursor: pointer;
    font-family: var(--fonte);
    font-size: 13px;
    font-weight: 700;
    transition: border-color 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease, transform 0.16s ease;
}

.custom-select-trigger i {
    color: var(--roxo-principal);
    font-size: 16px;
    transition: transform 0.18s ease;
}

.custom-select:hover .custom-select-trigger {
    border-color: #C4B5FD;
    background: #FCFAFF;
}

.custom-select.open .custom-select-trigger {
    border-color: var(--roxo-principal);
    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.14);
}

.custom-select.open .custom-select-trigger i {
    transform: rotate(180deg);
}

.custom-select.disabled .custom-select-trigger {
    background: #F5F3FA;
    color: var(--texto-fraco);
    cursor: not-allowed;
    opacity: 0.86;
}

.custom-select-menu {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 30;
    background: #FFFFFF;
    border: 1px solid #DDD6FE;
    border-radius: 8px;
    box-shadow: 0 18px 38px rgba(17, 24, 39, 0.16);
    max-height: 230px;
    overflow-y: auto;
    padding: 5px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-6px) scale(0.98);
    transform-origin: top;
    transition: opacity 0.16s ease, transform 0.16s ease;
}

.custom-select.open .custom-select-menu {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.custom-select-option {
    width: 100%;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--texto-escuro);
    cursor: pointer;
    display: flex;
    align-items: center;
    min-height: 34px;
    padding: 8px 10px;
    text-align: left;
    font-family: var(--fonte);
    font-size: 13px;
    font-weight: 600;
    transition: background-color 0.13s ease, color 0.13s ease, transform 0.13s ease;
}

.custom-select-option:hover {
    background: #F3ECFF;
    color: var(--roxo-principal);
    transform: translateX(2px);
}

.custom-select-option.selected {
    background: var(--roxo-principal);
    color: #FFFFFF;
}

.custom-select-option.selected:hover {
    background: #6D28D9;
    color: #FFFFFF;
}

@media (max-width: 900px) {
    .custom-select {
        width: 100%;
    }
}


/* ---- CUSTOM SELECTS GLOBAL ---- */
.custom-select {
    max-width: 100%;
}

.form-group .custom-select,
.admissao-form-card .custom-select,
.modal-body .custom-select,
.edit-grid .custom-select,
.form-inline-cadastro .custom-select,
.cadastros-empresa-bar .custom-select {
    width: 100%;
}

.form-inline-cadastro .custom-select {
    min-width: 130px;
}

.custom-select-trigger span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.custom-select-menu::-webkit-scrollbar {
    width: 8px;
}

.custom-select-menu::-webkit-scrollbar-thumb {
    background: #DDD6FE;
    border-radius: 999px;
}

.custom-select-menu::-webkit-scrollbar-track {
    background: #F8F5FF;
}


/* Zoom do preview de documentos */
.candidate-preview { display: block; position: relative; scroll-behavior: auto; }
.preview-zoom-toolbar { position: sticky; top: 10px; left: 10px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; padding: 10px; }
.preview-zoom-toolbar span { background: rgba(26, 10, 46, 0.76); color: white; border-radius: 999px; padding: 4px 9px; font-size: 11px; font-weight: 700; line-height: 1; box-shadow: 0 8px 20px rgba(26, 10, 46, 0.16); }
.preview-zoom-content { width: 100%; margin: -38px auto 0; transition: width 0.12s ease, transform 0.16s ease, padding 0.16s ease; transform-origin: center center; }
.preview-zoom-content iframe { width: 100%; border: none; background: white; display: block; }
.preview-zoom-content img { width: 100%; max-width: none; height: auto; display: block; margin: 0 auto 12px; }


/* Preview real dos documentos na ficha do funcionário */
.doc-preview-frame { width: 100%; height: 428px; border: none; background: white; display: block; }
.doc-preview-img { width: 100%; height: auto; display: block; margin: 0 auto; }
.doc-item .ti-circle-check { color: #16A34A; }


/* Zoom do preview de documentos na ficha do funcionário */
#ficha-doc-preview { display: block; position: relative; scroll-behavior: auto; align-items: initial; justify-content: initial; }
.ficha-preview-zoom-toolbar { position: sticky; top: 8px; left: 8px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; padding: 8px; }
.ficha-preview-zoom-toolbar span { background: rgba(26, 10, 46, 0.76); color: white; border-radius: 999px; padding: 4px 9px; font-size: 11px; font-weight: 700; line-height: 1; box-shadow: 0 8px 20px rgba(26, 10, 46, 0.16); }
.ficha-preview-zoom-content { width: 100%; margin: -34px auto 0; transition: width 0.12s ease, transform 0.16s ease, padding 0.16s ease; transform-origin: center center; }
.ficha-preview-zoom-content iframe { width: 100%; border: none; background: white; display: block; }
.ficha-preview-zoom-content img { width: 100%; max-width: none; height: auto; display: block; margin: 0 auto 12px; }


.preview-rotate-btn { border: none; border-radius: 999px; width: 26px; height: 26px; display: inline-flex; align-items: center; justify-content: center; background: rgba(26, 10, 46, 0.82); color: white; cursor: pointer; box-shadow: 0 8px 20px rgba(26, 10, 46, 0.16); }
.preview-rotate-btn:hover { background: rgba(91, 44, 168, 0.92); }


.uploaded-doc-line { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 0; border-bottom: 1px solid var(--borda); }
.uploaded-doc-line:last-child { border-bottom: none; }
.uploaded-doc-line span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texto-medio); font-size: 12px; }
.uploaded-doc-actions { margin-bottom: 14px; border: 1px solid var(--borda); border-radius: 8px; padding: 6px 10px; background: #F9FAFB; }


.preview-zoom-content.is-rotated,
.ficha-preview-zoom-content.is-rotated { padding: 120px 0; margin-top: 24px; }


/* Lista expansível da página Documentos */
.docs-detail-row td { background: #FBFAFF !important; padding: 0 16px 14px !important; }
.docs-inline-list { border: 1px solid var(--borda); border-radius: 8px; background: white; overflow: hidden; }
.docs-inline-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-bottom: 1px solid var(--borda); }
.docs-inline-item:last-child { border-bottom: none; }
.docs-inline-item strong { display: block; color: var(--texto-escuro); font-size: 13px; margin-bottom: 3px; }
.docs-inline-item span { display: block; color: var(--texto-fraco); font-size: 12px; }
.docs-inline-empty { border: 1px dashed var(--borda); border-radius: 8px; padding: 14px; color: var(--texto-fraco); background: white; font-size: 13px; }


/* Contratos e benefícios */
.contract-tabs { display: inline-flex; gap: 6px; padding: 6px; background: white; border: 1px solid var(--borda); border-radius: 8px; margin-bottom: 16px; }
.contract-tab { border: none; background: transparent; color: var(--texto-medio); padding: 9px 14px; border-radius: 6px; cursor: pointer; font-weight: 700; display: inline-flex; align-items: center; gap: 8px; }
.contract-tab.active { background: #EDE9FE; color: var(--roxo-principal); }
.contract-layout { display: grid; grid-template-columns: minmax(300px, 360px) 1fr; gap: 16px; align-items: start; }
.contract-upload-panel, .contract-list-panel, .contract-generator, .contract-ficha-section { background: white; border: 1px solid var(--borda); border-radius: 8px; padding: 18px; }
.contract-upload-panel h2 { font-size: 18px; margin-bottom: 16px; color: var(--texto-escuro); }
.contract-upload-panel label { display: block; margin-bottom: 14px; }
.contract-upload-panel label span { display: block; font-size: 12px; color: var(--texto-fraco); margin-bottom: 6px; }
.contract-upload-panel input, .contract-upload-panel select { width: 100%; border: 1px solid var(--borda); border-radius: 8px; padding: 10px 12px; font-family: var(--fonte); outline: none; }
.contract-drop { min-height: 150px; overflow: hidden; }
.contract-drop #contrato-arquivo-info { display: -webkit-box; max-width: 100%; overflow: hidden; overflow-wrap: anywhere; text-align: center; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.contract-model-list { display: flex; flex-direction: column; gap: 10px; }
.contract-model-row { display: flex; justify-content: space-between; gap: 12px; align-items: center; border: 1px solid var(--borda); border-radius: 8px; padding: 12px; }
.contract-model-row strong, .contract-ficha-section h3 { color: var(--texto-escuro); }
.contract-model-row span { display: block; margin-top: 4px; color: var(--texto-fraco); font-size: 12px; }
.contract-model-copy { min-width: 0; flex: 1; }
.contract-model-copy strong, .contract-model-copy span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contract-model-row .table-actions { flex-shrink: 0; }
.contract-ficha-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.contract-ficha-section h3 { font-size: 15px; margin-bottom: 12px; }
.contract-generator { margin-bottom: 14px; }
.contract-check { display: flex; gap: 10px; align-items: flex-start; padding: 10px 0; border-bottom: 1px solid var(--borda); cursor: pointer; }
.contract-check:last-of-type { border-bottom: none; }
.contract-check input { margin-top: 4px; }
.contract-check strong { display: block; color: var(--texto-escuro); }
.contract-check small { color: var(--texto-fraco); }
@media (max-width: 980px) { .contract-layout, .contract-ficha-grid { grid-template-columns: 1fr; } }

body.contract-preview-open { overflow: hidden; }
.contract-preview-overlay[hidden],
.contract-preview-loading[hidden],
.contract-preview-body iframe[hidden] { display: none; }
.contract-preview-overlay {
    z-index: 2400;
    padding: 18px;
    background: rgba(25, 13, 43, .66);
    backdrop-filter: blur(3px);
}
.contract-preview-modal {
    width: min(1180px, 96vw);
    height: min(820px, 94vh);
    max-height: 94vh;
    border-radius: 8px;
    overflow: hidden;
}
.contract-preview-heading { display: flex; align-items: center; gap: 11px; min-width: 0; }
.contract-preview-heading > div { min-width: 0; }
.contract-preview-heading .modal-titulo,
.contract-preview-heading > div > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contract-preview-heading > div > span { max-width: min(760px, 65vw); margin-top: 3px; color: var(--texto-fraco); font-size: 11px; }
.contract-preview-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    flex: 0 0 36px;
    border-radius: 7px;
    color: #B91C1C;
    background: #FEE2E2;
    font-size: 20px;
}
.contract-preview-body {
    position: relative;
    min-height: 420px;
    flex: 1;
    overflow: hidden;
    background: #525659;
}
.contract-preview-body iframe { width: 100%; height: 100%; border: 0; background: #525659; }
.contract-preview-loading {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 10px;
    color: #FFFFFF;
    background: #525659;
    font-size: 13px;
}
.contract-preview-loading i { color: #C4B5FD; font-size: 25px; }
.contract-preview-modal .modal-footer { padding: 11px 16px; }
.document-row .btn-secondary:disabled { opacity: .55; cursor: not-allowed; }
@media (max-width: 700px) {
    .contract-preview-overlay { padding: 8px; }
    .contract-preview-modal { width: 100%; height: 96vh; max-width: none; max-height: 96vh; }
    .contract-preview-modal .modal-header { padding: 14px; }
    .contract-preview-heading > div > span { max-width: 55vw; }
    .contract-preview-modal .modal-footer .btn-secondary { width: 100%; justify-content: center; }
}


/* Select fluido na área de contratos */
.contract-upload-panel { overflow: visible; }
.contract-upload-panel .custom-select { width: 100%; position: relative; z-index: 20; }
.contract-upload-panel .custom-select.open { z-index: 80; }
.contract-upload-panel .custom-select-trigger { min-height: 42px; }
.contract-upload-panel .native-select-hidden { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; }
.contract-upload-panel label:has(.custom-select) { position: relative; z-index: 30; }


/* Layout fixo para Bairro / UF / Cidade nos modais de empresa */
.modal-body .empresa-local-row {
    display: grid !important;
    grid-template-columns: minmax(150px, 1fr) 96px minmax(220px, 1.45fr);
    gap: 14px;
    align-items: end;
}
.modal-body .empresa-local-row .form-group {
    min-width: 0;
}
.modal-body .empresa-uf-field {
    width: 96px;
    max-width: 96px;
    position: relative;
    z-index: 4;
}
.modal-body .empresa-uf-field .custom-select,
.modal-body .empresa-uf-field select {
    width: 96px;
    min-width: 96px;
}
.modal-body .empresa-uf-field .custom-select-menu {
    min-width: 96px;
}
.modal-body .empresa-cidade-field {
    position: relative;
    min-width: 0;
    z-index: 2;
}
.modal-body .empresa-cidade-field input {
    width: 100%;
}
@media (max-width: 760px) {
    .modal-body .empresa-local-row {
        grid-template-columns: 1fr;
    }
    .modal-body .empresa-uf-field,
    .modal-body .empresa-uf-field .custom-select,
    .modal-body .empresa-uf-field select {
        width: 100%;
        max-width: none;
        min-width: 0;
    }
}


/* ---- DEPENDENTES DO FUNCIONARIO ---- */
.dependentes-list { display: flex; flex-direction: column; gap: 12px; }
.dependente-card { border: 1px solid var(--borda); border-radius: 8px; background: #FCFCFF; padding: 14px; display: grid; grid-template-columns: minmax(220px, 1fr) minmax(320px, 2fr) auto; gap: 14px; align-items: center; }
.dependente-main { display: flex; align-items: center; gap: 12px; min-width: 0; }
.dependente-avatar { width: 44px; height: 44px; border-radius: 50%; background: var(--roxo-claro); color: var(--roxo-principal); display: flex; align-items: center; justify-content: center; font-weight: 800; flex-shrink: 0; }
.dependente-main strong { display: block; color: var(--texto-escuro); margin-bottom: 3px; overflow-wrap: anywhere; }
.dependente-main span { color: var(--texto-fraco); font-size: 12px; line-height: 1.35; }
.dependente-meta { display: grid; grid-template-columns: repeat(3, minmax(120px, 1fr)); gap: 10px 12px; }
.dependente-meta span { color: var(--texto-escuro); font-weight: 700; font-size: 12px; }
.dependente-meta small { display: block; color: var(--texto-fraco); font-weight: 600; margin-bottom: 3px; }
.dependente-actions { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.dependent-toggle-row { display: grid; grid-template-columns: minmax(220px, 1fr) 120px; gap: 12px; align-items: end; }
.dependente-form .custom-select { width: 100%; }

@media (max-width: 1180px) {
    .dependente-card { grid-template-columns: 1fr; align-items: stretch; }
    .dependente-actions { justify-content: flex-start; }
}

@media (max-width: 720px) {
    .dependente-meta { grid-template-columns: 1fr; }
    .dependent-toggle-row { grid-template-columns: 1fr; }
}


/* Campo com validacao invalida */
.input-invalid,
.edit-grid input.input-invalid,
.form-group input.input-invalid {
    border-color: #DC2626 !important;
    background: #FEF2F2 !important;
    color: #7F1D1D;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12);
}


.dependente-docs-preview {
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: white;
    padding: 10px 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}
.dependente-docs-preview small {
    width: 100%;
    color: var(--texto-fraco);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.dependente-docs-preview span {
    border-radius: 999px;
    padding: 4px 9px;
    font-size: 11px;
    font-weight: 800;
}
.dependente-docs-preview span.ok {
    background: #DCFCE7;
    color: #166534;
}
.dependente-docs-preview span.pendente {
    background: #FEF3C7;
    color: #92400E;
}


.doc-preview:has(img),
#candidate-preview:has(img),
#ficha-doc-preview:has(img) { cursor: grab; }
.doc-preview.is-dragging,
#candidate-preview.is-dragging,
#ficha-doc-preview.is-dragging { cursor: grabbing; user-select: none; }
.doc-preview.is-dragging img,
#candidate-preview.is-dragging img,
#ficha-doc-preview.is-dragging img { pointer-events: none; }


/* ---- Exportação ERP / construtor de layouts ---- */
.erp-builder,
.erp-export-panel {
    background: var(--cinza-card);
    border: 1px solid var(--borda);
    border-radius: 10px;
    padding: 18px;
    margin-bottom: 18px;
}
.erp-builder-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.erp-builder-head.compact { margin-bottom: 12px; }
.erp-builder-head h2 {
    font-size: 18px;
    color: var(--texto-escuro);
    margin-bottom: 4px;
}
.erp-builder-head p {
    color: var(--texto-fraco);
    font-size: 13px;
}
.erp-builder-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.erp-layout-grid,
.erp-fields-grid {
    display: grid;
    grid-template-columns: minmax(260px, 0.85fr) minmax(360px, 1.6fr);
    gap: 16px;
}
.erp-fields-grid {
    grid-template-columns: 1fr 1fr;
    margin-top: 16px;
}
.erp-card {
    border: 1px solid var(--borda);
    border-radius: 8px;
    padding: 16px;
    background: #fff;
}
.erp-card h3 {
    color: var(--texto-escuro);
    font-size: 15px;
    margin-bottom: 12px;
}
.erp-card label {
    display: block;
    color: var(--texto-fraco);
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 12px;
}
.erp-card label input,
.erp-card label select {
    margin-top: 6px;
}
.erp-two-cols,
.erp-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.erp-field-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}
.erp-check {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding-top: 23px;
    color: var(--texto-medio) !important;
}
.erp-check input { width: auto; margin: 0; }
.erp-list-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}
.erp-list-title h3 { margin-bottom: 0; }
.erp-list-title span {
    color: var(--texto-fraco);
    font-size: 12px;
}
.erp-field-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 360px;
    overflow-y: auto;
    padding-right: 4px;
}
.erp-field-row {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 10px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    padding: 10px;
    background: #FBFAFF;
}
.erp-field-position {
    width: 48px;
    height: 32px;
    border-radius: 7px;
    background: var(--roxo-claro);
    color: var(--roxo-principal);
    border: 1px solid #D9CCFF;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    padding: 0 3px;
}
.erp-field-position:focus {
    outline: 2px solid rgba(124, 58, 237, 0.2);
    border-color: var(--roxo-principal);
}
.erp-field-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}
.erp-field-main strong {
    color: var(--texto-escuro);
    font-size: 13px;
}
.erp-field-main span,
.erp-field-meta {
    color: var(--texto-fraco);
    font-size: 12px;
}
.erp-field-meta { white-space: nowrap; }
.erp-card .custom-select { width: 100%; }

@media (max-width: 1100px) {
    .erp-layout-grid,
    .erp-fields-grid,
    .erp-field-grid {
        grid-template-columns: 1fr;
    }
    .erp-builder-head {
        align-items: flex-start;
        flex-direction: column;
    }
}


.erp-help {
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #FBFAFF;
    margin-bottom: 16px;
    overflow: hidden;
}
.erp-help summary {
    cursor: pointer;
    list-style: none;
    padding: 13px 14px;
    color: var(--texto-escuro);
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}
.erp-help summary::-webkit-details-marker { display: none; }
.erp-help-content {
    border-top: 1px solid var(--borda);
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.erp-help-content h3 {
    color: var(--texto-escuro);
    font-size: 13px;
    margin-bottom: 5px;
}
.erp-help-content p {
    color: var(--texto-fraco);
    font-size: 12px;
    line-height: 1.45;
}
.erp-help-example {
    background: #fff;
    border: 1px solid var(--borda);
    border-radius: 8px;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.erp-help-example strong {
    color: var(--texto-escuro);
    font-size: 12px;
}
.erp-help-example span {
    color: var(--texto-medio);
    font-size: 12px;
}
@media (max-width: 1100px) {
    .erp-help-content { grid-template-columns: 1fr; }
}

/* Exportação ERP por API */
.erp-mode-tabs {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px;
    margin-bottom: 18px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #fff;
}
.erp-mode-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 14px;
    color: var(--texto-medio);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 6px;
    transition: background .18s ease, color .18s ease;
}
.erp-mode-tabs a:hover { background: #F7F5FC; color: var(--texto-escuro); }
.erp-mode-tabs a.active { background: var(--roxo-claro); color: var(--roxo-principal); }
.erp-api-config {
    margin-bottom: 18px;
    padding: 18px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #fff;
}
.erp-api-config-grid {
    display: grid;
    grid-template-columns: minmax(250px, .65fr) minmax(620px, 1.8fr);
    gap: 16px;
    align-items: start;
}
.api-integrations-panel { padding: 12px; }
.api-integration-list {
    display: flex;
    flex-direction: column;
    gap: 7px;
    max-height: 620px;
    overflow-y: auto;
}
.api-integration-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 34px;
    gap: 6px;
    padding: 5px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #fff;
    transition: border-color .18s ease, background .18s ease;
}
.api-integration-item:hover,
.api-integration-item.active { border-color: #B89AF7; background: #FBFAFF; }
.api-integration-main {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 6px;
    border: 0;
    background: transparent;
    text-align: left;
    cursor: pointer;
}
.api-integration-main > span:nth-child(2) { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.api-integration-main strong { overflow: hidden; color: var(--texto-escuro); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.api-integration-main small { overflow: hidden; color: var(--texto-fraco); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.api-method {
    display: grid;
    place-items: center;
    min-height: 27px;
    color: #075985;
    background: #E0F2FE;
    border-radius: 6px;
    font-size: 10px;
    font-weight: 800;
}
.api-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: max-content;
    min-height: 22px;
    padding: 2px 8px;
    border-radius: 99px;
    font-size: 10px;
    font-weight: 700;
    white-space: nowrap;
}
.api-status.ativo,
.api-status.concluido { color: #047857; background: #D1FAE5; }
.api-status.inativo { color: #64748B; background: #E2E8F0; }
.api-status.erro,
.api-status.falhou { color: #B91C1C; background: #FEE2E2; }
.api-status.processando { color: #075985; background: #E0F2FE; }
.api-status.pendente { color: #92400E; background: #FEF3C7; }
.api-editor-panel { min-width: 0; }
.api-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}
.api-form-grid label,
.api-template-grid label {
    display: block;
    margin: 0;
    color: var(--texto-fraco);
    font-size: 12px;
    font-weight: 500;
}
.api-form-grid input,
.api-form-grid select,
.api-template-grid textarea { margin-top: 6px; }
.api-form-grid .custom-select { width: 100%; margin-top: 6px; }
.api-span-2 { grid-column: span 2; }
.api-toggle {
    min-height: 42px;
    margin-top: 23px !important;
    padding: 0 12px;
    border: 1px solid var(--borda);
    border-radius: 7px;
    background: #FBFAFF;
}
.api-template-grid {
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    gap: 12px;
    margin-top: 16px;
}
.api-json-editor {
    width: 100%;
    height: 290px;
    resize: vertical;
    padding: 12px;
    border: 1px solid var(--borda);
    border-radius: 7px;
    outline: none;
    color: #1F2937;
    background: #FBFCFE;
    font: 12px/1.55 Consolas, "Courier New", monospace;
    letter-spacing: 0;
}
.api-json-editor:focus { border-color: var(--roxo-principal); box-shadow: 0 0 0 3px rgba(124, 58, 237, .08); }
.api-send-toolbar { grid-template-columns: minmax(280px, .8fr) minmax(320px, 1.5fr); }
.api-send-toolbar .custom-select { width: 100%; }
.api-history-detail {
    display: block;
    max-width: 380px;
    overflow: hidden;
    color: var(--texto-fraco);
    font-size: 12px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.api-preview-modal {
    width: min(820px, calc(100vw - 32px));
    max-height: calc(100vh - 48px);
    padding: 0;
    border: 0;
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .28);
}
.api-preview-modal::backdrop { background: rgba(15, 23, 42, .55); }
.api-preview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--borda);
}
.api-preview-head h2 { color: var(--texto-escuro); font-size: 18px; }
.api-preview-head p { margin-top: 3px; color: var(--texto-fraco); font-size: 12px; }
.api-preview-modal pre {
    min-height: 280px;
    max-height: 56vh;
    margin: 0;
    padding: 18px 20px;
    overflow: auto;
    color: #E2E8F0;
    background: #172033;
    font: 12px/1.55 Consolas, "Courier New", monospace;
    white-space: pre-wrap;
    word-break: break-word;
}
.api-preview-modal .modal-actions { padding: 14px 20px; border-top: 1px solid var(--borda); background: #fff; }

@media (max-width: 1180px) {
    .erp-api-config-grid { grid-template-columns: 1fr; }
    .api-integration-list { max-height: 260px; }
}
@media (max-width: 760px) {
    .erp-mode-tabs { display: flex; width: 100%; }
    .erp-mode-tabs a { flex: 1; justify-content: center; }
    .api-form-grid,
    .api-template-grid,
    .api-send-toolbar { grid-template-columns: 1fr; }
    .api-span-2 { grid-column: auto; }
    .api-toggle { margin-top: 0 !important; }
}


/* Painel Sistema - workspaces */
.workspace-page { min-width: 0; }
.workspace-context-bar { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; margin-bottom: 18px; background: #FFFFFF; border: 1px solid var(--borda); border-left: 3px solid var(--roxo-principal); }
.workspace-context-icon { width: 38px; height: 38px; display: grid; place-items: center; flex: 0 0 38px; color: var(--roxo-principal); background: var(--roxo-claro); border-radius: 8px; font-size: 20px; }
.workspace-context-bar > div:nth-child(2) { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.workspace-context-label { color: var(--texto-fraco); font-size: 11px; font-weight: 600; text-transform: uppercase; }
.workspace-context-bar strong { color: var(--texto-escuro); font-size: 14px; }
.workspace-context-bar .workspace-code { margin-left: auto; }
.workspace-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.workspace-list-section { min-width: 0; }
.workspace-list-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 12px; }
.workspace-list-header h2 { font-size: 16px; color: var(--texto-escuro); margin: 0 0 3px; }
.workspace-list-header p { color: var(--texto-fraco); font-size: 12px; margin: 0; }
.workspace-tools { display: flex; align-items: center; gap: 8px; }
.workspace-search { width: 260px; display: flex; align-items: center; gap: 8px; padding: 0 11px; background: #FFFFFF; border: 1px solid var(--borda); border-radius: 8px; color: var(--texto-fraco); }
.workspace-search:focus-within { border-color: var(--roxo-principal); }
.workspace-search input { width: 100%; border: 0; outline: 0; padding: 9px 0; background: transparent; color: var(--texto-medio); font: inherit; font-size: 12px; }
.workspace-table-wrap { overflow: visible; }
.workspace-table td { vertical-align: middle; }
.workspace-row-current { background: #F8F5FF; }
.workspace-name-cell { display: flex; align-items: center; gap: 10px; min-width: 260px; }
.workspace-name-cell > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.workspace-name-cell strong { color: var(--texto-escuro); font-size: 13px; }
.workspace-name-cell small { color: var(--texto-fraco); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 260px; }
.workspace-avatar { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; border-radius: 8px; background: var(--roxo-claro); color: var(--roxo-principal); font-size: 11px; font-weight: 700; }
.workspace-code { display: inline-flex; align-items: center; min-height: 24px; padding: 3px 8px; border-radius: 6px; color: #5B21B6; background: #F1EBFF; font-family: Consolas, monospace; font-size: 11px; font-weight: 700; }
.workspace-current-badge { padding: 3px 7px; border-radius: 6px; background: #EDE9FE; color: #5B21B6; font-size: 9px; font-weight: 700; text-transform: uppercase; }
.workspace-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 210px; }
.icon-action { width: 32px; height: 32px; display: inline-grid; place-items: center; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; color: var(--texto-medio); cursor: pointer; }
.icon-action:hover { border-color: var(--roxo-principal); color: var(--roxo-principal); }
.icon-action.warning:hover { border-color: #D97706; color: #D97706; }
.icon-action.success:hover { border-color: #059669; color: #059669; }
.icon-action.danger:hover { border-color: #DC2626; color: #DC2626; }
.workspace-status-control { display: inline-flex; align-items: center; gap: 8px; color: var(--texto-medio); font-size: 13px; font-weight: 600; cursor: pointer; }
.workspace-status-control input { width: 16px; height: 16px; accent-color: var(--roxo-principal); }
@media (max-width: 1100px) { .workspace-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .workspace-table-wrap { overflow-x: auto; } }
@media (max-width: 720px) { .workspace-list-header { align-items: stretch; flex-direction: column; } .workspace-tools, .workspace-search { width: 100%; } .workspace-metrics { grid-template-columns: 1fr; } }

/* Áreas restritas do Painel Sistema */
.system-admin-tabs {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 5px;
    margin-bottom: 18px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    background: #FFFFFF;
}
.system-admin-tab {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 14px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--texto-medio);
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .18s ease, color .18s ease;
}
.system-admin-tab:hover { background: #F7F5FC; color: var(--texto-escuro); }
.system-admin-tab.active { background: var(--roxo-claro); color: var(--roxo-principal); }
.system-view[hidden] { display: none !important; }
.system-api-scope {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 12px 16px;
    margin-bottom: 18px;
    border: 1px solid #DDD6FE;
    border-left: 3px solid var(--roxo-principal);
    background: #FFFFFF;
}
.system-api-scope-title { display: flex; align-items: center; gap: 12px; min-width: 0; }
.system-api-scope-title > div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.system-api-scope-title strong { color: var(--texto-escuro); font-size: 13px; }
.system-api-scope-title span { color: var(--texto-fraco); font-size: 11px; }
.system-api-scope-icon {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 8px;
    background: var(--roxo-claro);
    color: var(--roxo-principal) !important;
    font-size: 19px !important;
}
.system-api-scope > label { width: min(360px, 38vw); color: var(--texto-fraco); font-size: 11px; font-weight: 600; }
.system-api-scope > label .custom-select,
.system-api-scope > label select { width: 100%; margin-top: 5px; }
.system-api-send-toolbar { grid-template-columns: minmax(220px, .8fr) minmax(220px, .8fr) minmax(300px, 1.4fr); }
.system-api-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.api-form-grid input:disabled { color: #5B21B6; background: #F5F1FF; cursor: not-allowed; }
.api-copy-field { display: grid; grid-template-columns: minmax(0, 1fr) 38px; gap: 7px; align-items: end; }
.api-copy-field .input-busca { width: 100%; min-width: 0; }
.api-copy-field .icon-btn { width: 38px; height: 38px; margin-top: 6px; }
.api-key-once { display: grid; grid-template-columns: minmax(190px, .65fr) minmax(320px, 1.35fr); gap: 14px; align-items: end; margin-top: 16px; padding: 14px; border: 1px solid #C4B5FD; border-left: 3px solid var(--roxo-principal); background: #F8F5FF; }
.api-key-once[hidden] { display: none !important; }
.api-key-once > div { display: flex; align-items: center; gap: 10px; min-height: 38px; }
.api-key-once > div > i { color: var(--roxo-principal); font-size: 22px; }
.api-key-once > div > span { display: flex; flex-direction: column; gap: 2px; }
.api-key-once strong { color: var(--texto-escuro); font-size: 13px; }
.api-key-once small { color: var(--texto-fraco); font-size: 11px; }
.api-import-actions { display: flex; justify-content: flex-end; margin-top: 12px; }
.api-import-reference-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr); gap: 14px; margin-top: 16px; }
.api-reference-head { display: flex; align-items: center; justify-content: space-between; min-height: 34px; color: var(--texto-fraco); font-size: 12px; font-weight: 600; }
.api-reference-head .icon-btn { width: 32px; height: 32px; }
.api-import-reference-grid .api-json-editor { height: 360px; margin-top: 5px; resize: vertical; }
.api-import-company-list { height: 366px; padding: 7px; overflow-y: auto; border: 1px solid var(--borda); background: #FBFCFE; }
.api-import-company { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 45px; padding: 7px 9px; border-bottom: 1px solid var(--borda); }
.api-import-company:last-child { border-bottom: 0; }
.api-import-company > span { display: flex; min-width: 0; flex-direction: column; gap: 2px; }
.api-import-company strong { overflow: hidden; color: var(--texto-escuro); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.api-import-company small { color: var(--texto-fraco); font-size: 10px; }
.api-import-company code { padding: 4px 7px; color: #5B21B6; background: #F1EBFF; font: 700 11px Consolas, monospace; }
.api-company-missing { color: #B91C1C; font-size: 10px; font-weight: 700; white-space: nowrap; }
.api-import-history-wrap { overflow-x: auto; }
.api-import-history-wrap table { min-width: 1120px; }

@media (max-width: 1040px) {
    .system-api-send-toolbar { grid-template-columns: 1fr 1fr; }
    .system-api-send-toolbar .input-busca { grid-column: span 2; }
    .system-api-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .api-import-reference-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
    .system-admin-tabs { display: flex; width: 100%; }
    .system-admin-tab { flex: 1; justify-content: center; }
    .system-api-scope { align-items: stretch; flex-direction: column; }
    .system-api-scope > label { width: 100%; }
    .system-api-send-toolbar { grid-template-columns: 1fr; }
    .system-api-send-toolbar .input-busca { grid-column: auto; }
    .system-api-metrics { grid-template-columns: 1fr; }
    .api-key-once { grid-template-columns: 1fr; }
}


/* Ações de exportação Excel */
.topbar-actions { display: flex; align-items: center; gap: 8px; }
.sys-export-button { margin-left: auto; }
@media (max-width: 760px) {
    .topbar-actions { width: 100%; flex-wrap: wrap; }
    .sys-export-button { width: 100%; margin-left: 0; justify-content: center; }
}


/* Troca de workspace no painel */
.dashboard-top-actions { display: flex; align-items: center; gap: 8px; }
.dashboard-workspace-button { max-width: 280px; }
.dashboard-workspace-button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-workspace-modal { width: 460px; }
.sys-card-workspace { color: #5B21B6; }
@media (max-width: 720px) {
    .dashboard-top-actions { width: 100%; align-items: stretch; flex-direction: column; }
    .dashboard-workspace-button { width: 100%; max-width: none; justify-content: space-between; }
}


/* Gestão de usuários */
.usuarios-page { min-width: 0; }
.usuarios-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.usuarios-list-section { margin-top: 20px; }
.usuarios-toolbar { display: flex; align-items: center; gap: 10px; padding: 12px; background: #FFFFFF; border: 1px solid var(--borda); border-bottom: 0; border-radius: 8px 8px 0 0; }
.usuarios-search { width: min(360px, 100%); display: flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--borda); border-radius: 8px; color: var(--texto-fraco); }
.usuarios-search:focus-within { border-color: var(--roxo-principal); }
.usuarios-search input { width: 100%; padding: 9px 0; border: 0; outline: 0; color: var(--texto-medio); font: inherit; font-size: 12px; }
.usuarios-toolbar > .input-select, .usuarios-toolbar > .custom-select { width: 210px; }
.usuarios-table-wrap { border-top-left-radius: 0; border-top-right-radius: 0; }
.usuario-identidade { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.usuario-identidade > div { display: flex; flex-direction: column; gap: 2px; }
.usuario-identidade strong { color: var(--texto-escuro); font-size: 13px; }
.usuario-identidade small { color: var(--texto-fraco); font-size: 11px; }
.usuario-avatar { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; border-radius: 8px; background: var(--roxo-claro); color: var(--roxo-principal); font-size: 11px; font-weight: 700; }
.usuario-nivel-badge { display: inline-flex; padding: 5px 8px; border-radius: 6px; font-size: 10px; font-weight: 700; white-space: nowrap; }
.usuario-nivel-badge.nivel-1 { color: #5B21B6; background: #EDE9FE; }
.usuario-nivel-badge.nivel-2 { color: #075985; background: #E0F2FE; }
.usuario-nivel-badge.nivel-3 { color: #374151; background: #F3F4F6; }
.usuario-empresas-chips { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; min-width: 200px; }
.usuario-empresa-chip, .usuario-empresa-mais { display: inline-flex; padding: 4px 7px; border-radius: 6px; color: #5B21B6; background: #F3EEFF; font-size: 10px; font-weight: 600; }
.usuario-empresa-mais { color: var(--texto-medio); background: #F3F4F6; }
.usuario-sem-empresa { color: var(--texto-fraco); font-size: 11px; }
.usuario-acoes { display: flex; justify-content: flex-end; gap: 6px; }
.usuario-modal-box { width: 720px; }
.usuario-empresas-lista { max-height: 230px; overflow-y: auto; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; }
.usuario-empresa-opcao { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--borda); cursor: pointer; }
.usuario-empresa-opcao:last-child { border-bottom: 0; }
.usuario-empresa-opcao:hover { background: #FAF8FF; }
.usuario-empresa-opcao input { width: 16px !important; height: 16px; flex: 0 0 16px; accent-color: var(--roxo-principal); }
.usuario-empresa-opcao span { display: flex; flex-direction: column; gap: 2px; }
.usuario-empresa-opcao strong { color: var(--texto-escuro); font-size: 12px; }
.usuario-empresa-opcao small { color: var(--texto-fraco); font-size: 10px; }
.usuario-empresas-vazio { padding: 22px; text-align: center; color: var(--texto-fraco); font-size: 12px; }
.usuario-status-control { display: inline-flex !important; align-items: center; gap: 8px; color: var(--texto-medio) !important; cursor: pointer; }
.usuario-status-control input { width: 16px !important; height: 16px; accent-color: var(--roxo-principal); }
@media (max-width: 900px) { .usuarios-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .usuarios-toolbar { flex-wrap: wrap; } }
@media (max-width: 620px) { .usuarios-metrics { grid-template-columns: 1fr; } .usuarios-toolbar > .input-select, .usuarios-toolbar > .custom-select, .usuarios-search { width: 100%; } }

.usuarios-top-actions { display: flex; align-items: center; gap: 8px; }
.usuarios-tabs { display: inline-flex; gap: 4px; padding: 4px; margin-top: 18px; background: #FFFFFF; border: 1px solid var(--borda); border-radius: 8px; }
.usuarios-tab { min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px; border: 0; border-radius: 6px; background: transparent; color: var(--texto-medio); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.usuarios-tab:hover { background: #F7F5FC; color: var(--texto-escuro); }
.usuarios-tab.active { background: #EDE9FE; color: var(--roxo-principal); }
.usuario-workspace-chip, .usuario-grupo-chip { display: inline-flex; padding: 4px 7px; border-radius: 6px; font-size: 10px; font-weight: 600; }
.usuario-workspace-chip { color: #075985; background: #E0F2FE; }
.usuario-grupo-chip { color: #166534; background: #DCFCE7; }
.usuario-acessos-lista { max-height: 170px; overflow-y: auto; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; }
.usuario-acessos-por-workspace { max-height: 310px; overflow-y: auto; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; }
.usuario-workspace-access + .usuario-workspace-access { border-top: 1px solid var(--borda); }
.usuario-workspace-access-title { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 7px 12px; color: var(--texto-escuro); background: #F8F7FC; border-bottom: 1px solid var(--borda); font-size: 11px; }
.usuario-workspace-access .usuario-empresa-opcao { padding-left: 16px; }
.usuario-modal-box { width: 800px; }

@media (max-width: 720px) {
    .usuarios-top-actions { width: 100%; }
    .usuarios-top-actions .btn-primary { flex: 1; justify-content: center; }
    .usuarios-tabs { width: 100%; }
    .usuarios-tab { flex: 1; justify-content: center; }
}

.recuperacao-modal { width: 440px; }
.recuperacao-canais { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.recuperacao-canais label { margin: 0 !important; cursor: pointer; }
.recuperacao-canais input { position: absolute; opacity: 0; pointer-events: none; }
.recuperacao-canais span { min-height: 40px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 8px; color: var(--texto-medio); background: #FFFFFF; font-size: 12px; font-weight: 600; }
.recuperacao-canais input:checked + span { color: var(--roxo-principal); border-color: var(--roxo-principal); background: #F3EEFF; }
.recuperacao-canais label.disabled { cursor: not-allowed; opacity: 0.45; }
.recuperacao-ok { padding: 10px 14px; margin-bottom: 12px; border-radius: 8px; color: #065F46; background: #D1FAE5; font-size: 12px; }

/* Navegacao e Painel Sistema em telas estreitas */
@media (max-width: 720px) {
    .dashboard-page { min-width: 0; overflow-x: hidden; }
    .dashboard-page .sidebar { width: 128px; padding: 14px 0; }
    .dashboard-page .sidebar-logo { gap: 7px; padding: 0 10px 16px; }
    .dashboard-page .sidebar-logo .logo-text { font-size: 16px; }
    .dashboard-page .nav-secao { padding: 12px 10px 4px; font-size: 8px; letter-spacing: .05em; }
    .dashboard-page .nav-item { gap: 6px; padding: 8px 10px; font-size: 10px; line-height: 1.2; }
    .dashboard-page .nav-item i { font-size: 15px; }
    .dashboard-page .sidebar-user { gap: 6px; padding: 10px; }
    .dashboard-page .sidebar-user .user-avatar { width: 28px; height: 28px; }
    .dashboard-page .sidebar-user .user-info { display: none; }
    .dashboard-page .sidebar-user #btn-logout { margin-left: auto; }
    .dashboard-page .main-content { padding: 16px 10px; }
    .dashboard-page .topbar { align-items: flex-start; flex-direction: column; gap: 8px; margin-bottom: 16px; }

    .workspace-page .system-admin-tabs { display: grid; grid-template-columns: 1fr; width: 100%; }
    .workspace-page .system-admin-tab { width: 100%; justify-content: flex-start; }
    .workspace-page .erp-api-config { padding: 10px; }
    .workspace-page .erp-builder-actions { width: 100%; }
    .workspace-page .erp-builder-actions button { flex: 1; justify-content: center; }
    .workspace-page .erp-api-config-grid,
    .workspace-page .erp-api-config-grid > *,
    .workspace-page .api-form-grid,
    .workspace-page .api-form-grid > *,
    .workspace-page .api-import-reference-grid > * { min-width: 0; }
    .workspace-page .api-form-grid .input-busca { width: 100%; max-width: 100%; }
    .workspace-page .api-import-reference-grid .api-json-editor,
    .workspace-page .api-import-company-list { height: 280px; }
    .workspace-page .api-import-history-wrap { width: 100%; max-width: 100%; }
}

/* Painel Sistema - catálogo de chaves */
.system-key-intro,
.system-key-conversion-head,
.system-key-editor-head,
.system-key-list-head,
.system-key-section-title,
.system-key-danger-zone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.system-key-intro { margin-bottom: 16px; }
.system-key-intro h2,
.system-key-conversion-head h2 { margin: 0 0 4px; color: var(--texto-escuro); font-size: 18px; }
.system-key-intro p,
.system-key-conversion-head p { margin: 0; color: var(--texto-fraco); font-size: 12px; }
.system-key-metrics { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.system-key-workbench {
    display: grid;
    grid-template-columns: minmax(310px, 360px) minmax(0, 1fr);
    min-height: 690px;
    margin-top: 18px;
    border: 1px solid var(--borda);
    border-radius: 8px;
    overflow: hidden;
    background: #FFFFFF;
}
.system-key-list-panel { min-width: 0; border-right: 1px solid var(--borda); background: #FBFCFE; }
.system-key-list-head { align-items: flex-start; padding: 16px; border-bottom: 1px solid var(--borda); background: #FFFFFF; }
.system-key-list-head > div { flex: 0 0 auto; }
.system-key-list-head h3,
.system-key-editor-head h3 { margin: 2px 0 0; color: var(--texto-escuro); font-size: 15px; }
.system-key-list-head span,
.system-key-editor-head span { color: var(--texto-fraco); font-size: 10px; }
.system-key-search { width: 185px; min-height: 36px; display: flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid var(--borda); border-radius: 7px; color: var(--texto-fraco); background: #FFFFFF; }
.system-key-search:focus-within { border-color: var(--roxo-principal); box-shadow: 0 0 0 3px rgba(124, 58, 237, .08); }
.system-key-search input { width: 100%; min-width: 0; padding: 8px 0; border: 0; outline: 0; color: var(--texto-medio); background: transparent; font: inherit; font-size: 11px; }
.system-key-list { max-height: 800px; overflow-y: auto; }
.system-key-list-item {
    width: 100%;
    min-height: 82px;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr) auto;
    align-items: center;
    gap: 9px;
    padding: 11px 13px;
    border: 0;
    border-bottom: 1px solid var(--borda);
    background: transparent;
    color: inherit;
    text-align: left;
    cursor: pointer;
    transition: background .16s ease, box-shadow .16s ease;
}
.system-key-list-item:hover { background: #F6F3FF; }
.system-key-list-item.active { background: #EEE8FF; box-shadow: inset 3px 0 0 var(--roxo-principal); }
.system-key-list-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 7px; color: var(--roxo-principal); background: #F1EBFF; font-size: 16px; }
.system-key-list-copy { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.system-key-list-copy strong { overflow: hidden; color: var(--texto-escuro); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.system-key-list-copy code { overflow: hidden; color: #6D28D9; font: 600 10px Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.system-key-list-copy small { color: var(--texto-fraco); font-size: 9px; }
.system-key-list-meta { display: flex; align-items: flex-end; flex-direction: column; gap: 5px; }
.system-key-list-meta em { padding: 3px 6px; border-radius: 5px; color: #475569; background: #E9EEF5; font-size: 8px; font-style: normal; font-weight: 700; text-transform: uppercase; }
.system-key-list-meta small { max-width: 100px; color: var(--texto-fraco); font-size: 8px; text-align: right; }
.system-key-editor-panel { min-width: 0; padding: 18px; }
.system-key-editor-head { padding-bottom: 14px; border-bottom: 1px solid var(--borda); }
.system-key-editor-head > div:first-child { display: flex; flex-direction: column; }
.system-key-editor-actions { display: flex; gap: 7px; }
.system-key-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; margin-top: 16px; }
.system-key-form-grid label,
.system-key-document-add label,
.system-key-conversion-context label,
.system-key-formula-grid label,
.system-key-conditional label { min-width: 0; color: var(--texto-fraco); font-size: 11px; font-weight: 600; }
.system-key-form-grid label:first-child { grid-column: span 2; }
.system-key-form-grid .input-busca,
.system-key-form-grid .custom-select,
.system-key-form-grid select,
.system-key-document-add .input-busca,
.system-key-document-add .custom-select,
.system-key-formula-grid .input-busca,
.system-key-formula-grid .custom-select,
.system-key-conversion-context .input-busca,
.system-key-conversion-context .custom-select { width: 100%; margin-top: 5px; }
.system-key-placement { display: flex; align-items: center; gap: 18px; padding: 13px 0; margin-top: 15px; border-top: 1px solid var(--borda); border-bottom: 1px solid var(--borda); }
.system-key-placement > div { display: flex; min-width: 215px; margin-right: auto; flex-direction: column; gap: 2px; }
.system-key-placement strong,
.system-key-section-title strong,
.system-key-formula-head strong,
.system-key-danger-zone strong { color: var(--texto-escuro); font-size: 12px; }
.system-key-placement span,
.system-key-section-title span,
.system-key-formula-head span,
.system-key-danger-zone span { color: var(--texto-fraco); font-size: 10px; }
.system-key-placement label { display: inline-flex; align-items: center; gap: 6px; color: var(--texto-medio); font-size: 11px; font-weight: 600; white-space: nowrap; }
.system-key-placement input { width: 15px; height: 15px; accent-color: var(--roxo-principal); }
.system-key-conditional { padding: 15px; margin-top: 15px; border: 1px solid #DDD6FE; border-left: 3px solid var(--roxo-principal); background: #FAF9FF; }
.system-key-conditional[hidden] { display: none !important; }
.system-key-conditional .api-json-editor { width: 100%; min-height: 105px; margin-top: 5px; resize: vertical; }
.system-key-conditional > small { display: block; margin-top: 6px; color: var(--texto-fraco); font-size: 10px; }
.system-key-source-grid { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(210px, 1fr) auto; align-items: end; gap: 10px; margin-bottom: 12px; }
.system-key-source-grid .custom-select,
.system-key-source-grid select,
.system-key-rule-add .custom-select,
.system-key-rule-add select,
.system-key-rule-add .input-busca { width: 100%; margin-top: 5px; }
.system-key-required { min-height: 38px; padding-bottom: 8px; white-space: nowrap; }
.system-key-rules { padding-top: 14px; margin-top: 15px; border-top: 1px solid #DDD6FE; }
.system-key-rule-add { display: grid; grid-template-columns: repeat(3, minmax(170px, 1fr)); align-items: end; gap: 10px; margin-top: 12px; }
.system-key-rule-add > .toggle-inline { min-height: 38px; padding-bottom: 8px; }
.system-key-rule-add > button { min-height: 38px; justify-self: start; }
.system-key-rule-list { margin-top: 11px; border: 1px solid var(--borda); border-radius: 7px; overflow: hidden; background: #FFFFFF; }
.system-key-rule-row { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--borda); }
.system-key-rule-row:last-child { border-bottom: 0; }
.system-key-rule-row > span { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; column-gap: 7px; }
.system-key-rule-row > span i { grid-row: span 2; color: var(--roxo-principal); font-size: 17px; }
.system-key-rule-row strong { color: var(--texto-escuro); font-size: 11px; }
.system-key-rule-row small { color: var(--texto-fraco); font-size: 10px; }
.system-key-formula-head { display: flex; flex-direction: column; gap: 2px; margin-bottom: 12px; }
.system-key-formula-grid { display: grid; grid-template-columns: minmax(210px, 2fr) repeat(3, minmax(70px, .55fr)); gap: 10px; }
.system-key-formula-preview { display: flex; align-items: center; gap: 8px; padding: 9px 11px; margin-top: 11px; color: #5B21B6; background: #F1EBFF; font-size: 11px; font-weight: 600; }
.system-key-documents { padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--borda); }
.system-key-documents[hidden] { display: none !important; }
.system-key-section-title > div { display: flex; flex-direction: column; gap: 2px; }
.system-key-document-add { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(240px, 1.2fr) auto; align-items: end; gap: 10px; margin-top: 12px; }
.system-key-document-add > button { min-height: 38px; margin-bottom: 0; }
.system-key-document-list { margin-top: 10px; border: 1px solid var(--borda); border-radius: 7px; overflow: hidden; }
.system-key-document-row { min-height: 48px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 10px; border-bottom: 1px solid var(--borda); background: #FFFFFF; }
.system-key-document-row:last-child { border-bottom: 0; }
.system-key-document-row > span { display: grid; grid-template-columns: 24px minmax(0, 1fr); align-items: center; column-gap: 7px; }
.system-key-document-row > span i { grid-row: span 2; color: var(--roxo-principal); font-size: 17px; }
.system-key-document-row strong { overflow: hidden; color: var(--texto-escuro); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.system-key-document-row small { color: var(--texto-fraco); font-size: 10px; }
.system-key-muted { display: block; padding: 13px; color: var(--texto-fraco); font-size: 11px; text-align: center; }
.system-key-danger-zone { padding-top: 16px; margin-top: 18px; border-top: 1px solid #FECACA; }
.system-key-danger-zone > div { display: flex; flex-direction: column; gap: 2px; }
.system-key-danger-zone .btn-danger:disabled { opacity: .45; cursor: not-allowed; }
.system-key-conversions { padding: 18px; margin-top: 18px; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; }
.system-key-csv-button { cursor: pointer; }
.system-key-csv-button .btn-secondary { pointer-events: none; }
.system-key-conversion-context { display: grid; grid-template-columns: minmax(180px, .8fr) minmax(180px, .8fr) minmax(230px, 1.2fr) minmax(170px, .8fr) minmax(150px, .7fr) auto; align-items: end; gap: 10px; padding: 14px 0; margin-top: 12px; border-top: 1px solid var(--borda); }
.system-key-conversion-context > button { min-height: 38px; }
.system-key-mask-editor { padding: 12px 0; margin-bottom: 12px; border-top: 1px solid var(--borda); border-bottom: 1px solid var(--borda); }
.system-key-mask-form { display: grid; grid-template-columns: minmax(160px, .7fr) minmax(190px, .8fr) minmax(190px, .8fr) auto; align-items: end; gap: 10px; }
.system-key-mask-title { min-height: 38px; display: flex; align-items: center; gap: 8px; color: var(--texto-escuro); font-size: 12px; font-weight: 700; }
.system-key-mask-title i { color: var(--roxo-principal); font-size: 18px; }
.system-key-mask-form label { color: var(--texto-medio); font-size: 10px; font-weight: 600; }
.system-key-mask-form .input-busca { width: 100%; margin-top: 5px; font-family: Consolas, monospace; }
.system-key-mask-form > button { min-height: 38px; }
.system-key-mask-preview { min-height: 38px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 11px; border: 1px solid #D7E3E0; background: #F4FAF8; }
.system-key-mask-preview span { color: var(--texto-fraco); font-size: 10px; }
.system-key-mask-preview strong { color: #0F766E; font: 700 12px Consolas, monospace; }
.system-key-mask-preview strong.invalid { color: #B91C1C; }
.system-key-mask-list { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.system-key-mask-item { min-height: 34px; display: flex; align-items: center; gap: 9px; padding: 5px 5px 5px 10px; border: 1px solid var(--borda); border-radius: 7px; background: #FFFFFF; }
.system-key-mask-item > span { display: flex; flex-direction: column; gap: 1px; }
.system-key-mask-item strong { color: var(--texto-escuro); font-size: 10px; }
.system-key-mask-item small { color: #6D28D9; font: 600 9px Consolas, monospace; }
.system-key-mask-item code { padding: 3px 6px; color: #0F766E; background: #ECFDF5; font: 700 11px Consolas, monospace; }
.system-key-mask-item .icon-action { flex: 0 0 auto; }
.system-key-mask-list .system-key-muted { width: 100%; padding: 7px 0; text-align: left; }
.system-key-csv-help { display: flex; align-items: center; gap: 12px; padding: 9px 11px; margin-bottom: 12px; color: var(--texto-fraco); background: #F8FAFC; font-size: 10px; }
.system-key-csv-help code { color: #5B21B6; font: 700 11px Consolas, monospace; }
.system-key-conversion-table { overflow-x: auto; }
.system-key-conversion-table table { min-width: 720px; }
.system-key-conversion-table td:first-child { min-width: 220px; }
.system-key-conversion-table td:first-child strong,
.system-key-table-key { display: block; }
.system-key-table-key { margin-top: 3px; color: #6D28D9; font: 600 10px Consolas, monospace; }
.system-key-conversion-group { cursor: pointer; transition: background-color .16s ease; }
.system-key-conversion-group:hover,
.system-key-conversion-group:focus { outline: none; background: #F8F5FF; }
.system-key-conversion-group.open { background: #F5F0FF; }
.system-key-conversion-count { color: var(--texto-escuro); font-size: 12px; font-weight: 700; }
.system-key-conversion-open-label { color: var(--texto-fraco); font-size: 11px; }
.system-key-conversion-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; }
.system-key-conversion-detail-row > td { padding: 0 !important; background: #FCFBFF; }
.system-key-conversion-detail { padding: 12px 18px 16px 32px; border-top: 1px solid #EDE9FE; border-bottom: 1px solid #EDE9FE; }
.system-key-conversion-detail-tools { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 10px; }
.system-key-conversion-search { width: min(360px, 100%); display: flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--borda); border-radius: 7px; background: #FFFFFF; color: var(--texto-fraco); }
.system-key-conversion-search:focus-within { border-color: var(--roxo-principal); box-shadow: 0 0 0 2px #EDE9FE; }
.system-key-conversion-search input { width: 100%; min-height: 36px; padding: 0; border: 0; outline: 0; background: transparent; color: var(--texto-escuro); font: inherit; }
.system-key-conversion-pagination { display: flex; align-items: center; gap: 7px; color: var(--texto-fraco); font-size: 11px; white-space: nowrap; }
.system-key-conversion-pagination .icon-action:disabled { opacity: .35; cursor: default; }
.system-key-conversion-items { border: 1px solid var(--borda); border-radius: 7px; overflow: hidden; background: #FFFFFF; }
.system-key-conversion-item { min-height: 42px; display: grid; grid-template-columns: minmax(180px, 1fr) 24px minmax(100px, .45fr) 32px; align-items: center; gap: 10px; padding: 7px 9px 7px 12px; border-bottom: 1px solid var(--borda); }
.system-key-conversion-item:last-child { border-bottom: 0; }
.system-key-conversion-item > span,
.system-key-conversion-item > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.system-key-conversion-item > span { color: var(--texto-medio); font-size: 12px; }
.system-key-conversion-item > strong { color: var(--texto-escuro); font-size: 12px; }
.system-key-conversion-item > i { color: var(--roxo-principal); text-align: center; }
.system-key-conversion-loading { padding: 18px; color: var(--texto-fraco); font-size: 12px; text-align: center; }
.system-key-conversion-loading.error { color: #B91C1C; }

@media (max-width: 1320px) {
    .system-key-workbench { grid-template-columns: 300px minmax(0, 1fr); }
    .system-key-conversion-context { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .system-key-conversion-context > button { justify-self: start; }
    .system-key-mask-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .system-key-mask-form > button { justify-self: start; }
}
@media (max-width: 1080px) {
    .system-key-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .system-key-workbench { grid-template-columns: 1fr; }
    .system-key-list-panel { border-right: 0; border-bottom: 1px solid var(--borda); }
    .system-key-list { max-height: 360px; }
    .system-key-source-grid,
    .system-key-rule-add { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
    .system-key-intro,
    .system-key-conversion-head,
    .system-key-editor-head,
    .system-key-list-head,
    .system-key-danger-zone { align-items: stretch; flex-direction: column; }
    .system-key-intro .btn-primary,
    .system-key-editor-actions,
    .system-key-editor-actions > button { width: 100%; justify-content: center; }
    .system-key-metrics,
    .system-key-form-grid,
    .system-key-formula-grid,
    .system-key-document-add,
    .system-key-source-grid,
    .system-key-rule-add,
    .system-key-conversion-context,
    .system-key-mask-form { grid-template-columns: 1fr; }
    .system-key-form-grid label:first-child { grid-column: auto; }
    .system-key-search { width: 100%; }
    .system-key-placement { align-items: flex-start; flex-direction: column; gap: 10px; }
    .system-key-placement > div { min-width: 0; margin-right: 0; }
    .system-key-csv-help { align-items: flex-start; flex-direction: column; }
    .system-key-conversion-detail { padding: 10px; }
    .system-key-conversion-detail-tools { align-items: stretch; flex-direction: column; }
    .system-key-conversion-search { width: 100%; }
}

/* Comprovante de assinatura na ficha do funcionário */
.contract-employee-row {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
}
.contract-employee-row > div:first-child {
    width: 100%;
    min-width: 0;
}
.contract-employee-row > div:first-child strong {
    font-size: 14px;
    line-height: 1.35;
    overflow-wrap: break-word;
    word-break: normal;
}
.contract-employee-row > div:first-child span {
    display: block;
    line-height: 1.45;
}
.contract-employee-row .table-actions {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 6px;
}
.contract-employee-row .table-actions > * { flex-shrink: 0; }
body.signature-proof-open { overflow: hidden; }
.signature-proof-overlay[hidden] { display: none; }
.signature-proof-modal { width: min(980px, calc(100vw - 40px)); max-height: calc(100vh - 40px); }
.signature-proof-icon { background: #ECFDF5; color: #047857; }
.signature-proof-body { flex: 1; overflow-y: auto; padding: 18px; background: #F8F7FA; }
.signature-proof-record { margin-bottom: 14px; border: 1px solid var(--borda); border-radius: 8px; background: #FFFFFF; overflow: hidden; }
.signature-proof-record:last-child { margin-bottom: 0; }
.signature-proof-record.invalidated { border-color: #FED7AA; }
.signature-proof-record-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 16px; border-bottom: 1px solid var(--borda); }
.signature-proof-record-head > div { display: flex; align-items: center; gap: 10px; }
.signature-proof-record-head h3 { font-size: 14px; }
.signature-proof-grid { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 18px; padding: 16px; }
.signature-proof-photo img { width: 100%; aspect-ratio: 4 / 5; display: block; border: 1px solid var(--borda); border-radius: 8px; background: #F3F4F6; object-fit: cover; }
.signature-proof-photo span { display: block; margin-top: 7px; color: var(--texto-fraco); font-size: 10px; line-height: 1.35; text-align: center; }
.signature-proof-grid dl { display: grid; grid-template-columns: 1fr 1fr; align-content: start; gap: 0 18px; margin: 0; }
.signature-proof-grid dl > div { min-width: 0; padding: 9px 0; border-bottom: 1px solid var(--borda); }
.signature-proof-grid dl > div.wide { grid-column: 1 / -1; }
.signature-proof-grid dt { color: var(--texto-fraco); font-size: 10px; }
.signature-proof-grid dd { margin: 4px 0 0; color: var(--texto-escuro); font-size: 11px; font-weight: 700; overflow-wrap: anywhere; }
.signature-proof-grid code { color: #4B5563; font-size: 10px; }
.signature-proof-term { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 9px; margin: 0 16px 16px; padding: 11px 12px; border: 1px solid #DDD6FE; border-radius: 8px; background: #F5F3FF; color: #4C1D95; font-size: 10px; line-height: 1.45; }
.signature-proof-term i { font-size: 17px; }

@media (max-width: 760px) {
    .signature-proof-modal { width: 100%; max-height: 94vh; }
    .signature-proof-record-head { align-items: flex-start; flex-direction: column; }
    .signature-proof-grid { grid-template-columns: 1fr; }
    .signature-proof-photo { max-width: 240px; }
    .signature-proof-grid dl { grid-template-columns: 1fr; }
    .signature-proof-grid dl > div.wide { grid-column: auto; }
}
