/* Base */
:root {
    --bg: #f7f8fa;
    --card: #ffffff;
    --text: #1f2937;
    --muted: #6b7280;
    --accent: #2563eb;
    --border: #e5e7eb;
    --sidebar: #111827;
    --sidebar-muted: #9ca3af;
    --success: #047857;
    --error: #b91c1c;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: "Segoe UI", Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
}
.page-kanban-os .content {
    overflow-x: hidden;
}
a {
    color: inherit;
    text-decoration: none;
}
.modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(17, 24, 39, 0.55);
    z-index: 40;
}
.modal.is-open {
    display: flex;
}
.modal-dialog {
    width: min(960px, 100%);
    max-height: 90vh;
    overflow: auto;
    background: var(--card);
    border-radius: 12px;
    border: 1px solid var(--border);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}
.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}
.modal-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    margin: 0;
}
.modal-title svg {
    width: 18px;
    height: 18px;
    color: var(--muted);
}
.modal-body {
    padding: 16px 20px 20px;
}
a { color: inherit; text-decoration: none; }
.app {
    display: flex;
    min-height: 100vh;
}
.sidebar {
    width: 260px;
    background: var(--sidebar);
    color: #fff;
    padding: 24px 20px;
    transition: width 0.2s ease, padding 0.2s ease;
}
.sidebar-logo {
    display: block;
    width: 60%;
    height: auto;
    margin: 0 auto 12px;
}
.brand {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 16px;
}
.brand-short {
    display: none;
}
.user-info {
    font-size: 12px;
    color: var(--sidebar-muted);
    margin-bottom: 24px;
}
.user-info-btn {
    padding: 0;
    border: none;
    background: transparent;
    color: inherit;
    font-size: inherit;
    cursor: pointer;
    text-align: left;
}
.user-info-btn:hover {
    color: #fff;
    text-decoration: underline;
}
.menu-group {
    margin-bottom: 20px;
}
.menu-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 12px;
    color: var(--sidebar-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin: 10px 0;
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}
.menu-title:hover {
    background: rgba(255,255,255,0.08);
    color: #fff;
}
.menu-chevron {
    width: 14px;
    height: 14px;
    transition: transform 0.2s ease;
}
.menu-group.is-open .menu-chevron {
    transform: rotate(180deg);
}
.menu-items {
    max-height: 0 !important;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.2s ease, visibility 0.3s ease;
    opacity: 0;
    visibility: hidden;
}
.menu-group.is-open .menu-items {
    max-height: 500px !important;
    opacity: 1;
    visibility: visible;
}
.menu-link {
    display: block;
    padding: 8px 10px;
    border-radius: 8px;
    color: #e5e7eb;
    font-size: 14px;
}
.menu-link.has-icon {
    display: flex;
    align-items: center;
    gap: 8px;
}
.menu-link.has-icon svg {
    width: 16px;
    height: 16px;
}
.menu-link.active,
.menu-link:hover {
    background: rgba(255,255,255,0.12);
    color: #fff;
}
.sidebar-toggle {
    padding: 6px;
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    border: none;
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
}
.sidebar-toggle:hover {
    background: transparent;
    color: #111827;
}
.app.is-collapsed .sidebar {
    width: 80px;
    padding: 24px 12px;
    overflow-y: auto;
    overflow-x: hidden;
}
.app.is-collapsed .sidebar .sidebar-logo {
    width: 100%;
    max-width: 48px;
}
.app.is-collapsed .sidebar .brand-text,
.app.is-collapsed .sidebar .user-info {
    display: none;
}
.app.is-collapsed .sidebar .brand-short {
    display: block;
    text-align: center;
}
.app.is-collapsed .sidebar .menu-title span,
.app.is-collapsed .sidebar .menu-chevron {
    opacity: 0;
    width: 0;
    overflow: hidden;
}
.app.is-collapsed .sidebar .menu-title {
    padding: 8px;
    justify-content: center;
}
.app.is-collapsed .sidebar .menu-link span {
    opacity: 0;
    width: 0;
    overflow: hidden;
}
.app.is-collapsed .sidebar .menu-link {
    padding: 10px;
    justify-content: center;
}
.app.is-collapsed .sidebar .menu-items {
    max-height: 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
}
.app.is-collapsed .sidebar .menu-group.is-open .menu-items {
    max-height: 500px !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.app.is-collapsed .sidebar .menu-group {
    margin-bottom: 12px;
}
.content {
    flex: 1;
    padding: 24px 32px 48px;
}
.topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.page-title {
    font-size: 22px;
    margin: 0;
}
.topbar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}
.topbar-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    border-radius: 8px;
    color: var(--muted);
}
.topbar-actions a:hover {
    background: transparent;
    color: #111827;
}
.topbar-actions svg {
    width: 18px;
    height: 18px;
    display: block;
}
.card {
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 16px;
    margin-top: 16px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}
.subtitle {
    color: var(--muted);
    font-size: 14px;
}
label {
    display: block;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
}
select, input, button {
    font-family: inherit;
}
select, input[type="month"], input[type="number"], input[type="date"], input[type="datetime-local"], input[type="text"], input[type="email"], input[type="password"] {
    width: 100%;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: #fff;
    font-size: 14px;
}
button {
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--accent);
    color: #fff;
    border: none;
    cursor: pointer;
    font-weight: 600;
}
button.btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
button.btn-with-icon .icon-loading {
    display: none;
}
button.btn-with-icon.is-loading .icon-loading {
    display: inline-flex;
    animation: spin 0.9s linear infinite;
}
button.btn-with-icon.is-loading .btn-label {
    opacity: 0.8;
}
button:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}
body.is-processing {
    cursor: progress;
}
body.is-processing button,
body.is-processing a,
body.is-processing input,
body.is-processing select,
body.is-processing textarea {
    cursor: progress;
}
@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
th, td {
    padding: 10px 8px;
    border-bottom: 1px solid var(--border);
    vertical-align: top;
}
th {
    text-align: left;
    color: var(--muted);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.notice {
    padding: 10px 12px;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 12px;
    border: 1px solid var(--border);
}
.notice.success {
    color: var(--success);
    border-color: rgba(4,120,87,0.3);
    background: rgba(4,120,87,0.06);
}
.notice.error {
    color: var(--error);
    border-color: rgba(185,28,28,0.3);
    background: rgba(185,28,28,0.06);
}
.row-muted {
    color: var(--muted);
    font-size: 12px;
}

/* Login */
.page-login .wrapper {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}
.page-login .card {
    width: 100%;
    max-width: 380px;
    padding: 24px;
    border-radius: 12px;
    margin-top: 0;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.page-login .logo {
    width: 45%;
    height: auto;
    display: block;
    margin: 0 auto 12px;
}
.page-login .project-name {
    text-align: center;
    margin: 0 0 12px;
    font-size: 20px;
}
.page-login h1 {
    margin: 0 0 8px;
    font-size: 22px;
}
.page-login .subtitle {
    font-size: 13px;
    margin-bottom: 16px;
}
.page-login input[type="email"],
.page-login input[type="password"] {
    margin-bottom: 12px;
}
.page-login button {
    width: 100%;
}
.page-login .notice {
    border-color: rgba(185,28,28,0.3);
    background: rgba(185,28,28,0.06);
    color: var(--error);
    font-size: 13px;
}

/* Dashboard */
.page-dashboard .dashboard-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}
.page-dashboard .filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 8px;
    align-items: end;
}
.page-dashboard .filter-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.page-dashboard .filter-actions button {
    white-space: nowrap;
}
.page-dashboard .filter-quick {
    margin-top: 8px;
}
.page-dashboard .filter-quick .filter-actions {
    gap: 8px;
}
.page-dashboard .chart-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

@media (max-width: 1200px) {
    .page-dashboard .chart-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .page-dashboard .chart-grid {
        grid-template-columns: 1fr;
    }
}
.page-dashboard .bars {
    display: flex;
    flex-direction: column;
    gap: 0;
}
.page-dashboard .bar-row {
    display: grid;
    grid-template-columns: 160px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 8px 10px;
    background: transparent;
}
.page-dashboard .bar-row:nth-child(odd) {
    background: #f9fafb;
}
.page-dashboard .bar-row + .bar-row {
    border-top: 1px solid var(--border);
}
.page-dashboard .bar-label {
    font-size: 13px;
    color: var(--muted);
}
.page-dashboard .bar-stack {
    display: grid;
    gap: 4px;
}
.page-dashboard .bar-track {
    background: #eef2ff;
    border-radius: 999px;
    height: 10px;
    overflow: hidden;
    position: relative;
}
.page-dashboard .bar-fill {
    height: 100%;
    border-radius: 999px;
}
.page-dashboard .bar-fill.apontadas {
    background: #60a5fa;
}
.page-dashboard .bar-fill.cobradas {
    background: #34d399;
}
.page-dashboard .bar-fill.nao-verificadas {
    background: #f59e0b;
}
.page-dashboard .value-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.page-dashboard .value-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    display: inline-block;
}
/* Acompanhamento de Orçadas — indicador de consumo (apontado / orçado) */
.page-dashboard .orcada-consumo-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}
.page-dashboard .orcada-consumo-dot--verde {
    background: #22c55e;
}
.page-dashboard .orcada-consumo-dot--amarelo {
    background: #eab308;
}
.page-dashboard .orcada-consumo-dot--laranja {
    background: #f97316;
}
.page-dashboard .orcada-consumo-dot--vermelho {
    background: #ef4444;
}
.page-dashboard .orcada-consumo-dot--neutro {
    background: #94a3b8;
}
.page-dashboard th.col-orcada-consumo {
    width: 2.25rem;
    text-align: center;
    padding-left: 4px;
    padding-right: 4px;
}
.page-dashboard td.col-orcada-consumo {
    text-align: center;
    vertical-align: middle;
}
.page-dashboard .bar-totals {
    display: grid;
    gap: 4px;
    font-size: 12px;
    color: var(--muted);
    justify-items: end;
    min-width: 96px;
}
.page-dashboard .chart-legend {
    display: flex;
    gap: 16px;
    align-items: center;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 12px;
}
.page-dashboard .pie-wrap {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 12px;
    align-items: center;
}
.page-dashboard .pie {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: #e5e7eb;
    position: relative;
}
.page-dashboard .pie-center {
    position: absolute;
    inset: 44px;
    background: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    color: var(--muted);
    text-align: center;
    padding: 8px;
    flex-direction: column;
    gap: 4px;
}
.page-dashboard .legend {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 11px;
    color: var(--muted);
    max-width: none;
    width: 100%;
}
.page-dashboard .legend-strong {
    font-weight: 700;
}
.page-dashboard .legend-item {
    display: grid;
    grid-template-columns: 14px 1fr;
    gap: 8px;
    align-items: center;
}
.page-dashboard .legend-color {
    width: 12px;
    height: 12px;
    border-radius: 3px;
}
.page-dashboard .period-header {
    display: flex;
    align-items: center;
    gap: 8px;
}
.page-dashboard .period-toggle {
    padding: 2px 6px;
    border-radius: 6px;
    background: #e5e7eb;
    color: #111827;
    border: none;
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
    font-size: 12px;
}
.page-dashboard .period-toggle:hover {
    background: #d1d5db;
}
.page-dashboard .period-nav {
    padding: 2px 6px;
    border-radius: 6px;
    background: #e5e7eb;
    color: #111827;
    border: none;
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
    font-size: 12px;
}
.page-dashboard .period-toggle svg,
.page-dashboard .period-nav svg {
    width: 14px;
    height: 14px;
    display: block;
}
.page-dashboard .period-nav:hover {
    background: #d1d5db;
}
.page-dashboard .filter-card.is-hidden {
    display: none;
}
.page-dashboard .resumo-table th,
.page-dashboard .resumo-table td {
    padding: 8px 6px;
    font-size: 16px;
}
.page-dashboard .resumo-table td {
    white-space: nowrap;
}
.page-dashboard .resumo-table td.num {
    font-size: 17px;
}
.page-dashboard .resumo-table .link-num {
    color: inherit;
    text-decoration: underline;
}
.page-dashboard .resumo-table .link-num:hover {
    color: var(--accent);
}
.page-dashboard .resumo-table .col-nao-atendidas,
.page-dashboard .resumo-table .col-nao-cobradas,
.page-dashboard .resumo-table .col-cobradas {
    font-weight: 700;
}
.page-dashboard .resumo-table th {
    text-align: center;
}
.page-dashboard .resumo-table td {
    text-align: center;
}
.page-dashboard .resumo-table td:first-child,
.page-dashboard .resumo-table td:nth-child(2) {
    white-space: normal;
    text-align: left;
}
.page-dashboard .resumo-table .total-row td {
    font-weight: 700;
    border-top: 2px solid #111827;
}
.page-dashboard .resumo-table .alert-row td {
    background: #fef2f2;
}
.page-dashboard .resumo-table .group-separator td {
    border-top: 2px solid #111827;
}
.page-dashboard .resumo-table .col-nao-pre,
.page-dashboard .resumo-table .col-apontadas,
.page-dashboard .resumo-table .col-projetos,
.page-dashboard .resumo-table .col-horas,
.page-dashboard .resumo-table .col-a-faturar {
    color: var(--muted);
}
.page-dashboard .resumo-table .col-nao-atendidas {
    color: #f97316;
}
.page-dashboard .resumo-table .col-nao-cobradas {
    color: #ef4444;
}
.page-dashboard .resumo-table .col-cobradas {
    color: #22c55e;
}
.page-dashboard .resumo-table .bg-red {
    background-color: #ef4444 !important;
    color: #fff !important;
}
.page-dashboard .resumo-table .bg-blue {
    background-color: #2563eb !important;
    color: #fff !important;
}
.page-dashboard .resumo-table .bg-yellow {
    background-color: #f59e0b !important;
    color: #fff !important;
}
.page-dashboard .contract-cell {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.page-dashboard .contract-bar {
    height: 6px;
    border-radius: 999px;
    background: #60a5fa;
    overflow: hidden;
}
.page-dashboard .contract-bar-work {
    height: 100%;
    background: #22c55e;
}
.page-dashboard .contract-bar-work.over {
    background: #ef4444;
}
.page-dashboard .modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(17, 24, 39, 0.55);
    z-index: 40;
}
.page-dashboard .modal.is-open {
    display: flex;
}
.page-dashboard .modal-dialog {
    width: min(480px, 100%);
    max-height: 90vh;
    overflow: auto;
    background: var(--card);
    border-radius: 12px;
    border: 1px solid var(--border);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}
.page-dashboard .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}
.page-dashboard .modal-title {
    font-size: 16px;
    margin: 0;
}
.page-dashboard .modal-close {
    border: none;
    background: transparent;
    color: var(--muted);
    font-size: 16px;
    cursor: pointer;
    padding: 4px;
}
.page-dashboard .modal-body {
    padding: 16px 20px 20px;
}
.page-dashboard .modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}
.page-dashboard .btn-secondary {
    background: #e5e7eb;
    color: #111827;
}
.page-dashboard .btn-secondary:hover {
    background: #d1d5db;
}

/* Verificar orçadas */
.page-verificar-orcadas .verificar-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 16px;
    align-items: start;
}
.page-verificar-orcadas .filter-stack {
    display: grid;
    gap: 12px;
}
.page-verificar-orcadas .filter-stack label {
    font-size: 11px;
    margin-bottom: 4px;
}
.page-verificar-orcadas .filter-stack select {
    font-size: 12px;
    padding: 8px 10px;
}
.page-verificar-orcadas .filter-stack button {
    padding: 8px 12px;
    font-size: 12px;
}
.page-verificar-orcadas .results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.page-verificar-orcadas .results-count {
    font-size: 12px;
    color: var(--muted);
}
.page-verificar-orcadas .os-meta {
    display: block;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 2px;
}
.page-verificar-orcadas .os-table td,
.page-verificar-orcadas .os-table th {
    padding: 8px 6px;
    font-size: 13px;
}
.page-verificar-orcadas .row-clickable {
    cursor: pointer;
}
.page-verificar-orcadas .row-clickable:hover {
    background: #f9fafb;
}
.page-verificar-orcadas .btn-icon {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--text);
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.page-verificar-orcadas .btn-icon svg {
    width: 16px;
    height: 16px;
}
.page-verificar-orcadas .btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.page-verificar-orcadas .btn-with-icon svg {
    width: 16px;
    height: 16px;
}
.page-verificar-orcadas .btn-link {
    color: var(--muted);
    font-size: 13px;
    text-decoration: underline;
    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;
}
.page-verificar-orcadas .modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(17, 24, 39, 0.55);
    z-index: 40;
}
.page-verificar-orcadas .modal.is-open {
    display: flex;
}
.page-verificar-orcadas .modal-dialog {
    width: min(720px, 100%);
    max-height: 90vh;
    overflow: auto;
    background: var(--card);
    border-radius: 12px;
    border: 1px solid var(--border);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}
.page-verificar-orcadas .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}
.page-verificar-orcadas .modal-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    margin: 0;
}
.page-verificar-orcadas .modal-title svg {
    width: 18px;
    height: 18px;
    color: var(--muted);
}
.page-verificar-orcadas .modal-body {
    padding: 16px 20px 20px;
}
.page-verificar-orcadas .os-modal-meta {
    display: grid;
    gap: 4px;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 8px;
}
.page-verificar-orcadas .os-modal-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}
.page-verificar-orcadas .os-modal-fields .full-row {
    grid-column: 1 / -1;
}
.page-verificar-orcadas .modal-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 16px;
}
@media (max-width: 960px) {
    .page-verificar-orcadas .verificar-grid {
        grid-template-columns: 1fr;
    }
}

/* Pré-faturamento */
.page-pre-faturamento .prefaturamento-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 16px;
    align-items: start;
}
.page-pre-faturamento .filter-stack {
    display: grid;
    gap: 12px;
}
.page-pre-faturamento .filter-stack label {
    font-size: 11px;
    margin-bottom: 4px;
}
.page-pre-faturamento .filter-stack select,
.page-pre-faturamento .filter-stack input[type="month"],
.page-pre-faturamento .filter-stack input[type="text"] {
    font-size: 12px;
    padding: 8px 10px;
}
.page-pre-faturamento .checkbox-group {
    display: grid;
    gap: 6px;
}
.page-pre-faturamento .checkbox-item {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--muted);
}
.page-pre-faturamento .checkbox-item input[type="checkbox"] {
    width: 14px;
    height: 14px;
}
.page-pre-faturamento .filter-stack button {
    padding: 8px 12px;
    font-size: 12px;
}
.page-pre-faturamento .results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.page-pre-faturamento .results-count {
    font-size: 12px;
    color: var(--muted);
}
.page-pre-faturamento .os-meta {
    display: block;
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 2px;
}
.page-pre-faturamento .total-hours {
    margin-top: 12px;
    font-size: 14px;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    color: var(--muted);
}
.page-pre-faturamento .total-hours strong {
    color: var(--accent);
}
.page-pre-faturamento .os-row {
    cursor: pointer;
}
.page-pre-faturamento .os-details {
    display: none;
}
.page-pre-faturamento .os-details.is-open {
    display: table-row;
}
.page-pre-faturamento .os-details .details-wrap {
    padding: 12px;
    background: #fbfbfb;
    border: 1px solid var(--border);
    border-radius: 8px;
}
.page-pre-faturamento .entry-card {
    border: 1px solid var(--border);
    border-radius: 8px;
    padding: 12px;
    margin-bottom: 12px;
    background: #fff;
}
.page-pre-faturamento .entry-card:last-child {
    margin-bottom: 0;
}
.page-pre-faturamento .entry-header {
    display: grid;
    grid-template-columns: 1.6fr 0.8fr 0.8fr 0.6fr;
    gap: 8px;
    align-items: center;
    font-size: 12px;
    color: var(--muted);
}
.page-pre-faturamento .entry-hours {
    font-size: 16px;
    font-weight: 700;
    color: var(--accent);
}
.page-pre-faturamento .entry-meta {
    margin: 8px 0;
    font-size: 12px;
    color: var(--muted);
}
.page-pre-faturamento .entry-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    margin-top: 8px;
}
.page-pre-faturamento .toggle-group {
    display: flex;
    gap: 8px;
    align-items: center;
    font-size: 12px;
    color: var(--muted);
}
.page-pre-faturamento .toggle-group label {
    margin: 0;
    font-size: 12px;
}
.page-pre-faturamento .save-status {
    font-size: 12px;
    color: var(--success);
}
.page-pre-faturamento .entry-actions button {
    margin-left: auto;
}
.page-pre-faturamento textarea {
    width: 100%;
    min-height: 80px;
    resize: vertical;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    font-family: inherit;
    font-size: 14px;
}
.page-pre-faturamento .os-table td,
.page-pre-faturamento .os-table th {
    padding: 8px 6px;
    font-size: 13px;
}
@media (max-width: 960px) {
    .page-pre-faturamento .prefaturamento-grid {
        grid-template-columns: 1fr;
    }
}

/* BI */
.page-bi .filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    align-items: end;
    font-size: 12px;
}
.page-bi .filter-group {
    margin-bottom: 12px;
}
.page-bi .filter-group h3 {
    margin: 0 0 8px;
    font-size: 11px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-bi .summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}
.page-bi .summary-block {
    padding: 12px;
    border: 1px dashed var(--border);
    border-radius: 8px;
}
.page-bi .summary-block h3 {
    margin: 0 0 8px;
    font-size: 12px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-bi .summary-line {
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    font-size: 13px;
}
.page-bi .bi-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.page-bi .bi-actions button,
.page-bi .bi-actions a {
    padding: 6px 12px;
    border-radius: 6px;
    background: #e5e7eb;
    color: #111827;
    border: none;
    cursor: pointer;
    font-weight: 700;
    line-height: 1;
}
.page-bi .bi-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.page-bi .bi-actions button:hover,
.page-bi .bi-actions a:hover {
    background: #d1d5db;
}
.page-bi .bi-table th,
.page-bi .bi-table td {
    text-align: right;
    white-space: nowrap;
}
.page-bi .bi-table th:first-child,
.page-bi .bi-table td:first-child {
    text-align: left;
    white-space: normal;
}
.page-bi .bi-table .total-row td,
.page-bi .bi-table .total-col {
    font-weight: 700;
    border-top: 2px solid var(--border);
}
.page-bi .pivot-fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 12px;
}
.page-bi .chart-wrap {
    position: relative;
    width: 100%;
    min-height: 320px;
}
.page-bi .save-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    align-items: end;
}
.page-bi .filters label {
    font-size: 11px;
}
.page-bi .filters select,
.page-bi .filters input[type="text"],
.page-bi .filters input[type="date"],
.page-bi .filters input[type="datetime-local"],
.page-bi .filters input[type="month"] {
    padding: 6px 8px;
    font-size: 12px;
}
.page-bi .bi-actions button,
.page-bi .bi-actions a {
    padding: 6px 10px;
    font-size: 12px;
}
.page-bi .inline-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}

/* Apontamentos */
.page-apontamentos .filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    align-items: end;
}
.page-apontamentos .filter-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.page-apontamentos .label-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--muted);
}
.page-apontamentos .label-check input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
}
.page-apontamentos .filter-break {
    grid-column: 1 / -1;
    height: 0;
}
.page-apontamentos .label-hint {
    font-weight: normal;
    color: var(--muted);
    font-size: 0.9em;
}
.page-apontamentos .filters-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    align-self: end;
}
.page-apontamentos .filters-actions a.btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--accent);
    color: #fff;
    font-weight: 600;
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
    border: none;
    line-height: 1.2;
}
.page-apontamentos .filters-actions a.btn-with-icon:hover {
    filter: brightness(1.06);
}
.page-apontamentos .filters-actions a.btn-with-icon svg {
    width: 16px;
    height: 16px;
}
.page-apontamentos .filters-actions .btn-with-icon.is-loading {
    pointer-events: none;
    opacity: 0.7;
}
.page-apontamentos .print-logo {
    display: none;
}
.page-apontamentos .print-logo img {
    display: block;
    width: 120px;
    height: auto;
}
.page-apontamentos .mainrow td {
    border-bottom: none;
    padding-bottom: 4px;
}
.page-apontamentos .subrow td {
    background: #fbfbfb;
    color: var(--muted);
    font-size: 12px;
    border-bottom: 1px solid var(--border);
    padding-top: 0;
    padding-bottom: 12px;
}

/* Auditoria de Apontamentos (sobreposições) — “caixa” fechada 2px ao redor de A+B+sobreposição */
.page-auditoria-apontamentos table.auditoria-overlap-pairs {
    table-layout: auto;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}
/* Tabela de pares: fonte menor; o resumo final (.auditoria-resumo-fim) não usa .auditoria-overlap-pairs */
.page-auditoria-apontamentos table.auditoria-overlap-pairs th,
.page-auditoria-apontamentos table.auditoria-overlap-pairs td {
    font-size: 11px;
    line-height: 1.35;
}
.page-auditoria-apontamentos table.auditoria-overlap-pairs .auditoria-col-nowrap {
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
}
/* imprimir: o layout de apontamentos força break-word no td; manter colunas ap/início/fim em uma linha */
@media print {
    .page-auditoria-apontamentos table.auditoria-overlap-pairs th.auditoria-col-nowrap,
    .page-auditoria-apontamentos table.auditoria-overlap-pairs td.auditoria-col-nowrap {
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
    }
}
/* espaço vazio entre um grupo (par) e o seguinte; sem bordas, para não conflitar com a caixa */
.page-auditoria-apontamentos tr.auditoria-pair-gap td {
    height: 12px;
    padding: 0;
    line-height: 0;
    font-size: 0;
    border: none !important;
    background: transparent;
    box-shadow: none;
    vertical-align: top;
}
/* reseta a borda padrão th/td do app nas linhas do par (redesenhamos) */
.page-auditoria-apontamentos tr.auditoria-row-a th,
.page-auditoria-apontamentos tr.auditoria-row-a td,
.page-auditoria-apontamentos tr.auditoria-row-b th,
.page-auditoria-apontamentos tr.auditoria-row-b td {
    border: none;
}
/* Linha A: topo e divisória interna A|B */
.page-auditoria-apontamentos tr.auditoria-row-a > th {
    border-top: 2px solid var(--text) !important;
    border-left: 2px solid var(--text) !important;
    border-bottom: 1px solid var(--border) !important;
    border-right: 1px solid var(--border) !important;
    vertical-align: middle;
    padding: 8px 8px 10px;
}
.page-auditoria-apontamentos tr.auditoria-row-a > td:not(.auditoria-overlap-value) {
    border-top: 2px solid var(--text) !important;
    border-bottom: 1px solid var(--border) !important;
    border-left: 1px solid var(--border) !important;
    border-right: 1px solid var(--border) !important;
    vertical-align: middle;
    padding: 8px 8px 10px;
}
.page-auditoria-apontamentos tr.auditoria-row-a > td.auditoria-overlap-value {
    min-width: 5.5rem;
    width: 6.5rem;
    border-top: 2px solid var(--text) !important;
    border-left: 1px solid var(--border) !important;
    border-right: 2px solid var(--text) !important;
    border-bottom: 2px solid var(--text) !important; /* borda de fechamento inferior do “bloco” (rowspan) */
    vertical-align: middle;
    padding: 8px 8px;
    background: rgba(0, 0, 0, 0.04);
    text-align: center;
    font-weight: 600;
}
/* evita linha dupla entre coluna “Fim” e sobreposição */
.page-auditoria-apontamentos tr.auditoria-row-a > td.aud-cell-before-overlap,
.page-auditoria-apontamentos tr.auditoria-row-b > td.aud-cell-before-overlap {
    border-right: none !important;
}
/* Linha B: base e cantos; sem topo (coluna A–Fim encosta na divisória A|B) */
.page-auditoria-apontamentos tr.auditoria-row-b > th {
    border-left: 2px solid var(--text) !important;
    border-bottom: 2px solid var(--text) !important;
    border-right: 1px solid var(--border) !important;
    vertical-align: middle;
    padding: 8px 8px 10px;
}
.page-auditoria-apontamentos tr.auditoria-row-b > td:not(.auditoria-overlap-value) {
    border-bottom: 2px solid var(--text) !important;
    border-left: 1px solid var(--border) !important;
    border-right: 1px solid var(--border) !important;
    vertical-align: middle;
    padding: 8px 8px 10px;
}
@media (prefers-color-scheme: dark) {
    .page-auditoria-apontamentos tr.auditoria-row-a > td.auditoria-overlap-value {
        background: rgba(255, 255, 255, 0.05);
    }
}
.page-auditoria-apontamentos .auditoria-col-role {
    width: 2rem;
    text-align: center;
    color: var(--muted);
    font-weight: 600;
    vertical-align: middle;
}
.page-auditoria-apontamentos thead th.auditoria-col-overlap {
    width: 6.5rem;
    min-width: 5.5rem;
    text-align: center;
    vertical-align: bottom;
}
.page-auditoria-apontamentos .auditoria-os-title {
    max-width: 16rem;
    word-break: break-word;
    line-height: 1.25;
}

/* Integridade de Apontamentos — tabelas na 1ª seção (hash) */
.page-integridade-apontamentos table.integ-violation-meta th.integ-td-label,
.page-integridade-apontamentos table.integ-violation-hash th.integ-td-label {
    width: 11rem;
    max-width: 35%;
    text-align: left;
    text-transform: none;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: normal;
    color: var(--muted);
    background: rgba(0, 0, 0, 0.03);
    vertical-align: top;
}
.page-integridade-apontamentos table.integ-violation-meta td,
.page-integridade-apontamentos table.integ-violation-hash td {
    font-size: 13px;
}
.page-integridade-apontamentos .integ-td-pre {
    white-space: pre-wrap;
    word-break: break-word;
    line-height: 1.45;
}
.page-integridade-apontamentos .integ-code-tiny {
    font-size: 0.82em;
    word-break: break-all;
}
.page-integridade-apontamentos table.integ-violation-horarios th {
    text-transform: none;
    letter-spacing: normal;
    font-size: 11px;
}
.page-integridade-apontamentos table.integ-violation-horarios td {
    font-size: 13px;
}
.page-integridade-apontamentos .integ-subtable-title {
    color: var(--text);
}
/* Bloco de cada violação: contorno externo espesso, preto puro (sem sombra; tema escuro: branco para contraste). */
.page-integridade-apontamentos .integ-violation-card {
    background: var(--card);
    border-radius: 10px;
    padding: 16px;
    margin: 0 0 1.5rem;
    text-align: left;
    border: 4px solid #000;
    box-shadow: none;
}
@media (prefers-color-scheme: dark) {
    .page-integridade-apontamentos .integ-violation-card {
        border: 4px solid #fff;
    }
}

.page-apontamentos .os-title,
.page-apontamentos .os-desc {
    margin: 0;
    line-height: 1.2;
}
.page-apontamentos .summary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.page-apontamentos .summary-block {
    padding: 12px;
    border: 1px dashed var(--border);
    border-radius: 8px;
}
.page-apontamentos .summary-block h3 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-apontamentos .summary-line {
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    font-size: 14px;
}
.page-apontamentos .total-pay {
    font-size: 20px;
    font-weight: 700;
    color: var(--accent);
}
.page-apontamentos .badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 12px;
    background: rgba(37, 99, 235, 0.08);
    color: var(--accent);
    font-weight: 600;
}
@media print {
    .page-apontamentos .filters,
    .page-apontamentos .card.filters-card,
    .page-apontamentos .sidebar,
    .page-apontamentos .topbar {
        display: none !important;
    }
    .page-apontamentos .content {
        padding: 0;
    }
    body.page-apontamentos {
        background: #fff;
    }
    .page-apontamentos .print-logo {
        display: block !important;
        position: relative;
        padding: 0 0 8px 0;
    }
    .page-apontamentos table {
        table-layout: fixed;
        width: 100%;
    }
    .page-apontamentos th, .page-apontamentos td {
        word-break: break-word;
        overflow-wrap: anywhere;
    }
}

/* Valores (layout) */
.page-clientes .section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}
.page-clientes .section-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.page-clientes .section-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}
.page-clientes .section-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 18px;
}
.page-clientes .section-title svg {
    width: 18px;
    height: 18px;
    color: var(--muted);
}
.page-clientes .grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    align-items: end;
}
.page-clientes .full-row {
    grid-column: 1 / -1;
}
.page-clientes .form-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
}
.page-clientes .field-hint {
    display: block;
    font-size: 12px;
    color: var(--muted);
    margin-top: 6px;
}
.page-clientes .checklist {
    display: grid;
    gap: 8px;
}
.page-clientes .users-list {
    margin-top: 16px;
}
.page-clientes .users-list h4 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
}
.page-clientes .filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: end;
    padding: 12px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #f9fafb;
    margin-bottom: 12px;
}
.page-clientes .filter-field {
    flex: 1;
    min-width: 240px;
}
.page-clientes .check-field {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--muted);
}
.page-clientes .check-field input {
    width: auto;
}
.page-clientes .filter-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.page-clientes .btn-link {
    color: var(--muted);
    font-size: 13px;
    text-decoration: underline;
}
.page-clientes .tabs {
    display: inline-flex;
    gap: 8px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 16px;
}
.page-clientes .tab-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 12px;
}
.page-clientes .tab-button {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--muted);
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 13px;
    cursor: pointer;
}
.page-clientes .tab-button.is-active {
    border-color: rgba(37, 99, 235, 0.4);
    color: var(--accent);
    background: rgba(37, 99, 235, 0.08);
}
.page-clientes .tab-panel {
    display: none;
}
.page-clientes .tab-panel.is-active {
    display: block;
}
.page-clientes .contracts-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}
.page-clientes .contracts-table th,
.page-clientes .contracts-table td {
    padding: 8px 6px;
    border-bottom: 1px solid var(--border);
}
.page-clientes .history-block {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px dashed var(--border);
}
.page-clientes .history-block h4 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
}
.page-clientes .client-contracts {
    display: grid;
    gap: 12px;
}
.page-clientes .contract-card {
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 12px;
    background: #fff;
}
.page-clientes .contract-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.page-clientes .contract-title {
    font-weight: 600;
    margin-bottom: 4px;
}
.page-clientes .contract-sub {
    font-size: 12px;
    color: var(--muted);
}
.page-clientes .contract-actions {
    display: inline-flex;
    gap: 8px;
}
.page-clientes .contract-values {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px dashed var(--border);
    display: grid;
    gap: 10px;
}
.page-clientes .contract-value {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 10px;
    background: #f9fafb;
}
.page-clientes .value-title {
    font-size: 13px;
}
.page-clientes .value-sub {
    font-size: 12px;
    color: var(--muted);
}
.page-clientes .value-actions {
    display: inline-flex;
    gap: 6px;
}
.page-clientes .action-cell {
    width: 64px;
    text-align: center;
}
.page-clientes .btn-icon {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--text);
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.page-clientes .btn-icon svg {
    width: 16px;
    height: 16px;
}
.page-clientes .btn-icon.danger {
    color: var(--error);
}
.page-clientes .btn-icon.danger:hover {
    border-color: rgba(185,28,28,0.3);
    background: rgba(185,28,28,0.06);
}
.page-clientes .btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.page-clientes .btn-with-icon svg {
    width: 16px;
    height: 16px;
}
.page-clientes .inline-form {
    margin: 0;
}
.page-clientes .row-clickable {
    cursor: pointer;
}
.page-clientes .row-clickable:hover {
    background: #f9fafb;
}
.page-clientes .hint {
    color: var(--muted);
    font-size: 12px;
    margin-top: 8px;
}
.page-clientes .results-count {
    font-size: 12px;
    color: var(--muted);
}
.page-clientes .modal {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(17, 24, 39, 0.55);
    z-index: 40;
}
.page-clientes .modal.is-open {
    display: flex;
}
.page-clientes .modal-dialog {
    width: min(960px, 100%);
    max-height: 90vh;
    overflow: auto;
    background: var(--card);
    border-radius: 12px;
    border: 1px solid var(--border);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
}
.page-clientes .modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--border);
}
.page-clientes .modal-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    margin: 0;
}
.page-clientes .modal-title svg {
    width: 18px;
    height: 18px;
    color: var(--muted);
}
.page-clientes .modal-body {
    padding: 16px 20px 20px;
}
body.modal-open {
    overflow: hidden;
}

/* Logs */
.page-logs .results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.page-logs .results-count {
    font-size: 12px;
    color: var(--muted);
}
.page-logs .log-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin: 12px 0 16px;
}
.page-logs .log-filters .full-row {
    grid-column: 1 / -1;
}
.page-logs .form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.page-logs .btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.page-logs .btn-with-icon svg {
    width: 16px;
    height: 16px;
}
.page-logs .btn-link {
    color: var(--muted);
    font-size: 13px;
    text-decoration: underline;
}
.page-logs .logs-table td,
.page-logs .logs-table th {
    padding: 8px 6px;
    font-size: 13px;
}
.page-logs .log-details {
    margin: 0;
    white-space: pre-wrap;
    word-break: break-word;
    font-size: 12px;
    color: var(--muted);
}
.table-sortable th {
    cursor: pointer;
    user-select: none;
}
.table-sortable th.is-sorted {
    color: var(--accent);
}
.table-sortable th .sort-indicator {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    color: var(--muted);
}
.table-sortable th.is-sorted .sort-indicator {
    color: var(--accent);
}
.table-sortable th .sort-indicator svg {
    width: 14px;
    height: 14px;
}
@media (max-width: 960px) {
    .page-logs .log-filters {
        grid-template-columns: 1fr;
    }
}

/* Valores (layout) */
.page-valores .action-cell {
    width: 48px;
    text-align: center;
}
.page-valores .btn-trash {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--error);
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
}
.page-valores .btn-trash:hover {
    border-color: rgba(185,28,28,0.3);
    background: rgba(185,28,28,0.06);
}
.page-valores .inline-form {
    margin: 0;
}
.page-valores tr[data-row] {
    cursor: pointer;
}
.page-valores tr[data-row]:hover {
    background: #f9fafb;
}
.page-valores .grid {
    display: grid;
    grid-template-columns: 1fr 1fr 160px 160px 180px auto;
    gap: 12px;
    align-items: end;
}
.page-valores .hint {
    color: var(--muted);
    font-size: 12px;
    margin-top: 8px;
}

/* Fechamento (layout) */
.page-fechamento-cliente .filters {
    display: grid;
    grid-template-columns: 1fr 1fr 200px auto;
    gap: 12px;
    align-items: end;
}
.page-fechamento-cliente .filters-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    align-self: end;
}
.page-fechamento-cliente .filters-actions a.btn-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border-radius: 8px;
    background: var(--accent);
    color: #fff;
    font-weight: 600;
    font-size: inherit;
    font-family: inherit;
    cursor: pointer;
    border: none;
    line-height: 1.2;
}
.page-fechamento-cliente .filters-actions a.btn-with-icon:hover {
    filter: brightness(1.06);
}
.page-fechamento-cliente .filters-actions a.btn-with-icon svg {
    width: 16px;
    height: 16px;
}
.page-fechamento-cliente .filters-actions .btn-with-icon.is-loading {
    pointer-events: none;
    opacity: 0.7;
}
@media screen {
    .page-fechamento-cliente .print-logo {
        display: none;
    }
}
.page-fechamento-cliente .print-logo img {
    display: block;
    width: 120px;
    height: auto;
}
.page-fechamento-cliente .filter-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}
.page-fechamento-cliente .label-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 11px;
    color: var(--muted);
}
.page-fechamento-cliente .label-check input[type="checkbox"] {
    width: 14px;
    height: 14px;
    margin: 0;
}
.page-fechamento-cliente .subrow td {
    background: #fbfbfb;
    color: var(--muted);
    font-size: 12px;
    border-bottom: none;
}
.page-fechamento-cliente table tbody tr:not(.subrow) td {
    font-weight: 600;
}
.page-fechamento-cliente .subrow .entry-line {
    padding: 6px 0;
    border-bottom: 1px dashed var(--border);
}
.page-fechamento-cliente .subrow .entry-line:last-child {
    border-bottom: none;
}
.page-fechamento-cliente .summary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.page-fechamento-cliente .summary-block {
    padding: 12px;
    border: 1px dashed var(--border);
    border-radius: 8px;
}
.page-fechamento-cliente .summary-block h3 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-fechamento-cliente .summary-line {
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    font-size: 14px;
}
.page-fechamento-cliente .total-pay {
    font-size: 20px;
    font-weight: 700;
    color: var(--accent);
}
@media print {
    .page-fechamento-cliente .filters,
    .page-fechamento-cliente .card.filters-card,
    .page-fechamento-cliente .sidebar,
    .page-fechamento-cliente .topbar {
        display: none !important;
    }
    .page-fechamento-cliente .content {
        padding: 0;
    }
    body.page-fechamento-cliente {
        background: #fff;
    }
    .page-fechamento-cliente .print-logo {
        display: block !important;
        position: static;
        padding: 0 0 16px 0;
    }
}

/* Relatório de fechamento (standalone) */
.page-fechamento-relatorio header {
    padding: 24px 24px 8px;
}
.page-fechamento-relatorio .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 24px 48px;
}
.page-fechamento-relatorio h1 {
    margin: 0 0 8px;
    font-size: 24px;
}
.page-fechamento-relatorio .subtitle {
    color: var(--muted);
    font-size: 14px;
}
.page-fechamento-relatorio .filters {
    display: grid;
    grid-template-columns: 1fr 1fr 200px auto;
    gap: 12px;
    align-items: end;
}
.page-fechamento-relatorio .subrow td {
    background: #fbfbfb;
    color: var(--muted);
    font-size: 12px;
    border-bottom: none;
}
.page-fechamento-relatorio .subrow .entry-line {
    padding: 6px 0;
    border-bottom: 1px dashed var(--border);
}
.page-fechamento-relatorio .subrow .entry-line:last-child {
    border-bottom: none;
}
.page-fechamento-relatorio .summary-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.page-fechamento-relatorio .summary-block {
    padding: 12px;
    border: 1px dashed var(--border);
    border-radius: 8px;
}
.page-fechamento-relatorio .summary-block h3 {
    margin: 0 0 8px;
    font-size: 14px;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-fechamento-relatorio .summary-line {
    display: flex;
    justify-content: space-between;
    margin: 6px 0;
    font-size: 14px;
}
.page-fechamento-relatorio .total-pay {
    font-size: 20px;
    font-weight: 700;
    color: var(--accent);
}
.page-fechamento-relatorio .error {
    color: #b91c1c;
    font-weight: 600;
}
@media print {
    .page-fechamento-relatorio .filters,
    .page-fechamento-relatorio .card.filters-card {
        display: none !important;
    }
    .page-fechamento-relatorio header,
    .page-fechamento-relatorio .container {
        padding: 0;
    }
    body.page-fechamento-relatorio {
        background: #fff;
    }
}

/* Valores por cliente (standalone) */
.page-valores-relatorio header {
    padding: 24px 24px 8px;
}
.page-valores-relatorio .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 16px 24px 48px;
}
.page-valores-relatorio h1 {
    margin: 0 0 8px;
    font-size: 24px;
}
.page-valores-relatorio .subtitle {
    color: var(--muted);
    font-size: 14px;
}
.page-valores-relatorio .action-cell {
    width: 48px;
    text-align: center;
}
.page-valores-relatorio .btn-trash {
    border: 1px solid var(--border);
    background: #fff;
    color: var(--error);
    padding: 6px 8px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
}
.page-valores-relatorio .btn-trash:hover {
    border-color: rgba(185,28,28,0.3);
    background: rgba(185,28,28,0.06);
}
.page-valores-relatorio .inline-form {
    margin: 0;
}
.page-valores-relatorio tr[data-row] {
    cursor: pointer;
}
.page-valores-relatorio tr[data-row]:hover {
    background: #f9fafb;
}
.page-valores-relatorio .grid {
    display: grid;
    grid-template-columns: 1fr 1fr 160px 160px 180px auto;
    gap: 12px;
    align-items: end;
}
.page-valores-relatorio .hint {
    color: var(--muted);
    font-size: 12px;
    margin-top: 8px;
}

/* Responsivo */
@media (max-width: 1024px) {
    .app {
        overflow-x: hidden;
    }
    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: 240px;
        transform: translateX(0);
        transition: transform 0.2s ease;
        z-index: 20;
        overflow-y: auto;
    }
    .app.is-collapsed .sidebar {
        width: 240px;
        padding: 24px 20px;
        transform: translateX(-100%);
    }
    .app.is-collapsed .sidebar .brand-text,
    .app.is-collapsed .sidebar .user-info,
    .app.is-collapsed .sidebar .menu-title span,
    .app.is-collapsed .sidebar .menu-chevron,
    .app.is-collapsed .sidebar .menu-link span {
        display: inline;
    }
    .app.is-collapsed .sidebar .brand-short {
        display: none;
    }
    .app.is-collapsed .sidebar .menu-title {
        padding: 8px 10px;
        justify-content: space-between;
    }
    .app.is-collapsed .sidebar .menu-link {
        padding: 8px 10px;
        justify-content: flex-start;
    }
    .app.is-collapsed .sidebar .menu-items {
        max-height: 0 !important;
        opacity: 0 !important;
    }
    .app.is-collapsed .sidebar .menu-group.is-open .menu-items {
        max-height: 500px !important;
        opacity: 1 !important;
    }
    .content {
        padding: 16px 20px 32px;
    }
    .topbar {
        flex-wrap: wrap;
        gap: 12px;
    }
    .page-title {
        font-size: 20px;
    }
}

.page-rentabilidade-por-cliente .num,
.page-rentabilidade-por-contrato .num,
.page-rentabilidade-por-dev .num {
    text-align: right;
}
/* Cabeçalhos de coluna centralizados (sobrescreve .num só no thead) */
.page-rentabilidade-por-cliente table thead th.num,
.page-rentabilidade-por-contrato table thead th.num,
.page-rentabilidade-por-dev table thead th.num {
    text-align: center;
}
.page-rentabilidade-por-cliente .profit,
.page-rentabilidade-por-contrato .profit,
.page-rentabilidade-por-dev .profit {
    font-weight: 600;
}
.page-rentabilidade-por-cliente .profit.negative,
.page-rentabilidade-por-contrato .profit.negative,
.page-rentabilidade-por-dev .profit.negative {
    color: var(--error);
}
.page-rentabilidade-por-cliente .profit.positive,
.page-rentabilidade-por-contrato .profit.positive,
.page-rentabilidade-por-dev .profit.positive {
    color: var(--accent);
}
.page-rentabilidade-por-cliente table thead th,
.page-rentabilidade-por-contrato table thead th,
.page-rentabilidade-por-dev table thead th {
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
    text-align: center;
}
.page-rentabilidade-por-cliente table tfoot th,
.page-rentabilidade-por-cliente table tfoot td,
.page-rentabilidade-por-contrato table tfoot th,
.page-rentabilidade-por-contrato table tfoot td,
.page-rentabilidade-por-dev table tfoot th,
.page-rentabilidade-por-dev table tfoot td {
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
    letter-spacing: normal;
}
.page-rentabilidade-por-cliente table.rent-table,
.page-rentabilidade-por-contrato table.rent-table,
.page-rentabilidade-por-dev table {
    font-size: 13px;
}
/* Largura mínima por conteúdo (evita esticar colunas no vazio) */
.page-rentabilidade-por-cliente table.rent-table,
.page-rentabilidade-por-contrato table.rent-table {
    width: max-content;
    max-width: 100%;
    table-layout: auto;
}
.page-rentabilidade-por-cliente table.rent-table tbody td.num,
.page-rentabilidade-por-cliente table.rent-table tfoot th.num,
.page-rentabilidade-por-cliente table.rent-table tfoot td.num,
.page-rentabilidade-por-contrato table.rent-table tbody td.num,
.page-rentabilidade-por-contrato table.rent-table tfoot th.num,
.page-rentabilidade-por-contrato table.rent-table tfoot td.num {
    width: 1%;
    white-space: nowrap;
    padding-left: 6px;
    padding-right: 6px;
}
.page-rentabilidade-por-cliente table.rent-table thead th.num,
.page-rentabilidade-por-contrato table.rent-table thead th.num {
    width: 1%;
    padding-left: 6px;
    padding-right: 6px;
}
.page-rentabilidade-por-cliente table.rent-table th,
.page-rentabilidade-por-cliente table.rent-table td,
.page-rentabilidade-por-contrato table.rent-table th,
.page-rentabilidade-por-contrato table.rent-table td {
    padding: 8px 6px;
}
.page-rentabilidade-por-cliente table.rent-table thead th,
.page-rentabilidade-por-contrato table.rent-table thead th {
    text-align: center;
}
.page-rentabilidade-por-cliente table.rent-table thead th[rowspan],
.page-rentabilidade-por-contrato table.rent-table thead th[rowspan] {
    vertical-align: middle;
}

/* Grupos de colunas OSs APONTADAS / OSs ORÇADAS (rentabilidade cliente e contrato) */
.page-rentabilidade-por-cliente table.rent-table th.rent-group,
.page-rentabilidade-por-contrato table.rent-table th.rent-group {
    text-align: center;
    vertical-align: middle;
    font-weight: 700;
    padding-top: 10px;
    padding-bottom: 8px;
}
.page-rentabilidade-por-cliente table.rent-table th.rent-group-apontadas,
.page-rentabilidade-por-contrato table.rent-table th.rent-group-apontadas {
    background: rgba(59, 130, 246, 0.09);
}
.page-rentabilidade-por-cliente table.rent-table th.rent-group-orcadas,
.page-rentabilidade-por-contrato table.rent-table th.rent-group-orcadas {
    background: rgba(124, 58, 237, 0.08);
}
.page-rentabilidade-por-cliente table.rent-table thead tr.rent-head-cols th,
.page-rentabilidade-por-contrato table.rent-table thead tr.rent-head-cols th {
    border-top: 1px solid var(--border);
}
.page-rentabilidade-por-cliente table.rent-table th.rent-divider-before,
.page-rentabilidade-por-cliente table.rent-table td.rent-divider-before,
.page-rentabilidade-por-contrato table.rent-table th.rent-divider-before,
.page-rentabilidade-por-contrato table.rent-table td.rent-divider-before {
    border-left: 2px solid var(--border);
}

/* Relatório por contrato: cliente + contrato na mesma coluna */
.page-rentabilidade-por-contrato .rent-col-cliente-contrato {
    vertical-align: top;
    min-width: 0;
    text-align: left;
    word-wrap: break-word;
    overflow-wrap: break-word;
}
.page-rentabilidade-por-contrato .rent-nome-cliente {
    font-weight: 700;
    color: var(--foreground);
    line-height: 1.3;
}
.page-rentabilidade-por-contrato tr.rent-row-cliente-label .rent-nome-cliente {
    margin-bottom: 0;
}
.page-rentabilidade-por-contrato table.rent-table td.rent-empty {
    background: transparent;
    color: transparent;
}
.page-rentabilidade-por-contrato .rent-nome-contrato {
    padding-left: 1.1rem;
    font-weight: 500;
    color: var(--muted);
    line-height: 1.35;
}
.page-rentabilidade-por-contrato tr.rent-row-cliente-sep td {
    height: 12px;
    padding: 0;
    border-bottom: none;
    background: transparent;
}
.page-rentabilidade-por-contrato table.rent-table tfoot th:first-child {
    text-align: left;
}

/* Filtros rentabilidade (cliente e contrato): grade em 3 colunas */
.page-rentabilidade-por-cliente .filters,
.page-rentabilidade-por-contrato .filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    align-items: end;
}
.page-rentabilidade-por-cliente .filters > div,
.page-rentabilidade-por-contrato .filters > div {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
}
.page-rentabilidade-por-cliente .filter-month-input,
.page-rentabilidade-por-contrato .filter-month-input {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
}
.page-rentabilidade-por-cliente .filter-month-input input[type="month"],
.page-rentabilidade-por-contrato .filter-month-input input[type="month"] {
    flex: 1;
    min-width: 0;
}
.page-rentabilidade-por-cliente .btn-filter-month,
.page-rentabilidade-por-contrato .btn-filter-month {
    padding: 8px 10px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--card);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
    flex-shrink: 0;
    line-height: 1;
}
.page-rentabilidade-por-cliente .btn-filter-month:hover:not(:disabled),
.page-rentabilidade-por-contrato .btn-filter-month:hover:not(:disabled) {
    background: var(--bg);
    border-color: var(--accent);
    color: var(--accent);
}
.page-rentabilidade-por-cliente .btn-filter-month:disabled,
.page-rentabilidade-por-contrato .btn-filter-month:disabled {
    opacity: 0.45;
    cursor: not-allowed;
}
.page-rentabilidade-por-cliente .btn-filter-month svg,
.page-rentabilidade-por-contrato .btn-filter-month svg {
    width: 16px;
    height: 16px;
}

@media (max-width: 900px) {
    .filters,
    .page-dashboard .bar-row,
    .page-dashboard .pie-wrap,
    .page-apontamentos .summary-grid,
    .page-custo-por-cliente .summary-grid,
    .page-fechamento-cliente .summary-grid,
    .page-fechamento-relatorio .summary-grid,
    .page-bi .summary-grid,
    .page-bi .pivot-fields,
    .page-bi .save-grid,
    .page-valores .grid,
    .page-valores-relatorio .grid {
        grid-template-columns: 1fr;
    }
    .page-pre-faturamento .entry-header {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .card {
        overflow-x: auto;
    }
    table {
        min-width: 640px;
    }
    .page-fechamento-relatorio header,
    .page-fechamento-relatorio .container,
    .page-valores-relatorio header,
    .page-valores-relatorio .container {
        padding: 16px;
    }
}

.page-kanban-os .kanban-filter-card {
    margin-bottom: 16px;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
}
.page-kanban-os .kanban-filter-bar {
    display: block;
    width: 100%;
    max-width: 100%;
}
.page-kanban-os .kanban-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}
.page-kanban-os .kanban-filter-field {
    flex: 1;
    min-width: 200px;
}
.page-kanban-os .status-dropdown {
    position: relative;
}
.page-kanban-os .status-dropdown-toggle {
    width: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: #fff;
    font-size: 14px;
    color: var(--text);
    cursor: pointer;
}
.page-kanban-os .status-dropdown-label {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.page-kanban-os .status-dropdown-toggle svg {
    width: 16px;
    height: 16px;
}
.page-kanban-os .status-dropdown-panel {
    position: static;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
    padding: 8px;
    display: none;
    z-index: 10;
}
.page-kanban-os .kanban-client-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
    width: 100%;
    align-items: center;
}
.page-kanban-os .kanban-status-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
    width: 100%;
    align-items: center;
}
.page-kanban-os .kanban-responsible-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    width: 100%;
    align-items: center;
}
.page-kanban-os .kanban-client-inputs {
    display: none;
}
.page-kanban-os .kanban-status-inputs {
    display: none;
}
.page-kanban-os .kanban-responsible-inputs {
    display: none;
}
.page-kanban-os .client-badge {
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
    cursor: pointer;
    background: rgba(37, 99, 235, 0.12);
    color: #1d4ed8;
}
.page-kanban-os .client-badge.is-muted {
    background: #eef2f7;
    color: var(--muted);
    border-color: var(--border);
}
.page-kanban-os .client-badge.is-selected {
    background: rgba(37, 99, 235, 0.16);
    color: #1d4ed8;
}
.page-kanban-os .status-badge {
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    text-transform: none;
    cursor: pointer;
    background: rgba(234, 179, 8, 0.22);
    color: #92400e;
}
.page-kanban-os .status-badge.is-muted {
    background: #eef2f7;
    color: var(--muted);
    border-color: var(--border);
}
.page-kanban-os .status-badge.is-selected {
    background: rgba(234, 179, 8, 0.28);
    color: #92400e;
}
.page-kanban-os .status-badge:focus-visible {
    outline: 2px solid rgba(234, 179, 8, 0.4);
    outline-offset: 2px;
}
.page-kanban-os .status-badge-wip {
    background: #fff;
    color: var(--muted);
    border: 1px solid var(--border);
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 999px;
}
.page-kanban-os .responsible-badge {
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
    cursor: pointer;
    background: rgba(16, 185, 129, 0.18);
    color: #047857;
}
.page-kanban-os .responsible-badge.is-muted {
    background: #eef2f7;
    color: var(--muted);
    border-color: var(--border);
}
.page-kanban-os .responsible-badge.is-selected {
    background: rgba(16, 185, 129, 0.22);
    color: #047857;
}
.page-kanban-os .responsible-badge:focus-visible {
    outline: 2px solid rgba(16, 185, 129, 0.35);
    outline-offset: 2px;
}
.page-kanban-os .client-badge:focus-visible {
    outline: 2px solid rgba(37, 99, 235, 0.4);
    outline-offset: 2px;
}
.page-kanban-os .client-badge-action {
    border: 1px solid var(--border);
    border-radius: 999px;
    height: 22px;
    min-width: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: var(--muted);
    cursor: pointer;
    padding: 0 8px;
}
.page-kanban-os .client-badge-action svg {
    width: 14px;
    height: 14px;
}
.page-kanban-os .client-badge-action:hover {
    border-color: rgba(37, 99, 235, 0.35);
    color: var(--accent);
}
.page-kanban-os .status-dropdown.is-open .status-dropdown-panel {
    display: block;
}
.page-kanban-os .status-option {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 8px;
    border-radius: 8px;
    font-size: 13px;
    color: var(--text);
    cursor: pointer;
}
.page-kanban-os .status-option:hover {
    background: #f3f4f6;
}
.page-kanban-os .status-option input {
    width: auto;
}
.page-kanban-os .kanban-filter-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.page-kanban-os .btn-link {
    color: var(--muted);
    font-size: 13px;
    text-decoration: underline;
}
.page-kanban-os .ticket-list-card {
    margin-top: 12px;
}
.page-kanban-os .ticket-list-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}
.page-kanban-os .ticket-list-title {
    font-weight: 700;
    font-size: 16px;
}
.page-kanban-os .kanban-total-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    margin-left: 8px;
    padding: 0 6px;
    border-radius: 999px;
    background: #e5e7eb;
    color: #111827;
    font-size: 12px;
    font-weight: 700;
}
.page-kanban-os .kanban-subtitle-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}
.page-kanban-os .ticket-kanban-card {
    background: #f3f5f9;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
    --kanban-font-step: 0px;
}
.page-kanban-os .kanban-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    width: 100%;
    max-width: 100%;
    padding-top: 6px;
    transform: rotateX(180deg);
}
.page-kanban-os .ticket-kanban {
    display: flex;
    gap: 10px;
    flex-wrap: nowrap;
    padding-bottom: 6px;
    transform: rotateX(180deg);
    min-width: max-content;
}
.page-kanban-os .kanban-column {
    flex: 0 0 250px;
    min-height: 200px;
    border-radius: 14px;
    border: 1px solid var(--border);
    background: #eef2f7;
    padding: calc(10px + var(--kanban-font-step, 0px));
    display: flex;
    flex-direction: column;
}
.page-kanban-os .kanban-column.is-empty {
    flex-basis: 180px;
    min-height: 120px;
    padding: 8px;
    background: #f1f5f9;
}
.page-kanban-os .kanban-empty-minimal {
    font-size: 11px;
    color: var(--muted);
    border: 1px dashed var(--border);
    border-radius: 10px;
    padding: 8px;
    text-align: center;
    background: #fff;
}
.page-kanban-os .kanban-column-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.page-kanban-os .kanban-column-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: calc(14px + var(--kanban-font-step, 0px));
}
.page-kanban-os .kanban-status-count {
    background: #e5e7eb;
    color: #111827;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: calc(12px + var(--kanban-font-step, 0px));
    font-weight: 600;
}
.page-kanban-os .kanban-column-meta {
    font-size: calc(11px + var(--kanban-font-step, 0px));
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.page-kanban-os .kanban-column-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    overflow-y: auto;
    max-height: calc(100vh - 360px);
}
.page-kanban-os .kanban-ticket-card {
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: calc(6px + var(--kanban-font-step, 0px));
    padding: calc(10px + var(--kanban-font-step, 0px));
    border-radius: 12px;
    border: 1px solid var(--border);
    background: var(--card);
    color: var(--text);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.page-kanban-os .kanban-ticket-card.is-deadline-ok {
    border-color: rgba(16, 185, 129, 0.7);
}
.page-kanban-os .kanban-ticket-card.is-deadline-warning {
    border-color: rgba(249, 115, 22, 0.8);
}
.page-kanban-os .kanban-ticket-card.is-deadline-danger {
    border-color: rgba(220, 38, 38, 0.9);
    border-width: 2px;
}
.page-kanban-os .kanban-ticket-card.is-deadline-overdue {
    border-color: #0f172a;
    border-width: 2px;
}
.page-kanban-os .kanban-ticket-card:hover {
    border-color: rgba(37, 99, 235, 0.35);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
    transform: translateY(-1px);
}
.page-kanban-os .kanban-ticket-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: calc(12px + var(--kanban-font-step, 0px));
    color: var(--muted);
}
.page-kanban-os .kanban-ticket-header-right {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.page-kanban-os .kanban-responsible-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(16, 185, 129, 0.18);
    color: #047857;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.02em;
}
.page-kanban-os .kanban-ticket-code {
    font-weight: 600;
    color: var(--text);
}
.page-kanban-os .kanban-priority-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #d1d5db;
}
.page-kanban-os .kanban-ticket-title {
    font-weight: 700;
    font-size: 13px;
    color: var(--text);
    line-height: 1.3;
}
.page-kanban-os .kanban-ticket-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: calc(12px + var(--kanban-font-step, 0px));
    color: var(--muted);
}
.page-kanban-os .kanban-ticket-meta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.page-kanban-os .kanban-meta-deadline {
    margin-left: auto;
    text-align: right;
}
.page-kanban-os .kanban-ticket-meta svg {
    width: 14px;
    height: 14px;
}
.page-kanban-os .kanban-ticket-footer {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    font-size: calc(12px + var(--kanban-font-step, 0px));
    color: var(--muted);
}
.page-kanban-os .kanban-footer-row {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.page-kanban-os .kanban-contract-badge {
    background: rgba(37, 99, 235, 0.16);
    color: #1d4ed8;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: calc(11px + var(--kanban-font-step, 0px));
    font-weight: 600;
}
.page-kanban-os .kanban-opened-by {
    font-size: calc(12px + var(--kanban-font-step, 0px));
    color: var(--muted);
}
.page-kanban-os .kanban-empty {
    font-size: calc(12px + var(--kanban-font-step, 0px));
    color: var(--muted);
    padding: 10px;
    border-radius: 10px;
    border: 1px dashed var(--border);
    background: #fff;
    text-align: center;
}
.page-kanban-os .ticket-progress {
    flex: 1;
    min-width: 120px;
}
.page-kanban-os .ticket-progress-track {
    position: relative;
    height: 8px;
    background: #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
}
.page-kanban-os .ticket-progress-fill {
    position: absolute;
    inset: 0;
    width: 0;
    background: var(--accent);
    border-radius: 999px;
}
.page-kanban-os .ticket-progress-dot {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 14px;
    height: 14px;
    border-radius: 999px;
    background: #10b981;
    border: 2px solid #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.page-kanban-os .ticket-status-mini {
    display: grid;
    gap: 6px;
}
.page-kanban-os .ticket-status-label {
    font-size: 12px;
    font-weight: 600;
    color: var(--text);
}
.page-kanban-os .ticket-progress.is-compact .ticket-progress-track {
    height: 6px;
}
.page-kanban-os .ticket-progress.is-compact .ticket-progress-dot {
    width: 12px;
    height: 12px;
}
.page-kanban-os .ticket-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}
.page-kanban-os .ticket-detail-header strong {
    font-size: 18px;
    color: var(--text);
}
.page-kanban-os .ticket-detail-sub {
    font-size: 12px;
    color: var(--muted);
    margin-top: 6px;
}
.page-kanban-os .ticket-detail-dates {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    color: var(--muted);
    text-align: right;
}
.page-kanban-os .ticket-detail-section {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 12px;
}
.page-kanban-os .ticket-detail-section .section-title {
    margin-bottom: 8px;
}
.page-kanban-os .ticket-detail-side {
    margin-bottom: 16px;
}
.page-kanban-os .ticket-info-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
}
.page-kanban-os .ticket-info-grid span {
    display: block;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--muted);
}
.page-kanban-os .ticket-info-grid strong {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: var(--text);
}
.page-kanban-os .ticket-project-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    background: rgba(37, 99, 235, 0.16);
    color: #1d4ed8;
    font-size: 11px;
    font-weight: 700;
    width: fit-content;
}
.page-kanban-os .entry-html {
    margin-top: 6px;
    font-size: 13px;
    color: var(--text);
}
.page-kanban-os .entry-html p {
    margin: 6px 0 0;
}
.page-kanban-os .entry-html ul,
.page-kanban-os .entry-html ol {
    margin: 6px 0 0 18px;
}
.page-kanban-os .entry-html a {
    color: var(--accent);
}
.page-kanban-os .time-entry-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    flex-wrap: wrap;
}
.page-kanban-os .time-entry-totals {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.page-kanban-os .time-entry-total {
    font-size: 12px;
    color: var(--text);
    background: #eef2f7;
    padding: 4px 8px;
    border-radius: 999px;
}
.page-kanban-os .time-entry-total strong {
    font-weight: 700;
}
.page-kanban-os .time-entry-total.is-billed {
    background: rgba(16, 185, 129, 0.16);
    color: #047857;
}
.page-kanban-os .time-entry-total.is-not-billed {
    background: rgba(220, 38, 38, 0.16);
    color: #b91c1c;
}
.page-kanban-os .time-entry-total.is-unverified {
    background: rgba(234, 179, 8, 0.18);
    color: #92400e;
}
.page-kanban-os .time-entry-list {
    display: grid;
    gap: 10px;
}
.page-kanban-os .time-entry-item {
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 10px 12px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.04);
}
.page-kanban-os .time-entry-head,
.page-kanban-os .time-entry-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 12px;
    color: var(--muted);
}
.page-kanban-os .time-entry-head span,
.page-kanban-os .time-entry-footer span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.page-kanban-os .time-entry-duration {
    font-weight: 600;
    color: var(--text);
}
.page-kanban-os .time-entry-badge {
    font-size: 11px;
    font-weight: 700;
    border-radius: 999px;
    padding: 2px 8px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}
.page-kanban-os .time-entry-badge.is-billed {
    background: rgba(16, 185, 129, 0.16);
    color: #047857;
}
.page-kanban-os .time-entry-badge.is-unverified {
    background: rgba(234, 179, 8, 0.18);
    color: #92400e;
}
.page-kanban-os .time-entry-badge.is-not-billed {
    background: rgba(220, 38, 38, 0.16);
    color: #b91c1c;
}
.page-kanban-os .time-entry-body p {
    margin: 8px 0;
    font-size: 13px;
    color: var(--text);
    line-height: 1.4;
}
.page-kanban-os .time-entry-head svg,
.page-kanban-os .time-entry-footer svg {
    width: 14px;
    height: 14px;
}
.modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease;
    z-index: 50;
}
.modal-overlay.is-visible {
    opacity: 1;
    visibility: visible;
}
.modal-card {
    position: relative;
    width: min(780px, 100%);
    background: #f3f4f6;
    border-radius: 24px;
    padding: 28px 28px 24px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, 0.2);
}
.modal-card-detail {
    width: min(860px, 100%);
    max-height: 80vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.modal-card-detail .modal-body {
    flex: 1;
    max-height: none;
    overflow-y: auto;
    padding-right: 6px;
    padding-bottom: 12px;
}
.modal-close {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    padding: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.modal-close svg {
    width: 18px;
    height: 18px;
    pointer-events: none;
}
.modal-detail-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}
.modal-detail-main {
    display: grid;
    gap: 6px;
}
.modal-detail-meta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}
.modal-detail-header h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    text-align: left;
}
.modal-detail-number {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: var(--muted);
    font-weight: 600;
}
@media (max-width: 720px) {
    .page-kanban-os .kanban-ticket-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
    .page-kanban-os .kanban-meta-deadline {
        margin-left: 0;
    }
    .page-kanban-os .kanban-column {
        flex-basis: 240px;
    }
    .page-kanban-os .kanban-filter-bar {
        align-items: stretch;
    }
}

/* Página de Gráficos - Handoffs */
.page-graficos-handoffs .chart-container {
    position: relative;
    width: 100%;
    height: 500px;
    margin-top: 20px;
}

.page-graficos-handoffs .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 12px;
}

.page-graficos-handoffs .filter-field {
    display: flex;
    flex-direction: column;
}

.page-graficos-handoffs .checkbox-group-compact {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px 12px;
    margin-top: 8px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid var(--border);
    max-height: 300px;
    overflow-y: auto;
}

.page-graficos-handoffs .checkbox-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.page-graficos-handoffs .checkbox-item input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
    flex-shrink: 0;
}

.page-graficos-handoffs .checkbox-item label {
    margin: 0;
    cursor: pointer;
    font-size: 13px;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.page-graficos-handoffs .filter-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
}

.page-graficos-handoffs .row-muted {
    color: var(--muted);
    font-size: 14px;
    text-align: center;
    padding: 20px;
}

.page-graficos-handoffs code {
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: 4px;
    font-family: 'Courier New', monospace;
    font-size: 13px;
    color: #dc2626;
}

@media (max-width: 768px) {
    .page-graficos-handoffs .chart-container {
        height: 350px;
    }
    
    .page-graficos-handoffs .checkbox-group-compact {
        grid-template-columns: 1fr;
        max-height: 250px;
    }
    
    .page-graficos-handoffs .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Página de Gráficos - CFD */
.page-graficos-cfd .chart-container {
    position: relative;
    width: 100%;
    height: 500px;
    margin-top: 20px;
}

.page-graficos-cfd .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 12px;
}

.page-graficos-cfd .filter-field {
    display: flex;
    flex-direction: column;
}

.page-graficos-cfd .checkbox-group-compact {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 8px 12px;
    margin-top: 8px;
    padding: 12px;
    background: #f9fafb;
    border-radius: 8px;
    border: 1px solid var(--border);
    max-height: 300px;
    overflow-y: auto;
}

.page-graficos-cfd .checkbox-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.page-graficos-cfd .checkbox-item input[type="checkbox"] {
    width: auto;
    margin: 0;
    cursor: pointer;
    flex-shrink: 0;
}

.page-graficos-cfd .checkbox-item label {
    margin: 0;
    cursor: pointer;
    font-size: 13px;
    color: var(--text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.page-graficos-cfd .filter-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
}

.page-graficos-cfd .row-muted {
    color: var(--muted);
    font-size: 14px;
    text-align: center;
    padding: 20px;
}

@media (max-width: 768px) {
    .page-graficos-cfd .chart-container {
        height: 350px;
    }
    
    .page-graficos-cfd .checkbox-group-compact {
        grid-template-columns: 1fr;
        max-height: 250px;
    }
    
    .page-graficos-cfd .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Página de Gráficos - Cycle Time e Total Time */
.page-graficos-cycle-time .chart-container,
.page-graficos-total-time .chart-container {
    position: relative;
    width: 100%;
    height: 500px;
    margin-top: 20px;
}

.page-graficos-cycle-time .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 12px;
}

.page-graficos-cycle-time .filter-field,
.page-graficos-total-time .filter-field {
    display: flex;
    flex-direction: column;
}

.page-graficos-cycle-time .filter-actions,
.page-graficos-total-time .filter-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
}

.page-graficos-cycle-time .row-muted,
.page-graficos-total-time .row-muted {
    color: var(--muted);
    font-size: 14px;
    text-align: center;
    padding: 20px;
}

.page-graficos-cycle-time .chart-description,
.page-graficos-total-time .chart-description {
    color: var(--muted);
    font-size: 14px;
    margin: 0 0 12px 0;
}

.page-graficos-cycle-time .periodo-group,
.page-graficos-total-time .periodo-group {
    margin-bottom: 24px;
}

.page-graficos-cycle-time .periodo-group:last-child,
.page-graficos-total-time .periodo-group:last-child {
    margin-bottom: 0;
}

.page-graficos-cycle-time .periodo-title,
.page-graficos-total-time .periodo-title {
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--border);
}

.page-graficos-cycle-time .table-cycle-time-os,
.page-graficos-total-time .table-cycle-time-os {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.page-graficos-cycle-time .table-cycle-time-os th,
.page-graficos-cycle-time .table-cycle-time-os td,
.page-graficos-total-time .table-cycle-time-os th,
.page-graficos-total-time .table-cycle-time-os td {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid var(--border);
}

.page-graficos-cycle-time .table-cycle-time-os th,
.page-graficos-total-time .table-cycle-time-os th {
    font-weight: 700;
    color: var(--muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.page-graficos-cycle-time .table-cycle-time-os .text-right,
.page-graficos-total-time .table-cycle-time-os .text-right {
    text-align: right;
}

.page-graficos-cycle-time .table-responsive,
.page-graficos-total-time .table-responsive {
    overflow-x: auto;
}

.page-graficos-cycle-time .table-cycle-time-os tr.periodo-separator td,
.page-graficos-total-time .table-cycle-time-os tr.periodo-separator td {
    font-weight: 600;
    background: var(--bg-secondary, #f8f9fa);
    border-top: 1px solid var(--border);
    padding: 12px 16px;
}

@media (max-width: 768px) {
    .page-graficos-cycle-time .chart-container,
    .page-graficos-total-time .chart-container {
        height: 350px;
    }
    
    .page-graficos-cycle-time .filter-row-compact,
    .page-graficos-total-time .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Página de Gráficos - Waiting Time */
.page-graficos-waiting-time .chart-container {
    position: relative;
    width: 100%;
    height: 500px;
    margin-top: 20px;
}

.page-graficos-waiting-time .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin-bottom: 12px;
}

.page-graficos-waiting-time .filter-field {
    display: flex;
    flex-direction: column;
}

.page-graficos-waiting-time .filter-actions {
    display: flex;
    gap: 12px;
    align-items: center;
    margin-top: 16px;
}

.page-graficos-waiting-time .row-muted {
    color: var(--muted);
    font-size: 14px;
    text-align: center;
    padding: 20px;
}

@media (max-width: 768px) {
    .page-graficos-waiting-time .chart-container {
        height: 350px;
    }
    
    .page-graficos-waiting-time .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Gráfico Rentabilidade Operacional Bruta */
.page-graficos-rentabilidade .filters-card h2 {
    margin: 0 0 12px;
    font-size: 16px;
}
.page-graficos-rentabilidade .chart-container {
    position: relative;
    width: 100%;
    height: 480px;
    margin-top: 16px;
}
.page-graficos-rentabilidade .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    align-items: end;
}
.page-graficos-rentabilidade .filter-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.page-graficos-rentabilidade .filter-field label {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
}
.page-graficos-rentabilidade .filter-actions {
    display: flex;
    align-items: flex-end;
    padding-bottom: 2px;
}
.page-graficos-rentabilidade .chart-description {
    margin: 0 0 8px;
    font-size: 13px;
}
.page-graficos-rentabilidade .filter-field-checkbox-rent {
    grid-column: 1 / -1;
    padding: 10px 12px;
    border-radius: 8px;
    border: 1px dashed var(--border);
    background: var(--bg);
}
.page-graficos-rentabilidade .filter-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    color: var(--text);
}
.page-graficos-rentabilidade .filter-checkbox-label input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    flex-shrink: 0;
}
.page-graficos-rentabilidade .filter-hint {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    color: var(--muted);
    line-height: 1.35;
}
@media (max-width: 768px) {
    .page-graficos-rentabilidade .chart-container {
        height: 360px;
    }
    .page-graficos-rentabilidade .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Gráfico Horas por cliente */
.page-graficos-horas-por-cliente .filters-card h2 {
    margin: 0 0 12px;
    font-size: 16px;
}
.page-graficos-horas-por-cliente .chart-container {
    position: relative;
    width: 100%;
    height: 480px;
    margin-top: 16px;
}
.page-graficos-horas-por-cliente .filter-row-compact {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    align-items: end;
}
.page-graficos-horas-por-cliente .filter-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.page-graficos-horas-por-cliente .filter-field-cliente-grafico {
    grid-column: span 1;
}
.page-graficos-horas-por-cliente .filter-field label {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
}
.page-graficos-horas-por-cliente .filter-actions {
    display: flex;
    align-items: flex-end;
    padding-bottom: 2px;
}
.page-graficos-horas-por-cliente .chart-description {
    margin: 0 0 8px;
    font-size: 13px;
}
.page-graficos-horas-por-cliente .chart-description code {
    font-size: 12px;
}
@media (max-width: 768px) {
    .page-graficos-horas-por-cliente .chart-container {
        height: 360px;
    }
    .page-graficos-horas-por-cliente .filter-row-compact {
        grid-template-columns: 1fr;
    }
}

/* Gráfico Horas por OS */
.page-graficos-horas-por-os .filters-card h2 {
    margin: 0 0 12px;
    font-size: 16px;
}
.page-graficos-horas-por-os .graficos-os-filters {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.page-graficos-horas-por-os .graficos-os-filters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    align-items: end;
}
.page-graficos-horas-por-os .chart-container {
    position: relative;
    width: 100%;
    height: 480px;
    margin-top: 16px;
}
.page-graficos-horas-por-os .chart-container-os-line {
    max-width: 100%;
}
.page-graficos-horas-por-os .filter-field {
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.page-graficos-horas-por-os .filter-field label {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
}
.page-graficos-horas-por-os .graficos-os-multiselect-hint {
    margin: 0 0 8px;
}
.page-graficos-horas-por-os .filter-field-os-multiselect {
    margin-top: 4px;
}
.page-graficos-horas-por-os .graficos-os-actions {
    padding-top: 4px;
}
.page-graficos-horas-por-os .chart-description {
    margin: 0 0 8px;
    font-size: 13px;
}
.page-graficos-horas-por-os .chart-description code {
    font-size: 12px;
}
/* Multiselect (alinhado ao padrão da Configuração do sistema) */
.page-graficos-horas-por-os .multiselect-container {
    position: relative;
    width: 100%;
}
.page-graficos-horas-por-os .multiselect-selected {
    min-height: 42px;
    padding: 4px 8px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    cursor: pointer;
    align-items: center;
}
.page-graficos-horas-por-os .multiselect-selected .placeholder {
    color: var(--muted);
    font-size: 14px;
    padding-left: 4px;
}
.page-graficos-horas-por-os .multiselect-tag {
    background: #e0f2fe;
    color: #0369a1;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #bae6fd;
    max-width: 100%;
}
.page-graficos-horas-por-os .multiselect-tag > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 280px;
}
.page-graficos-horas-por-os .multiselect-tag-remove {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0369a1;
    flex-shrink: 0;
    transition: color 0.2s;
}
.page-graficos-horas-por-os .multiselect-tag-remove:hover {
    color: #ef4444;
}
.page-graficos-horas-por-os .multiselect-tag-remove svg {
    width: 14px;
    height: 14px;
}
.page-graficos-horas-por-os .multiselect-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-top: 4px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
    z-index: 50;
    display: none;
    max-height: 320px;
    overflow: hidden;
    flex-direction: column;
}
.page-graficos-horas-por-os .multiselect-container.is-open .multiselect-dropdown {
    display: flex;
}
.page-graficos-horas-por-os .multiselect-search-container {
    padding: 8px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
}
.page-graficos-horas-por-os .multiselect-search {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 14px;
}
.page-graficos-horas-por-os .multiselect-options {
    overflow-y: auto;
    flex: 1;
}
.page-graficos-horas-por-os .multiselect-option {
    padding: 10px 12px;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    transition: background 0.15s ease;
    border-bottom: 1px solid var(--border);
    line-height: 1.35;
    word-break: break-word;
}
.page-graficos-horas-por-os .multiselect-option:last-child {
    border-bottom: none;
}
.page-graficos-horas-por-os .multiselect-option:hover {
    background: var(--bg);
}
.page-graficos-horas-por-os .multiselect-option.selected {
    background: rgba(37, 99, 235, 0.08);
    color: var(--accent, #2563eb);
    font-weight: 500;
}
.page-graficos-horas-por-os .multiselect-option .icon-check {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: none;
}
.page-graficos-horas-por-os .multiselect-option.selected .icon-check {
    display: block;
}
@media (max-width: 768px) {
    .page-graficos-horas-por-os .chart-container {
        height: 360px;
    }
    .page-graficos-horas-por-os .graficos-os-filters-grid {
        grid-template-columns: 1fr;
    }
    .page-graficos-horas-por-os .multiselect-tag > span:first-child {
        max-width: 200px;
    }
}

/* Gráfico Horas Box TI */
.page-graficos-horas-box-ti .filters-card h2 {
    margin: 0 0 12px;
    font-size: 16px;
}
.page-graficos-horas-box-ti .graficos-box-ti-filters {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.page-graficos-horas-box-ti .graficos-box-ti-filters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    align-items: end;
}
.page-graficos-horas-box-ti .filter-actions-inline {
    padding-bottom: 2px;
}
.page-graficos-horas-box-ti .graficos-box-ti-cat-hint {
    margin: 0 0 8px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--muted);
}
.page-graficos-horas-box-ti .filter-field-cat-multiselect {
    margin-top: 4px;
}
.page-graficos-horas-box-ti .chart-container {
    position: relative;
    width: 100%;
    height: 480px;
    margin-top: 16px;
}
.page-graficos-horas-box-ti .chart-container-box-ti {
    max-width: 100%;
}
.page-graficos-horas-box-ti .filter-field label {
    font-size: 12px;
    color: var(--muted);
    margin-bottom: 6px;
}
.page-graficos-horas-box-ti .filter-actions {
    display: flex;
    align-items: flex-end;
    padding-bottom: 2px;
}
.page-graficos-horas-box-ti .chart-description {
    margin: 0 0 8px;
    font-size: 13px;
}
.page-graficos-horas-box-ti .multiselect-container {
    position: relative;
    width: 100%;
}
.page-graficos-horas-box-ti .multiselect-selected {
    min-height: 42px;
    padding: 4px 8px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    cursor: pointer;
    align-items: center;
}
.page-graficos-horas-box-ti .multiselect-selected .placeholder {
    color: var(--muted);
    font-size: 14px;
    padding-left: 4px;
}
.page-graficos-horas-box-ti .multiselect-tag {
    background: #e0f2fe;
    color: #0369a1;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #bae6fd;
    max-width: 100%;
}
.page-graficos-horas-box-ti .multiselect-tag > span:first-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 320px;
}
.page-graficos-horas-box-ti .multiselect-tag-remove {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0369a1;
    flex-shrink: 0;
    transition: color 0.2s;
}
.page-graficos-horas-box-ti .multiselect-tag-remove:hover {
    color: #ef4444;
}
.page-graficos-horas-box-ti .multiselect-tag-remove svg {
    width: 14px;
    height: 14px;
}
.page-graficos-horas-box-ti .multiselect-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 8px;
    margin-top: 4px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
    z-index: 50;
    display: none;
    max-height: 280px;
    overflow: hidden;
    flex-direction: column;
}
.page-graficos-horas-box-ti .multiselect-container.is-open .multiselect-dropdown {
    display: flex;
}
.page-graficos-horas-box-ti .multiselect-search-container {
    padding: 8px;
    border-bottom: 1px solid var(--border);
    background: var(--bg);
}
.page-graficos-horas-box-ti .multiselect-search {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 14px;
}
.page-graficos-horas-box-ti .multiselect-options {
    overflow-y: auto;
    flex: 1;
}
.page-graficos-horas-box-ti .multiselect-option {
    padding: 10px 12px;
    font-size: 13px;
    cursor: pointer;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    transition: background 0.15s ease;
    border-bottom: 1px solid var(--border);
    line-height: 1.35;
    word-break: break-word;
}
.page-graficos-horas-box-ti .multiselect-option:last-child {
    border-bottom: none;
}
.page-graficos-horas-box-ti .multiselect-option:hover {
    background: var(--bg);
}
.page-graficos-horas-box-ti .multiselect-option.selected {
    background: rgba(37, 99, 235, 0.08);
    color: var(--accent, #2563eb);
    font-weight: 500;
}
.page-graficos-horas-box-ti .multiselect-option .icon-check {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    display: none;
}
.page-graficos-horas-box-ti .multiselect-option.selected .icon-check {
    display: block;
}
@media (max-width: 768px) {
    .page-graficos-horas-box-ti .chart-container {
        height: 360px;
    }
    .page-graficos-horas-box-ti .graficos-box-ti-filters-grid {
        grid-template-columns: 1fr;
    }
    .page-graficos-horas-box-ti .multiselect-tag > span:first-child {
        max-width: 200px;
    }
}

/* KPI Cards */
.kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 12px;
    margin-top: 24px;
    margin-bottom: 24px;
}

.kpi-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: var(--card);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    transition: all 0.2s ease;
}

.kpi-card:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.kpi-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    flex-shrink: 0;
}

.kpi-icon svg,
.kpi-icon i {
    width: 20px;
    height: 20px;
    color: #ffffff;
}

.kpi-content {
    flex: 1;
    min-width: 0;
}

.kpi-label {
    font-size: 11px;
    color: var(--muted);
    margin-bottom: 3px;
    font-weight: 500;
    line-height: 1.3;
}

.kpi-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--text);
    line-height: 1.2;
}

@media (max-width: 1200px) {
    .kpi-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 1024px) {
    .kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .kpi-value {
        font-size: 16px;
    }
}

@media (max-width: 768px) {
    .kpi-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    
    .kpi-card {
        padding: 14px;
    }
    
    .kpi-icon {
        width: 36px;
        height: 36px;
    }
    
    .kpi-icon svg,
    .kpi-icon i {
        width: 18px;
        height: 18px;
    }
    
    .kpi-value {
        font-size: 16px;
    }
}

/* Card Export Button */
.card-header-with-export {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
}

.card-header-with-export h2 {
    margin: 0;
    flex: 1;
}

.btn-export-card {
    background: transparent;
    border: 1px solid var(--border);
    border-radius: 6px;
    padding: 6px 8px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    color: var(--muted);
    flex-shrink: 0;
    margin-left: 12px;
}

.btn-export-card:hover {
    background: var(--bg-hover);
    border-color: var(--primary);
    color: var(--primary);
}

.btn-export-card svg,
.btn-export-card i {
    width: 16px;
    height: 16px;
}

.btn-export-card.exporting {
    opacity: 0.5;
    cursor: wait;
}

@media (max-width: 768px) {
    .btn-export-card {
        padding: 4px 6px;
    }
    
    .btn-export-card svg,
    .btn-export-card i {
        width: 14px;
        height: 14px;
    }
}

/* Charts Side by Side */
.charts-full-width {
    width: 100%;
    margin-bottom: 20px;
}

.charts-side-by-side {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 20px;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.waiting-days-filter {
    display: flex;
    background: #f1f5f9;
    border-radius: 6px;
    padding: 2px;
    border: 1px solid var(--border);
}

.btn-filter {
    padding: 4px 10px;
    font-size: 11px;
    border-radius: 4px;
    color: var(--muted);
    text-decoration: none;
    font-weight: 500;
}

.btn-filter.active {
    background: #ffffff;
    color: var(--primary);
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.simple-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.simple-table th {
    text-align: left;
    padding: 8px 12px;
    background: #f8fafc;
    color: var(--muted);
    font-weight: 700;
    position: sticky;
    top: 0;
    z-index: 1;
}

.simple-table td {
    padding: 8px 12px;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}

.simple-table td:nth-child(2) {
    white-space: normal;
    word-break: break-word;
}

.truncate-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.os-slug {
    font-weight: 600;
    color: var(--primary);
}

.card-body-scrollable::-webkit-scrollbar {
    width: 6px;
}

.card-body-scrollable::-webkit-scrollbar-thumb {
    background: #e2e8f0;
    border-radius: 3px;
}

@media (max-width: 1024px) {
    .charts-side-by-side {
        grid-template-columns: 1fr;
    }
}

/* Permissões do menu lateral */
.page-permissoes-menu .form-section-title {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
}
.page-permissoes-menu .form-section-title.perm-grupo-title-line {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 12px;
    width: 100%;
}
.page-permissoes-menu .perm-grupo-heading {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.page-permissoes-menu .perm-grupo-heading svg {
    width: 18px;
    height: 18px;
    color: var(--muted);
    flex-shrink: 0;
}
.page-permissoes-menu .perm-toggle-grupo {
    display: inline;
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    font: inherit;
    font-size: 12px;
    font-weight: 400;
    color: var(--muted);
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
}
.page-permissoes-menu .perm-toggle-grupo:hover {
    color: var(--primary);
}
.page-permissoes-menu .perm-toggle-grupo:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
    border-radius: 2px;
}
.page-permissoes-menu .perm-grupo {
    margin-top: 24px;
}
.page-permissoes-menu .perm-grupo-header {
    margin-bottom: 0;
}

/* Integração IA - Permissões */
.permissoes-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
    margin-top: 16px;
}
.perm-item {
    padding: 12px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid var(--border);
}
.perm-item span {
    font-size: 13px;
}
.perm-item input {
    margin-right: 8px;
}
.btn-danger {
    color: var(--error);
}
.btn-danger:hover {
    text-decoration: underline;
}