/* vsCloud Admin - Flat theme layer
   Loaded last. Keeps the existing DOM and JS contracts intact. */

:root,
[data-bs-theme="vscloud"] {
  --vs-primary: #2563eb;
  --vs-primary-dark: #1d4ed8;
  --vs-primary-soft: #eff6ff;
  --vs-accent: #0891b2;
  --vs-danger: #dc2626;
  --vs-success: #15803d;

  --vs-body: #dce3ec;
  --vs-card: #ffffff;
  --vs-surface: #ffffff;
  --vs-surface-soft: #eef2f6;
  --vs-sidebar: #dce3ec;
  --vs-sidebar-border: #b6c0cd;
  --vs-panel: #dce3ec;
  --vs-panel-header: #cbd5e1;
  --vs-panel-soft: #d2dae5;
  --vs-panel-blue: #c7d9eb;

  --vs-border: #b6c0cd;
  --vs-border-soft: #d7dde5;
  --vs-border-strong: #9fb3c8;

  --vs-text: #172033;
  --vs-muted: #64748b;
  --vs-label: #334155;

  --vs-shadow-sm: none;
  --vs-shadow: 0 1px 3px rgba(15,23,42,.10);
  --vs-radius: 4px;
  --vs-radius-control: 6px;

  --bs-primary: #2563eb;
  --bs-primary-rgb: 37,99,235;
  --bs-info: #0891b2;
  --bs-info-rgb: 8,145,178;
  --bs-body-bg: #dce3ec;
  --bs-body-color: #172033;
  --bs-border-color: #b6c0cd;
}

body.vscloud-app,
body.vs-theme-flat {
  background: var(--vs-body) !important;
  color: var(--vs-text) !important;
}

.erp-topbar {
  min-height: 52px !important;
  padding: 6px 10px !important;
  background: var(--vs-panel-header) !important;
  color: var(--vs-text) !important;
  border-bottom: 1px solid var(--vs-border) !important;
  box-shadow: none !important;
}

.erp-topbar-center h1 {
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.erp-topbar-center p,
.erp-logo-text small {
  color: var(--vs-muted) !important;
}

.erp-logo,
.erp-logo:hover {
  color: var(--vs-text) !important;
}

.erp-logo-image,
.erp-logo-mark {
  border-radius: 3px !important;
  background: var(--vs-card) !important;
  box-shadow: none !important;
}

.erp-logo-png {
  filter: none !important;
}

.erp-topbar-actions .btn,
.action-group .btn {
  border-radius: 3px !important;
  border-color: var(--vs-border) !important;
  background: var(--vs-card) !important;
  color: var(--vs-text) !important;
  box-shadow: none !important;
  transform: none !important;
}

.erp-topbar-actions .btn:hover,
.action-group .btn:hover {
  background: var(--vs-panel-soft) !important;
  border-color: var(--vs-border-strong) !important;
  transform: none !important;
  box-shadow: none !important;
}

.erp-topbar-actions .btn-outline-light,
.icon-btn,
#btnJsonEditor,
#btnJsonImport {
  background: var(--vs-card) !important;
  border: 1px solid var(--vs-border-strong) !important;
  color: var(--vs-text) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
}

.erp-topbar-actions .btn-outline-light:hover,
.icon-btn:hover,
#btnJsonEditor:hover,
#btnJsonImport:hover {
  background: var(--vs-panel-soft) !important;
  border-color: var(--vs-primary) !important;
  color: var(--vs-primary-dark) !important;
}

.user-chip {
  border-radius: 3px !important;
  background: var(--vs-panel) !important;
  border-color: var(--vs-border-strong) !important;
  color: var(--vs-text) !important;
  box-shadow: none !important;
}

.erp-sidebar {
  width: 178px !important;
  min-width: 178px !important;
  background: var(--vs-sidebar) !important;
  color: var(--vs-text) !important;
  border-right: 1px solid var(--vs-sidebar-border) !important;
  box-shadow: none !important;
}

.sidebar-header,
.sidebar-footer {
  min-height: 40px !important;
  color: var(--vs-label) !important;
  background: var(--vs-panel-header) !important;
  border-color: var(--vs-sidebar-border) !important;
  font-weight: 700 !important;
}

.module-menu {
  padding: 8px !important;
}

.nav-group-title,
.module-menu .nav-item {
  min-height: 32px !important;
  margin: 0 0 4px !important;
  padding: 6px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 3px !important;
  background: transparent !important;
  color: #26384c !important;
  box-shadow: none !important;
  font-weight: 650 !important;
}

.nav-group-title:hover,
.module-menu .nav-item:hover {
  background: var(--vs-card) !important;
  border-color: var(--vs-border) !important;
  color: var(--vs-primary-dark) !important;
}

.module-menu .nav-item.active {
  background: var(--vs-panel-blue) !important;
  border-color: var(--vs-border-strong) !important;
  color: #0f3c91 !important;
}

.erp-main,
.erp-content {
  background: var(--vs-body) !important;
}

.erp-content {
  padding: 8px !important;
}

.erp-tabs-card,
.grid-toolbar-card,
.grid-shell,
.form-panel,
.detail-shell,
.json-editor-card,
.welcome-card,
.empty-state,
.content-card,
.workspace-filter-panel,
.embedded-detail-tabs-shell {
  background: var(--vs-card) !important;
  border: 1px solid var(--vs-border) !important;
  border-radius: var(--vs-radius) !important;
  box-shadow: none !important;
}

.erp-tabs-card {
  margin-bottom: 6px !important;
}

.erp-tabs-bar,
.erp-subtabs-bar,
.workspace-tabs-bar,
.embedded-detail-tabs-nav {
  background: var(--vs-panel-header) !important;
  border-color: var(--vs-border) !important;
}

.tab-btn,
.subtab-btn,
.workspace-tab-btn,
.embedded-detail-tab {
  background: var(--vs-panel) !important;
  color: #26384c !important;
  border: 1px solid var(--vs-border) !important;
  border-radius: 3px 3px 0 0 !important;
  box-shadow: none !important;
  font-weight: 650 !important;
}

.tab-btn:hover,
.subtab-btn:hover,
.workspace-tab-btn:hover,
.embedded-detail-tab:hover {
  background: var(--vs-card) !important;
  color: var(--vs-primary-dark) !important;
}

.tab-btn.active,
.subtab-btn.active,
.workspace-tab-btn.active,
.embedded-detail-tab.active {
  background: var(--vs-card) !important;
  color: var(--vs-text) !important;
  border-top-color: var(--vs-primary) !important;
  border-bottom-color: var(--vs-card) !important;
  box-shadow: inset 0 2px 0 var(--vs-primary) !important;
}

.tab-btn.active::after {
  display: none !important;
}

.grid-toolbar-card,
.form-panel,
.json-editor-header,
.detail-shell-header {
  padding: 10px !important;
}

.grid-toolbar-title h2,
.detail-shell-header h2,
.json-editor-header h2,
.form-panel::before {
  color: #172033 !important;
  font-weight: 750 !important;
  letter-spacing: 0 !important;
}

.btn {
  border-radius: 3px !important;
  box-shadow: none !important;
  font-weight: 650 !important;
}

.btn-primary {
  --bs-btn-bg: var(--vs-primary);
  --bs-btn-border-color: var(--vs-primary);
  --bs-btn-hover-bg: var(--vs-primary-dark);
  --bs-btn-hover-border-color: var(--vs-primary-dark);
  --bs-btn-active-bg: #1e40af;
  --bs-btn-active-border-color: #1e40af;
}

.btn-outline-primary {
  --bs-btn-color: var(--vs-primary-dark);
  --bs-btn-border-color: var(--vs-primary);
  --bs-btn-hover-bg: var(--vs-primary);
  --bs-btn-hover-border-color: var(--vs-primary);
}

.form-control,
.form-select,
.form-control-sm,
.form-select-sm,
.form-input,
.grid-search,
.lookup-input,
.lookup-description-input {
  border-radius: var(--vs-radius-control) !important;
  border-color: var(--vs-border) !important;
  background-color: #ffffff !important;
  color: var(--vs-text) !important;
  box-shadow: none !important;
}

.form-control:focus,
.form-select:focus,
.form-control-sm:focus,
.form-select-sm:focus,
.form-input:focus,
.grid-search:focus,
.lookup-input:focus,
.lookup-description-input:focus {
  border-color: var(--vs-primary) !important;
  box-shadow: 0 0 0 2px rgba(37,99,235,.12) !important;
}

.input-group-text,
.lookup-description-input[readonly] {
  background: var(--vs-surface-soft) !important;
  border-color: var(--vs-border) !important;
  color: #475569 !important;
}

.field-check-control,
.vs-check-field {
  border-radius: var(--vs-radius-control) !important;
  border-color: var(--vs-border) !important;
  background: #ffffff !important;
  box-shadow: none !important;
  gap: 6px !important;
  height: 32px !important;
  min-height: 32px !important;
  padding: 0 8px !important;
}

/* Checkbox "solto" (sem borda de controle), usado quando o campo tem só o marcador. */
.field-check-control-only {
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.field-check-control:hover,
.vs-check-field:hover {
  border-color: var(--vs-primary) !important;
  background: var(--vs-surface-soft) !important;
}

.field-check-control-only:hover {
  background: transparent !important;
  border: 0 !important;
}

.field-check-control .form-check-input,
.vs-check-field .form-check-input,
.form-check-input {
  width: 15px !important;
  height: 15px !important;
  min-width: 15px !important;
  min-height: 15px !important;
  border-radius: 3px !important;
  box-shadow: none !important;
}

.field-check-text,
.vs-check-label {
  font-size: 13px !important;
}

.lookup-dropdown,
.lookup-menu,
.lookup-results,
.tab-lookup-dropdown {
  border: 1px solid var(--vs-border-strong) !important;
  border-radius: 3px !important;
  box-shadow: var(--vs-shadow) !important;
  background: #ffffff !important;
}

.lookup-item {
  border-bottom-color: var(--vs-border-soft) !important;
}

.lookup-item:hover,
.lookup-item.active {
  background: var(--vs-panel-blue) !important;
  color: #0f3c91 !important;
}

.tabulator {
  border: 1px solid var(--vs-border) !important;
  background: #ffffff !important;
  font-size: 13px !important;
}

.tabulator .tabulator-header,
.tabulator .tabulator-header .tabulator-col {
  background: var(--vs-panel-header) !important;
  color: #172033 !important;
  border-color: var(--vs-border) !important;
}

.tabulator .tabulator-header .tabulator-col-title {
  font-weight: 700 !important;
}

.tabulator .tabulator-row {
  border-bottom: 1px solid var(--vs-border-soft) !important;
}

.tabulator .tabulator-row:nth-child(even) {
  background: #f7f9fc !important;
}

.tabulator .tabulator-row:hover {
  background: #eef6ff !important;
}

.tabulator .tabulator-row.tabulator-selected {
  background: var(--vs-panel-blue) !important;
}

.tabulator .tabulator-cell {
  border-right: 1px solid var(--vs-border-soft) !important;
  padding: 5px 8px !important;
}

.tabulator .tabulator-footer {
  background: var(--vs-surface-soft) !important;
  border-top-color: var(--vs-border) !important;
  box-shadow: none !important;
}

.tabulator .tabulator-footer .tabulator-page {
  border-radius: 3px !important;
  box-shadow: none !important;
}

.json-editor-card textarea,
#jsonEditor,
#jsonImportEditor {
  border-radius: 3px !important;
}

@media (max-width: 991.98px) {
  .erp-sidebar {
    width: 240px !important;
    min-width: 240px !important;
  }
}

/* Célula de lookup em grid de detalhe: código + descrição lado a lado. */
.embedded-detail-table td:has(> .embedded-detail-lookup-cell.lookup-pair),
.embedded-detail-table td:has(> .embedded-detail-lookup-desc) {
  white-space: nowrap;
}
.embedded-detail-lookup-cell.lookup-pair {
  display: inline-block !important;
  width: 120px !important;
  vertical-align: middle !important;
}
.embedded-detail-lookup-desc {
  display: inline-block !important;
  width: calc(100% - 128px) !important;
  min-width: 200px !important;
  margin-left: 6px !important;
  vertical-align: middle !important;
  background: var(--vs-surface-soft) !important;
  color: #475569 !important;
  border-color: var(--vs-border-soft) !important;
  cursor: default !important;
  pointer-events: none !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

/* Forms: não exibir cabeçalhos/painéis decorativos gerados pelo tema. */
.form-panel::before {
  content: none !important;
  display: none !important;
}

.detail-shell-header {
  display: none !important;
}

.detail-shell,
.workspace-detail-shell,
.lotes-master-detail-shell {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
