:root {
    --v2-bg: #f4f7ff;
    --v2-surface: #ffffff;
    --v2-surface-soft: #eef3ff;
    --v2-text: #10233f;
    --v2-text-soft: #4d5a70;
    --v2-primary: #133a73;
    --v2-secondary: #0e7b7b;
    --v2-border: #c6d0e2;
    --v2-radius: 10px;
    /* --erp-shell-bg vem só de themes.css ([data-theme]); não definir aqui senão o modo escuro quebra */
}

body {
    background: var(--erp-shell-bg, var(--v2-bg)) !important;
    color: var(--v2-text);
    font-family: Inter, "Segoe UI", Tahoma, sans-serif;
}

html[data-theme="dark"] body {
    color: var(--text-main);
}

.erp-sidebar {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    /* cores da sidebar vêm de themes.css (--sidebar-bg) para troca de tema funcionar */
    width: 260px !important;
    max-width: 260px !important;
}

.erp-main {
    margin-left: 260px !important;
    background: var(--erp-shell-bg, var(--v2-bg)) !important;
}

.erp-sidebar .sidebar-title {
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    padding: 1rem 1.25rem 0.85rem 1.25rem !important;
    border-bottom: 1px solid var(--sidebar-border) !important;
}

.erp-sidebar .sidebar-subtitle {
    color: var(--sidebar-text);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 700;
    opacity: .78;
}

.erp-sidebar li {
    border-left: 3px solid transparent;
    border-radius: 8px;
    margin: 4px 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px !important;
    font-weight: 600 !important;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.erp-sidebar li.active {
    transform: translateX(2px);
}

.erp-sidebar li i {
    font-size: 1rem;
    width: 18px;
    text-align: center;
    opacity: .85;
}

.erp-sidebar li span {
    flex: 1;
}

.sidebar-footer {
    margin-top: auto;
    padding: 12px 14px 16px;
    border-top: 1px solid var(--v2-border);
    background: var(--v2-surface);
}

.sidebar-user-card {
    background: var(--v2-surface-soft);
    border: 1px solid var(--v2-border);
    border-radius: var(--v2-radius);
    padding: 10px 12px;
}

.sidebar-user-company {
    font-size: 12px;
    font-weight: 600;
    color: var(--v2-text-soft);
    line-height: 1.25;
    margin-bottom: 4px;
}

.sidebar-user-name {
    font-size: 13px;
    font-weight: 700;
    color: var(--v2-text);
    line-height: 1.3;
}

/* Barra superior do conteúdo */
.erp-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0 16px;
    margin-bottom: 4px;
    position: sticky;
    top: 0;
    z-index: 50;
    background: var(--erp-shell-bg, var(--v2-bg)) !important;
    border-bottom: 1px solid rgba(198, 208, 226, 0.55);
}

.erp-toolbar-heading {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--v2-text);
    letter-spacing: -0.02em;
    margin: 0;
    line-height: 1.2;
}

.erp-toolbar-subtitle {
    font-size: 0.875rem;
    color: var(--v2-text-soft);
    margin-top: 4px;
}

.erp-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.erp-toolbar-icon-btn {
    width: 38px;
    height: 38px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--v2-radius) !important;
}

.erp-density-toggle .btn.active {
    background: rgba(14, 123, 123, 0.12) !important;
    border-color: var(--v2-secondary) !important;
    color: #065858 !important;
}

.erp-toolbar-avatars {
    display: inline-flex;
    align-items: center;
    padding-left: 4px;
}

.erp-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    border: 2px solid var(--v2-bg);
    margin-left: -8px;
}

.erp-avatar:first-child {
    margin-left: 0;
}

.erp-avatar--user {
    background: linear-gradient(135deg, rgba(19, 58, 115, 0.92), rgba(14, 123, 123, 0.85));
    color: #fff;
}

.erp-avatar--more {
    background: var(--v2-surface);
    color: var(--v2-text-soft);
    border-style: dashed;
    border-color: var(--v2-border);
    font-size: 14px;
}

.card {
    border: 1px solid var(--v2-border) !important;
    border-radius: var(--v2-radius) !important;
    box-shadow: 0 2px 8px rgba(16, 35, 63, 0.06) !important;
}

.card-header {
    background: var(--v2-surface) !important;
    border-bottom: 1px solid #e8edf7 !important;
}

/* Módulos SPA: fundo transparente (usa --v2-bg do body) + faixa de abas branca como Clientes */
#module-content > .container-fluid {
    background: transparent !important;
}

/* Cabeçalho branco só no modo claro/custom — no escuro themes.css + tokens --card-header-bg */
html:not([data-theme="dark"]) #module-content .card > .card-header {
    background: var(--v2-surface) !important;
}

html:not([data-theme="dark"]) #module-content .card > .card-header .nav-tabs {
    border-bottom-color: var(--v2-border);
}

html:not([data-theme="dark"]) #module-content .card > .card-header .nav-tabs .nav-link:not(.active) {
    background: transparent !important;
}

html:not([data-theme="dark"]) #module-content .card > .card-header .nav-tabs .nav-link.active {
    background-color: var(--v2-surface) !important;
    border-color: var(--v2-border) var(--v2-border) var(--v2-surface);
}

.table thead th {
    background: var(--v2-surface-soft) !important;
    color: var(--v2-text-soft) !important;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: .04em;
}

.table-hover tbody tr:hover {
    background-color: #f1f6ff !important;
}

/* Ações (ícones): container flex — substitui btn-group nas listagens */
.erp-table-actions {
    vertical-align: middle;
}

.erp-table-actions > .btn {
    border-radius: 0.5rem !important;
    margin: 0 !important;
    padding: 0.4rem 0.55rem !important;
    min-width: 2.35rem;
    min-height: 2.35rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
}

.erp-table-actions > .btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(16, 35, 63, 0.12);
}

.btn {
    border-radius: 8px !important;
    font-weight: 600 !important;
}

/* Modais de edição/visualização: largura padronizada + altura controlada */
.modal .modal-dialog:not(.modal-fullscreen) {
    width: auto;
}

.modal .modal-dialog.modal-sm {
    max-width: min(90vw, 420px);
}

.modal .modal-dialog.modal-lg {
    max-width: min(94vw, 1120px);
}

.modal .modal-dialog.modal-xl {
    max-width: min(96vw, 1280px);
}

.modal .modal-dialog:not(.modal-sm):not(.modal-lg):not(.modal-xl):not(.modal-fullscreen) {
    max-width: min(92vw, 1040px);
}

.modal .modal-content {
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.modal .modal-body {
    overflow-y: auto;
}

/* Muitos modais usam <form> como filho direto de .modal-content */
.modal .modal-content > form {
    display: flex;
    flex-direction: column;
    min-height: 0;
    max-height: inherit;
}

.modal .modal-content > form .modal-body {
    overflow-y: auto;
}

.modal .modal-content > form .modal-header,
.modal .modal-content > form .modal-footer {
    flex-shrink: 0;
}

.btn-primary,
.btn-outline-success:hover,
.btn-success {
    background-color: var(--v2-secondary) !important;
    border-color: var(--v2-secondary) !important;
}

.form-control,
.form-select {
    border-radius: 8px !important;
    border-color: var(--v2-border) !important;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--v2-secondary) !important;
    box-shadow: 0 0 0 .2rem rgba(14, 123, 123, 0.18) !important;
}

/* Densidade */
body[data-density="compact"] .card .card-body {
    padding: .75rem !important;
}
body[data-density="compact"] .table th,
body[data-density="compact"] .table td {
    padding-top: .45rem !important;
    padding-bottom: .45rem !important;
}
body[data-density="compact"] .btn {
    padding: .35rem .6rem !important;
}

@media (max-width: 991.98px) {
    .erp-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto;
    }
    .erp-main {
        margin-left: 0 !important;
    }
    .erp-toolbar {
        position: relative;
        top: auto;
    }
}

/* ── Modo escuro: neutraliza tokens claros fixos deste arquivo ───────────── */
html[data-theme="dark"] .erp-toolbar {
    background: var(--erp-shell-bg) !important;
    border-bottom-color: var(--card-border) !important;
}

html[data-theme="dark"] .erp-toolbar-heading {
    color: var(--text-main) !important;
}

html[data-theme="dark"] .erp-toolbar-subtitle {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .erp-density-toggle .btn.active {
    background: rgba(14, 123, 123, 0.22) !important;
    border-color: var(--v2-secondary) !important;
    color: #5eead4 !important;
}

html[data-theme="dark"] .erp-toolbar .btn.btn-light.border.erp-toolbar-icon-btn {
    background-color: var(--card-bg) !important;
    border-color: var(--card-border) !important;
    color: var(--text-main) !important;
}

html[data-theme="dark"] .erp-toolbar .btn.btn-light.border.erp-toolbar-icon-btn:hover {
    background-color: var(--table-header-bg) !important;
}

html[data-theme="dark"] .erp-avatar {
    border-color: var(--erp-shell-bg) !important;
}

html[data-theme="dark"] .erp-avatar--more {
    background: var(--card-bg) !important;
    color: var(--text-muted) !important;
    border-color: var(--card-border) !important;
}

html[data-theme="dark"] .sidebar-footer {
    background: var(--sidebar-bg) !important;
    border-top-color: var(--sidebar-border) !important;
}

html[data-theme="dark"] .sidebar-user-card {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: var(--sidebar-border) !important;
}

html[data-theme="dark"] .sidebar-user-company {
    color: var(--sidebar-text) !important;
}

html[data-theme="dark"] .sidebar-user-name {
    color: var(--sidebar-title-color) !important;
}

html[data-theme="dark"] .table thead th {
    background: var(--table-header-bg) !important;
    color: var(--text-muted) !important;
}

html[data-theme="dark"] .table-hover tbody tr:hover {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

html[data-theme="dark"] .erp-table-actions > .btn[class*="btn-outline"] {
    background-color: rgba(255, 255, 255, 0.06);
}

html[data-theme="dark"] .erp-table-actions > .btn.btn-outline-primary {
    border-color: rgba(96, 165, 250, 0.45);
    color: #93c5fd;
}

html[data-theme="dark"] .erp-table-actions > .btn.btn-outline-secondary {
    border-color: rgba(148, 163, 184, 0.4);
    color: #cbd5e1;
}

html[data-theme="dark"] .erp-table-actions > .btn.btn-outline-danger {
    border-color: rgba(248, 113, 113, 0.45);
    color: #fca5a5;
}

html[data-theme="dark"] .erp-table-actions > .btn.btn-outline-success {
    border-color: rgba(74, 222, 128, 0.45);
    color: #86efac;
}

html[data-theme="dark"] .erp-table-actions > .btn.btn-outline-info {
    border-color: rgba(56, 189, 248, 0.45);
    color: #7dd3fc;
}

html[data-theme="dark"] .erp-table-actions > .btn:hover {
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.35);
}

html[data-theme="dark"] #module-content .kanban-column {
    background: var(--table-header-bg) !important;
}

html[data-theme="dark"] #module-content .kanban-column-header {
    background: var(--card-header-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: none !important;
}

html[data-theme="dark"] #module-content .kanban-column-title {
    color: var(--text-main) !important;
}

html[data-theme="dark"] #module-content .filters-container {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: none !important;
}

html[data-theme="dark"] #module-content .kanban-card {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] #module-content .kanban-card .card-header {
    background-color: var(--table-header-bg) !important;
    border-bottom-color: var(--card-border) !important;
}

html[data-theme="dark"] #module-content .kanban-card .card-title {
    color: var(--text-main) !important;
}

html[data-theme="dark"] #module-content .kanban-card .card-subtitle {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] #module-content .kanban-card .card-client {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] #module-content .empty-column {
    color: var(--text-muted) !important;
}

html[data-theme="dark"] #module-content .form-label {
    color: var(--text-main) !important;
}

html[data-theme="dark"] #module-content .calendar-container {
    background: var(--card-bg) !important;
    border: 1px solid var(--card-border) !important;
}

html[data-theme="dark"] #module-content .calendar-controls,
html[data-theme="dark"] #module-content .calendar-filters {
    background: var(--table-header-bg) !important;
}

html[data-theme="dark"] #module-content .calendar-day {
    background: var(--card-bg) !important;
}

html[data-theme="dark"] #module-content .calendar-day-number {
    color: var(--text-main) !important;
}

html[data-theme="dark"] #module-content .calendar-day.other-month {
    background: rgba(255, 255, 255, 0.03) !important;
    color: var(--text-muted) !important;
}