/* ==========================================================================
   RESET E CONFIGURAÇÃO DE FONTES ORIGINAL VIVAX
   ========================================================================== */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Inter', sans-serif;
}

body {
    display: flex;
    background-color: #f4f6f9;
    color: #333;
    min-height: 100vh;
}

/* ==========================================================================
   CONFIGURACOES DO SISTEMA
   ========================================================================== */
.settings-page .clients-content {
    gap: 0;
    padding: 0;
}

.settings-shell {
    width: 100%;
    min-height: calc(100vh - 60px);
    background: #eef4fb;
}

.settings-tabs {
    display: flex;
    align-items: stretch;
    min-height: 40px;
    background: #2494e8;
    overflow-x: auto;
    scrollbar-width: thin;
}

.settings-tab {
    border: 0;
    background: transparent;
    color: #ffffff;
    padding: 0 20px;
    min-height: 40px;
    font-size: 0.76rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.settings-tab:hover,
.settings-tab.active {
    background: #ffffff;
    color: #111827;
}

.settings-pane {
    padding: 0 4px 18px;
}

.settings-section {
    min-height: 128px;
    background: #ffffff;
    border-bottom: 8px solid #eef4fb;
    padding: 18px 40px 26px;
}

.settings-section-header {
    color: #1479e5;
    font-size: 0.76rem;
    font-weight: 500;
    margin-bottom: 34px;
}

.settings-form-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.settings-form-row label,
.settings-field span,
.settings-choice-row > span {
    min-width: 146px;
    text-align: right;
    font-size: 0.72rem;
    color: #111827;
}

.settings-form-row select,
.settings-field input,
.settings-field select,
.settings-field textarea {
    height: 34px;
    border: 1px solid #d1d7df;
    border-radius: 4px;
    background: #ffffff;
    color: #1f2937;
    font-size: 0.72rem;
    padding: 0 12px;
}

.settings-field textarea {
    min-height: 74px;
    height: auto;
    padding: 9px 12px;
    resize: vertical;
}

.settings-form-row select {
    width: min(286px, 52vw);
    outline: 2px solid #bfdef7;
}

.settings-section-integration {
    min-height: 256px;
    padding-top: 18px;
}

.settings-form-grid {
    display: grid;
    gap: 22px;
    justify-content: center;
}

.settings-field {
    display: flex;
    align-items: center;
    gap: 8px;
}

.settings-field-wide input {
    width: min(378px, 56vw);
}

.settings-field-wide textarea {
    width: min(378px, 56vw);
}

.settings-charges-grid {
    grid-template-columns: minmax(420px, 620px);
}

.settings-charges-grid .settings-field {
    justify-content: space-between;
}

.settings-charges-grid .settings-field span {
    flex: 1;
    min-width: 260px;
}

.settings-charges-grid .settings-field input {
    width: 110px;
    text-align: center;
}

.settings-charges-grid .settings-actions-row {
    justify-content: flex-end;
}

.settings-users-section {
    min-height: 0;
}

.settings-users-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.settings-users-header h2 {
    margin: 0;
    color: #1479e5;
    font-size: 0.84rem;
    font-weight: 700;
}

.settings-users-header p {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 0.72rem;
}

.settings-users-table-wrap {
    overflow-x: auto;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    background: #ffffff;
}

.settings-users-table {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
}

.settings-users-table th,
.settings-users-table td {
    height: 44px;
    padding: 8px 14px;
    border-bottom: 1px solid #edf2f7;
    color: #334155;
    font-size: 0.74rem;
    text-align: left;
}

.settings-users-table th {
    background: #f8fafc;
    color: #64748b;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.settings-users-table tbody tr:hover {
    background: #f8fbff;
}

.settings-users-table th:last-child,
.settings-users-table td:last-child {
    width: 210px;
    text-align: right;
}

.settings-user-access {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: 0 8px;
    border-radius: 999px;
    background: #e8f4ff;
    color: #1479e5;
    font-size: 0.68rem;
    font-weight: 700;
}

.settings-user-actions {
    display: flex;
    justify-content: flex-end;
    gap: 7px;
}

.settings-user-actions .secondary-action {
    min-height: 30px;
    padding: 0 9px;
    font-size: 0.68rem;
}

.secondary-action.danger,
.modal-save-button.danger {
    color: #dc2626;
    border-color: #fecaca;
    background: #fff7f7;
}

.secondary-action.danger:hover,
.modal-save-button.danger:hover {
    color: #ffffff;
    border-color: #dc2626;
    background: #dc2626;
}

.settings-users-empty td {
    color: #94a3b8;
    text-align: center !important;
}

.settings-user-modal {
    width: min(480px, 100%);
}

.settings-user-password-note,
.settings-user-confirm-text {
    color: #64748b;
    font-size: 0.72rem;
}

.settings-field-textarea {
    align-items: flex-start;
}

.settings-nfcom-section {
    min-height: 0;
}

.settings-collapse-panel {
    padding-top: 0;
    padding-bottom: 0;
}

.settings-collapse-panel .settings-section-header {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 -40px;
    padding: 0 40px;
    border-bottom: 1px solid #e2e8f0;
    color: #1479e5;
    cursor: pointer;
    list-style: none;
}

.settings-collapse-panel .settings-section-header::-webkit-details-marker {
    display: none;
}

.settings-collapse-panel .settings-section-header i {
    color: #64748b;
    font-size: 0.72rem;
    transition: transform 0.18s ease;
}

.settings-collapse-panel[open] .settings-section-header {
    margin-bottom: 22px;
}

.settings-collapse-panel[open] .settings-section-header i {
    transform: rotate(180deg);
}

.settings-collapse-panel[open] {
    padding-bottom: 26px;
}

.settings-nfcom-grid {
    grid-template-columns: repeat(2, minmax(320px, 1fr));
    justify-content: stretch;
    max-width: 980px;
    margin: 0 auto;
}

.settings-nfcom-grid .settings-field-wide,
.settings-nfcom-grid .settings-field-textarea,
.settings-nfcom-note,
.settings-nfcom-grid .settings-actions-row {
    grid-column: 1 / -1;
}

.settings-nfcom-grid .settings-field input,
.settings-nfcom-grid .settings-field select,
.settings-nfcom-grid .settings-field textarea {
    width: min(360px, 100%);
}

.settings-nfcom-note {
    max-width: 720px;
    justify-self: center;
}

.settings-cert-summary {
    grid-column: 1 / -1;
    max-width: 980px;
    width: 100%;
    justify-self: center;
    padding: 12px 14px;
    border: 1px solid #dbe6f2;
    border-radius: 5px;
    background: #f8fbff;
    color: #334155;
}

.settings-cert-summary strong {
    display: block;
    margin-bottom: 8px;
    color: #1f2937;
    font-size: 0.76rem;
}

.settings-cert-summary > span {
    display: block;
    color: #64748b;
    font-size: 0.7rem;
}

.settings-cert-summary dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 14px;
    margin: 0;
}

.settings-cert-summary dl div {
    min-width: 0;
}

.settings-cert-summary dt {
    color: #64748b;
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
}

.settings-cert-summary dd {
    margin: 2px 0 0;
    overflow-wrap: anywhere;
    color: #1f2937;
    font-size: 0.7rem;
}

.settings-tax-note {
    max-width: 980px;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 auto 12px;
    padding: 9px 12px;
    border-radius: 4px;
    border: 1px solid #fde68a;
    background: #fffbeb;
    color: #92400e;
    font-size: 0.72rem;
}

.settings-tax-note i {
    color: #f59e0b;
}

.settings-tax-accordion {
    max-width: 980px;
    display: grid;
    gap: 8px;
    margin: 0 auto;
    border: 0;
    background: transparent;
}

.settings-tax-panel {
    border: 1px solid #dbe2ea;
    border-radius: 4px;
    background: #ffffff;
    overflow: hidden;
}

.settings-tax-panel summary {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 12px;
    color: #334155;
    font-size: 0.74rem;
    font-weight: 600;
    cursor: pointer;
    list-style: none;
}

.settings-tax-panel summary::-webkit-details-marker {
    display: none;
}

.settings-tax-panel summary i {
    color: #64748b;
    font-size: 0.68rem;
    transition: transform 0.18s ease;
}

.settings-tax-panel[open] summary i {
    transform: rotate(180deg);
}

.settings-tax-grid {
    max-width: none;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
    padding: 14px 12px 16px;
    border-top: 1px solid #eef2f7;
    background: #ffffff;
}

.settings-tax-grid .settings-field,
.settings-tax-grid .settings-choice-row {
    min-width: 0;
}

.settings-tax-grid .settings-field input,
.settings-tax-grid .settings-field select,
.settings-tax-grid .settings-field textarea {
    min-width: 0;
    max-width: 100%;
    flex: 1 1 auto;
    width: auto;
}

.settings-tax-grid .settings-field select {
    overflow: hidden;
    text-overflow: ellipsis;
}

.settings-choice-row {
    display: flex;
    align-items: center;
    gap: 11px;
}

.settings-choice-row label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.72rem;
    color: #111827;
}

.settings-choice-row input[type="radio"] {
    width: 15px;
    height: 15px;
    accent-color: #2494e8;
}

.settings-actions-row {
    display: flex;
    justify-content: flex-end;
    margin-top: 2px;
}

.settings-actions-row .primary-action {
    gap: 7px;
    min-height: 36px;
    padding: 0 16px;
}

.settings-message {
    margin: 10px 12px 0;
    padding: 10px 12px;
    border-radius: 4px;
    background: #eff6ff;
    color: #1d4ed8;
    font-size: 0.76rem;
    font-weight: 600;
}

.settings-message.success {
    background: #ecfdf3;
    color: #15803d;
}

.settings-message.error {
    background: #fef2f2;
    color: #b91c1c;
}

.settings-page-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 24px;
    border-bottom: 1px solid #e5eaf1;
    background: #ffffff;
}

.settings-page-heading h1 {
    margin: 3px 0 4px;
    color: #1f2937;
    font-size: 1.28rem;
    font-weight: 700;
}

.settings-page-heading p {
    margin: 0;
    color: #64748b;
    font-size: 0.82rem;
}

.settings-eyebrow {
    color: #2494e8;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

@media (max-width: 720px) {
    .settings-section {
        padding: 18px 14px 24px;
    }

    .settings-form-row,
    .settings-field,
    .settings-choice-row {
        align-items: stretch;
        flex-direction: column;
        gap: 8px;
    }

    .settings-form-row label,
    .settings-field span,
    .settings-choice-row > span {
        min-width: 0;
        text-align: left;
    }

    .settings-form-row select,
    .settings-field-wide input,
    .settings-field-wide textarea,
    .settings-nfcom-grid .settings-field input,
    .settings-nfcom-grid .settings-field select,
    .settings-nfcom-grid .settings-field textarea {
        width: 100%;
    }

    .settings-nfcom-grid {
        grid-template-columns: 1fr;
    }

    .settings-tax-note {
        align-items: flex-start;
        margin-top: 0;
    }

    .settings-cert-summary dl {
        grid-template-columns: 1fr;
    }

    .settings-actions-row {
        justify-content: stretch;
    }

    .settings-users-header {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-users-header .primary-action {
        width: 100%;
        justify-content: center;
    }

    .settings-page-heading {
        align-items: stretch;
        flex-direction: column;
        padding: 18px 16px;
    }

    .nfcom-details-grid {
        grid-template-columns: 1fr;
    }

    .nfcom-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

.settings-actions-row .primary-action {
    width: 100%;
    justify-content: center;
}
}

.settings-sync-status {
    display: grid;
    gap: 4px;
    align-content: start;
    padding: 12px;
    border: 1px solid #dce5ef;
    border-radius: 4px;
    background: #f8fafc;
    color: #475569;
    font-size: 0.68rem;
}

.settings-sync-status strong { color: #27364b; font-size: 0.72rem; }
.settings-sync-status > span { width: max-content; padding: 2px 7px; border-radius: 10px; background: #e5eef8; color: #2563a9; font-weight: 600; text-transform: capitalize; }
.settings-sync-status small { color: #64748b; }
.settings-sync-status small b { color: #334155; font-weight: 500; }
.settings-actions-row { gap: 8px; }
.settings-actions-row .secondary-action { width: 100%; justify-content: center; }

/* ========================================================================== 
   SIDEBAR (MENU LATERAL) - RESTAURAÇÃO IDÊNTICA AOS PRINTS (SEM SALTO DE TELA)
   ========================================================================== */
.sidebar {
    width: 250px;
    background-color: #ffffff;
    border-right: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    transition: width 0.25s ease;
}

/* Oculta a barra de rolagem no Chrome, Safari e Opera */
.sidebar::-webkit-scrollbar {
    display: none;
}

/* Quando colapsado no desktop */
.sidebar.collapsed {
    width: 70px;
}

/* Cabeçalho da Sidebar (Fundo Branco, Texto VIVAX Azul) */
.sidebar-header {
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    background-color: #ffffff;
    border-bottom: 1px solid #f1f5f9;
	flex-shrink: 0; /* Impede que o cabeçalho seja esmagado */
}

.logo-text {
    font-weight: 700;
    color: #3b82f6; /* Azul VIVAX */
    font-size: 1.4rem;
    letter-spacing: -0.5px;
}

.sidebar.collapsed .logo-text {
    display: none;
}

.toggle-btn {
    background: none;
    border: none;
    color: #475569;
    cursor: pointer;
    font-size: 1.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Estrutura do Menu Lateral */
.sidebar-menu {
    flex: 1; /* Ocupa o restante do espaço */
    overflow-y: auto; /* Apenas o menu rola */
    padding: 10px 0;
    scrollbar-width: none; /* Esconde a barra de rolagem */
}

/* Dropdown Wrapper */
.menu-dropdown {
    width: 100%;
    display: flex;
    flex-direction: column;
}

/* Item do Menu Principal - Limpo e sem fundo cinza, conforme os prints */
.menu-item {
    display: flex;
    align-items: center;
    padding: 11px 20px;
    color: #526985;
    text-decoration: none;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 0.88rem;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0;
    position: relative;
    transition: color 0.15s ease, background-color 0.15s ease;
}

/* Ícones dos menus principais (Azuis ou cinzas discretos) */
.menu-item i:first-child {
    font-size: 1.08rem;
    width: 24px;
    margin-right: 12px;
    color: #60758f;
    display: flex;
    align-items: center;
    justify-content: center;
}

.menu-text {
    flex-grow: 1;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    white-space: nowrap;
}

/* Setas laterais de dropdown (>) */
.arrow {
    font-size: 0.68rem;
    color: #8a9aaf;
    transition: transform 0.2s ease;
}

.arrow.rotate {
    transform: rotate(90deg);
}

/* Hover e Estados Ativos do Menu Principal */
.menu-item:hover, 
.menu-item.active {
    background-color: #f4f7fb;
    color: #2f6fae;
}

.menu-item:hover i:first-child,
.menu-item.active i:first-child {
    color: #2f6fae;
}

/* SUBMENUS RECONSTRUÍDOS (Conforme image_86b466, image_86b38b, image_7cd226) */
.submenu-list {
    list-style: none;
    padding: 4px 0 8px 56px; /* Alinhamento identado perfeito do texto */
    display: none;
    background-color: #ffffff; /* Fundo totalmente limpo */
}

.submenu-list.open {
    display: block;
}

.submenu-list li {
    display: flex;
    align-items: center;
    position: relative;
}

.submenu-item {
    display: inline-flex;
    align-items: center;
    padding: 7px 0;
    color: #657a93;
    text-decoration: none;
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0;
    width: 100%;
    transition: color 0.15s;
}

.submenu-item:hover {
    color: #2f6fae;
}

.submenu-item.active {
    width: calc(100% + 12px);
    margin-left: -12px;
    padding-left: 9px;
    border-left: 3px solid #2494e8;
    border-radius: 0 3px 3px 0;
    background: #edf4fb;
    color: #245f9a;
    font-weight: 600;
}

.submenu-item.active:hover {
    background: #e3eef9;
    color: #1f568c;
}

/* TAGS "NOVO" AZUIS (Conforme image_86b38b e image_7cd226) */
.badge-novo {
    background-color: #2563eb;
    color: #ffffff;
    font-size: 0.6rem;
    font-weight: 800;
    padding: 1px 4px;
    border-radius: 3px;
    text-transform: uppercase;
    margin-right: 8px;
    display: inline-block;
    line-height: 1.2;
    letter-spacing: 0.5px;
}

/* Ocultar elementos se a barra colapsar no Desktop */
.sidebar.collapsed .menu-text,
.sidebar.collapsed .arrow,
.sidebar.collapsed .submenu-list,
.sidebar.collapsed .badge-novo {
    display: none !important;
}

.sidebar.collapsed .menu-item {
    justify-content: center;
    padding: 15px 0;
}

.sidebar.collapsed .menu-item i:first-child {
    margin-right: 0;
}

/* ==========================================================================
   TOPBAR VIVAX (AZUL ROYAL INTEGRADO COM A PESQUISA DROPDOWN)
   ========================================================================== */
.topbar {
    height: 60px;
    background-color: #3b82f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    color: #ffffff;
    position: fixed;
    top: 0;
    left: 250px;
    right: 0;
    z-index: 1000; /* AUMENTADO: Garante que a barra de pesquisa fique no topo */
    transition: left 0.25s ease;
    pointer-events: auto; /* Garante que a barra capture cliques */
}

.sidebar.collapsed ~ .main-container .topbar {
    left: 70px;
}

.mobile-menu-trigger {
    display: none;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 1.25rem;
    cursor: pointer;
    margin-right: 15px;
}

/* Container da Busca */
.search-container {
    position: relative;
    width: 100%;
    max-width: 550px;
    z-index: 1001; /* Garante que o input e o dropdown fiquem acima de tudo */
}

/* Input Branco do print original VIVAX */
.search-bar {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    padding: 7px 14px;
    border-radius: 4px;
    width: 100%;
}

.search-bar i {
    color: #94a3b8;
    margin-right: 10px;
    font-size: 0.95rem;
}

.search-bar input {
    border: none;
    background: transparent;
    width: 100%;
    outline: none;
    font-size: 0.9rem;
    color: #334155;
}

.search-bar input::placeholder {
    color: #94a3b8;
}

.topbar-actions {
    display: flex;
    align-items: center;
    gap: 18px;
}


.action-icon {
    font-size: 1.2rem;
    cursor: pointer;
    color: #ffffff;
}

.notification-badge {
    position: relative;
    cursor: pointer;
}

.notification-trigger {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #ffffff;
    cursor: pointer;
}

.notification-badge .badge {
    position: absolute;
    top: -6px;
    right: -8px;
    font-size: 0.65rem;
    font-weight: 700;
    color: #ffffff;
    padding: 1px 4px;
    border-radius: 10px;
}

.notification-badge.warning .badge { background-color: #f59e0b; }
.notification-badge.danger .badge { background-color: #ef4444; }

.notification-panel {
    display: none;
    position: absolute;
    top: 46px;
    right: -44px;
    width: min(690px, calc(100vw - 24px));
    min-height: 276px;
    grid-template-columns: 285px minmax(0, 1fr);
    background: #ffffff;
    border: 1px solid #dbe3ef;
    border-radius: 6px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, 0.18);
    color: #26364d;
    cursor: default;
    overflow: hidden;
    z-index: 9999;
}

.notification-panel.show {
    display: grid;
    animation: fadeIn 0.2s ease;
}

.notification-panel-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    padding: 13px 15px;
    border-bottom: 1px solid #e7edf5;
    background: #f8fafc;
    grid-column: 1 / -1;
}

.notification-panel-header strong { font-size: 0.85rem; }
.notification-panel-header span { color: #7b8798; font-size: 0.65rem; }
.notification-types { padding: 5px 0; border-right: 1px solid #e7edf5; }

.notification-type {
    width: 100%;
    min-height: 40px;
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 24px 12px;
    align-items: center;
    gap: 8px;
    border: 0;
    border-left: 3px solid transparent;
    padding: 8px 13px 8px 12px;
    background: #ffffff;
    color: #445268;
    text-align: left;
    cursor: pointer;
}

.notification-type:hover,
.notification-type.active {
    border-left-color: #2498e9;
    background: #eef7fe;
    color: #1269a7;
}

.notification-type > i:first-child { color: #2498e9; font-size: 0.8rem; }
.notification-type > i:last-child { color: #a5afbd; font-size: 0.58rem; }
.notification-type span { overflow-wrap: anywhere; font-size: 0.72rem; font-weight: 500; }
.notification-type b { color: #ffffff; background: #2498e9; border-radius: 9px; padding: 2px 5px; font-size: 0.58rem; text-align: center; }

.notification-panel-empty {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 45px;
    padding: 10px 15px;
    border-top: 1px solid #e7edf5;
    background: #fbfcfe;
    color: #8a96a7;
    font-size: 0.66rem;
    grid-column: 2;
}

.notification-panel-empty i { color: #a7b2c1; }
.notification-panel-empty[hidden], .notification-list-panel[hidden] { display: none !important; }

.notification-list-panel { min-width: 0; background: #fbfcfe; }
.notification-list-panel > header { min-height: 38px; display: flex; align-items: center; padding: 8px 12px; border-bottom: 1px solid #e7edf5; color: #344258; font-size: 0.72rem; }
.notification-ticket-list { max-height: 330px; overflow-y: auto; }
.notification-ticket-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 1px solid #e7edf5; }
.notification-ticket-item:hover { background: #eef7fe; }
.notification-ticket-item > div { min-width: 0; display: grid; gap: 3px; }
.notification-ticket-kind { width: max-content; color: #1683ca; font-size: 0.58rem; font-weight: 700; text-transform: uppercase; }
.notification-ticket-item strong { overflow: hidden; color: #27364b; font-size: 0.7rem; text-overflow: ellipsis; white-space: nowrap; }
.notification-ticket-item small { color: #7c899a; font-size: 0.6rem; }
.notification-ticket-item button, .notification-ticket-item > a { border: 1px solid #b8d8ef; border-radius: 3px; padding: 5px 7px; background: #ffffff; color: #1674b5; font-size: 0.6rem; text-decoration: none; cursor: pointer; }
.notification-ticket-item button:hover, .notification-ticket-item > a:hover { background: #2498e9; color: #ffffff; }
.notification-pre-item .notification-ticket-kind { color: #d97706; }
.notification-certificate-item.warning .notification-ticket-kind { color: #d97706; }
.notification-certificate-item.danger .notification-ticket-kind { color: #dc2626; }
.notification-certificate-item.warning { background: #fffaf0; }
.notification-certificate-item.danger { background: #fff1f2; }
.notification-certificate-item.danger strong { color: #991b1b; }
.notification-list-empty { min-height: 150px; display: grid; place-content: center; justify-items: center; gap: 7px; color: #8a96a7; font-size: 0.66rem; }

.server-modal.notification-ticket-modal { width: min(620px, 100%); }
.notification-ticket-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; padding: 12px 16px; background: #edf6fc; border-bottom: 1px solid #d8e5ef; }
.notification-ticket-summary div { min-width: 0; display: grid; gap: 2px; padding: 5px 8px; }
.notification-ticket-summary span, .notification-ticket-message > span { color: #708096; font-size: 0.58rem; text-transform: uppercase; }
.notification-ticket-summary strong { overflow-wrap: anywhere; color: #26364d; font-size: 0.7rem; }
.notification-ticket-modal-body { display: grid; gap: 12px; }
.notification-ticket-message { display: grid; gap: 5px; padding-top: 4px; }
.notification-ticket-message p { min-height: 70px; max-height: 150px; overflow-y: auto; margin: 0; padding: 9px; border: 1px solid #d7e0ea; background: #f8fafc; color: #475569; font-size: 0.68rem; white-space: pre-wrap; }
.server-modal.certificate-expiry-modal { width: min(560px, 100%); }
.certificate-expiry-body { display: grid; gap: 14px; }
.certificate-expiry-warning { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px; border: 1px solid #fed7aa; border-radius: 8px; background: #fff7ed; color: #9a3412; }
.certificate-expiry-warning i { font-size: 1.35rem; }
.certificate-expiry-warning div { display: grid; gap: 3px; }
.certificate-expiry-warning strong { color: #7c2d12; font-size: 0.84rem; }
.certificate-expiry-warning span { color: #9a3412; font-size: 0.7rem; }
.certificate-expiry-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid #d9e3ef; border-radius: 8px; background: #d9e3ef; }
.certificate-expiry-grid div { min-width: 0; display: grid; gap: 4px; padding: 10px 12px; background: #ffffff; }
.certificate-expiry-grid div.full { grid-column: 1 / -1; }
.certificate-expiry-grid span { color: #64748b; font-size: 0.58rem; font-weight: 700; text-transform: uppercase; }
.certificate-expiry-grid strong { overflow-wrap: anywhere; color: #243247; font-size: 0.74rem; }
.danger-action { display: inline-flex; align-items: center; gap: 7px; border: 1px solid #ef4444; border-radius: 3px; padding: 8px 12px; background: #ffffff; color: #dc2626; cursor: pointer; }
.danger-action:hover { background: #ef4444; color: #ffffff; }

/* ==========================================================================
   FATURAMENTO
   ========================================================================== */
.invoicing-page .clients-content { gap: 9px; }
.invoicing-stats { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.invoicing-stats .client-stat { min-width: 0; }
.invoicing-advanced-filters { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.client-table.invoicing-table { min-width: 980px; table-layout: fixed; }
.client-table.invoicing-table > thead > tr > th:nth-child(1) { width: 34px; }
.client-table.invoicing-table > thead > tr > th:nth-child(2) { width: 68px; }
.client-table.invoicing-table > thead > tr > th:nth-child(3) { width: auto; }
.client-table.invoicing-table > thead > tr > th:nth-child(4) { width: 72px; }
.client-table.invoicing-table > thead > tr > th:nth-child(5) { width: 86px; }
.client-table.invoicing-table > thead > tr > th:nth-child(6) { width: 112px; }
.client-table.invoicing-table > thead > tr > th:nth-child(7) { width: 88px; }
.client-table.invoicing-table > thead > tr > th:nth-child(8) { width: 120px; }
.client-table.invoicing-table > thead > tr > th:nth-child(9) { width: 124px; }
.invoicing-table > thead > tr > th {
    height: 46px;
    padding: 5px 7px;
    vertical-align: middle;
    line-height: 1.15;
    white-space: normal;
}
.invoicing-table > thead > tr > th:first-child { padding-right: 0; padding-left: 0; text-align: center; }
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td { padding-top: 7px; padding-bottom: 7px; }
.invoicing-table > thead > tr > th:nth-child(2),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(2),
.invoicing-table > thead > tr > th:nth-child(4),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(4),
.invoicing-table > thead > tr > th:nth-child(5),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(5),
.invoicing-table > thead > tr > th:nth-child(6),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(6),
.invoicing-table > thead > tr > th:nth-child(7),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(7),
.invoicing-table > thead > tr > th:nth-child(8),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(8),
.invoicing-table > thead > tr > th:nth-child(9),
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(9) { text-align: center; }
.invoicing-table > tbody > tr:not(.invoice-detail-row) > td:nth-child(9) .ticket-row-actions { justify-content: center; }
.invoice-client { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.invoice-status { display: inline-flex; padding: 2px 5px; border-radius: 2px; color: #ffffff; font-size: 0.58rem; font-weight: 700; text-transform: lowercase; }
.invoice-status.atraso { background: #ef5350; }
.invoice-status.aberto { background: #278bd2; }
.invoice-status.aguardando { background: #f2b233; color: #513b00; }
.invoice-status.concluindo { background: #f2b233; color: #513b00; }
.invoice-status.concluido { background: #43b654; }
.invoice-status.arquivado { background: #7b8798; }
.invoice-status.cancelado { background: #ef5350; }
.invoice-status.integration-status { text-transform: none; white-space: nowrap; }
.invoice-status.integration-status.integrated { background: #43b654; }
.invoice-status.integration-status.not-integrated { background: #f2b233; color: #513b00; }
.invoice-table tr.invoice-row-status-atraso td { color: #ef5350; }
.invoice-table tr.invoice-row-status-concluido td { color: #43b654; }
.invoice-table tr.invoice-row-status-concluindo td { color: #8a5b00; }
.invoice-table tr.invoice-row-status-cancelado td,
.invoice-table tr.invoice-row-status-arquivado td { color: #7b8798; }
.invoice-table tr.invoice-row-status-aberto td { color: inherit; }
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button { color: inherit; }
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button.danger { color: #ef5350; }
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button:disabled,
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button.invoice-disabled-action {
    color: #c4ccd6;
    background: #f3f6f9;
    cursor: not-allowed;
    opacity: 0.48;
}
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button:disabled:hover,
.invoice-table tr[class*="invoice-row-status-"] .ticket-row-actions button.invoice-disabled-action:hover {
    color: #b8c2cf;
    background: #f3f6f9;
}
.invoicing-table .bank-integration-column {
    white-space: normal;
    line-height: 1.15;
}
.invoicing-table tr.expanded > td { background: #f8fbfd; border-bottom-color: #d6e3ed; }
.invoice-detail-row > td { padding: 0 !important; background: #eef3f7; }
.invoice-detail { display: grid; grid-template-columns: minmax(230px, 29%) minmax(0, 1fr); gap: 8px; padding: 7px; }
.invoice-detail aside { padding: 10px 12px; background: #ffffff; }
.invoice-detail h3 { margin: 0 0 12px; padding-bottom: 8px; border-bottom: 1px solid #e0e6ec; color: #24344a; font-size: 0.72rem; font-weight: 500; text-transform: uppercase; }
.invoice-detail dl { margin: 0; border: 1px solid #d8dfe7; }
.invoice-detail dl div { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 5px; padding: 11px; border-bottom: 1px solid #d8dfe7; }
.invoice-detail dl div:last-child { border-bottom: 0; }
.invoice-detail dt { color: #95a0ad; font-size: 0.61rem; }
.invoice-detail dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: #26364a; font-size: 0.62rem; font-weight: 600; }
.invoice-detail section { min-width: 0; background: #ffffff; }
.invoice-detail section table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.invoice-detail section th, .invoice-detail section td { padding: 8px 7px; border-bottom: 1px solid #e1e6ec; color: #46556a; font-size: 0.61rem; text-align: left; }
.invoice-detail section th { background: #f3f5f8; color: #667488; font-weight: 500; }
.invoicing-table .invoice-detail section th,
.invoicing-table .invoice-detail section td { text-align: center; }
.invoicing-table .invoice-detail section th:nth-child(1) { width: 72px; }
.invoicing-table .invoice-detail section th:nth-child(2) { width: 82px; }
.invoicing-table .invoice-detail section th:nth-child(3) { width: 110px; }
.invoicing-table .invoice-detail section th:nth-child(4) { width: 120px; }
.invoicing-table .invoice-detail section th:nth-child(5) { width: 100px; }
.invoicing-table .invoice-detail section th:nth-child(6) { width: 105px; }
.invoicing-table .invoice-detail section th:nth-child(7) { width: 95px; }
.invoice-detail section td.paid { color: #43b654; font-weight: 700; }
.invoice-detail section td.late { color: #ef5350; font-weight: 700; }
.invoice-detail section td.awaiting { color: #b77900; font-weight: 700; }
.invoice-detail section td.open { color: #278bd2; font-weight: 700; }
.invoice-detail section td.canceled { color: #7b8798; font-weight: 700; }
.invoice-detail section footer { padding: 12px; color: #68778b; font-size: 0.62rem; }
.invoice-installment-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    white-space: nowrap;
}
.invoice-installment-actions button {
    width: 28px;
    min-width: 28px;
    height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #f7f9fb;
    color: #627287;
    cursor: pointer;
}
.invoice-installment-actions button:hover { background: #eaf4fb; color: #1785ca; }
.invoice-installment-actions button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.invoice-installment-actions button.danger { color: #ef5350; }
.invoice-installment-actions button.danger:hover { background: #fff1f2; color: #dc2626; }
.invoice-installment-actions .installment-paid { color: #35a853; }
.invoice-installment-actions .installment-paid:hover { background: #e9f8ed; color: #188437; }
.client-detail-page .invoice-detail section th:first-child,
.client-detail-page .invoice-detail section td:first-child {
    width: 86px;
    min-width: 86px;
    text-align: center;
    white-space: nowrap;
}

.new-invoice-modal { width: min(510px, 100%); }
.new-invoice-modal-body { gap: 12px; }
.charge-result-modal { width: min(430px, 100%); }
.charge-processing-modal { width: min(420px, 100%); }
.charge-processing-body {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 24px 26px;
}
.charge-processing-body strong {
    display: block;
    color: #172033;
    font-size: 0.88rem;
    margin-bottom: 4px;
}
.charge-processing-body p {
    margin: 0;
    color: #64748b;
    font-size: 0.76rem;
    line-height: 1.45;
}
.charge-processing-time {
    display: inline-block;
    margin-top: 8px;
    color: #218ee5;
    font-size: 0.74rem;
    font-weight: 700;
}
.charge-processing-spinner {
    width: 34px;
    height: 34px;
    border: 3px solid #dbeafe;
    border-top-color: #218ee5;
    border-radius: 50%;
    animation: charge-spin 0.8s linear infinite;
}
@keyframes charge-spin {
    to { transform: rotate(360deg); }
}
.charge-edit-modal { width: min(520px, 100%); }
.charge-edit-body { gap: 12px; }
.charge-edit-body .server-form-field {
    grid-template-columns: 115px minmax(0, 1fr);
}
.installment-edit-modal { width: min(560px, 100%); }
.installment-edit-body { gap: 12px; }
.installment-edit-body .server-form-field {
    grid-template-columns: 135px minmax(0, 1fr);
}
.installment-edit-body textarea {
    min-height: 72px;
    resize: vertical;
}
.charge-edit-summary {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid #dce7f2;
    background: #f8fbff;
    border-radius: 4px;
}
.charge-edit-summary strong {
    color: #172033;
    font-size: 0.8rem;
}
.charge-edit-summary span,
.charge-edit-summary small {
    color: #64748b;
    font-size: 0.68rem;
}
.charge-result-body {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 22px 24px;
}
.charge-result-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 50%;
    background: #e8f7ef;
    color: #23a455;
    font-size: 1.45rem;
}
.charge-result-icon.warning {
    background: #fff4e5;
    color: #f59e0b;
}
.charge-result-icon.error {
    background: #fee2e2;
    color: #dc2626;
}
.charge-result-body strong {
    display: block;
    color: #1f2937;
    font-size: 0.95rem;
    font-weight: 700;
}
.charge-result-body p {
    margin: 7px 0 0;
    color: #4b5563;
    font-size: 0.82rem;
    line-height: 1.45;
}
.invoice-confirm-modal { width: min(460px, 100%); }
.nfcom-confirm-reason {
    display: grid;
    gap: 6px;
    margin-top: 14px;
}
.nfcom-confirm-reason span {
    font-size: 0.78rem;
    font-weight: 700;
    color: #334155;
}
.nfcom-confirm-reason textarea {
    width: 100%;
    min-height: 92px;
    resize: vertical;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    padding: 10px 12px;
    font: inherit;
    color: #1f2937;
    background: #fff;
}
.nfcom-confirm-reason textarea:focus {
    outline: none;
    border-color: #1785ca;
    box-shadow: 0 0 0 3px rgba(23, 133, 202, .14);
}
.nfcom-confirm-reason small {
    color: #64748b;
    font-size: 0.72rem;
}
.invoice-confirm-body {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
    padding: 22px 24px;
}
.invoice-confirm-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 50%;
    background: #fff4e5;
    color: #f59e0b;
    font-size: 1.2rem;
}
.invoice-confirm-body strong {
    display: block;
    color: #1f2937;
    font-size: 0.95rem;
    font-weight: 700;
}
.invoice-confirm-body p {
    margin: 7px 0 0;
    color: #4b5563;
    font-size: 0.82rem;
    line-height: 1.45;
}
.invoice-confirm-effective-date {
    display: grid;
    gap: 6px;
    margin-top: 16px;
}
.invoice-confirm-effective-date[hidden] { display: none; }
.invoice-confirm-effective-date span {
    color: #374151;
    font-size: 0.74rem;
    font-weight: 600;
}
.invoice-confirm-effective-date input {
    width: 100%;
    height: 38px;
    border: 1px solid #cfd8e3;
    border-radius: 4px;
    padding: 0 10px;
    background: #ffffff;
    color: #334155;
    font-size: 0.76rem;
}
.invoice-confirm-effective-date input:focus {
    border-color: #2494e8;
    outline: 0;
    box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12);
}
.new-invoice-client-control { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 36px; }
.new-invoice-client-search { min-width: 0; position: relative; }
.new-invoice-client-search > input[type="search"] { width: 100%; height: 36px; border: 1px solid #cfd8e3; border-radius: 3px 0 0 3px; padding: 0 10px; outline: 0; color: #334155; font-size: 0.7rem; }
.new-invoice-client-search > input[type="search"]:focus { border-color: #2494e8; box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12); }
.new-invoice-client-control button { border: 1px solid #cfd8e3; border-left: 0; border-radius: 0 3px 3px 0; background: #f8fafc; color: #3687bd; cursor: pointer; }
.new-invoice-client-control button:disabled { color: #aeb8c4; cursor: not-allowed; }
.new-invoice-client-suggestions { max-height: 220px; position: absolute; top: calc(100% + 3px); left: 0; right: 0; z-index: 20; overflow-y: auto; border: 1px solid #cfd8e3; border-radius: 3px; background: #ffffff; box-shadow: 0 7px 18px rgba(15, 23, 42, 0.16); }
.new-invoice-client-suggestions[hidden] { display: none; }
.new-invoice-client-suggestions button { width: 100%; display: grid; gap: 3px; border: 0; border-bottom: 1px solid #e8edf3; padding: 8px 10px; background: #ffffff; color: #334155; text-align: left; cursor: pointer; }
.new-invoice-client-suggestions button:hover { background: #edf7fe; }
.new-invoice-client-suggestions strong { font-size: 0.67rem; }
.new-invoice-client-suggestions span, .new-invoice-client-empty { color: #7b8798; font-size: 0.58rem; }
.new-invoice-client-empty { padding: 12px; text-align: center; }
.new-invoice-client-summary { width: calc(100% - 130px); display: grid; gap: 3px; align-self: end; padding: 9px 10px; border-radius: 3px; background: #ffd400; color: #293446; font-size: 0.62rem; }
.new-invoice-client-summary[hidden] { display: none; }
.new-invoice-client-summary strong { font-weight: 600; }
.new-invoice-installments select { max-width: 100px; }
.new-invoice-single-fields { display: grid; gap: 12px; }
.new-invoice-single-fields[hidden] { display: none; }

/* ==========================================================================
   GERAR FATURAMENTO EM LOTE
   ========================================================================== */
.invoice-batch-stats { grid-template-columns: repeat(3, minmax(160px, 190px)); justify-content: start; }
.invoice-batch-filter-bar { padding: 7px; }
.invoice-batch-filters { display: grid; grid-template-columns: minmax(180px, 1.5fr) minmax(160px, 1fr) minmax(190px, 1fr) 38px 38px; gap: 8px; }
.invoice-batch-filters select { min-width: 0; height: 38px; border: 1px solid #d7dee8; border-radius: 3px; padding: 0 10px; background: #ffffff; color: #334155; font-size: 0.72rem; }
.invoice-batch-table { table-layout: fixed; min-width: 0; }
.invoice-batch-table th:nth-child(1) { width: 28px; }
.invoice-batch-table th:nth-child(2) { width: 52%; }
.invoice-batch-table th:nth-child(3) { width: 7%; }
.invoice-batch-table th:nth-child(4) { width: 6%; }
.invoice-batch-table th:nth-child(5) { width: 12%; }
.invoice-batch-table th:nth-child(6) { width: 23%; }
.invoice-batch-table td:nth-child(2) { font-weight: 500; white-space: nowrap; font-size: 0.7rem; }
.invoice-batch-table th:nth-child(3),
.invoice-batch-table td:nth-child(3) { padding-left: 4px; padding-right: 4px; }
.invoice-batch-table th:nth-child(4),
.invoice-batch-table td:nth-child(4) { text-align: center; }
.invoice-batch-table th,
.invoice-batch-table td { padding-left: 6px; padding-right: 6px; }
.invoice-batch-table td { padding-top: 4px; padding-bottom: 4px; }
.invoice-batch-table td { padding-top: 7px; padding-bottom: 7px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.batch-invoice-modal { width: min(450px, 100%); }
.batch-invoice-modal-body { align-items: center; padding: 22px 28px; }
.batch-invoice-modal-body p { margin: 0; color: #334155; }
.batch-invoice-modal-body .server-form-field { width: 100%; max-width: 280px; }
.batch-add-client { width: 28px; height: 25px; border: 0; background: #f7f9fb; color: #50657d; cursor: pointer; }
.batch-add-client:hover { background: #eaf5fd; color: #1685cb; }
.secondary-action[href] { text-decoration: none; }

.user-profile {
    display: flex;
    align-items: center;
    color: #ffffff;
    cursor: pointer;
}

/* ==========================================================================
   CONTEÚDO E DASHBOARD GRID (ALINHAMENTO DE ESPAÇO)
   ========================================================================== */
.main-container {
    margin-left: 250px;
    padding-top: 60px; /* Compensação da topbar fixa */
    width: calc(100% - 250px);
    transition: margin-left 0.25s ease, width 0.25s ease;
}

.sidebar.collapsed ~ .main-container {
    margin-left: 70px;
    width: calc(100% - 70px);
}

.dashboard-content {
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.card {
    background: #ffffff;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
    padding: 20px;
}

.card.full-width { width: 100%; }

.card-title {
    font-size: 0.85rem;
    font-weight: 700;
    color: #475569;
    margin-bottom: 16px;
    letter-spacing: 0.02em;
}

.chart-container {
    position: relative;
    height: 220px;
    width: 100%;
}

.container-pagamentos { height: 260px; }

.grid-2-columns {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* Bloco de indicadores */
.indicators-grid { display: grid; gap: 12px; }
.indicators-grid.grid-4 { grid-template-columns: repeat(4, 1fr); }
.indicators-grid.grid-6 { grid-template-columns: repeat(3, 1fr); }

.indicator-item {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    padding: 12px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
}

.indicator-item .value { font-size: 1.2rem; font-weight: 700; color: #1e293b; }
.indicator-item .value small { font-size: 0.75rem; color: #64748b; margin-left: 2px; }
.indicator-item .label { font-size: 0.75rem; color: #64748b; margin-top: 2px; }

.border-gray { border-left: 3px solid #94a3b8; }
.border-green { border-left: 3px solid #22c55e; }
.border-blue { border-left: 3px solid #3b82f6; }
.border-red { border-left: 3px solid #ef4444; }
.border-green-light { border-left: 3px solid #4ade80; }
.border-blue-light { border-left: 3px solid #60a5fa; }
.border-orange { border-left: 3px solid #fb923c; }
.border-yellow { border-left: 3px solid #facc15; }
.border-blue-dark { border-left: 3px solid #1e3a8a; }

/* ==========================================================================
   CAIXA DE RESULTADOS DA PESQUISA DROPDOWN (PRESERVADA)
   ========================================================================== */
.search-results-dropdown {
    display: none;
    position: absolute;
    top: 105%;
    left: 0;
    width: min(315px, 100%);
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    border: 1px solid #cbd5e1;
    padding: 5px;
    max-height: 450px;
    overflow-y: auto;
}

.search-results-dropdown.show {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.search-result-card {
    border-radius: 4px;
    padding: 7px 8px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    cursor: pointer;
    border: 1px solid transparent;
    color: inherit;
    text-decoration: none;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.search-result-card.status-danger { background-color: #fff1f1; border-color: #fecaca; }
.search-result-card.status-normal { background-color: #edf6ff; border-color: #d6e8fa; }
.search-result-card:hover,
.search-result-card:focus-visible {
    border-color: #1685e5;
    background: #2494e8;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(36, 148, 232, 0.24);
    outline: 0;
    transform: translateX(2px);
}

.card-row-main { display: flex; justify-content: space-between; align-items: center; }
.client-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; font-size: 0.67rem; color: #1e293b; }
.search-result-card.status-danger .client-name { color: #b91c1c; }
.download-icon { color: #64748b; font-size: 0.68rem; }
.card-meta-info { display: flex; align-items: center; gap: 4px; min-width: 0; font-size: 0.57rem; color: #475569; }
.card-meta-info span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.text-danger { color: #dc2626; font-weight: 600; }
.card-row-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px; font-size: 0.57rem; color: #475569; }
.card-row-details > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.detail-item { display: flex; align-items: center; gap: 3px; }
.detail-item i, .card-meta-info i { flex: 0 0 11px; color: #94a3b8; width: 11px; text-align: center; font-size: 0.55rem; }
.search-result-card.status-danger .card-row-details,
.search-result-card.status-danger .card-meta-info,
.search-result-card.status-danger .detail-item i,
.search-result-card.status-danger .card-meta-info i { color: #dc2626; }
.search-result-card:hover .client-name,
.search-result-card:hover .card-row-details,
.search-result-card:hover .card-meta-info,
.search-result-card:hover .download-icon,
.search-result-card:hover .detail-item i,
.search-result-card:hover .card-meta-info i,
.search-result-card:focus-visible .client-name,
.search-result-card:focus-visible .card-row-details,
.search-result-card:focus-visible .card-meta-info,
.search-result-card:focus-visible .download-icon,
.search-result-card:focus-visible .detail-item i,
.search-result-card:focus-visible .card-meta-info i { color: #ffffff; }
.global-search-empty { padding: 16px 10px; color: #64748b; font-size: 0.75rem; text-align: center; }

/* ==========================================================================
   RESPONSIVIDADE MOBILE
   ========================================================================= */
.sidebar-overlay {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.4);
    z-index: 95;
}

@media (max-width: 768px) {
    .topbar { left: 0 !important; }
    .mobile-menu-trigger { display: block; }
    .sidebar { transform: translateX(-100%); width: 250px !important; }
    .sidebar.mobile-open { transform: translateX(0); }
    .sidebar-overlay.active { display: block; }
    .main-container { margin-left: 0 !important; width: 100% !important; padding: 75px 12px 12px 12px; }
    .grid-2-columns { grid-template-columns: 1fr; gap: 16px; }
    .indicators-grid.grid-4 { grid-template-columns: repeat(2, 1fr); }
    .indicators-grid.grid-6 { grid-template-columns: repeat(2, 1fr); }
    .search-container { width: 60%; }
    .topbar-actions .fa-comment-dots { display: none !important; }
    .notification-panel { position: fixed; top: 58px; right: 8px; grid-template-columns: 1fr; width: min(380px, calc(100vw - 16px)); max-height: calc(100vh - 66px); overflow-y: auto; }
    .notification-panel-header, .notification-panel-empty { grid-column: 1; }
    .notification-types { border-right: 0; border-bottom: 1px solid #e7edf5; }
    .notification-ticket-summary { grid-template-columns: 1fr; }
    .invoicing-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .invoicing-advanced-filters { grid-template-columns: 1fr; }
    .invoice-detail { grid-template-columns: 1fr; }
    .client-table.invoicing-table { min-width: 760px; }
    .invoicing-table th:nth-child(4), .invoicing-table td:nth-child(4), .invoicing-table th:nth-child(5), .invoicing-table td:nth-child(5) { display: none; }
    .invoice-batch-stats { grid-template-columns: repeat(3, minmax(110px, 1fr)); }
    .invoice-batch-filters { grid-template-columns: 1fr 1fr; }
    .invoice-batch-filters select:first-child { grid-column: 1 / -1; }
    .invoice-batch-table th:nth-child(3), .invoice-batch-table td:nth-child(3), .invoice-batch-table th:nth-child(5), .invoice-batch-table td:nth-child(5) { display: none; }
    .new-invoice-client-summary { width: 100%; }
}

/* ==========================================================================
   MODAL DE CADASTRO DE CLIENTE
   ========================================================================== */
body.modal-open {
    overflow: hidden;
}

.client-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 5000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 18px;
    background: rgba(15, 23, 42, 0.48);
}

.client-modal-backdrop[hidden] {
    display: none;
}

.client-modal {
    width: min(1120px, 100%);
    max-height: calc(100vh - 36px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #cfd7e3;
    border-radius: 4px;
    box-shadow: 0 18px 55px rgba(15, 23, 42, 0.3);
}

.client-modal-header {
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    color: #ffffff;
    background: #3b82f6;
}

.client-modal-header h2 {
    font-size: 0.95rem;
    font-weight: 600;
}

.client-modal-close {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #ffffff;
    cursor: pointer;
    font-size: 1rem;
}

.client-modal-form {
    min-height: 0;
    display: flex;
    flex-direction: column;
}

.client-modal-body {
    min-height: 0;
    overflow-y: auto;
    padding: 14px;
    background: #f4f6f9;
}

.client-form-errors {
    margin-bottom: 14px;
    padding: 11px 14px;
    border: 1px solid #ef9a9a;
    background: #fff5f5;
    color: #b42318;
    font-size: 0.72rem;
}
.client-form-errors.success {
    border-color: #86efac;
    background: #f0fdf4;
    color: #166534;
}
.client-form-errors[hidden] { display: none; }
.client-form-errors strong { display: block; margin-bottom: 5px; }
.client-form-errors ul { margin: 0; padding-left: 18px; }
.client-form-errors li + li { margin-top: 3px; }
.client-modal-form .field-invalid > span { color: #c62828; }
.client-modal-form .field-invalid input,
.client-modal-form .field-invalid select,
.client-modal-form .field-invalid textarea,
.client-modal-form .field-invalid .password-control {
    border-color: #e53935;
    background: #fff8f8;
}

.client-form-section {
    margin: 0 0 12px;
    padding: 14px;
    border: 1px solid #dce3ec;
    background: #ffffff;
}

.client-form-section legend {
    padding: 0 7px;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 700;
}

.client-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 11px 12px;
}
.client-whatsapp-field { align-self: start; }
.client-whatsapp-choice { display: flex; align-items: center; gap: 8px; min-height: 24px; margin-top: 4px; }
.client-whatsapp-choice small { color: #64748b; font-size: 0.6rem; }
.client-whatsapp-choice label { display: inline-flex; align-items: center; cursor: pointer; }
.client-whatsapp-choice input { position: absolute; opacity: 0; pointer-events: none; }
.client-whatsapp-choice label span { display: inline-flex; align-items: center; gap: 4px; padding: 3px 7px; border: 1px solid #d5dde7; border-radius: 3px; background: #fff; color: #64748b; font-size: 0.61rem; }
.client-whatsapp-choice label input:checked + span { border-color: #2494e8; background: #eef7fe; color: #2563eb; }
.client-whatsapp-choice label:first-of-type input:checked + span { border-color: #27ae60; background: #edfdf3; color: #169447; }
.client-whatsapp-indicator { margin-left: 4px; color: #20b858; font-size: 0.72rem; }

.field {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.field[data-auth-pppoe][hidden],
.field[data-auth-dhcp][hidden],
.field[data-person-fisica][hidden],
.field[data-person-juridica][hidden] {
    display: none !important;
}

.field.span-2 {
    grid-column: span 2;
}

.client-nfcom-fields {
    grid-template-columns: minmax(150px, 1fr) minmax(220px, 2fr) minmax(128px, 0.75fr) minmax(150px, 0.85fr);
}

.client-nfcom-fields .field.span-2 {
    grid-column: auto;
}

.client-nfcom-code input,
.client-nfcom-contract input {
    max-width: 160px;
}

.field > span {
    color: #475569;
    font-size: 0.68rem;
    font-weight: 600;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    min-height: 36px;
    border: 1px solid #cfd8e3;
    border-radius: 3px;
    background: #ffffff;
    color: #334155;
    padding: 7px 9px;
    font-size: 0.75rem;
    outline: none;
}

.field textarea {
    min-height: 72px;
    resize: vertical;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.12);
}

.password-control {
    display: flex;
}

.password-control input {
    border-radius: 3px 0 0 3px;
}

.password-control button {
    width: 38px;
    border: 1px solid #cfd8e3;
    border-left: 0;
    border-radius: 0 3px 3px 0;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
}

.segmented-options {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    min-height: 36px;
    border: 1px solid #cfd8e3;
    border-radius: 3px;
    overflow: hidden;
}

.segmented-options.three-options {
    grid-template-columns: repeat(3, 1fr);
}

.segmented-options label {
    min-width: 0;
    cursor: pointer;
}

.segmented-options input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.segmented-options span {
    height: 100%;
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 8px;
    border-right: 1px solid #cfd8e3;
    color: #64748b;
    background: #ffffff;
    font-size: 0.7rem;
    text-align: center;
}

.segmented-options label:last-child span {
    border-right: 0;
}

.segmented-options input:checked + span {
    color: #ffffff;
    background: #3b82f6;
}

.client-modal-footer {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    padding: 10px 14px;
    border-top: 1px solid #dce3ec;
    background: #ffffff;
}

.modal-cancel-button,
.modal-save-button {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 0 15px;
    border-radius: 3px;
    font-size: 0.75rem;
    cursor: pointer;
}

.modal-cancel-button {
    border: 1px solid #cfd8e3;
    background: #ffffff;
    color: #475569;
}

.modal-save-button {
    border: 1px solid #2585dc;
    background: #258fe7;
    color: #ffffff;
}

@media (max-width: 900px) {
    .client-form-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .client-nfcom-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .client-modal-backdrop {
        padding: 0;
    }

    .client-modal {
        max-height: 100vh;
        height: 100vh;
        border-radius: 0;
    }

    .client-form-grid {
        grid-template-columns: 1fr;
    }

    .client-nfcom-fields {
        grid-template-columns: 1fr;
    }

    .field.span-2 {
        grid-column: span 1;
    }

    .client-nfcom-fields .field.span-2 {
        grid-column: span 1;
    }

    .segmented-options.three-options {
        grid-template-columns: 1fr;
    }
}

/* Estilização específica da página de login */
.login-page {
    background-color: #f4f6f9;
    align-items: center;
    justify-content: center;
}

.login-container {
    width: 100%;
    max-width: 400px;
    background: #ffffff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
    border: 1px solid #e2e8f0;
}

.login-header {
    text-align: center;
    margin-bottom: 30px;
}

.login-header h1 {
    color: #3b82f6; /* Azul VIVAX */
    font-size: 2rem;
    font-weight: 700;
}

.input-group {
    margin-bottom: 15px;
}

.input-group label {
    display: block;
    font-size: 0.8rem;
    font-weight: 700;
    color: #475569;
    margin-bottom: 5px;
}

.input-group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    font-size: 0.9rem;
}

.options-row {
    margin: 15px 0;
    font-size: 0.8rem;
    color: #475569;
}

.btn-login {
    width: 100%;
    padding: 12px;
    background-color: #3b82f6;
    color: white;
    border: none;
    border-radius: 4px;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-login:hover {
    background-color: #2563eb;
}

/* Responsividade Mobile */
@media (max-width: 480px) {
    .login-container {
        margin: 20px;
        padding: 25px;
    }
}
/* Container pai (o ícone) */
.user-profile {
    position: relative;
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 5px;
}

/* O Menu escondido */
.user-menu {
    display: none; 
    position: absolute;
    top: 100%; /* Exatamente abaixo do ícone */
    right: 0;
    width: 200px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border: 1px solid #e2e8f0;
    margin-top: 12px; /* Espaçamento entre o ícone e o menu */
    z-index: 9999;
    overflow: hidden;
}

/* Mostrar o menu */
.user-menu.show {
    display: block;
    animation: fadeIn 0.2s ease;
}

/* Animação suave */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Cabeçalho do menu (nome do usuário) */
.user-menu-header {
    padding: 12px 16px;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.85rem;
    font-weight: 600;
    color: #1e293b;
}

/* Link Sair */
.user-menu-item {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    color: #ef4444; /* Vermelho para indicar saída */
    text-decoration: none;
    font-size: 0.85rem;
    transition: background 0.2s;
}

.user-menu-item:hover {
    background-color: #fee2e2;
}

.user-menu-item i {
    margin-right: 10px;
}

/* ==========================================================================
   CLIENTES
   ========================================================================== */
.clients-content {
    padding: 10px 8px 24px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.clients-load-error {
    padding: 10px 12px;
    border: 1px solid #fecaca;
    background: #fff1f2;
    color: #b91c1c;
    font-size: 0.75rem;
}

.clients-page {
    background: #edf2f7;
}


.client-stats {
    display: grid;
    grid-template-columns: repeat(6, minmax(140px, 1fr));
    gap: 9px;
}

.client-stat {
    min-height: 46px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    background: #ffffff;
    border: 1px solid #dce3ec;
    border-radius: 3px;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.14);
    cursor: pointer;
    text-align: left;
}

.client-stat.active {
    border-color: #64748b;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.28);
}
.client-stat:disabled {
    cursor: default;
    opacity: 0.62;
    box-shadow: none;
}

.client-stat strong {
    font-size: 1.25rem;
    font-weight: 500;
    color: #172033;
}

.client-stat span {
    font-size: 0.62rem;
    font-weight: 700;
    color: #172033;
    text-transform: uppercase;
}

.client-stat.stat-blue strong, .client-stat.stat-blue span { color: #0867d9; }
.client-stat.stat-orange strong, .client-stat.stat-orange span { color: #f59e0b; }
.client-stat.stat-red strong, .client-stat.stat-red span { color: #e11d2e; }
.client-stat.stat-green strong, .client-stat.stat-green span { color: #16803b; }

.client-filter-bar {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 8px 7px;
    background: #ffffff;
    border: 1px solid #e5eaf1;
}

.client-filter-main {
    display: flex;
    align-items: stretch;
    gap: 5px;
}

.client-filter-input {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    border: 1px solid #d7dee8;
    border-radius: 3px;
    color: #94a3b8;
}

.client-filter-input input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    padding: 10px;
    color: #334155;
}

.icon-button {
    width: 36px;
    height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid #d7dee8;
    border-radius: 3px;
    color: #64748b;
    cursor: pointer;
}

.icon-button:disabled { cursor: not-allowed; opacity: 0.45; }
.icon-button.disabled { cursor: not-allowed; opacity: 0.45; pointer-events: none; }
a.icon-button { text-decoration: none; }
.search-client-button { color: #ffffff; background: #2494e8; border-color: #2494e8; }
.clear-search { background: #f8fafc; }
.expand-filters-button { background: #f8fafc; }
.expand-filters-button i { transition: transform 0.2s ease; }
.expand-filters-button[aria-expanded="true"] i { transform: rotate(180deg); }

.client-advanced-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(150px, 1fr)) repeat(2, minmax(180px, 1fr));
    gap: 8px 10px;
    align-items: center;
}

.client-advanced-filters[hidden] {
    display: none;
}

.client-advanced-filters select,
.date-filter {
    height: 38px;
    border: 1px solid #d7dee8;
    border-radius: 3px;
    background: #ffffff;
    color: #334155;
    font-size: 0.72rem;
}

.client-advanced-filters select {
    padding: 0 10px;
}

.date-filter {
    display: flex;
    position: relative;
    overflow: hidden;
}

.date-filter input {
    min-width: 0;
    flex: 1;
    border: 0;
    outline: 0;
    padding: 0 10px;
    font-size: 0.72rem;
    color: transparent;
    background: transparent;
    cursor: pointer;
}

.date-filter input::-webkit-datetime-edit {
    color: transparent;
}

.date-filter.has-value input {
    color: #334155;
}

.date-filter.has-value input::-webkit-datetime-edit {
    color: #334155;
}

.date-filter input::-webkit-calendar-picker-indicator {
    position: absolute;
    inset: 0;
    width: auto;
    height: auto;
    opacity: 0;
    cursor: pointer;
}

.date-placeholder {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #a0a8b4;
    font-size: 0.72rem;
    pointer-events: none;
    z-index: 1;
}

.date-filter.has-value .date-placeholder {
    display: none;
}

.date-filter button {
    width: 38px;
    position: relative;
    z-index: 2;
    border: 0;
    border-left: 1px solid #cbd5e1;
    background: #edf1f5;
    color: #496782;
    cursor: pointer;
}

.client-table-panel {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0;
    overflow: hidden;
}

.client-table-toolbar {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 7px;
    border-bottom: 1px solid #e5eaf1;
}

.toolbar-actions { display: flex; gap: 8px; }

.bulk-actions {
    position: relative;
}

.bulk-actions-menu {
    width: 185px;
    position: fixed;
    z-index: 3000;
    background: #ffffff;
    border: 1px solid #d6dbe3;
    border-radius: 2px;
    box-shadow: 0 5px 14px rgba(15, 23, 42, 0.12);
}

.bulk-actions-menu[hidden] {
    display: none;
}

.bulk-actions-group {
    padding: 6px 0;
    border-bottom: 1px solid #e1e5eb;
}

.bulk-actions-group:last-child {
    border-bottom: 0;
}

.bulk-actions-menu button {
    width: 100%;
    min-height: 25px;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 24px;
    border: 0;
    background: #ffffff;
    color: #374151;
    font-size: 0.72rem;
    text-align: left;
    cursor: pointer;
}

.bulk-actions-menu button[hidden] { display: none; }

.bulk-actions-menu button:hover:not(:disabled) {
    background: #f3f6fa;
}

.bulk-actions-menu button:disabled {
    color: #aeb7c3;
    cursor: not-allowed;
}
.bulk-actions-menu .pre-export-action { min-height: 36px; display: flex; align-items: center; gap: 8px; padding: 0 12px; color: #475569; font-size: 0.72rem; text-decoration: none; }
.bulk-actions-menu .pre-export-action:hover { background: #edf7fe; color: #1785ca; }
.pre-registration-table { min-width: 760px; }
.pre-registration-table .pre-col-name { width: 23%; }
.pre-registration-table .pre-col-login { width: 29%; }
.pre-registration-table .pre-col-phone { width: 18%; }
.pre-registration-table .pre-col-date { width: 20%; }
.pre-registration-table .pre-col-actions { width: 90px; }
.client-table.pre-registration-table th,
.client-table.pre-registration-table td { padding-left: 12px; padding-right: 12px; }
.client-table.pre-registration-table th:first-child,
.client-table.pre-registration-table td:first-child { width: auto; text-align: left; }
.client-table.pre-registration-table .actions-column,
.client-table.pre-registration-table .pre-registration-actions { width: auto; text-align: center; }
.pre-registration-actions .ticket-row-actions { justify-content: center; }

.primary-action, .secondary-action {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 0 14px;
    border: 1px solid transparent;
    border-radius: 3px;
    font-size: 0.78rem;
    cursor: pointer;
}

.primary-action { color: #ffffff; background: #2494e8; }
.secondary-action { color: #334155; background: #f8fafc; border-color: #eef2f7; }

.page-size select {
    height: 36px;
    border: 1px solid #d7dee8;
    border-radius: 3px;
    background: #ffffff;
    color: #475569;
    padding: 0 30px 0 12px;
}

.client-table-scroll { width: 100%; overflow-x: auto; }

.client-table {
    width: 100%;
    min-width: 1040px;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 0.7rem;
    color: #334155;
}

.client-table th {
    height: 36px;
    color: #7b8492;
    font-weight: 500;
    text-align: left;
    border-bottom: 1px solid #edf1f5;
}

.client-table th i {
    margin-left: 3px;
    font-size: 0.55rem;
    color: #bac2ce;
}

.table-sort-button {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    cursor: pointer;
}

.table-sort-button:hover,
.table-sort-button:focus-visible {
    color: #2494e8;
}

.table-sort-button .fa-sort-up,
.table-sort-button .fa-sort-down {
    color: #2494e8;
}

.client-table td {
    height: 50px;
    padding: 7px 6px;
    border-bottom: 1px solid #edf1f5;
    vertical-align: middle;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.clients-page:not(.client-detail-page) .client-table td {
    height: 30px;
    padding-top: 2px;
    padding-bottom: 2px;
    line-height: 1.12;
}

.client-table tbody tr:hover { background: #f8fbff; }
#clientTable tbody tr:hover { background: #eef7ff; }
#clientTable tbody tr[data-client-url] { cursor: pointer; }
.client-table tbody tr.blocked-client { color: #91323b; background: #f9d8db; }
.client-table tbody tr.blocked-client:hover { background: #f5cdd1; }
.client-table .select-column, .client-table td:first-child { width: 30px; text-align: center; }
.client-table th:nth-child(2) { width: 76px; }
.client-table th:nth-child(3) { width: 180px; }
.client-table th:nth-child(4) { width: 140px; }
.client-table th:nth-child(5) { width: 90px; }
.client-table th:nth-child(6) { width: 94px; }
.client-table th:nth-child(7) { width: 110px; }
.client-table .actions-column { width: 215px; }
.customer-name { font-weight: 600; }
.customer-name a { color: inherit; text-decoration: none; }
.customer-name a:hover { color: inherit; text-decoration: none; }
#clientTable tbody tr:hover .customer-name a { color: #0f5f9f; }

.cep-field { position: relative; }
.cep-lookup-status {
    min-height: 14px;
    margin-top: 3px;
    color: #64748b;
    font-size: 0.62rem;
    line-height: 1.2;
}
.cep-lookup-status.loading { color: #2563eb; }
.cep-lookup-status.success { color: #16803c; }
.cep-lookup-status.error { color: #dc2626; }

#clientTable {
    min-width: 760px;
    table-layout: fixed;
}

#clientTable th:nth-child(2) { width: 58px; }
#clientTable th:nth-child(3) { width: auto; }
#clientTable th:nth-child(4) { width: 175px; }
#clientTable th:nth-child(5) { width: 58px; }
#clientTable th:nth-child(6) { width: 82px; }
#clientTable th:nth-child(7) { width: 112px; }
#clientTable .actions-column { width: 136px; }
#clientTable .actions-column,
#clientTable td:last-child {
    position: sticky;
    right: 0;
    z-index: 2;
    background: #ffffff;
    box-shadow: -5px 0 8px -8px rgba(15, 23, 42, 0.45);
}
#clientTable tbody tr:hover td:last-child { background: #eef7ff; }
#clientTable tbody tr.blocked-client td:last-child { background: #f9d8db; }
#clientTable tbody tr.blocked-client:hover td:last-child { background: #f5cdd1; }
#clientTable th,
#clientTable td {
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-wrap: normal;
}
#clientTable .customer-name {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    font-size: 0.67rem;
}
#clientTable .customer-name a { white-space: nowrap; }
#clientTable .client-id-cell,
#clientTable .client-due-cell {
    text-align: center;
    font-size: 0.65rem;
}
#clientTable .client-login-cell {
    max-width: 175px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    font-size: 0.66rem;
}
#clientTable .client-server-cell,
#clientTable .client-plan-cell {
    font-size: 0.64rem;
}
#clientTable .table-sort-button {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
#clientTable .row-actions a,
#clientTable .row-actions button {
    width: 22px;
    height: 22px;
    font-size: 0.6rem;
}

.row-actions a {
    width: 29px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #bad3ee;
    border-right: 0;
    background: #ffffff;
    color: #64748b;
    text-decoration: none;
}

.row-actions a:first-child { border-radius: 2px 0 0 2px; }

/* Detalhes do cliente */
.client-detail-content {
    min-height: calc(100vh - 60px);
    display: grid;
    grid-template-columns: 285px minmax(0, 1fr);
    background: #edf2f7;
}
.client-detail-save-message {
    position: fixed;
    z-index: 70;
    top: 70px;
    right: 18px;
    max-width: 420px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15);
}

.client-profile-panel {
    min-height: calc(100vh - 60px);
    padding: 10px 14px 20px;
    background: #ffffff;
    border-right: 1px solid #e2e8f0;
}

.client-profile-header {
    min-height: 42px;
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) 12px;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #edf1f5;
}

.client-profile-header strong {
    overflow: hidden;
    color: #253247;
    font-size: 0.78rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.client-back-button {
    width: 28px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    color: #64748b;
    text-decoration: none;
}

.client-back-button:hover { color: #2494e8; border-color: #2494e8; }

.client-online-indicator {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #94a3b8;
}
.client-online-indicator.online { background: #45b95f; box-shadow: 0 0 0 2px rgba(69, 185, 95, 0.14); }
.client-online-indicator.offline { background: #ef4444; box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.13); }
.client-online-indicator.checking { background: #f59e0b; }

.client-profile-section { padding: 12px 8px 0; }
.client-profile-section h2 {
    margin: 0 0 7px;
    color: #111827;
    font-size: 0.94rem;
    font-weight: 600;
}
.client-profile-section p {
    margin: 3px 0;
    color: #111827;
    font-size: 0.73rem;
    line-height: 1.5;
}
.client-profile-section p span { color: #475569; }
.detail-status {
    padding: 1px 4px;
    color: #ffffff;
    background: #ef4444;
    font-size: 0.65rem;
    text-transform: uppercase;
}
.detail-status.active { background: #45b95f; }

.client-profile-actions {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 18px 0 8px;
    padding: 0 2px;
}
.client-profile-actions button {
    width: 29px;
    height: 29px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e3e8ef;
    border-radius: 2px;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}
.client-profile-actions button:nth-child(1),
.client-profile-actions button:nth-child(7) { color: #ef5350; }
.client-profile-actions button:nth-child(3) { color: #3977a8; }
.client-profile-actions button:nth-child(5),
.client-profile-actions button:nth-child(6) { color: #27b55f; }
.client-profile-actions button:hover { background: #f7fafc; border-color: #b9c7d8; }
.client-network-panel { margin-top: 8px; border-top: 1px solid #edf1f5; }
.client-network-toggle {
    width: 100%;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px;
    border: 0;
    border-bottom: 1px solid #dfe6ee;
    background: transparent;
    color: #111827;
    font-size: 0.78rem;
    cursor: pointer;
}
.client-network-content[hidden] { display: none; }
.client-network-card {
    margin-top: 14px;
    padding: 9px 8px 8px;
    border: 1px solid #e0e6ed;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 2px 7px rgba(15, 23, 42, 0.11);
}
.client-network-metrics {
    min-height: 24px;
    display: grid;
    grid-template-columns: auto 1fr 1fr 22px;
    align-items: center;
    gap: 5px;
    color: #64748b;
    font-size: 0.58rem;
}
.client-network-card[data-auth-type="dhcp"] .client-network-metrics {
    grid-template-columns: minmax(0, 1fr) auto auto;
}
.client-network-metrics strong { font-weight: 500; white-space: nowrap; }
.client-network-metrics .network-type,
.client-network-metrics .network-download,
.client-network-metrics .network-upload { white-space: nowrap; }
.network-download i { color: #ef5350; }
.network-upload i { color: #3b82f6; }
.network-disconnect {
    width: 22px;
    height: 22px;
    border: 0;
    background: transparent;
    color: #64748b;
    cursor: pointer;
}
.network-disconnect { color: #ef5350; }
.network-disconnect:disabled { color: #cbd5e1; cursor: wait; }
.network-disconnect.working i { animation: client-disconnect-spin 0.9s linear infinite; }
@keyframes client-disconnect-spin {
    to { transform: rotate(360deg); }
}
.client-network-credentials {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}
.client-network-credential {
    width: 100%;
    min-height: 29px;
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr) 14px;
    align-items: center;
    gap: 3px;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
    color: #334155;
    font-size: 0.62rem;
    text-align: left;
    cursor: pointer;
}
.client-network-credential:hover { color: #1685e5; }
.client-network-credential.copied { color: #168449; }
.client-network-credential span, .client-network-details dd {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.client-network-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    margin: 2px 0 8px;
}
.client-network-details div {
    min-width: 0;
    display: grid;
    grid-template-columns: 16px minmax(0, 1fr);
    align-items: center;
    color: #475569;
    font-size: 0.58rem;
}
.client-network-details dt, .client-network-details dd { margin: 0; }
.client-network-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 0.61rem;
}
.network-session-time {
    padding: 2px 7px;
    border-radius: 12px;
    background: #b8f0ce;
    color: #168449;
}
.network-ip { color: #1685e5; font-weight: 600; }
.client-network-card.offline .network-session-time {
    background: #fee2e2;
    color: #dc2626;
}
.client-network-card.offline .network-ip { color: #94a3b8; }

.client-detail-workspace {
    min-width: 0;
    max-width: 100%;
    overflow-x: hidden;
}
.client-detail-tabs {
    min-height: 52px;
    display: grid;
    grid-template-columns: repeat(9, minmax(0, 1fr));
    align-items: stretch;
    background: #2494e8;
    border-left: 8px solid #ffffff;
}
.client-detail-tabs button {
    min-height: 52px;
    min-width: 0;
    padding: 7px 2px;
    border: 0;
    background: transparent;
    color: #ffffff;
    font: inherit;
    font-size: 0.59rem;
    line-height: 1.25;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
    cursor: pointer;
}
.client-detail-tabs button.active {
    background: #ffffff;
    color: #1f2937;
}
.client-tab-panel {
    display: none;
    min-width: 0;
    max-width: 100%;
    padding: 8px;
    overflow-x: hidden;
}
.client-tab-panel.active { display: block; }

.invoice-toolbar {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    background: #fff;
}
.invoice-actions { position: relative; }
.invoice-actions-menu {
    position: absolute;
    z-index: 20;
    top: calc(100% + 4px);
    left: 0;
    width: 145px;
    border: 1px solid #dbe2ea;
    background: #fff;
    box-shadow: 0 5px 12px rgba(15, 23, 42, 0.14);
}
.invoice-actions-menu[hidden] { display: none; }
.invoice-actions-menu button {
    width: 100%;
    min-height: 36px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 12px;
    border: 0;
    border-bottom: 1px solid #edf1f5;
    background: #fff;
    color: #475569;
    font-size: 0.72rem;
    cursor: pointer;
}
.invoice-actions-menu button:last-child { border-bottom: 0; }
.invoice-actions-menu button.danger { color: #ef5350; }
.invoice-actions-menu button:disabled { color: #b6c0cc; cursor: not-allowed; }
.invoice-page-size {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    color: #64748b;
    font-size: 0.7rem;
}
.invoice-page-size select { height: 32px; border: 1px solid #dbe2ea; background: #fff; color: #475569; }
.invoice-table-wrap { max-width: 100%; overflow-x: hidden; background: #fff; }
.invoice-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; font-size: 0.7rem; }
.invoice-table th {
    height: 32px;
    padding: 0 10px;
    border-bottom: 1px solid #dbe2ea;
    background: #f3f5f8;
    color: #64748b;
    font-weight: 500;
    text-align: left;
}
.invoice-table th i { color: #b0bac5; font-size: 0.56rem; }
.invoice-table td {
    height: 38px;
    padding: 4px 10px;
    border-bottom: 1px solid #edf1f5;
    color: #334155;
    overflow-wrap: anywhere;
}
.invoice-table th:first-child, .invoice-table td:first-child { width: 24px; padding-left: 8px; padding-right: 2px; }
.invoice-status { padding: 2px 5px; border-radius: 2px; color: #fff; font-size: 0.61rem; font-weight: 600; }
.invoice-status.overdue { background: #e65359; }
.invoice-status.completed { background: #48ad58; }
.invoice-status.aguardando { background: #f2b233; color: #513b00; }
.invoice-row-actions { white-space: nowrap; }
.invoice-row-actions button {
    width: 27px;
    height: 27px;
    border: 0;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
}
.invoice-row-actions button:last-child { color: #ef5350; }
.invoice-table-footer {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 16px;
    color: #64748b;
    font-size: 0.68rem;
}

/* Faturamento dentro dos detalhes do cliente */
.client-detail-page [data-client-panel="cobrancas"] {
    overflow: visible;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-toolbar {
    position: relative;
    z-index: 12;
    overflow: visible;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-actions {
    position: relative;
    z-index: 30;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-actions-menu {
    z-index: 80;
    width: 210px;
    overflow: hidden;
    border-radius: 3px;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-actions-menu button {
    white-space: nowrap;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table-wrap {
    overflow-x: hidden;
    overflow-y: visible;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table {
    width: 100%;
    min-width: 0;
    font-size: 0.66rem;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th {
    height: 28px;
    padding: 0 6px;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th,
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead .table-sort-button {
    white-space: nowrap;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > tbody > tr:not(.invoice-detail-row) > td {
    height: 30px;
    padding: 2px 6px;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > tbody > tr:not(.invoice-detail-row) > td:last-child {
    overflow: visible;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th {
    padding-right: 6px;
    padding-left: 6px;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(1) { width: 30px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(2) { width: 118px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(3) { width: 72px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(4) { width: 88px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(5) { width: 118px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(6) { width: 90px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(7) { width: 132px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table > thead > tr > th:nth-child(8) { width: 145px; }
.client-detail-page [data-client-panel="cobrancas"] .invoice-table tr.charge-status-row-awaiting > td {
    background: #fff8e6;
    color: #9a6700;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table tr.charge-status-row-awaiting:hover > td {
    background: #fff1c2;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table .charge-status.awaiting {
    background: #f2b233 !important;
    color: #513b00 !important;
}
.client-detail-page [data-client-panel="cobrancas"] .invoice-table .charge-status,
.client-detail-page [data-client-panel="cobrancas"] .invoice-table .charge-integration {
    min-height: 16px;
    padding: 1px 4px;
    font-size: 0.52rem;
}
.client-detail-page [data-client-panel="cobrancas"] .charge-row-actions {
    gap: 2px;
}
.client-detail-page [data-client-panel="cobrancas"] .charge-row-actions button {
    flex-basis: 20px;
    width: 20px;
    height: 20px;
}
.invoice-pagination { display: flex; align-items: center; gap: 8px; }
.invoice-pagination button {
    width: 28px;
    height: 28px;
    border: 1px solid #dbe2ea;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}
.invoice-pagination button:disabled { color: #cbd5e1; cursor: not-allowed; }

.billing-stats {
    display: grid;
    grid-template-columns: 1.8fr repeat(4, minmax(120px, 1fr));
    gap: 9px;
}
.billing-stat {
    min-height: 60px;
    display: grid;
    grid-template-columns: auto 1fr;
    align-content: center;
    column-gap: 10px;
    padding: 7px 10px;
    background: #ffffff;
    border: 1px solid #dbe2ea;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.18);
}
.billing-stat.active { border-color: #475569; }
.billing-stat strong { grid-row: span 2; font-size: 1.25rem; font-weight: 500; }
.billing-stat span { align-self: end; font-size: 0.61rem; font-weight: 700; text-transform: uppercase; }
.billing-stat small { font-size: 0.66rem; }
.billing-stat.stat-red strong, .billing-stat.stat-red span { color: #e11d48; }
.billing-stat.stat-green strong, .billing-stat.stat-green span { color: #15803d; }
.billing-stat.stat-blue strong, .billing-stat.stat-blue span { color: #2563eb; }
.billing-stat.stat-orange strong, .billing-stat.stat-orange span { color: #f59e0b; }

.client-charge-stats { grid-template-columns: repeat(6, minmax(100px, 1fr)); }
.client-charge-stats .billing-stat { width: 100%; text-align: left; font-family: inherit; }
.client-charges-panel { margin-top: 10px; }
.detail-charge-toolbar { gap: 12px; }
.detail-charge-controls { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; }
.detail-charge-controls .client-filter-input { width: min(310px, 32vw); }
.detail-charge-controls .client-filter-input input { width: 100%; }
.client-charge-table-scroll { overflow-x: hidden; }
.client-charge-table { width: 100%; min-width: 0; table-layout: fixed; }
.client-charge-table th:nth-child(1) { width: 30px; }
.client-charge-table th:nth-child(2) { width: 92px; }
.client-charge-table th:nth-child(3) { width: 68px; }
.client-charge-table th:nth-child(4) { width: 88px; }
.client-charge-table th:nth-child(5), .client-charge-table th:nth-child(6) { width: 78px; }
.client-charge-table th:nth-child(7) { width: 90px; }
.client-charge-table th:nth-child(8) { width: 110px; }
.client-charge-table th:nth-child(9) { width: 150px; }
.client-charge-table th, .client-charge-table td { padding: 5px 6px; }
.client-charge-table th,
.client-charge-table td,
.client-charge-table .table-sort-button {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.client-charge-table th:last-child,
.client-charge-table td:last-child {
    overflow: visible;
}
.client-charge-table .charge-row-actions { width: 100%; }
.detail-client-charge-info > td { height: auto !important; padding: 0 !important; background: #eef3f7; }
.detail-client-charge-info .charge-detail { grid-template-columns: minmax(220px, 34%) minmax(0, 1fr); }

@media (max-width: 1100px) {
    .client-charge-stats { grid-template-columns: repeat(3, minmax(120px, 1fr)); }
    .detail-charge-toolbar { align-items: stretch; flex-direction: column; }
    .detail-charge-controls { justify-content: flex-start; }
    .detail-charge-controls .client-filter-input { width: min(420px, 100%); }
}

.client-detail-toolbar {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    padding: 8px;
    background: #ffffff;
}
.detail-empty-table { background: #ffffff; }
.detail-table-head {
    min-height: 36px;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    align-items: center;
    padding: 0 18px;
    border-bottom: 1px solid #dbe2ea;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.7rem;
}
.detail-empty-table > p { min-height: 50px; margin: 0; padding: 12px 18px; font-size: 0.72rem; }
.detail-empty-table footer { padding: 14px 18px; border-top: 1px solid #dbe2ea; color: #64748b; font-size: 0.68rem; }
.client-tab-empty {
    min-height: 260px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #ffffff;
    color: #94a3b8;
}
.client-tab-empty i { font-size: 2rem; }
.client-tab-empty p { margin: 0; font-size: 0.82rem; }
.client-map { width: 100%; min-height: 520px; border: 0; background: #ffffff; }
.client-map-coordinates { margin: 0; padding: 9px 12px; background: #ffffff; color: #64748b; font-size: 0.72rem; }
.client-detail-error { margin: 20px; padding: 20px; background: #ffffff; }
.client-detail-error h1 { margin-top: 0; font-size: 1.1rem; }

@media (max-width: 1050px) {
    .client-detail-content { grid-template-columns: 240px minmax(0, 1fr); }
    .billing-stats { grid-template-columns: repeat(3, minmax(130px, 1fr)); }
    .client-detail-tabs { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .client-detail-tabs button { font-size: 0.54rem; padding-inline: 1px; }
}

@media (max-width: 768px) {
    .client-detail-content { display: block; }
    .client-profile-panel { min-height: 0; border-right: 0; border-bottom: 1px solid #e2e8f0; }
    .billing-stats { grid-template-columns: repeat(2, minmax(130px, 1fr)); }
    .client-detail-tabs { grid-template-columns: repeat(9, minmax(0, 1fr)); }
    .client-detail-tabs button { font-size: 0.48rem; }
}

.row-actions {
    display: flex;
    align-items: center;
    gap: 0;
    white-space: nowrap;
}

.row-actions button {
    width: 29px;
    height: 27px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid #bad3ee;
    border-right: 0;
    color: #64748b;
    cursor: pointer;
}

.row-actions button:first-child { border-radius: 2px 0 0 2px; }
.row-actions button:last-child { border-right: 1px solid #bad3ee; border-radius: 0 2px 2px 0; }
.row-actions .action-edit { color: #38a169; }
.row-actions .action-whatsapp { color: #18b967; }
.row-actions .action-block, .row-actions .action-delete { color: #ef5350; }
.row-actions .action-status-activate { color: #28a745; }
.row-actions button:disabled,
.client-profile-actions button:disabled { opacity: 0.45; cursor: wait; }
.client-profile-actions .detail-status-action.activate { color: #28a745; }

.client-table-footer {
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 10px;
    color: #64748b;
    font-size: 0.72rem;
    border-top: 1px solid #edf1f5;
}

.table-pagination { display: flex; align-items: center; gap: 8px; }

@media (max-width: 1100px) {
    .client-stats { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
    .client-advanced-filters { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
}

@media (max-width: 768px) {
    .clients-content { padding: 0; }
    .client-stats { grid-template-columns: repeat(2, minmax(125px, 1fr)); }
    .client-table-toolbar, .client-table-footer { align-items: flex-start; flex-direction: column; }
    .client-advanced-filters { grid-template-columns: 1fr; }
}

/* Servidores */
.server-stats {
    display: grid;
    grid-template-columns: minmax(220px, 320px);
    gap: 9px;
}

.server-list-count {
    color: #64748b;
    font-size: 0.72rem;
}

.server-table {
    min-width: 855px;
}

.server-table th:nth-child(1) { width: 55px; }
.server-table th:nth-child(2) { width: 150px; }
.server-table th:nth-child(3) { width: 155px; }
.server-table th:nth-child(4) { width: 105px; }
.server-table th:nth-child(5) { width: 75px; }
.server-table th:nth-child(6) { width: 135px; }
.server-table th:nth-child(7) { width: 115px; }
.server-table th:nth-child(8) { width: 100px; }
.server-table td:first-child { width: 55px; text-align: left; }
.server-table th:first-child,
.server-table td:first-child { padding-left: 18px; }
.server-table .server-actions-column { width: 120px; }
.server-name { font-weight: 600; }

.server-status {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 6px;
    border-radius: 3px;
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
}

.server-status::before {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    content: "";
}

.server-status.online { color: #15803d; background: #dcfce7; }
.server-status.offline { color: #dc2626; background: #fee2e2; }
.server-status.maintenance { color: #b45309; background: #fef3c7; }
.server-status.checking { color: #64748b; background: #eef2f7; }

.server-cpu,
.server-clients {
    text-align: center;
}

.server-row-actions {
    display: flex;
    align-items: center;
    gap: 0;
}

.server-row-actions button {
    width: 31px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #bad3ee;
    border-right: 0;
    background: #ffffff;
    color: #64748b;
    cursor: pointer;
}

.server-row-actions button:first-child { border-radius: 2px 0 0 2px; color: #2494e8; }
.server-row-actions button:nth-child(2) { color: #38a169; }
.server-row-actions button:last-child { border-right: 1px solid #bad3ee; border-radius: 0 2px 2px 0; }
.server-row-actions button:hover { background: #f1f7fd; }

.server-options-menu {
    width: 175px;
    position: fixed;
    z-index: 170;
    padding: 5px 0;
    border: 1px solid #d6dbe3;
    border-radius: 3px;
    background: #ffffff;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.18);
}

.server-options-menu[hidden] { display: none; }

.server-options-menu button {
    width: 100%;
    min-height: 34px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 5px 13px;
    border: 0;
    background: #ffffff;
    color: #334155;
    font-size: 0.72rem;
    text-align: left;
    cursor: pointer;
}

.server-options-menu button:hover { background: #f3f6fa; }
.server-options-menu button.danger { color: #dc2626; }

.server-save-message {
    padding: 10px 12px;
    border: 1px solid #bbf7d0;
    background: #f0fdf4;
    color: #166534;
    font-size: 0.75rem;
}
.server-save-message.erro {
    border-color: #fecaca;
    background: #fff1f2;
    color: #b91c1c;
}

@media (max-width: 768px) {
    .server-stats { grid-template-columns: repeat(2, minmax(125px, 1fr)); }
}

.server-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(15, 23, 42, 0.58);
}

.server-modal-backdrop[hidden] { display: none; }

#chargeEditModal { z-index: 10060; }
#chargeMessageModal { z-index: 10070; }
#chargeProcessingModal { z-index: 10075; }
#chargeConfirmModal { z-index: 10080; }
#newInvoiceModal { z-index: 10060; }
#installmentEditModal { z-index: 10060; }
#chargeResultModal { z-index: 10070; }
#invoiceConfirmModal { z-index: 10080; }
#nfcomPreviewWizardModal { z-index: 10060; }
#nfcomDetailsModal { z-index: 10065; }
#nfcomValidationModal { z-index: 10085; }
#nfcomMessageModal { z-index: 10090; }
#nfcomConfirmModal { z-index: 10100; }
#certificateExpiryModal { z-index: 10110; }

.server-modal {
    width: min(500px, 100%);
    background: #ffffff;
    border-radius: 3px;
    box-shadow: 0 15px 40px rgba(15, 23, 42, 0.28);
}

.server-modal-header {
    min-height: 60px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    border-bottom: 1px solid #dbe2ea;
}

.server-modal-header h2 {
    margin: 0;
    color: #2f3033;
    font-size: 1.1rem;
    font-weight: 600;
}

.server-modal-close {
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    color: #7b8492;
    cursor: pointer;
}

.server-modal-body {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 16px 16px 32px;
}

.server-form-field {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.server-form-field > span:first-child {
    color: #3f3f46;
    font-size: 0.72rem;
    text-align: right;
}

.server-form-field input {
    min-width: 0;
    height: 34px;
    padding: 0 12px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    outline: 0;
    color: #334155;
}

.server-form-field select {
    min-width: 0;
    height: 36px;
    padding: 0 12px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    outline: 0;
    background: #ffffff;
    color: #334155;
}

.server-form-field select:focus { border-color: #2494e8; box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12); }

.server-form-field input:focus { border-color: #2494e8; box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12); }
.server-form-field-short input { max-width: 110px; }

.server-password-input {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 103px;
}

.server-password-input input { border-radius: 4px 0 0 4px; }
.server-password-input button {
    border: 1px solid #cbd5e1;
    border-left: 0;
    border-radius: 0 4px 4px 0;
    background: #edf1f5;
    color: #475569;
    font-size: 0.68rem;
    cursor: pointer;
}

.server-modal-footer {
    min-height: 68px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid #dbe2ea;
}

@media (max-width: 520px) {
    .server-form-field { grid-template-columns: 1fr; gap: 5px; }
    .server-form-field > span:first-child { text-align: left; }
}

/* Pools */
.pool-table-panel { margin-top: 0; }
.pool-table { min-width: 650px; }
.pool-table th:first-child,
.pool-table td:first-child {
    width: 70px;
    padding-left: 14px;
    text-align: left;
}
.pool-table th:nth-child(1) { width: 70px; }
.pool-table th:nth-child(2) { width: 230px; }
.pool-table th:nth-child(3) { width: 320px; }
.pool-table .pool-actions-column { width: 130px; }
.pool-name { font-weight: 500; }

.pool-row-actions {
    display: flex;
    align-items: center;
    gap: 0;
}

.pool-row-actions button {
    width: 31px;
    height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #e2e8f0;
    border-right: 0;
    background: #ffffff;
    cursor: pointer;
}

.pool-row-actions .edit-pool { color: #256782; border-radius: 2px 0 0 2px; }
.pool-row-actions .delete-pool { color: #ef5350; border-right: 1px solid #e2e8f0; border-radius: 0 2px 2px 0; }
.pool-row-actions button:hover { background: #f3f6fa; }
.pool-modal { width: min(500px, 100%); }

/* Planos */
.plan-table { min-width: 1000px; }
.plan-table th:first-child,
.plan-table td:first-child { width: 75px; padding-left: 12px; text-align: left; }
.plan-table th:nth-child(2) { width: 260px; }
.plan-table th:nth-child(3) { width: 125px; }
.plan-table th:nth-child(4) { width: 110px; }
.plan-table th:nth-child(5) { width: 300px; }
.plan-table .plan-actions-column { width: 120px; }
.plan-name { font-weight: 500; }

.plan-modal {
    width: min(940px, 100%);
    max-height: calc(100vh - 24px);
    overflow: hidden;
}
.plan-modal form { display: flex; max-height: calc(100vh - 84px); flex-direction: column; }
.plan-modal-body {
    overflow-y: auto;
    padding: 18px;
}
.plan-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.plan-form-grid label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    color: #334155;
    font-size: 0.72rem;
}
.plan-form-grid input,
.plan-form-grid select,
.plan-speed-sections input {
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    background: #ffffff;
    color: #334155;
}
.plan-servers-field select { min-height: 112px; padding: 6px; }
.plan-speed-sections {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin: 18px 0;
}
.plan-speed-sections fieldset {
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 12px;
    border: 1px solid #dbe2ea;
}
.plan-speed-sections legend {
    padding: 0 5px;
    color: #334155;
    font-size: 0.7rem;
    font-weight: 600;
}
.plan-speed-sections label {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
    color: #64748b;
    font-size: 0.66rem;
}
.plan-nfcom-section {
    min-width: 0;
    margin-top: 18px;
    padding: 12px;
    border: 1px solid #dbe2ea;
    border-radius: 3px;
    background: transparent;
}
.plan-nfcom-section legend {
    padding: 0 5px;
    color: #334155;
    font-size: 0.7rem;
    font-weight: 600;
}
.plan-nfcom-section .plan-form-grid {
    gap: 12px;
}
.plan-nfcom-wide-field {
    grid-column: 1 / -1;
}

@media (max-width: 850px) {
    .plan-form-grid, .plan-speed-sections { grid-template-columns: 1fr; }
}

/* Grupos de clientes */
.group-table {
    min-width: 650px;
    table-layout: fixed;
}
.group-table th:first-child,
.group-table td:first-child { padding-left: 12px; text-align: left; }
.group-table th:first-child { width: auto; }
.group-table .group-nfcom-column,
.group-table .group-nfcom-cell {
    width: 130px;
    text-align: center;
}
.group-table .group-actions-column,
.group-table .group-actions-cell {
    width: 120px;
    text-align: center;
}
.group-table .pool-row-actions {
    justify-content: center;
}
.group-name { font-weight: 500; }
.group-modal { width: min(450px, 100%); }

/* Chamados */
.ticket-stats {
    grid-template-columns: repeat(6, minmax(145px, 1fr));
}
.ticket-stats .client-stat span {
    font-size: 0.57rem;
}
.ticket-advanced-filters {
    grid-template-columns: repeat(6, minmax(145px, 1fr));
}
.ticket-advanced-filters input[type="search"] {
    min-width: 0;
    height: 34px;
    padding: 0 11px;
    border: 1px solid #d4dae3;
    border-radius: 3px;
    background: #fff;
    color: #475569;
    font-size: 0.68rem;
    outline: 0;
}
.ticket-advanced-filters input[type="search"]:focus {
    border-color: #2494e8;
}
.ticket-table {
    min-width: 0;
    table-layout: fixed;
}
.ticket-table th { height: 32px; }
.ticket-table td {
    height: 38px;
    padding: 4px 5px;
    line-height: 1.25;
}
.ticket-table .select-column,
.ticket-table td:first-child { width: 27px; }
.ticket-table th:nth-child(2) { width: 7%; }
.ticket-table th:nth-child(3) { width: 16%; }
.ticket-table th:nth-child(4) { width: 18%; }
.ticket-table th:nth-child(5),
.ticket-table th:nth-child(6) { width: 10%; }
.ticket-table th:nth-child(7) { width: 12%; }
.ticket-table th:nth-child(8) { width: 7%; }
.ticket-table th:nth-child(9) { width: 5%; text-align: center; }
.ticket-table .actions-column { width: 85px; }
.ticket-table td:nth-child(9) { text-align: center; }
.ticket-subject { font-weight: 500; }
.ticket-status {
    width: 12px;
    height: 12px;
    display: inline-block;
    border-radius: 50%;
    background: #50bd69;
}
.ticket-status.finalizado { background: #94a3b8; }
.ticket-status.aguardando_cliente { background: #f59e0b; }
.ticket-status.aguardando_resposta { background: #ef5350; }
.ticket-status.novo { background: #2494e8; }
.ticket-row-actions {
    display: inline-flex;
    align-items: center;
}
.ticket-row-actions button {
    width: 26px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #fff;
    color: #64748b;
    cursor: pointer;
}
.ticket-row-actions button:hover { background: #f1f5f9; }
.ticket-row-actions button:nth-child(2) { color: #256782; }
.ticket-row-actions button.danger { color: #ef5350; }
.ticket-row-actions button:disabled,
.ticket-row-actions button:disabled:hover {
    color: #c4ccd6 !important;
    background: #f3f6f9;
    cursor: not-allowed;
    opacity: 0.48;
}
.ticket-actions-menu { width: 150px; }
.ticket-modal { width: min(570px, 100%); max-height: calc(100vh - 24px); overflow: hidden; }
.ticket-modal form { display: flex; max-height: calc(100vh - 84px); flex-direction: column; }
.ticket-modal-body { padding-top: 16px; overflow-y: auto; }
.ticket-modal-body .server-form-field { grid-template-columns: 95px minmax(0, 1fr); }
.ticket-priority-field select { max-width: 135px; }
.ticket-message-field { align-items: start; }
.ticket-message-field > span:first-child { padding-top: 9px; }
.ticket-message-field textarea {
    min-width: 0;
    min-height: 110px;
    padding: 9px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    color: #334155;
    font: inherit;
    resize: vertical;
    outline: 0;
}
.ticket-message-field textarea:focus { border-color: #2494e8; box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12); }
.ticket-client-combobox { min-width: 0; position: relative; }
.ticket-client-combobox > input[type="search"] {
    width: 100%;
    height: 36px;
    padding: 0 11px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    color: #334155;
    outline: 0;
}
.ticket-client-combobox > input[type="search"]:focus { border-color: #2494e8; box-shadow: 0 0 0 2px rgba(36, 148, 232, 0.12); }
.ticket-client-suggestions {
    position: absolute;
    z-index: 20;
    top: calc(100% + 3px);
    right: 0;
    left: 0;
    max-height: 235px;
    overflow-y: auto;
    border: 1px solid #cbd5e1;
    border-radius: 3px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.16);
}
.ticket-client-suggestions[hidden] { display: none; }
.ticket-subcategory-fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: -3px 0 2px;
    padding: 12px;
    border: 1px solid #dbe7f3;
    background: #f7fbff;
}
.ticket-subcategory-fields[hidden] { display: none; }
.ticket-subcategory-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    border: 1px solid #dbe7f3;
    background: #dbe7f3;
}
.ticket-subcategory-summary[hidden] { display: none; }
.ticket-subcategory-summary div { min-width: 0; padding: 8px; background: #fff; }
.ticket-subcategory-summary span,
.ticket-subcategory-summary strong { display: block; }
.ticket-subcategory-summary span { margin-bottom: 4px; color: #64748b; font-size: 0.58rem; }
.ticket-subcategory-summary strong { color: #334155; font-size: 0.67rem; white-space: nowrap; }
.ticket-subcategory-summary strong.yes { color: #168449; }
.ticket-subcategory-quantity select { max-width: 90px; }
.ticket-subcategory-installments select { max-width: 90px; }
.ticket-subcategory-custom-value .ticket-subcategory-value { max-width: 170px; }
@media (max-width: 520px) {
    .ticket-subcategory-summary { grid-template-columns: 1fr; }
}
.ticket-client-suggestions button {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding: 8px 10px;
    border: 0;
    border-bottom: 1px solid #edf1f5;
    background: #fff;
    color: #334155;
    text-align: left;
    cursor: pointer;
}
.ticket-client-suggestions button:hover { background: #eef6ff; }
.ticket-client-suggestions button strong { font-size: 0.7rem; font-weight: 600; }
.ticket-client-suggestions button span, .ticket-client-no-result { color: #64748b; font-size: 0.63rem; }
.ticket-client-no-result { padding: 10px; }
.client-ticket-panel { margin-top: 0; }
.client-ticket-panel .client-table-scroll {
    max-width: 100%;
    overflow-x: hidden;
}
.client-detail-ticket-table {
    min-width: 0;
    table-layout: fixed;
}
.client-detail-ticket-table th,
.client-detail-ticket-table td {
    height: 36px;
    padding: 4px 6px;
    line-height: 1.2;
    overflow-wrap: anywhere;
}
.client-detail-ticket-table th:nth-child(1) { width: 28px; }
.client-detail-ticket-table th:nth-child(2) { width: 44px; }
.client-detail-ticket-table th:nth-child(3) { width: 16%; }
.client-detail-ticket-table th:nth-child(4),
.client-detail-ticket-table th:nth-child(5) { width: 12%; }
.client-detail-ticket-table th:nth-child(6) { width: 14%; }
.client-detail-ticket-table th:nth-child(7) { width: 10%; }
.client-detail-ticket-table th:nth-child(8) { width: 11%; }
.client-detail-ticket-table th:nth-child(9) { width: 90px; }
.client-services-panel { margin-top: 0; }
.client-services-panel .client-table-scroll { overflow-x: hidden; }
.client-services-table { min-width: 0; table-layout: fixed; }
.client-services-table th,
.client-services-table td { height: 38px; padding: 4px 6px; line-height: 1.2; }
.client-services-table th:nth-child(1) { width: 30px; }
.client-services-table th:nth-child(2) { width: 48px; }
.client-services-table th:nth-child(3) { width: 24%; }
.client-services-table th:nth-child(4),
.client-services-table th:nth-child(5) { width: 10%; }
.client-services-table th:nth-child(6) { width: 8%; }
.client-services-table th:nth-child(7) { width: 12%; }
.client-services-table th:nth-child(8) { width: 14%; }
.client-services-table th:nth-child(9) { width: 11%; }
.service-description strong,
.service-description small { display: block; }
.service-description small { margin-top: 3px; color: #64748b; font-size: 0.57rem; }
.service-boolean { color: #94a3b8; }
.service-boolean.yes { color: #168449; font-weight: 600; }
.service-status { display: inline-block; padding: 2px 6px; border-radius: 2px; color: #fff; font-size: 0.57rem; text-transform: uppercase; }
.service-status.ativo { background: #43b75d; }
.service-status.inativo { background: #f59e0b; }
.service-status.cancelado { background: #ef5350; }
.service-status.concluido { background: #1685e5; }
.table-pagination button.icon-button:disabled {
    cursor: default;
    opacity: 0.45;
}
@media (max-width: 1180px) {
    .ticket-stats { grid-template-columns: repeat(3, minmax(145px, 1fr)); }
    .ticket-advanced-filters { grid-template-columns: repeat(3, minmax(145px, 1fr)); }
}
@media (max-width: 650px) {
    .ticket-stats { grid-template-columns: repeat(2, minmax(125px, 1fr)); }
    .ticket-advanced-filters { grid-template-columns: 1fr; }
}

/* Mapa de clientes */
.client-map-content {
    height: calc(100vh - 60px);
    min-height: 560px;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: 9px;
    padding: 9px;
    overflow: hidden;
}
.map-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(130px, 1fr));
    gap: 9px;
}
.map-summary > div {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 12px;
    border: 1px solid #dce3ec;
    background: #fff;
    box-shadow: 0 2px 4px rgba(15, 23, 42, 0.12);
}
.map-summary strong { color: #1685e5; font-size: 1.28rem; font-weight: 500; }
.map-summary span { color: #334155; font-size: 0.63rem; font-weight: 700; text-transform: uppercase; }
.map-workspace {
    min-height: 0;
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    border: 1px solid #dce3ec;
    background: #fff;
}
.map-control-panel {
    min-height: 0;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #dce3ec;
    background: #fff;
    overflow: hidden;
}
.map-control-panel header {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 10px;
    border-bottom: 1px solid #e5eaf0;
}
.map-control-panel header div { display: grid; gap: 2px; min-width: 0; }
.map-control-panel header span { color: #172033; font-size: 0.79rem; font-weight: 600; }
.map-control-panel header small { color: #64748b; font-size: 0.58rem; }
.map-control-panel header button {
    width: 30px; height: 30px; border: 1px solid #dce3ec; background: #fff; color: #1685e5; cursor: pointer;
}
.map-filters { display: grid; gap: 6px; padding: 9px; border-bottom: 1px solid #e5eaf0; }
.map-filters label { height: 34px; display: flex; align-items: center; gap: 7px; padding: 0 9px; border: 1px solid #dce3ec; color: #94a3b8; }
.map-filters input { min-width: 0; flex: 1; border: 0; outline: 0; font: inherit; font-size: 0.67rem; }
.map-filters select { width: 100%; height: 34px; padding: 0 7px; border: 1px solid #dce3ec; background: #fff; color: #334155; font: inherit; font-size: 0.67rem; }
.map-legend { padding: 9px; border-bottom: 1px solid #e5eaf0; }
.map-legend h3, .map-region-list h3 { margin: 0 0 7px; color: #64748b; font-size: 0.61rem; font-weight: 700; text-transform: uppercase; }
.map-legend { display: flex; flex-wrap: wrap; gap: 5px; }
.map-legend h3 { width: 100%; }
.map-legend button {
    min-width: 0; display: flex; align-items: center; gap: 5px; padding: 4px 6px; border: 1px solid #e5eaf0; background: #f8fafc; color: #475569; font-size: 0.58rem; cursor: pointer;
}
.map-legend button span { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; }
.map-region-list { min-height: 0; padding: 9px; overflow-y: auto; }
.map-region-list button {
    width: 100%; min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 3px 5px; border: 0; border-bottom: 1px solid #edf1f5; background: #fff; color: #475569; font-size: 0.62rem; text-align: left; cursor: pointer;
}
.map-region-list button span { min-width: 0; display: flex; align-items: center; gap: 6px; }
.map-region-list button i { color: #e85d45; }
.map-region-list button strong { min-width: 24px; padding: 2px 4px; background: #edf6ff; color: #1685e5; font-size: 0.58rem; text-align: center; }
.map-region-list button:hover, .map-legend button:hover { background: #eaf5ff; }
.map-canvas-wrap { min-width: 0; min-height: 0; position: relative; }
.clients-map { width: 100%; height: 100%; min-height: 440px; background: #e8eef3; }
.map-loading { position: absolute; z-index: 500; inset: 12px auto auto 50%; transform: translateX(-50%); padding: 8px 12px; border: 1px solid #dce3ec; background: #fff; color: #475569; font-size: 0.68rem; box-shadow: 0 2px 8px rgba(15,23,42,.16); }
.client-map-marker-wrap { background: transparent; border: 0; }
.client-map-marker {
    width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; position: relative; border: 2px solid #fff; border-radius: 50% 50% 50% 4px; transform: rotate(-45deg); background: var(--marker-color); color: #fff; box-shadow: 0 2px 5px rgba(15,23,42,.3);
}
.client-map-marker i { transform: rotate(45deg); font-size: 0.57rem; }
.client-map-marker.inactive { background: #ef4444; opacity: .85; }
.client-map-cluster { display: flex; align-items: center; justify-content: center; border: 5px solid rgba(22,133,229,.25); border-radius: 50%; background: #1685e5; color: #fff; font-size: 0.68rem; font-weight: 700; box-shadow: 0 2px 6px rgba(15,23,42,.25); }
.client-map-cluster span { display: block; }
.map-client-popup { min-width: 210px; font-family: Inter, sans-serif; color: #334155; }
.map-client-popup header { display: flex; align-items: center; gap: 7px; margin-bottom: 8px; }
.map-client-popup header strong { font-size: 0.72rem; }
.popup-status { width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }
.popup-status.active { background: #22a06b; }
.map-client-popup p { display: flex; align-items: center; gap: 6px; margin: 5px 0; font-size: 0.61rem; }
.map-client-popup p i { width: 12px; color: #64748b; text-align: center; }
.map-client-popup a { display: flex; align-items: center; justify-content: space-between; margin-top: 9px; padding: 7px 8px; background: #1685e5; color: #fff; font-size: 0.62rem; text-decoration: none; }
@media (max-width: 900px) {
    .client-map-content { height: auto; overflow: visible; }
    .map-workspace { grid-template-columns: 1fr; }
    .map-control-panel { border-right: 0; border-bottom: 1px solid #dce3ec; }
    .map-region-list { max-height: 160px; }
    .clients-map { height: 65vh; }
}
@media (max-width: 600px) {
    .map-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Tipos de chamados */
.ticket-type-table-panel { margin-top: 0; }
.ticket-type-table { min-width: 650px; }
.ticket-type-table th:first-child,
.ticket-type-table td:first-child {
    width: auto;
    padding-left: 12px;
    text-align: left;
}
.ticket-type-table th:first-child { width: auto; }
.ticket-type-table .ticket-type-actions-column { width: 43%; }
.ticket-type-table th { height: 32px; }
.ticket-type-table td {
    height: 34px;
    padding-top: 3px;
    padding-bottom: 3px;
    line-height: 1.2;
}
.ticket-type-table .pool-row-actions button {
    width: 28px;
    height: 24px;
}
.ticket-type-description { font-weight: 500; }
.ticket-type-modal { width: min(450px, 100%); }
.ticket-type-modal-body { padding-top: 16px; }
.ticket-type-radio-group {
    display: flex;
    align-items: center;
    gap: 16px;
}
.ticket-type-radio-group label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #3f3f46;
    font-size: 0.72rem;
    cursor: pointer;
}
.ticket-type-radio-group input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: #2494e8;
}
.ticket-type-table .ticket-type-actions-column { width: 220px; }
.pool-row-actions .manage-ticket-subcategories { color: #1685e5; border-radius: 2px 0 0 2px; }
.ticket-type-table .pool-row-actions .edit-ticket-type { color: #256782; border-radius: 0; }
.ticket-type-table .pool-row-actions .delete-ticket-type { color: #ef5350; border-right: 1px solid #e2e8f0; border-radius: 0 2px 2px 0; }
.ticket-subcategories-modal {
    width: min(920px, 100%);
    max-height: calc(100vh - 32px);
    overflow: hidden;
}
.ticket-subcategories-modal .server-modal-header div { min-width: 0; }
.ticket-subcategories-modal .server-modal-header p { margin: 3px 0 0; color: #64748b; font-size: 0.68rem; }
.ticket-subcategories-toolbar { padding: 10px; background: #fff; border-bottom: 1px solid #e2e8f0; }
.ticket-subcategories-scroll { max-height: calc(100vh - 215px); overflow: auto; }
.ticket-subcategories-table { min-width: 720px; }
.ticket-subcategories-table th,
.ticket-subcategories-table td { height: 36px; padding-top: 4px; padding-bottom: 4px; }
.ticket-subcategories-table th:first-child,
.ticket-subcategories-table td:first-child { width: 34%; padding-left: 12px; text-align: left; }
.ticket-subcategories-table th:nth-child(2),
.ticket-subcategories-table th:nth-child(3) { width: 18%; }
.ticket-subcategories-table th:nth-child(4) { width: 15%; }
.ticket-subcategories-table th:last-child { width: 110px; }
.ticket-subcategory-charge.yes { color: #168449; font-weight: 600; }
.ticket-subcategory-charge.no { color: #94a3b8; }
.ticket-subcategories-footer { justify-content: space-between; }
.ticket-subcategories-footer > span { color: #64748b; font-size: 0.7rem; }
.ticket-subcategory-form-backdrop { z-index: 10060; }
.ticket-subcategory-modal { width: min(560px, 100%); }
.ticket-subcategory-modal-body .server-form-field { grid-template-columns: 155px minmax(0, 1fr); }
.ticket-subcategory-value { min-width: 0; display: grid; grid-template-columns: 38px minmax(0, 1fr); }
.ticket-subcategory-value > span { display: flex; align-items: center; justify-content: center; border: 1px solid #cbd5e1; border-right: 0; border-radius: 4px 0 0 4px; background: #f1f5f9; color: #64748b; font-size: 0.72rem; }
.ticket-subcategory-value input { border-radius: 0 4px 4px 0; }
@media (max-width: 600px) {
    .ticket-subcategory-modal-body .server-form-field { grid-template-columns: 1fr; gap: 5px; }
    .ticket-subcategory-modal-body .server-form-field > span:first-child { text-align: left; }
}

/* Tecnicos */
.technician-table-panel { margin-top: 0; }
.technician-table { min-width: 0; table-layout: fixed; }
.technician-table th, .technician-table td { height: 34px; padding-top: 3px; padding-bottom: 3px; line-height: 1.2; }
.technician-table th:first-child, .technician-table td:first-child { width: 42%; padding-left: 12px; text-align: left; }
.technician-table th:nth-child(2) { width: 28%; }
.technician-table .technician-actions-column { width: 30%; }
.technician-table .pool-row-actions button { width: 28px; height: 24px; }
.technician-name { font-weight: 500; }
.technician-status.inactive { color: #dc2626; }
.technician-modal { width: min(450px, 100%); }
.technician-modal-body { padding-top: 16px; }

.billing-day-table-panel { margin-top: 0; }
.billing-day-table { min-width: 0; table-layout: fixed; }

/* Faturamento em lote: mantém colunas auxiliares compactas e reserva o restante ao nome. */
.client-table.invoice-batch-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}
.client-table.invoice-batch-table th:nth-child(1) { width: 28px; }
.client-table.invoice-batch-table th:nth-child(2) { width: auto; }
.client-table.invoice-batch-table th:nth-child(3) { width: 105px; }
.client-table.invoice-batch-table th:nth-child(4) { width: 68px; }
.client-table.invoice-batch-table th:nth-child(5) { width: 135px; }
.client-table.invoice-batch-table th:nth-child(6) { width: 205px; }
.clients-page .client-table.invoice-batch-table th,
.clients-page .client-table.invoice-batch-table td {
    height: 27px;
    padding: 3px 5px;
    line-height: 1.15;
}
.clients-page .client-table.invoice-batch-table td:nth-child(2) {
    font-size: 0.7rem;
    font-weight: 500;
    white-space: nowrap;
}
.client-table.invoice-batch-table tr.batch-client-ineligible {
    color: #b4232d;
    background: #fff1f2;
}
.client-table.invoice-batch-table tr.batch-client-ineligible:hover { background: #ffe4e6; }
.batch-client-warning {
    margin-left: 7px;
    color: #dc2626;
    font-size: 0.58rem;
    font-weight: 600;
}
.batch-client-warning i { margin-right: 2px; }
.billing-day-table th,
.billing-day-table td { height: 34px; padding-top: 3px; padding-bottom: 3px; line-height: 1.2; }
.billing-day-table th:first-child,
.billing-day-table td:first-child { width: 70%; padding-left: 12px; text-align: left; }
.billing-day-table .billing-day-actions-column { width: 30%; }
.billing-day-table .pool-row-actions button { width: 28px; height: 24px; }
.billing-day-value { font-weight: 500; }
.billing-day-modal { width: min(450px, 100%); }
.billing-day-modal-body { padding-top: 16px; }
.technician-status-option { display: inline-flex; align-items: center; gap: 7px; color: #3f3f46; font-size: 0.72rem; cursor: pointer; }
.technician-status-option input { width: 15px; height: 15px; margin: 0; accent-color: #2494e8; }
/* Financeiro: Cobranças */
.charges-stats {
    grid-template-columns: repeat(6, minmax(125px, 1fr));
}

.charges-advanced-filters {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.charges-advanced-filters select,
.charges-advanced-filters .date-filter {
    min-width: 0;
}

.charges-table-scroll {
    overflow-x: hidden;
}

.charges-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    font-size: 0.64rem;
}

.charges-table th,
.charges-table td {
    height: 34px;
    padding: 4px 5px;
    line-height: 1.18;
    vertical-align: middle;
    white-space: nowrap;
}

.charges-table > thead > tr > th:nth-child(1) { width: 28px; }
.charges-table > thead > tr > th:nth-child(2) { width: 58px; }
.charges-table > thead > tr > th:nth-child(3) { width: auto; }
.charges-table > thead > tr > th:nth-child(4) { width: 70px; }
.charges-table > thead > tr > th:nth-child(5) { width: 64px; }
.charges-table > thead > tr > th:nth-child(6) { width: 58px; }
.charges-table > thead > tr > th:nth-child(7) { width: 78px; }
.charges-table > thead > tr > th:nth-child(8) { width: 74px; }
.charges-table > thead > tr > th:nth-child(9) { width: 70px; }
.charges-table > thead > tr > th:nth-child(10) { width: 82px; }
.charges-table > thead > tr > th:nth-child(11) { width: 106px; }
.charges-table > thead > tr > th:nth-child(12) { width: 62px; }

.charges-table .charge-group-row > td:nth-child(2),
.charges-table .charge-group-row > td:nth-child(4),
.charges-table .charge-group-row > td:nth-child(5),
.charges-table .charge-group-row > td:nth-child(6),
.charges-table .charge-group-row > td:nth-child(7),
.charges-table .charge-group-row > td:nth-child(8),
.charges-table .charge-group-row > td:nth-child(9),
.charges-table .charge-group-row > td:nth-child(10),
.charges-table .charge-group-row > td:nth-child(11),
.charges-table .charge-group-row > td:nth-child(12) {
    text-align: center;
}

.charge-client {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
}

.charges-table th,
.charges-table td {
    overflow: hidden;
    text-overflow: ellipsis;
}

.charges-table .charge-group-row > td:nth-child(10),
.charges-table .charge-group-row > td:nth-child(11) {
    overflow: visible;
    text-overflow: clip;
}

.charges-table .charge-detail-row td {
    white-space: normal;
}

.charge-status,
.charge-integration {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    min-width: 74px;
    max-width: 74px;
    min-height: 18px;
    padding: 2px 5px;
    border-radius: 2px;
    color: #ffffff;
    font-size: 0.55rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
}

.charge-integration {
    width: 98px;
    min-width: 98px;
    max-width: 98px;
}

.charge-status.open { background: #278bd2; }
.charge-status.awaiting,
.charges-table .charge-status.awaiting {
    background: #f2b233 !important;
    color: #513b00 !important;
}
.charge-status.overdue,
.charge-status.error { background: #ef5350; }
.charge-status.paid { background: #43b654; }
.charge-status.canceled { background: #7b8798; }
.charge-integration.synced { background: #43b654; }
.charge-integration.queued { background: #f2b233; color: #513b00; }
.charge-integration.processing { background: #2f8fe8; color: #fff; }
.charge-integration.pending { background: #f2b233; color: #513b00; }
.charge-integration.failed,
.charge-integration.error { background: #ef5350; }
.charge-error-badge {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    cursor: pointer;
    font-family: inherit;
    line-height: 1;
}
.charge-error-badge:hover {
    filter: brightness(0.95);
    transform: translateY(-1px);
}
.charge-error-modal { width: min(820px, 100%); }
.charge-error-body {
    display: block;
    max-height: min(72vh, 720px);
    overflow: auto;
}
.charge-error-summary,
.charge-error-event-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    gap: 10px;
}
.charge-error-summary div,
.charge-error-event-grid div,
.charge-error-current,
.charge-error-event {
    border: 1px solid #e5edf7;
    border-radius: 12px;
    background: #f8fbff;
    padding: 10px 12px;
}
.charge-error-summary span,
.charge-error-event-grid span,
.charge-error-current span {
    display: block;
    color: #64748b;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .03em;
    margin-bottom: 4px;
}
.charge-error-summary strong,
.charge-error-event-grid strong {
    display: block;
    color: #0f172a;
    font-size: .82rem;
    overflow-wrap: anywhere;
}
.charge-error-current {
    margin-top: 12px;
    background: #fff7ed;
    border-color: #fed7aa;
}
.charge-error-current p,
.charge-error-event p {
    margin: 0;
    color: #334155;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}
.charge-error-body h3 {
    margin: 16px 0 10px;
    font-size: .9rem;
    color: #0f172a;
}
.charge-error-event {
    margin-top: 10px;
    background: #fff;
}
.charge-error-event header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    margin-bottom: 10px;
}
.charge-error-event header strong { color: #0f172a; font-size: .8rem; }
.charge-error-event header span { color: #64748b; font-size: .75rem; font-weight: 700; }
.charge-error-payload {
    margin-top: 10px;
    border: 1px solid #e5edf7;
    border-radius: 10px;
    background: #f8fafc;
    overflow: hidden;
}
.charge-error-payload summary {
    cursor: pointer;
    padding: 9px 12px;
    color: #334155;
    font-size: .78rem;
    font-weight: 700;
}
.charge-error-payload pre {
    margin: 0;
    padding: 12px;
    max-height: 260px;
    overflow: auto;
    background: #0f172a;
    color: #e2e8f0;
    font-size: .72rem;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.charge-error-empty {
    margin: 0;
    color: #64748b;
}

.charge-overdue-count { color: #ef5350; font-weight: 700; }

.nfcom-table {
    min-width: 1680px;
    table-layout: fixed;
}

.nfcom-table th:nth-child(1) { width: 34px; }
.nfcom-table th:nth-child(2) { width: 70px; }
.nfcom-table th:nth-child(3) { width: 86px; }
.nfcom-table th:nth-child(4) { width: 220px; }
.nfcom-table th:nth-child(5) { width: 135px; }
.nfcom-table th:nth-child(6) { width: 118px; }
.nfcom-table th:nth-child(7) { width: 82px; }
.nfcom-table th:nth-child(8) { width: 100px; }
.nfcom-table th:nth-child(9) { width: 150px; }
.nfcom-table th:nth-child(10) { width: 125px; }
.nfcom-table th:nth-child(11) { width: 185px; }
.nfcom-table th:nth-child(12) { width: 104px; }
.nfcom-table th:nth-child(13) { width: 88px; }
.nfcom-table th:nth-child(14) { width: 138px; }
.nfcom-table th:nth-child(15) { width: 138px; }
.nfcom-table th:nth-child(16) { width: 74px; }

.nfcom-stats {
    grid-template-columns: repeat(4, minmax(140px, 1fr));
}

.nfcom-stats .client-stat {
    min-width: 0;
}

.nfcom-stats .client-stat strong {
    font-size: 1.25rem;
}

.nfcom-stats .client-stat span {
    font-size: 0.62rem;
    line-height: normal;
    white-space: nowrap;
}

.nfcom-table th,
.nfcom-table td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}

.nfcom-table th {
    height: 38px;
    padding: 6px 7px;
}

.nfcom-table td {
    height: 34px !important;
    padding: 4px 7px !important;
    line-height: 1.2 !important;
}

.nfcom-table .table-sort-button {
    max-width: 100%;
    justify-content: flex-start;
    text-align: left;
    white-space: nowrap;
}

.nfcom-table th:nth-child(1),
.nfcom-table td:nth-child(1),
.nfcom-table th:nth-child(2),
.nfcom-table td:nth-child(2),
.nfcom-table th:nth-child(3),
.nfcom-table td:nth-child(3),
.nfcom-table th:nth-child(7),
.nfcom-table td:nth-child(7),
.nfcom-table th:nth-child(8),
.nfcom-table td:nth-child(8),
.nfcom-table th:nth-child(9),
.nfcom-table td:nth-child(9),
.nfcom-table th:nth-child(16),
.nfcom-table td:nth-child(16) {
    text-align: center;
}

.nfcom-table th:nth-child(13),
.nfcom-table td:nth-child(13) {
    text-align: right;
}

.nfcom-client {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    font-weight: 600;
}

.nfcom-status,
.nfcom-sefaz {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 76px;
    min-height: 18px;
    padding: 2px 6px;
    border-radius: 2px;
    color: #ffffff;
    font-size: 0.55rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.nfcom-sefaz {
    min-width: 42px;
    margin-right: 5px;
}

.nfcom-sefaz + small {
    display: inline-block;
    max-width: 82px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    color: #64748b;
    font-size: 0.58rem;
}

.nfcom-status.draft { background: #7b8798; }
.nfcom-status.ready { background: #f2b233; color: #513b00; }
.nfcom-status.sent { background: #278bd2; }
.nfcom-status.authorized,
.nfcom-sefaz.authorized { background: #43b654; }
.nfcom-status.error,
.nfcom-sefaz.error { background: #ef5350; }
.nfcom-status.canceled { background: #7b8798; }
.nfcom-sefaz.pending { background: #94a3b8; }

.nfcom-row-actions {
    overflow: visible !important;
    text-align: center;
}

.nfcom-row-actions button {
    width: 28px;
    height: 28px;
    border: 1px solid #dbe5ef;
    border-radius: 5px;
    background: #ffffff;
    color: #2f6fae;
    cursor: pointer;
}

.nfcom-row-actions button:hover {
    background: #edf4fb;
}

.nfcom-details-modal {
    width: min(900px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.nfcom-details-body {
    display: grid;
    gap: 14px;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: 16px;
}

.nfcom-details-modal .server-modal-header,
.nfcom-details-modal .server-modal-footer {
    flex: 0 0 auto;
}

.nfcom-details-modal .server-modal-body {
    flex: 1 1 auto;
}

#nfcomDetailsModal {
    align-items: flex-start;
    overflow-y: auto;
}

#nfcomDetailsModal .nfcom-details-modal {
    max-height: calc(100vh - 32px) !important;
    max-height: calc(100dvh - 32px) !important;
}

#nfcomDetailsModal .nfcom-details-body {
    max-height: calc(100vh - 160px);
    max-height: calc(100dvh - 160px);
    overflow-y: auto !important;
}

#nfcomValidationModal {
    align-items: flex-start;
    overflow-y: auto;
}

.nfcom-validation-modal {
    width: min(940px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.nfcom-validation-body {
    display: grid;
    gap: 14px;
    min-height: 0;
    overflow-y: auto;
}

.nfcom-validation-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.nfcom-validation-summary > div,
.nfcom-validation-card {
    border: 1px solid #e2eaf3;
    border-radius: 8px;
    background: #f8fafc;
}

.nfcom-validation-summary > div {
    padding: 12px;
}

.nfcom-validation-summary span,
.nfcom-validation-card small {
    color: #64748b;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
}

.nfcom-validation-summary strong {
    display: block;
    margin-top: 4px;
    color: #25364b;
    font-size: 1.15rem;
}

.nfcom-validation-card {
    padding: 14px;
}

.nfcom-validation-card.ok {
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.nfcom-validation-card.error {
    border-color: #fecaca;
    background: #fff7f7;
}

.nfcom-validation-card.warning {
    border-color: #fde68a;
    background: #fffbeb;
}

.nfcom-validation-card h3 {
    margin: 0 0 4px;
    color: #1f3147;
    font-size: 0.95rem;
}

.nfcom-validation-card p {
    margin: 4px 0 0;
    color: #42566f;
    font-size: 0.8rem;
}

.nfcom-validation-error-list {
    display: grid;
    gap: 8px;
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.nfcom-validation-error-list li {
    padding: 10px;
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(148, 163, 184, 0.35);
}

.nfcom-validation-error-list strong {
    display: block;
    color: #991b1b;
    font-size: 0.78rem;
}

.nfcom-validation-error-list em {
    display: block;
    margin-top: 4px;
    color: #475569;
    font-size: 0.75rem;
    font-style: normal;
}

@media (max-width: 760px) {
    .nfcom-validation-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.nfcom-details-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.nfcom-details-grid > div,
.nfcom-details-long {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid #e2eaf3;
    border-radius: 6px;
    background: #f8fafc;
}

.nfcom-details-grid span,
.nfcom-details-long span {
    color: #64748b;
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
}

.nfcom-details-grid strong,
.nfcom-details-long p,
.nfcom-details-long code {
    margin: 0;
    color: #25364b;
    font-size: 0.76rem;
    word-break: break-word;
}

.nfcom-details-long code {
    font-family: Consolas, "Courier New", monospace;
}

.nfcom-details-loading {
    padding: 18px;
    color: #64748b;
    text-align: center;
}

.nfcom-details-loading.error,
.empty-table.error {
    color: #b91c1c;
}

.nfcom-wizard-modal {
    width: min(1040px, calc(100vw - 32px));
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.nfcom-wizard-body {
    display: grid;
    gap: 16px;
    min-height: 0;
    overflow-y: auto;
}

.nfcom-wizard-modal .server-modal-header,
.nfcom-wizard-modal .server-modal-footer {
    flex: 0 0 auto;
}

.nfcom-wizard-modal .server-modal-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.nfcom-wizard-modal .server-modal-body {
    flex: 1 1 auto;
}

#nfcomPreviewWizardModal {
    align-items: flex-start;
    overflow-y: auto;
}

.nfcom-wizard-steps {
    display: grid;
    grid-template-columns: max-content 1fr max-content 1fr max-content;
    align-items: center;
    gap: 10px;
    padding: 8px 2px 12px;
}

.nfcom-wizard-step {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #94a3b8;
    font-size: 0.7rem;
    font-weight: 700;
}

.nfcom-wizard-step span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #cbd5e1;
    color: #ffffff;
    font-size: 0.68rem;
}

.nfcom-wizard-step.active,
.nfcom-wizard-step.done {
    color: #0f2f4a;
}

.nfcom-wizard-step.active span,
.nfcom-wizard-step.done span {
    background: #123955;
}

.nfcom-wizard-line {
    height: 1px;
    background: #d9e2ec;
}

.nfcom-wizard-caption {
    margin: 0 0 12px;
    color: #64748b;
    font-size: 0.76rem;
}

.nfcom-wizard-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.nfcom-wizard-form label {
    display: grid;
    gap: 5px;
}

.nfcom-wizard-form span {
    color: #64748b;
    font-size: 0.64rem;
    font-weight: 700;
    text-transform: uppercase;
}

.nfcom-wizard-form input,
.nfcom-wizard-form select {
    height: 36px;
    border: 1px solid #d7dee8;
    border-radius: 5px;
    padding: 0 10px;
    background: #ffffff;
    color: #1f2937;
    font-size: 0.76rem;
}

.nfcom-wizard-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    margin-top: 14px;
    color: #334155;
    font-size: 0.74rem;
}

.nfcom-wizard-checks label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.nfcom-wizard-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.nfcom-wizard-list-head p {
    margin: 0;
    color: #475569;
    font-size: 0.76rem;
}

.nfcom-wizard-table-wrap {
    max-height: 390px;
    overflow: auto;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
}

.nfcom-wizard-table {
    width: 100%;
    min-width: 920px;
    border-collapse: collapse;
}

.nfcom-wizard-table th,
.nfcom-wizard-table td {
    padding: 9px 10px;
    border-bottom: 1px solid #edf2f7;
    color: #334155;
    font-size: 0.72rem;
    text-align: left;
    vertical-align: top;
}

.nfcom-wizard-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.nfcom-wizard-table td small {
    display: block;
    margin-top: 2px;
    color: #94a3b8;
    font-size: 0.62rem;
}

.nfcom-wizard-table tr.disabled {
    background: #f8fafc;
    opacity: 0.72;
}

.nfcom-wizard-pendencies {
    max-width: 260px;
    color: #b45309 !important;
    white-space: normal;
}

.nfcom-wizard-ok {
    color: #15803d;
    font-weight: 700;
}

.nfcom-wizard-footer-summary {
    display: inline-grid;
    grid-template-columns: auto auto;
    align-items: center;
    gap: 2px 12px;
    min-width: 250px;
    padding: 8px 12px;
    border: 1px solid #dbeafe;
    border-radius: 8px;
    background: #f8fbff;
    text-align: left;
}

.nfcom-wizard-footer-summary span {
    grid-column: 1 / -1;
    color: #64748b;
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.nfcom-wizard-footer-summary strong {
    color: #123955;
    font-size: 0.86rem;
    font-weight: 800;
}

.nfcom-wizard-footer-summary strong b {
    font: inherit;
}

.nfcom-wizard-footer-summary em {
    justify-self: end;
    color: #15803d;
    font-size: 0.86rem;
    font-style: normal;
    font-weight: 800;
}

.nfcom-wizard-footer-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.nfcom-wizard-review {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.nfcom-wizard-review > div,
.nfcom-wizard-review-list > div {
    display: grid;
    gap: 4px;
    padding: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    background: #f8fafc;
}

.nfcom-wizard-review span,
.nfcom-wizard-review-list span {
    color: #64748b;
    font-size: 0.64rem;
}

.nfcom-wizard-review strong {
    color: #0f2f4a;
    font-size: 1rem;
}

.nfcom-wizard-review-list {
    display: grid;
    gap: 8px;
    max-height: 220px;
    margin-top: 12px;
    overflow: auto;
}

.nfcom-wizard-review-list strong {
    color: #1f2937;
    font-size: 0.74rem;
}

@media (max-width: 760px) {
    .nfcom-wizard-steps {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .nfcom-wizard-line {
        display: none;
    }

    .nfcom-wizard-form,
    .nfcom-wizard-review {
        grid-template-columns: 1fr;
    }

    .nfcom-wizard-list-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .nfcom-wizard-modal .server-modal-footer {
        align-items: stretch;
        flex-direction: column;
    }

    .nfcom-wizard-footer-summary {
        width: 100%;
    }

    .nfcom-wizard-footer-actions {
        justify-content: flex-end;
    }
}

.group-nfcom-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 46px;
    min-height: 20px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: 0.64rem;
    font-weight: 700;
}

.group-nfcom-badge.yes {
    background: #dcfce7;
    color: #15803d;
}

.group-nfcom-badge.no {
    background: #f1f5f9;
    color: #64748b;
}

.group-nfcom-choice {
    justify-content: flex-start;
    margin-top: 8px;
}

.bulk-actions-menu button.danger {
    color: #dc2626;
}

.bulk-actions-menu button.danger:hover {
    background: #fff1f2;
    color: #b91c1c;
}

.charges-table .charge-group-detail-row > td {
    height: auto;
    padding: 0;
    overflow: visible;
    white-space: normal;
    background: #f7faff;
}

.charge-group-detail {
    padding: 7px 10px 9px 36px;
    border-top: 1px solid #dbe6f2;
    border-bottom: 1px solid #dbe6f2;
}

.charge-group-detail > footer {
    padding: 7px 4px 0;
    color: #64748b;
    font-size: 0.6rem;
}

.charge-child-table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    background: #fff;
}

.charges-table .charge-child-table th,
.charges-table .charge-child-table td {
    height: 29px;
    padding: 3px 5px;
    border-bottom: 1px solid #edf1f5;
    font-size: 0.6rem;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

.charge-child-table th:nth-child(1) { width: 25px; }
.charge-child-table th:nth-child(2) { width: 78px; }
.charge-child-table th:nth-child(3) { width: 58px; }
.charge-child-table th:nth-child(4) { width: 72px; }
.charge-child-table th:nth-child(5),
.charge-child-table th:nth-child(6) { width: 66px; }
.charge-child-table th:nth-child(7) { width: 82px; }
.charge-child-table th:nth-child(8) { width: 105px; }
.charge-child-table th:nth-child(9) { width: auto; }
.charge-child-table th:nth-child(10) { width: 122px; }

.charges-table .charge-child-table td:nth-child(7),
.charges-table .charge-child-table td:nth-child(8),
.charges-table .charge-child-table td:nth-child(10) {
    overflow: visible;
    text-overflow: clip;
}

.charge-child-info td { background: #f8fbff; }
.charge-child-info-grid {
    display: grid;
    grid-template-columns: 1.5fr 1.2fr 0.8fr;
    gap: 12px;
    padding: 8px 10px;
    text-align: left;
    white-space: normal;
}
.charge-child-info-grid div { min-width: 0; }
.charge-child-info-grid span { display: block; margin-bottom: 2px; color: #7b8798; font-size: 0.55rem; }
.charge-child-info-grid strong { display: block; color: #334155; font-size: 0.61rem; font-weight: 500; overflow-wrap: anywhere; }

.charge-row-actions {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    white-space: nowrap;
    width: 100%;
}

.charge-row-actions button {
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: #f8fafc;
    color: #64748b;
    cursor: pointer;
}

.charge-row-actions button.action-placeholder {
    visibility: hidden;
    pointer-events: none;
}

.charge-row-actions button:hover,
.charge-row-actions button.active {
    background: #e9f4fc;
    color: #1685d9;
}

.charge-row-actions button.danger {
    color: #ef5350;
}
.charge-row-actions button.mark-paid-charge { color: #22a55b; }
.charge-row-actions button.mark-paid-charge:hover { border-color: #9eddb8; background: #edfbf2; color: #15803d; }

.charge-row-actions button:disabled {
    color: #cbd5e1;
    cursor: not-allowed;
    opacity: 0.65;
}

.charge-row-actions button:disabled:hover {
    background: #f8fafc;
    color: #cbd5e1;
}
.charge-link-floating-menu {
    position: fixed;
    z-index: 120;
    width: 178px;
    padding: 5px 0;
    border: 1px solid #dbe3ec;
    border-radius: 4px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.16);
}
.charge-link-floating-menu[hidden] {
    display: none;
}
.charge-link-floating-menu button {
    width: 100%;
    min-height: 30px;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 5px 10px;
    border: 0;
    background: transparent;
    color: #475569;
    font-size: 0.66rem;
    font-family: inherit;
    text-align: left;
    cursor: pointer;
}
.charge-link-floating-menu button:hover {
    background: #edf7fe;
    color: #1685d9;
}
.charge-link-floating-menu i {
    width: 14px;
    text-align: center;
}
.charge-mark-paid-modal { width: min(560px, 100%); }
.charge-mark-paid-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 16px; }
.charge-mark-paid-summary > div { display: grid; gap: 3px; padding: 9px 10px; border: 1px solid #e2e8f0; border-radius: 4px; background: #f8fafc; }
.charge-mark-paid-summary span { color: #7b8798; font-size: 0.62rem; text-transform: uppercase; }
.charge-mark-paid-summary strong { min-width: 0; overflow-wrap: anywhere; color: #334155; font-size: 0.72rem; }
.charge-mark-paid-reason { display: grid; gap: 6px; }
.charge-mark-paid-reason textarea { width: 100%; resize: vertical; }
.charge-mark-paid-warning { display: flex; align-items: flex-start; gap: 7px; margin: 12px 0 0; color: #9a6700; font-size: 0.68rem; line-height: 1.4; }
.charge-mark-paid-warning i { margin-top: 2px; color: #f59e0b; }
@media (max-width: 600px) { .charge-mark-paid-summary { grid-template-columns: 1fr; } }

.charges-table tr.charge-row.expanded {
    background: #f8fbff;
}

.charges-table tr.charge-status-row-paid td {
    color: #43b654;
}

.charges-table tr.charge-status-row-overdue td {
    color: #ef5350;
}

.charges-table tr.charge-status-row-awaiting > td {
    background: #fff8e6;
    color: #9a6700;
}

.charges-table tr.charge-status-row-awaiting:hover > td {
    background: #fff1c2;
}

.charges-table tr.charge-status-row-awaiting .charge-status.awaiting {
    background: #f2b233 !important;
    color: #513b00 !important;
}

.charges-table tr.charge-status-row-error td {
    color: #f2b233;
}

.charges-table tr.charge-status-row-canceled td {
    color: #7b8798;
}

.charges-table tr.charge-status-row-open td {
    color: inherit;
}

.charges-table tr.charge-status-row-paid .charge-row-actions button,
.charges-table tr.charge-status-row-overdue .charge-row-actions button,
.charges-table tr.charge-status-row-error .charge-row-actions button,
.charges-table tr.charge-status-row-canceled .charge-row-actions button {
    color: inherit;
}

.charges-table tr.charge-status-row-overdue .charge-row-actions button.danger {
    color: #ef5350;
}

.charge-detail-row[hidden] {
    display: none;
}

.charge-empty-row td {
    height: 86px !important;
    text-align: center;
    color: #7b8492;
}

.charge-empty-state {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.72rem;
}

.charge-empty-state i {
    color: #a8b3c2;
}

.charge-detail-row > td {
    padding: 0 !important;
    background: #eef3f7;
}

.charge-detail {
    display: grid;
    grid-template-columns: minmax(230px, 28%) minmax(0, 1fr);
    gap: 8px;
    padding: 7px;
}

.charge-detail aside,
.charge-detail section {
    min-width: 0;
    background: #ffffff;
}

.charge-detail aside {
    padding: 10px 12px;
}

.charge-detail section {
    padding: 10px;
}

.charge-detail h3 {
    margin: 0 0 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e6ec;
    color: #24344a;
    font-size: 0.72rem;
    font-weight: 500;
    text-transform: uppercase;
}

.charge-detail dl {
    margin: 0;
    border: 1px solid #d8dfe7;
}

.charge-detail dl div {
    display: grid;
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 6px;
    padding: 9px;
    border-bottom: 1px solid #d8dfe7;
}

.charge-detail dl div:last-child {
    border-bottom: 0;
}

.charge-detail dt,
.charge-detail-grid span {
    color: #95a0ad;
    font-size: 0.6rem;
}

.charge-detail dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    color: #26364a;
    font-size: 0.62rem;
    font-weight: 600;
}

.charge-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.charge-detail-grid article {
    min-width: 0;
    display: grid;
    gap: 4px;
    padding: 8px;
    border: 1px solid #e1e7ef;
    background: #fbfcfe;
}

.charge-detail-grid strong {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #26364a;
    font-size: 0.64rem;
    font-weight: 600;
}

.charge-timeline {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}

.charge-timeline span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 7px;
    border: 1px solid #dce4ee;
    background: #f8fafc;
    color: #64748b;
    font-size: 0.61rem;
}

.charge-timeline span.done {
    border-color: #c8ead2;
    background: #ecf9f0;
    color: #258344;
}

@media (max-width: 900px) {
    .charges-stats { grid-template-columns: repeat(2, minmax(125px, 1fr)); }
    .charges-advanced-filters { grid-template-columns: 1fr; }
    .charge-detail { grid-template-columns: 1fr; }
    .charge-detail-grid { grid-template-columns: 1fr; }
}
.client-card-admin-list {
    display: grid;
    gap: 10px;
    margin-top: 8px;
}

.client-card-modal {
    width: min(560px, calc(100vw - 28px));
    max-height: calc(100vh - 32px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 10px;
}

.client-card-modal .server-modal-header {
    min-height: 48px;
    flex: 0 0 auto;
    padding: 0 14px;
}

.client-card-modal .server-modal-header h2 {
    font-size: 0.96rem;
}

.client-card-modal .server-modal-body {
    min-height: 0;
    flex: 1 1 auto;
    gap: 10px;
    padding: 12px 14px;
    overflow-y: auto;
}

.client-card-modal .server-modal-footer {
    min-height: 52px;
    flex: 0 0 auto;
    padding: 9px 14px;
    background: #fff;
}

.client-card-modal .charge-edit-summary {
    padding: 10px 12px;
}

.client-card-modal .charge-edit-summary small {
    line-height: 1.35;
}

.client-card-modal .settings-actions-row {
    margin: 0;
    gap: 8px;
}

.client-card-modal .settings-actions-row .primary-action,
.client-card-modal .settings-actions-row .secondary-action {
    min-height: 34px;
    padding: 0 12px;
    font-size: 0.72rem;
    white-space: nowrap;
}

.client-card-modal #clientCardGeneratedField {
    grid-template-columns: 72px minmax(0, 1fr);
}

.client-card-modal #clientCardGeneratedLink {
    font-size: 0.68rem;
}

.client-card-admin-list h3 {
    margin: 4px 0 0;
    font-size: 0.78rem;
    color: #334155;
}

.client-card-admin-item {
    display: grid;
    gap: 3px;
    padding: 8px 10px;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f8fafc;
}

.client-card-admin-item strong {
    color: #0f172a;
}

.client-card-admin-item span,
.client-card-admin-item small {
    color: #64748b;
    font-size: 0.66rem;
    line-height: 1.25;
}

.client-card-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 4px;
}

.client-card-admin-actions button {
    border: 1px solid #dbeafe;
    background: #eff6ff;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 5px 9px;
    cursor: pointer;
    font-size: 0.66rem;
    font-weight: 600;
}

.client-profile-actions button.disabled-card-action,
.client-profile-actions button:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
