/* ============================================================
   AD2/AD3 ? TailAdmin-inspired component theme
   ??y l? l?p giao di?n cu?i, kh?ng thay ??i business logic.
   ============================================================ */

.admin-main .welcome-box,
.admin-main .platform-overview-section,
.admin-main .admin-section,
.admin-main .buildings-section,
.admin-main .analytics-chart-card {
  margin-bottom: 20px;
  padding: 22px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.05);
}

.admin-main .welcome-box {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(70, 95, 255, 0.12), transparent 34%),
    var(--admin-surface);
}

.admin-main .welcome-box::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--admin-primary);
  content: "";
}

.admin-main .welcome-box h3,
.admin-main .section-header h3,
.admin-main .section-header h4,
.admin-main .platform-overview-title {
  color: var(--admin-text);
}

.admin-main .welcome-box h3 {
  font-size: 20px;
}

.admin-main .user-org-line,
.admin-main .welcome-box p,
.admin-main .platform-overview-hint {
  color: var(--admin-muted);
}

.admin-main .section-header {
  gap: 14px;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #f2f4f7;
}

.admin-main .section-header h3 {
  font-size: 17px;
  font-weight: 700;
}

.admin-main .org-overview-grid,
.admin-main .analytics-summary-cards {
  gap: 14px;
}

.admin-main .org-overview-card,
.admin-main .analytics-summary-card {
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.admin-main .org-overview-card:hover,
.admin-main .analytics-summary-card:hover {
  border-color: #c7d2fe;
  box-shadow: 0 8px 18px rgba(16, 24, 40, 0.08);
  transform: translateY(-1px);
}

/* Filter bar */
.admin-main .filter-bar,
.admin-main .logs-filter-bar,
.admin-main .analytics-filter-bar {
  gap: 12px !important;
  margin-bottom: 16px !important;
  padding: 14px;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  background: #f9fafb;
}

.admin-main .filter-bar label,
.admin-main .logs-filter-bar label,
.admin-main .analytics-filter-bar label {
  margin-bottom: 5px !important;
  color: #475467 !important;
  font-size: 12px !important;
  font-weight: 600;
}

.admin-main input:not([type="checkbox"]):not([type="radio"]),
.admin-main select,
.admin-main textarea,
.modal-content input:not([type="checkbox"]):not([type="radio"]),
.modal-content select,
.modal-content textarea {
  min-height: 40px;
  padding: 9px 12px !important;
  border: 1px solid #d0d5dd !important;
  border-radius: 8px !important;
  background: #fff;
  color: #101828;
  font: inherit;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.admin-main textarea,
.modal-content textarea {
  min-height: 96px;
  resize: vertical;
}

.admin-main input:focus,
.admin-main select:focus,
.admin-main textarea:focus,
.modal-content input:focus,
.modal-content select:focus,
.modal-content textarea:focus {
  border-color: #8098f9 !important;
  box-shadow: 0 0 0 3px rgba(70, 95, 255, 0.12);
}

/* Tables */
.admin-main .table-scroll-wrapper,
.admin-main .users-table-wrapper,
.admin-main .logs-table-wrapper {
  overflow: auto;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #fff;
}

.admin-main .buildings-table,
.admin-main .users-table,
.admin-main .logs-table,
.admin-main table.dash-sort-table {
  width: 100%;
  border-collapse: separate !important;
  border-spacing: 0;
  border-radius: 0 !important;
  background: #fff !important;
  box-shadow: none !important;
}

.admin-main .buildings-table th,
.admin-main .users-table th,
.admin-main .logs-table th,
.admin-main table.dash-sort-table th {
  padding: 12px 14px !important;
  border-bottom: 1px solid var(--admin-border);
  background: #f9fafb !important;
  color: #475467 !important;
  font-size: 11px !important;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-main .buildings-table td,
.admin-main .users-table td,
.admin-main .logs-table td,
.admin-main table.dash-sort-table td {
  padding: 13px 14px !important;
  border-bottom: 1px solid #f2f4f7 !important;
  color: #344054;
  font-size: 13px;
  vertical-align: middle;
}

.admin-main .buildings-table tbody tr:last-child td,
.admin-main .users-table tbody tr:last-child td,
.admin-main .logs-table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.admin-main .buildings-table tbody tr:hover,
.admin-main .users-table tbody tr:hover,
.admin-main .logs-table tbody tr:hover {
  background: #f8f9ff !important;
}

.admin-main .org-sortable {
  cursor: pointer;
  user-select: none;
}

.admin-main .table-pagination {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f2f4f7;
}

/* Buttons */
.admin-main button,
.modal-content button {
  font-family: inherit;
}

.admin-main .btn-add,
.admin-main .btn-create,
.admin-main .btn-edit,
.admin-main .btn-delete,
.admin-main .btn-logout,
.modal-content .btn-add,
.modal-content .btn-create,
.modal-content .btn-edit,
.modal-content .btn-delete,
.modal-content .btn-logout {
  min-height: 36px;
  padding: 8px 13px;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  transition: filter 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
}

.admin-main .btn-add,
.admin-main .btn-create,
.modal-content .btn-add,
.modal-content .btn-create {
  background: var(--admin-primary);
  color: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.12);
}

.admin-main .btn-edit,
.modal-content .btn-edit {
  border-color: #d0d5dd;
  background: #fff;
  color: #344054;
}

.admin-main .btn-delete,
.admin-main .btn-logout,
.modal-content .btn-delete,
.modal-content .btn-logout {
  background: #d92d20;
  color: #fff;
}

.admin-main .btn-add:hover,
.admin-main .btn-create:hover,
.admin-main .btn-edit:hover,
.admin-main .btn-delete:hover,
.admin-main .btn-logout:hover,
.modal-content button:hover {
  filter: brightness(0.96);
  transform: translateY(-1px);
}

.admin-main button:focus-visible,
.modal-content button:focus-visible,
.admin-sidebar button:focus-visible,
.navbar button:focus-visible {
  outline: 3px solid rgba(70, 95, 255, 0.24);
  outline-offset: 2px;
}

.admin-main button:disabled,
.modal-content button:disabled {
  cursor: not-allowed;
  filter: grayscale(0.35);
  opacity: 0.55;
  transform: none;
}

.admin-main .badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}

/* Modal */
.modal {
  z-index: 2000;
  padding: 16px;
  background: rgba(16, 24, 40, 0.55);
  backdrop-filter: blur(3px);
}

.modal-content {
  width: min(560px, calc(100vw - 32px));
  max-height: min(90vh, 820px);
  padding: 24px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 24px 48px rgba(16, 24, 40, 0.22);
}

.modal-content h3 {
  margin: 0 0 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid #eaecf0;
  color: var(--admin-text);
  font-size: 18px;
}

.modal-content label {
  margin-top: 14px;
  color: #344054;
  font-size: 13px;
  font-weight: 600;
}

.modal-actions {
  flex-wrap: wrap;
  margin-top: 24px;
  padding-top: 16px;
  border-top: 1px solid #eaecf0;
}

.admin-main .user-management-section,
.admin-main .logs-page {
  width: 100%;
  max-width: none;
  margin-left: 0;
  transform: none;
}

@media (max-width: 768px) {
  .admin-main .welcome-box,
  .admin-main .platform-overview-section,
  .admin-main .admin-section,
  .admin-main .buildings-section,
  .admin-main .analytics-chart-card {
    padding: 16px;
    border-radius: 10px;
  }

  #tab-maps .building-detail-section {
    padding: 0 16px;
  }

  .admin-main .section-header {
    align-items: stretch;
  }

  .admin-main .section-header > button,
  .admin-main .section-header > .btn-add,
  .admin-main .section-header > .btn-create {
    width: 100%;
  }

  .admin-main .filter-bar > div,
  .admin-main .logs-filter-bar > div,
  .admin-main .analytics-filter-bar > div {
    width: 100%;
  }

  .admin-main .filter-bar input,
  .admin-main .filter-bar select,
  .admin-main .logs-filter-bar input,
  .admin-main .logs-filter-bar select {
    width: 100%;
    min-width: 0 !important;
  }

  .modal-content {
    padding: 18px;
  }

  .modal-actions > button {
    flex: 1 1 140px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-main *,
  .admin-sidebar,
  .admin-sidebar-overlay {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
  }
}

/* Dark mode ? l?u b?i admin-shell.js */
body[data-admin-theme="dark"] {
  --admin-shell-bg: #0f172a;
  --admin-surface: #182230;
  --admin-border: #344054;
  --admin-text: #f2f4f7;
  --admin-muted: #98a2b3;
  --admin-primary: #8098f9;
  --admin-primary-soft: rgba(97, 114, 243, 0.16);
  --admin-sidebar-text: #d0d5dd;
  color-scheme: dark;
  background: var(--admin-shell-bg);
  color: var(--admin-text);
}

body[data-admin-theme="dark"] .admin-sidebar,
body[data-admin-theme="dark"] .admin-main .navbar {
  border-color: var(--admin-border);
  background: rgba(24, 34, 48, 0.98);
  color: var(--admin-text);
}

body[data-admin-theme="dark"] .admin-sidebar-header,
body[data-admin-theme="dark"] .admin-main .section-header,
body[data-admin-theme="dark"] .modal-content h3,
body[data-admin-theme="dark"] .modal-actions {
  border-color: #344054;
}

body[data-admin-theme="dark"] .admin-brand,
body[data-admin-theme="dark"] .admin-navbar-title h2,
body[data-admin-theme="dark"] .admin-main .welcome-box h3,
body[data-admin-theme="dark"] .admin-main .section-header h3,
body[data-admin-theme="dark"] .admin-main .section-header h4,
body[data-admin-theme="dark"] .admin-main .platform-overview-title,
body[data-admin-theme="dark"] .modal-content h3 {
  color: var(--admin-text);
}

body[data-admin-theme="dark"] .admin-sidebar .tab-btn:hover {
  border-color: transparent;
  background: #253044;
}

body[data-admin-theme="dark"] .admin-sidebar-footer {
  border-color: #344054;
  border-top-color: #344054;
  background: transparent;
  color: #98a2b3;
}

body[data-admin-theme="dark"] .admin-icon-btn,
body[data-admin-theme="dark"] .admin-user-avatar {
  border-color: #475467;
  background: #253044;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .admin-main .welcome-box,
body[data-admin-theme="dark"] .admin-main .platform-overview-section,
body[data-admin-theme="dark"] .admin-main .admin-section,
body[data-admin-theme="dark"] .admin-main .buildings-section,
body[data-admin-theme="dark"] .admin-main .analytics-chart-card,
body[data-admin-theme="dark"] .admin-main .org-overview-card,
body[data-admin-theme="dark"] .admin-main .analytics-summary-card,
body[data-admin-theme="dark"] .modal-content {
  border-color: var(--admin-border);
  background: var(--admin-surface) !important;
  color: #d0d5dd;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
}

body[data-admin-theme="dark"] .admin-main .welcome-box {
  background:
    radial-gradient(circle at 100% 0, rgba(128, 152, 249, 0.16), transparent 34%),
    var(--admin-surface) !important;
}

body[data-admin-theme="dark"] .admin-main .filter-bar,
body[data-admin-theme="dark"] .admin-main .logs-filter-bar,
body[data-admin-theme="dark"] .admin-main .analytics-filter-bar {
  border-color: #344054;
  background: #101828;
}

body[data-admin-theme="dark"] .admin-main label,
body[data-admin-theme="dark"] .modal-content label {
  color: #d0d5dd !important;
}

body[data-admin-theme="dark"] .admin-main input:not([type="checkbox"]):not([type="radio"]),
body[data-admin-theme="dark"] .admin-main select,
body[data-admin-theme="dark"] .admin-main textarea,
body[data-admin-theme="dark"] .modal-content input:not([type="checkbox"]):not([type="radio"]),
body[data-admin-theme="dark"] .modal-content select,
body[data-admin-theme="dark"] .modal-content textarea {
  border-color: #475467 !important;
  background: #101828 !important;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .admin-main input::placeholder,
body[data-admin-theme="dark"] .modal-content input::placeholder,
body[data-admin-theme="dark"] textarea::placeholder {
  color: #667085;
}

body[data-admin-theme="dark"] .admin-main .table-scroll-wrapper,
body[data-admin-theme="dark"] .admin-main .users-table-wrapper,
body[data-admin-theme="dark"] .admin-main .logs-table-wrapper {
  border-color: #344054;
  background: #182230;
}

body[data-admin-theme="dark"] .admin-main .buildings-table,
body[data-admin-theme="dark"] .admin-main .users-table,
body[data-admin-theme="dark"] .admin-main .logs-table,
body[data-admin-theme="dark"] .admin-main table.dash-sort-table {
  background: #182230 !important;
}

body[data-admin-theme="dark"] .admin-main .buildings-table th,
body[data-admin-theme="dark"] .admin-main .users-table th,
body[data-admin-theme="dark"] .admin-main .logs-table th,
body[data-admin-theme="dark"] .admin-main table.dash-sort-table th {
  border-color: #344054;
  background: #101828 !important;
  color: #98a2b3 !important;
}

body[data-admin-theme="dark"] .admin-main .buildings-table td,
body[data-admin-theme="dark"] .admin-main .users-table td,
body[data-admin-theme="dark"] .admin-main .logs-table td,
body[data-admin-theme="dark"] .admin-main table.dash-sort-table td {
  border-color: #344054 !important;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .admin-main .buildings-table tbody tr:hover,
body[data-admin-theme="dark"] .admin-main .users-table tbody tr:hover,
body[data-admin-theme="dark"] .admin-main .logs-table tbody tr:hover {
  background: #253044 !important;
}

body[data-admin-theme="dark"] .admin-main .btn-edit,
body[data-admin-theme="dark"] .modal-content .btn-edit {
  border-color: #475467;
  background: #253044;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .admin-main .table-pagination {
  border-color: #344054;
}

/* ============================================================
   AD5 ? Unify remaining surfaces + deep dark coverage
   ============================================================ */

.admin-main .admin-section {
  background: var(--admin-surface);
  border: 1px solid var(--admin-border);
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.05);
}

.admin-main .admin-section h3 {
  color: var(--admin-text);
}

.admin-main .status-draft,
.admin-main .status-published {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.admin-main .status-draft {
  background: #fffaeb;
  color: #b54708;
  border: 1px solid #fedf89;
}

.admin-main .status-published {
  background: #ecfdf3;
  color: #027a48;
  border: 1px solid #abefc6;
}

.admin-main .table-pagination button {
  min-height: 34px;
  padding: 6px 12px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-weight: 600;
}

.admin-main .table-pagination button:hover:not(:disabled) {
  border-color: #c7d2fe;
  background: #f8f9ff;
  color: var(--admin-primary);
}

.admin-main .table-pagination .page-info {
  color: var(--admin-muted);
  font-weight: 600;
}

.admin-main .quota-alert-line {
  border-radius: 10px;
}

.admin-main .billing-tab-empty,
.admin-main .billing-tab-loading,
.admin-main .billing-tab-error,
.admin-main .analytics-loading,
.admin-main .analytics-error,
.admin-main .analytics-empty {
  padding: 18px 16px;
  border-radius: 10px;
  border: 1px dashed #d0d5dd;
  background: #f9fafb;
}

.admin-main .billing-tab-error,
.admin-main .analytics-error {
  border-style: solid;
  border-color: #fecdca;
  background: #fef3f2;
  color: #b42318;
}

.admin-main .billing-tab-section-block,
.admin-main .org-billing-snapshot,
.admin-main .billing-future-note {
  border-color: var(--admin-border);
  border-radius: 10px;
}

.admin-main .org-billing-snapshot,
.admin-main .billing-future-note {
  background: #f8fafc;
}

.admin-main .analytics-summary-value {
  color: var(--admin-text);
}

.admin-main .analytics-chart-card h4 {
  color: var(--admin-text);
}

.admin-main .error-msg {
  padding: 10px 12px;
  border-radius: 8px;
  background: #fef3f2;
  border: 1px solid #fecdca;
}

.admin-main .success-msg {
  padding: 10px 12px;
  border-radius: 8px;
  background: #ecfdf3;
  border: 1px solid #abefc6;
}

html[data-admin-theme="dark"],
body[data-admin-theme="dark"] {
  --admin-shell-bg: #0f172a;
  --admin-surface: #182230;
  --admin-border: #344054;
  --admin-text: #f2f4f7;
  --admin-muted: #98a2b3;
  --admin-primary: #8098f9;
  --admin-primary-soft: rgba(97, 114, 243, 0.16);
  --admin-sidebar-text: #d0d5dd;
  color-scheme: dark;
}

body[data-admin-theme="dark"] .admin-main .admin-section h3 {
  color: var(--admin-text);
}

body[data-admin-theme="dark"] .admin-main .status-draft {
  background: rgba(247, 144, 9, 0.14);
  color: #fdb022;
  border-color: rgba(247, 144, 9, 0.35);
}

body[data-admin-theme="dark"] .admin-main .status-published {
  background: rgba(18, 183, 106, 0.14);
  color: #32d583;
  border-color: rgba(18, 183, 106, 0.35);
}

body[data-admin-theme="dark"] .admin-main .table-pagination button {
  border-color: #475467;
  background: #253044;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .admin-main .table-pagination button:hover:not(:disabled) {
  border-color: #6172f3;
  background: #344054;
  color: #c7d2fe;
}

body[data-admin-theme="dark"] .admin-main .quota-alert-line {
  background: rgba(247, 144, 9, 0.12);
  border-color: rgba(247, 144, 9, 0.35);
  color: #fdb022;
}

body[data-admin-theme="dark"] .admin-main .quota-alert-line.quota-alert-locked {
  background: rgba(240, 68, 56, 0.12);
  border-color: rgba(240, 68, 56, 0.35);
  color: #f97066;
}

body[data-admin-theme="dark"] .admin-main .billing-tab-empty,
body[data-admin-theme="dark"] .admin-main .billing-tab-loading,
body[data-admin-theme="dark"] .admin-main .analytics-loading,
body[data-admin-theme="dark"] .admin-main .analytics-empty {
  border-color: #475467;
  background: #101828;
  color: #98a2b3;
}

body[data-admin-theme="dark"] .admin-main .billing-tab-error,
body[data-admin-theme="dark"] .admin-main .analytics-error,
body[data-admin-theme="dark"] .admin-main .error-msg {
  border-color: rgba(240, 68, 56, 0.4);
  background: rgba(240, 68, 56, 0.12);
  color: #f97066;
}

body[data-admin-theme="dark"] .admin-main .success-msg {
  border-color: rgba(18, 183, 106, 0.4);
  background: rgba(18, 183, 106, 0.12);
  color: #32d583;
}

body[data-admin-theme="dark"] .admin-main .billing-tab-intro,
body[data-admin-theme="dark"] .admin-main .billing-tab-org-meta,
body[data-admin-theme="dark"] .admin-main .billing-field-label,
body[data-admin-theme="dark"] .admin-main .analytics-tab-intro,
body[data-admin-theme="dark"] .admin-main .analytics-summary-meta,
body[data-admin-theme="dark"] .admin-main .analytics-summary-label,
body[data-admin-theme="dark"] .admin-main .org-billing-snapshot-hint,
body[data-admin-theme="dark"] .admin-main .org-billing-snapshot-expiry {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .admin-main .billing-tab-section-block {
  border-top-color: #344054;
}

body[data-admin-theme="dark"] .admin-main .org-billing-snapshot,
body[data-admin-theme="dark"] .admin-main .billing-future-note {
  border-color: #344054;
  background: #101828;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .admin-main .billing-state-free {
  background: #344054;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .admin-main .billing-state-paid_active {
  background: rgba(18, 183, 106, 0.18);
  color: #32d583;
}

body[data-admin-theme="dark"] .admin-main .billing-state-grace {
  background: rgba(247, 144, 9, 0.18);
  color: #fdb022;
}

body[data-admin-theme="dark"] .admin-main .billing-state-expired {
  background: rgba(240, 68, 56, 0.18);
  color: #f97066;
}

body[data-admin-theme="dark"] .admin-main .analytics-summary-value,
body[data-admin-theme="dark"] .admin-main .analytics-chart-card h4,
body[data-admin-theme="dark"] .admin-main .billing-tab-org-head h4,
body[data-admin-theme="dark"] .admin-main .billing-tab-section-block h4 {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .admin-main .analytics-summary-card {
  background: #101828;
}

body[data-admin-theme="dark"] .admin-main hr {
  border-color: #344054 !important;
}

body[data-admin-theme="dark"] .admin-main .create-account-form input {
  border-color: #475467;
  background: #101828;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .users-table.dash-sort-table thead th.org-sortable:hover,
body[data-admin-theme="dark"] .users-table.dash-sort-table thead th.org-sort-active {
  background: #344054 !important;
  color: #c7d2fe !important;
}

/* ============================================================
   AD6 ? Icons, sticky headers, chart/org-detail polish
   ============================================================ */

.admin-brand-icon {
  display: grid;
  place-items: center;
}

.admin-brand-icon img,
.admin-brand-icon svg,
.admin-menu-icon svg,
.admin-user-avatar svg,
.admin-theme-icon svg {
  display: block;
}

.admin-menu-icon {
  display: grid;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  place-items: center;
  color: inherit;
  opacity: 0.92;
}

.admin-sidebar .tab-btn.active .admin-menu-icon {
  opacity: 1;
}

.admin-theme-toggle {
  position: relative;
}

.admin-theme-icon {
  display: grid;
  place-items: center;
}

.admin-theme-icon-light {
  display: none;
}

body[data-admin-theme="dark"] .admin-theme-icon-dark {
  display: none;
}

body[data-admin-theme="dark"] .admin-theme-icon-light {
  display: grid;
}

.admin-main .table-scroll-wrapper,
.admin-main .users-table-wrapper,
.admin-main .logs-table-wrapper {
  max-height: min(70vh, 760px);
}

/* Tab Tổ chức / Tòa nhà: bỏ max-height — không hiện thanh cuộn trong khung bảng */
#tab-organizations #orgListView > .table-scroll-wrapper,
#tab-buildings .table-scroll-wrapper {
  max-height: none;
}

.admin-main .buildings-table thead th,
.admin-main .users-table thead th,
.admin-main .logs-table thead th,
.admin-main table.dash-sort-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}

.admin-main .analytics-bar-track {
  background: #eef2f6;
}

.admin-main .analytics-bar-fill {
  background: linear-gradient(180deg, #8098f9, #465fff);
}

.admin-main .analytics-plan-bar {
  background: #eef2f6;
}

.admin-main .analytics-paid-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-main .analytics-paid-table th,
.admin-main .analytics-paid-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #eaecf0;
  text-align: left;
  font-size: 13px;
}

.admin-main .analytics-paid-table th {
  color: #667085;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.modal-content.org-detail-modal {
  width: min(860px, calc(100vw - 32px));
}

.modal-content .org-detail-body {
  display: grid;
  gap: 14px;
}

.modal-content .org-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.modal-content .org-detail-label {
  color: #667085;
  font-size: 12px;
  font-weight: 600;
}

.modal-content .org-detail-value {
  margin-top: 4px;
  color: #1d2939;
  font-size: 14px;
  font-weight: 600;
}

.modal-content .org-detail-section {
  padding: 14px;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  background: #f9fafb;
}

.modal-content .org-detail-section h4 {
  margin: 0 0 10px;
  color: #1d2939;
  font-size: 14px;
}

.modal-content .org-detail-mini-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  border-radius: 8px;
  overflow: hidden;
}

.modal-content .org-detail-mini-table th,
.modal-content .org-detail-mini-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #f2f4f7;
  font-size: 12px;
  text-align: left;
}

.modal-content .org-detail-mini-table th {
  background: #f9fafb;
  color: #667085;
}

.modal-actions {
  gap: 8px;
}

@media (max-width: 700px) {
  .modal-content .org-detail-grid {
    grid-template-columns: 1fr;
  }
}

body[data-admin-theme="dark"] .admin-main .analytics-bar-track,
body[data-admin-theme="dark"] .admin-main .analytics-plan-bar {
  background: #101828;
}

body[data-admin-theme="dark"] .admin-main .analytics-bar-fill {
  background: linear-gradient(180deg, #a4bcfd, #6172f3);
}

body[data-admin-theme="dark"] .admin-main .analytics-bar-label,
body[data-admin-theme="dark"] .admin-main .analytics-plan-head {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .admin-main .analytics-paid-table th,
body[data-admin-theme="dark"] .admin-main .analytics-paid-table td {
  border-color: #344054;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .admin-main .analytics-paid-table th {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .modal-content .org-detail-section {
  border-color: #344054;
  background: #101828;
}

body[data-admin-theme="dark"] .modal-content .org-detail-section h4,
body[data-admin-theme="dark"] .modal-content .org-detail-value {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .modal-content .org-detail-label {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .modal-content .org-detail-mini-table {
  background: #182230;
}

body[data-admin-theme="dark"] .modal-content .org-detail-mini-table th,
body[data-admin-theme="dark"] .modal-content .org-detail-mini-table td {
  border-color: #344054;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .modal-content .org-detail-mini-table th {
  background: #101828;
  color: #98a2b3;
}

/* ============================================================
   AD7 ? Toast, page progress, skeleton loading
   ============================================================ */

.admin-page-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 12050;
  height: 3px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.admin-page-progress.is-active {
  opacity: 1;
}

.admin-page-progress span {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 0 2px 2px 0;
  background: linear-gradient(90deg, var(--brand-accent), var(--admin-primary));
  transition: width 0.35s ease;
}

.admin-toast-region {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 12060;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(380px, calc(100vw - 24px));
  pointer-events: none;
}

.admin-toast {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
  box-shadow: 0 12px 28px rgba(16, 24, 40, 0.14);
  color: var(--admin-text);
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  pointer-events: auto;
}

.admin-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.admin-toast__icon {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-top: 2px;
  border-radius: 50%;
}

.admin-toast--success .admin-toast__icon {
  background: #12b76a;
  box-shadow: inset 0 0 0 3px #ecfdf3;
}

.admin-toast--error .admin-toast__icon {
  background: #f04438;
  box-shadow: inset 0 0 0 3px #fef3f2;
}

.admin-toast--warning .admin-toast__icon {
  background: #f79009;
  box-shadow: inset 0 0 0 3px #fffaeb;
}

.admin-toast--info .admin-toast__icon {
  background: var(--admin-primary);
  box-shadow: inset 0 0 0 3px var(--admin-primary-soft);
}

.admin-toast__body {
  flex: 1;
  font-size: 13px;
  line-height: 1.45;
}

.admin-toast__close {
  border: 0;
  background: transparent;
  color: var(--admin-muted);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}

.admin-state--loading {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 14px 0;
  color: var(--admin-muted);
  font-size: 13px;
}

.admin-spinner {
  width: 16px;
  height: 16px;
  border: 2px solid #d0d5dd;
  border-top-color: var(--admin-primary);
  border-radius: 50%;
  animation: admin-spin 0.75s linear infinite;
}

@keyframes admin-spin {
  to { transform: rotate(360deg); }
}

.admin-skeleton-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
}

.admin-skeleton-card {
  padding: 14px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}

.admin-skeleton-line {
  display: block;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(90deg, #f2f4f7 25%, #e4e7ec 50%, #f2f4f7 75%);
  background-size: 200% 100%;
  animation: admin-skeleton-shimmer 1.2s ease-in-out infinite;
}

.admin-skeleton-line--sm {
  width: 42%;
  margin-bottom: 10px;
}

.admin-skeleton-line--lg {
  width: 72%;
  height: 18px;
}

.admin-skeleton-line.admin-skeleton-cell--wide {
  width: 88%;
}

.admin-skeleton-table-wrap {
  overflow: auto;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
}

.admin-skeleton-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-skeleton-table td {
  padding: 12px 10px;
  border-bottom: 1px solid #f2f4f7;
}

.admin-table-loading-cell {
  text-align: center;
  padding: 18px 12px !important;
}

@keyframes admin-skeleton-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   AD8 ? Empty states + Finance tab polish
   ============================================================ */

.admin-empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 28px 20px;
  border: 1px dashed var(--admin-border);
  border-radius: 12px;
  background: #f9fafb;
  text-align: center;
}

.admin-empty-state--error {
  border-color: #fecaca;
  background: #fef2f2;
}

.admin-empty-state__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: var(--admin-primary-soft);
  color: var(--admin-primary);
}

.admin-empty-state__icon svg {
  width: 22px;
  height: 22px;
}

.admin-empty-state__title {
  margin: 0;
  color: var(--admin-text);
  font-size: 14px;
  font-weight: 700;
}

.admin-empty-state__hint {
  margin: 0;
  max-width: 360px;
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 1.5;
}

.finance-tab-section .finance-panel {
  margin-top: 16px;
}

.finance-toolbar,
.finance-filter-row,
.finance-report-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.finance-report-toolbar {
  align-items: end;
  margin-bottom: 12px;
}

.finance-filter-row {
  margin-bottom: 10px;
}

.finance-panel-hint {
  margin-bottom: 10px;
}

.finance-form-grid input,
.finance-form-grid select,
.finance-form-grid textarea,
.finance-toolbar input,
.finance-report-toolbar input {
  width: 100%;
}

/* Filter HĐ / payment: select gọn, không full-width */
.finance-filter-row select {
  width: auto;
  min-width: 180px;
  max-width: 280px;
  padding: 8px 10px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #fff;
}

.finance-table-wrap {
  overflow: auto;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
}

.finance-data-table {
  width: 100%;
  font-size: 13px;
}

.finance-data-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f9fafb;
}

.finance-org-list {
  min-height: 120px;
}

@media (max-width: 768px) {
  .finance-header-row {
    flex-direction: column;
    align-items: stretch !important;
  }

  .finance-toolbar,
  .finance-report-toolbar {
    width: 100%;
  }

  .finance-form-grid,
  .finance-settings-grid {
    grid-template-columns: 1fr !important;
  }

  .admin-toast-region {
    left: 12px;
    right: 12px;
    width: auto;
  }
}

body[data-admin-theme="dark"] .admin-skeleton-line {
  background: linear-gradient(90deg, #1d2939 25%, #344054 50%, #1d2939 75%);
  background-size: 200% 100%;
}

body[data-admin-theme="dark"] .admin-empty-state {
  background: #101828;
  border-color: #344054;
}

body[data-admin-theme="dark"] .admin-empty-state--error {
  background: #3b1219;
  border-color: #912018;
}

body[data-admin-theme="dark"] .admin-toast {
  background: #182230;
  border-color: #344054;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .finance-data-table thead th {
  background: #101828;
}

body[data-admin-theme="dark"] .finance-table-wrap,
body[data-admin-theme="dark"] .admin-skeleton-table-wrap {
  border-color: #344054;
}

body[data-admin-theme="dark"] .admin-skeleton-table td {
  border-color: #344054;
}

/* ============================================================
   AD10 ? Nav groups, billing list-first, finance sub-tabs
   ============================================================ */

.finance-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 16px;
  padding: 8px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f9fafb;
}

.finance-subnav-btn {
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--admin-muted);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 12px;
}

.finance-subnav-btn:hover {
  background: #fff;
  border-color: #d0d5dd;
  color: var(--admin-text);
}

.finance-subnav-btn.active {
  background: #fff;
  border-color: var(--admin-primary);
  color: var(--admin-primary);
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06);
}

.finance-subpanel {
  display: none;
}

.finance-subpanel.is-active {
  display: block;
  animation: admin-panel-enter 0.22s ease-out;
}

.billing-org-list-head {
  margin-bottom: 12px;
}

.billing-org-list-head h4 {
  margin: 0 0 4px;
  font-size: 16px;
}

.billing-org-slug {
  margin-top: 2px;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 500;
}

.billing-org-table tbody tr.billing-org-row {
  cursor: pointer;
}

.billing-org-table tbody tr.billing-org-row:hover {
  background: #f8fafc;
}

.billing-detail-back-row {
  margin-bottom: 12px;
}

.admin-main .tab-content[style*="block"],
.billing-org-list-panel:not([style*="display: none"]),
.billing-tab-body:not([style*="display: none"]) {
  animation: admin-panel-enter 0.22s ease-out;
}

@keyframes admin-panel-enter {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

body[data-admin-theme="dark"] .admin-nav-group-toggle:hover {
  background: #253044;
  color: var(--admin-primary);
}

body[data-admin-theme="dark"] .admin-nav-group.is-open > .admin-nav-group-toggle {
  background: #253044;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .admin-sidebar .admin-nav-group-items .tab-btn:hover {
  background: #253044;
  color: var(--admin-primary);
}

body[data-admin-theme="dark"] .admin-nav-group-items {
  border-left-color: #344054;
}

/* Mini-rail collapsed — dark mode (YouTube-like) */
body[data-admin-theme="dark"].admin-sidebar-collapsed .admin-nav-group-items .tab-btn {
  color: #eaecf0;
}

body[data-admin-theme="dark"].admin-sidebar-collapsed .admin-nav-group-items .tab-btn:hover,
body[data-admin-theme="dark"].admin-sidebar-collapsed .admin-nav-group-items .tab-btn:active,
body[data-admin-theme="dark"].admin-sidebar-collapsed .admin-nav-group-items .tab-btn.active {
  background: #253044;
  color: #eaecf0;
}

body[data-admin-theme="dark"].admin-sidebar-collapsed .admin-sidebar-footer {
  border-top-color: #344054;
}

body[data-admin-theme="dark"] .finance-subnav {
  background: #101828;
  border-color: #344054;
}

body[data-admin-theme="dark"] .finance-subnav-btn:hover,
body[data-admin-theme="dark"] .finance-subnav-btn.active {
  background: #182230;
  border-color: #6172f3;
  color: #a4bcfd;
}

body[data-admin-theme="dark"] .billing-org-table tbody tr.billing-org-row:hover {
  background: #101828;
}

/* AD14 ? Tab T?ng quan m?c ??nh (KPI + bi?u ?? b?o c?o) */
.overview-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.overview-charts-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 16px;
}

.overview-chart-body {
  min-height: 140px;
}

.overview-dist-list {
  display: grid;
  gap: 12px;
}

.overview-dist-row.is-clickable {
  cursor: pointer;
  border-radius: 8px;
  padding: 4px;
  margin: -4px;
  transition: background-color 0.16s ease;
}

.overview-dist-row.is-clickable:hover {
  background: #f8fafc;
}

.overview-dist-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
  color: #344054;
  font-size: 13px;
}

.overview-dist-track {
  height: 10px;
  overflow: hidden;
  border-radius: 999px;
  background: #f2f4f7;
}

.overview-dist-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #465fff;
}

.overview-dist-fill.accent-green { background: #12b76a; }
.overview-dist-fill.accent-orange { background: #f79009; }
.overview-dist-fill.accent-red { background: #f04438; }
.overview-dist-fill.accent-blue { background: #2e90fa; }
.overview-dist-fill.accent-purple { background: #7a5af8; }
.overview-dist-fill.accent-gray { background: #98a2b3; }
.overview-dist-fill.accent-teal { background: #15b79e; }

.overview-tasks {
  display: grid;
  gap: 8px;
}

.overview-task-item {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #eaecf0;
  border-radius: 10px;
  background: #fff;
  color: #1d2939;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.overview-task-item:hover {
  border-color: #d0d5dd;
  box-shadow: 0 4px 12px rgba(16, 24, 40, 0.06);
  transform: translateY(-1px);
}

.overview-task-main {
  display: grid;
  gap: 2px;
}

.overview-task-main strong {
  font-size: 14px;
}

.overview-task-main small {
  color: #667085;
  font-size: 12px;
}

.overview-task-badge {
  flex: 0 0 auto;
  padding: 4px 8px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #344054;
  font-size: 11px;
  font-weight: 700;
}

.overview-task-item.accent-orange .overview-task-badge {
  background: #fffaeb;
  color: #b54708;
}

.overview-task-item.accent-red .overview-task-badge {
  background: #fef3f2;
  color: #b42318;
}

.overview-tasks-empty {
  margin: 0;
  padding: 8px 0;
}

@media (max-width: 900px) {
  .overview-charts-grid {
    grid-template-columns: 1fr;
  }
}

body[data-admin-theme="dark"] .overview-dist-meta {
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .overview-dist-track {
  background: #101828;
}

body[data-admin-theme="dark"] .overview-dist-row.is-clickable:hover {
  background: #101828;
}

body[data-admin-theme="dark"] .overview-task-item {
  border-color: #344054;
  background: #182230;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-task-main small {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .overview-task-badge {
  background: #101828;
  color: #d0d5dd;
}

/* AD15 ? Overview widget dashboard */
.overview-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.overview-range-label {
  font-size: 12px;
  color: #667085;
}

.overview-range-select {
  min-width: 120px;
  padding: 6px 10px;
  border-radius: 8px;
  border: 1px solid #d0d5dd;
  background: #fff;
  color: #101828;
}

.overview-widget-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 14px;
  margin-bottom: 16px;
}

.overview-widget {
  min-height: 180px;
  margin-bottom: 0 !important;
}

.overview-widget[hidden] {
  display: none !important;
}

.overview-widget--wide {
  grid-column: 1 / -1;
}

.overview-widget-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.overview-widget-head h4 {
  margin: 0;
}

.overview-widget-retry {
  border: 0;
  background: transparent;
  color: #667085;
  font-size: 12px;
  cursor: pointer;
  padding: 2px 4px;
}

.overview-widget-retry:hover {
  color: #175cd3;
}

.overview-widget-body {
  min-height: 120px;
}

.overview-revexp {
  display: grid;
  gap: 10px;
}

.overview-revexp-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 10px 12px;
  border-radius: 10px;
  background: #f9fafb;
  border: 1px solid #eaecf0;
}

.overview-revexp-item.accent-green strong { color: #027a48; }
.overview-revexp-item.accent-red strong { color: #b42318; }
.overview-revexp-item.accent-blue strong { color: #175cd3; }

.overview-revexp-meta {
  margin: 0;
}

.overview-deep-link {
  margin-top: 8px;
}

.overview-top-orgs,
.overview-activity-list,
.overview-alerts-list {
  display: grid;
  gap: 8px;
}

.overview-top-org-row,
.overview-activity-row,
.overview-alert-item {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  text-align: left;
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid #eaecf0;
  background: #fff;
  color: inherit;
}

.overview-top-org-row {
  cursor: pointer;
}

.overview-top-org-row:hover {
  border-color: #b2ccff;
  background: #f5f8ff;
}

.overview-top-rank {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #eff4ff;
  color: #3538cd;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}

.overview-top-main,
.overview-activity-row > div,
.overview-alert-item {
  display: grid;
  gap: 2px;
}

.overview-top-main small,
.overview-activity-row small,
.overview-alert-item small {
  color: #667085;
  font-size: 12px;
}

.overview-activity-row time {
  font-size: 11px;
  color: #98a2b3;
  white-space: nowrap;
}

.overview-alert-item.severity-danger {
  border-color: #fecdca;
  background: #fef3f2;
}

.overview-alert-item.severity-warn {
  border-color: #fedf89;
  background: #fffaeb;
}

@media (max-width: 900px) {
  .overview-widget-grid {
    grid-template-columns: 1fr;
  }
  .overview-widget--wide {
    grid-column: auto;
  }
}

body[data-admin-theme="dark"] .overview-range-label {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .overview-range-select {
  background: #182230;
  border-color: #344054;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-revexp-item,
body[data-admin-theme="dark"] .overview-top-org-row,
body[data-admin-theme="dark"] .overview-activity-row,
body[data-admin-theme="dark"] .overview-alert-item {
  background: #182230;
  border-color: #344054;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-top-org-row:hover {
  background: #101828;
  border-color: #6172f3;
}

body[data-admin-theme="dark"] .overview-top-main small,
body[data-admin-theme="dark"] .overview-activity-row small,
body[data-admin-theme="dark"] .overview-alert-item small,
body[data-admin-theme="dark"] .overview-activity-row time {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .overview-alert-item.severity-danger {
  background: #3b1219;
  border-color: #912018;
}

body[data-admin-theme="dark"] .overview-alert-item.severity-warn {
  background: #2e1c05;
  border-color: #93370d;
}

/* AD16 ? health, nav, delta/spark, org detail page, custom range */
.overview-custom-range {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.overview-date-input {
  padding: 6px 8px;
  border-radius: 8px;
  border: 1px solid #d0d5dd;
  background: #fff;
  color: #101828;
}

.overview-range-sep {
  color: #98a2b3;
  font-size: 12px;
}

.ov-value-row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}

.ov-delta {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

.ov-delta-up { color: #027a48; }
.ov-delta-down { color: #b42318; }
.ov-delta-flat { color: #667085; }

.ov-sparkline {
  display: block;
  margin-top: 6px;
  color: #2e90fa;
  opacity: 0.9;
}

/* AD17 ? KPI cards d?ng mini chart theo ??ng b?n ch?t d? li?u */
.overview-kpi-grid {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.overview-kpi-grid .org-overview-card {
  min-height: 142px;
  padding: 16px 18px;
  overflow: hidden;
}

.overview-kpi-grid .org-overview-card .ov-label {
  margin: 0;
  color: #344054;
  font-size: 13px;
  font-weight: 650;
}

.overview-kpi-grid .org-overview-card .ov-value {
  font-size: 28px;
  letter-spacing: -0.03em;
}

.ov-card-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
}

.ov-card-copy {
  min-width: 0;
  flex: 1 1 auto;
}

.ov-card-main .ov-sub {
  max-width: 160px;
  line-height: 1.45;
}

.ov-mini-chart {
  width: 104px;
  height: 48px;
  flex: 0 0 104px;
  overflow: visible;
}

.ov-mini-area-line {
  stroke: #2e90fa;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ov-mini-area-fill {
  fill: rgba(46, 144, 250, 0.12);
}

.ov-mini-area.accent-green .ov-mini-area-line { stroke: #12b76a; }
.ov-mini-area.accent-green .ov-mini-area-fill { fill: rgba(18, 183, 106, 0.12); }
.ov-mini-area.accent-purple .ov-mini-area-line { stroke: #7a5af8; }
.ov-mini-area.accent-purple .ov-mini-area-fill { fill: rgba(122, 90, 248, 0.13); }
.ov-mini-area.accent-orange .ov-mini-area-line { stroke: #f79009; }
.ov-mini-area.accent-orange .ov-mini-area-fill { fill: rgba(247, 144, 9, 0.14); }

.ov-mini-stacked {
  width: 116px;
  flex: 0 0 116px;
}

.ov-mini-stacked-bar {
  display: flex;
  height: 12px;
  overflow: hidden;
  border-radius: 999px;
  background: #eaecf0;
}

.ov-mini-stacked-bar > span {
  min-width: 2px;
}

.ov-mini-stacked .is-green { background: #12b76a; }
.ov-mini-stacked .is-gray { background: #d0d5dd; }
.ov-mini-stacked .is-orange { background: #f79009; }
.ov-mini-stacked .is-red { background: #f04438; }

.ov-mini-stacked-legend {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  color: #667085;
  font-size: 10px;
}

.ov-mini-stacked-legend span {
  display: flex;
  align-items: center;
  gap: 5px;
}

.ov-mini-stacked-legend i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
}

.ov-mini-donut,
.ov-mini-progress-ring {
  position: relative;
  display: grid;
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(#15b79e var(--kpi-pct), #eaecf0 0);
}

.ov-mini-progress-ring {
  background: conic-gradient(#12b76a var(--kpi-pct), #eaecf0 0);
}

.ov-mini-donut::before,
.ov-mini-progress-ring::before {
  position: absolute;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #fff;
  content: "";
}

.ov-mini-donut span,
.ov-mini-progress-ring span,
.ov-mini-progress-ring small {
  position: relative;
  z-index: 1;
  font-weight: 750;
}

.ov-mini-donut span,
.ov-mini-progress-ring span {
  font-size: 11px;
  color: #344054;
  letter-spacing: -0.02em;
}

.ov-mini-progress-ring small {
  margin-top: -16px;
  color: #98a2b3;
  font-size: 8px;
}

.ov-mini-map-stats {
  width: 112px;
  flex: 0 0 112px;
  display: grid;
  gap: 7px;
}

.ov-mini-map-stats span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 5px;
  border-bottom: 1px solid #eaecf0;
  color: #667085;
  font-size: 9px;
  white-space: nowrap;
}

.ov-mini-map-stats strong {
  color: #344054;
  font-size: 14px;
}

.ov-mini-gauge {
  width: 104px;
  flex: 0 0 104px;
}

.ov-mini-gauge-track {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: #f2f4f7;
}

.ov-mini-gauge-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #fdb022, #f79009);
}

.ov-mini-gauge strong {
  display: inline-block;
  margin-top: 8px;
  color: #b54708;
  font-size: 15px;
}

.ov-mini-gauge small {
  margin-left: 5px;
  color: #98a2b3;
  font-size: 10px;
}

body[data-admin-theme="dark"] .overview-kpi-grid .org-overview-card .ov-label,
body[data-admin-theme="dark"] .ov-mini-donut span,
body[data-admin-theme="dark"] .ov-mini-progress-ring span {
  color: #e4e7ec;
}

body[data-admin-theme="dark"] .ov-mini-map-stats span {
  border-color: #344054;
}

body[data-admin-theme="dark"] .ov-mini-map-stats strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .ov-mini-donut,
body[data-admin-theme="dark"] .ov-mini-progress-ring {
  background: conic-gradient(#15b79e var(--kpi-pct), #344054 0);
}

body[data-admin-theme="dark"] .ov-mini-progress-ring {
  background: conic-gradient(#12b76a var(--kpi-pct), #344054 0);
}

body[data-admin-theme="dark"] .ov-mini-donut::before,
body[data-admin-theme="dark"] .ov-mini-progress-ring::before {
  background: #182230;
}

body[data-admin-theme="dark"] .ov-mini-stacked-bar,
body[data-admin-theme="dark"] .ov-mini-gauge-track {
  background: #344054;
}

@media (max-width: 620px) {
  .overview-kpi-grid {
    grid-template-columns: 1fr;
  }
}

/* AD18 ? Area chart t?ng tr??ng t? ch?c */
.overview-widget--growth {
  min-height: 320px;
  padding: 18px 20px !important;
}

#ov-body-org_growth {
  width: 100%;
}

.overview-widget-subtitle {
  margin: 4px 0 0;
  color: #98a2b3;
  font-size: 12px;
}

.ov-growth-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 26px;
  margin: 4px 0 2px;
  padding: 0 4px;
}

.ov-growth-summary > div:not(.ov-growth-legend) {
  display: grid;
  gap: 2px;
}

.ov-growth-summary span {
  color: #667085;
  font-size: 11px;
}

.ov-growth-summary strong {
  color: #101828;
  font-size: 19px;
  letter-spacing: -0.02em;
}

.ov-growth-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-left: auto;
  padding-bottom: 3px;
}

.ov-growth-nav {
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 5px !important;
  margin-left: 2px;
}

.ov-growth-nav button {
  display: inline-grid;
  width: 28px;
  height: 28px;
  padding: 0;
  place-items: center;
  border: 1px solid #e4e7ec;
  border-radius: 7px;
  background: #fff;
  color: #475467;
  cursor: pointer;
  font-size: 19px;
  line-height: 1;
}

.ov-growth-nav button:hover:not(:disabled) {
  border-color: #a4bcfd;
  color: #3538cd;
}

.ov-growth-nav button:disabled {
  cursor: not-allowed;
  opacity: 0.35;
}

.ov-growth-nav span {
  min-width: 78px;
  text-align: center;
  white-space: nowrap;
}

.ov-growth-summary > div.ov-growth-mode {
  display: inline-flex !important;
  grid-template-columns: none !important;
  align-items: center;
  gap: 2px !important;
  flex-wrap: nowrap;
}

.ov-growth-mode .overview-period-btn {
  min-width: 58px;
  white-space: nowrap;
}

.ov-growth-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.ov-growth-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.ov-growth-legend i.is-total {
  background: #6172f3;
}

.ov-growth-legend i.is-new {
  background: #53b1fd;
}

.ov-growth-chart-scroll {
  width: 100%;
  overflow: hidden;
  overflow-y: hidden;
  cursor: ew-resize;
  overscroll-behavior: contain;
}

.ov-growth-chart {
  display: block;
  width: 100%;
  min-width: 760px;
  height: auto;
  aspect-ratio: 1000 / 220;
}

.ov-growth-pan {
  will-change: transform;
}

.ov-growth-grid-row line {
  stroke: #eaecf0;
  stroke-width: 1;
}

.ov-growth-grid-row text,
.ov-growth-x-label,
.ov-growth-axis-note {
  fill: #98a2b3;
  font-size: 9px;
}

.ov-growth-area {
  fill: url("#ovGrowthAreaFill");
}

.ov-growth-total-line,
.ov-growth-new-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ov-growth-total-line {
  stroke: #6172f3;
  stroke-width: 2.4;
}

.ov-growth-new-line {
  stroke: #53b1fd;
  stroke-width: 1.8;
}

.ov-growth-point circle {
  opacity: 0;
  transition: opacity 0.15s ease, r 0.15s ease;
}

.ov-growth-point:hover circle {
  opacity: 1;
  r: 3.5;
}

.ov-growth-point circle.is-total {
  fill: #6172f3;
}

.ov-growth-point circle.is-new {
  fill: #53b1fd;
}

body[data-admin-theme="dark"] .overview-widget-subtitle,
body[data-admin-theme="dark"] .ov-growth-summary span {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .ov-growth-summary strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .ov-growth-nav button {
  border-color: #344054;
  background: #182230;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .ov-growth-grid-row line {
  stroke: #344054;
}

body[data-admin-theme="dark"] .ov-growth-grid-row text,
body[data-admin-theme="dark"] .ov-growth-x-label,
body[data-admin-theme="dark"] .ov-growth-axis-note {
  fill: #98a2b3;
}

@media (max-width: 700px) {
  .overview-widget--growth {
    padding: 16px !important;
  }

  .ov-growth-legend {
    width: 100%;
    margin-left: 0;
  }

  .ov-growth-chart-scroll {
    overflow-x: auto;
    cursor: auto;
  }
}

.overview-nav-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 10px;
}

.overview-nav-kpis > div {
  padding: 8px 10px;
  border-radius: 8px;
  border: 1px solid #eaecf0;
  background: #f9fafb;
  display: grid;
  gap: 2px;
}

.overview-nav-kpis span {
  font-size: 11px;
  color: #667085;
}

.overview-health-status {
  display: inline-flex;
  margin-bottom: 10px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  background: #ecfdf3;
  color: #027a48;
}

.overview-health-status.status-degraded {
  background: #fffaeb;
  color: #b54708;
}

.overview-health-status.status-critical {
  background: #fef3f2;
  color: #b42318;
}

.overview-health-grid {
  display: grid;
  gap: 10px;
}

.overview-health-track {
  height: 8px;
  border-radius: 999px;
  background: #eaecf0;
  overflow: hidden;
}

.overview-health-track > span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #2e90fa, #12b76a);
}

.overview-health-label {
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 4px;
}

.overview-health-meta {
  font-size: 11px;
  color: #667085;
  margin-top: 4px;
}

.org-detail-page {
  display: grid;
  gap: 14px;
}

.org-detail-page[hidden] {
  display: none !important;
}

#orgListView[hidden] {
  display: none !important;
}
#userListView[hidden] {
  display: none !important;
}
#buildingListView[hidden] {
  display: none !important;
}

.org-detail-page-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  justify-content: space-between;
}

.org-detail-page-header h3 {
  margin: 0;
  flex: 1 1 auto;
}

.org-detail-page-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.org-detail-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  border-bottom: 1px solid #eaecf0;
  padding-bottom: 8px;
}

.org-detail-subnav-btn {
  border: 0;
  background: transparent;
  padding: 8px 12px;
  border-radius: 8px;
  cursor: pointer;
  color: #667085;
  font-weight: 600;
}

.org-detail-subnav-btn.active,
.org-detail-subnav-btn:hover {
  background: #eff4ff;
  color: #3538cd;
}

.org-detail-page-body {
  min-height: 240px;
}

/* ===== Org detail ? hero header (IA SaaS) ===== */
.org-detail-hero-header {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 2px 0 4px;
}
button.linkish.org-detail-back {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  margin: 0 0 4px;
  padding: 7px 11px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}
button.linkish.org-detail-back:hover {
  border-color: #a4bcfd;
  background: #f5f8ff;
  color: #3538cd;
  text-decoration: none;
}
.org-detail-hero-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.org-detail-hero-title-row h3 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -.02em;
}
.org-detail-hero-badges {
  display: inline-flex;
  gap: 6px;
  align-items: center;
}
.org-detail-hero-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 16px;
  color: #667085;
  font-size: 12px;
}
.org-detail-hero-meta code {
  color: #475467;
  font-size: 11px;
}

/* ===== Org Overview ? grid of focused cards ===== */
.org-ov-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
}
.org-ov-card {
  border: 1px solid #eaecf0;
  border-radius: 12px;
  background: #fff;
  padding: 16px 18px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .04);
}
.org-ov-card--wide {
  grid-column: 1 / -1;
}
.org-ov-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}
.org-ov-card-head h4 {
  margin: 0;
  font-size: 14px;
  color: #101828;
}
.org-ov-kv {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 6px 0;
  border-bottom: 1px dashed #f2f4f7;
  font-size: 13px;
}
.org-ov-kv:last-child { border-bottom: 0; }
.org-ov-kv > span { color: #667085; flex: 0 0 auto; }
.org-ov-kv > div { color: #101828; text-align: right; word-break: break-word; }

/* Progress bars (Stripe-like) */
.org-ov-progress { margin-bottom: 14px; }
.org-ov-progress:last-child { margin-bottom: 0; }
.org-ov-progress-top {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 6px;
}
.org-ov-progress-top span { color: #667085; }
.org-ov-progress-top strong { color: #101828; }
.org-ov-progress-inf { color: #98a2b3; font-weight: 600; }
.org-ov-progress-track {
  height: 8px;
  border-radius: 999px;
  background: #f2f4f7;
  overflow: hidden;
}
.org-ov-progress-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: #465fff;
  transition: width .4s ease;
}
.org-ov-progress-fill.is-warn { background: #f79009; }
.org-ov-progress-fill.is-danger { background: #f04438; }

/* Statistics grid */
.org-ov-stat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.org-ov-stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.org-ov-stat-num {
  font-size: 22px;
  font-weight: 700;
  color: #101828;
  letter-spacing: -.02em;
}
.org-ov-stat-label {
  font-size: 12px;
  color: #667085;
}

/* Recent activity */
.org-ov-activity { list-style: none; margin: 0; padding: 0; }
.org-ov-activity li {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid #f2f4f7;
  font-size: 13px;
}
.org-ov-activity li:last-child { border-bottom: 0; }
.org-ov-activity-act { color: #101828; }
.org-ov-activity-time { color: #98a2b3; flex: 0 0 auto; }

/* Quick actions */
.org-ov-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.org-ov-action-btn {
  padding: 12px;
  border: 1px solid #d0d5dd;
  border-radius: 10px;
  background: #fff;
  color: #344054;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
  transition: all .15s ease;
}
.org-ov-action-btn:hover {
  border-color: #a4bcfd;
  background: #f5f8ff;
  color: #3538cd;
}

/* Tab head (buildings/users) */
.org-detail-tab-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin: 4px 0 8px;
}
.org-detail-tab-head h4 { margin: 0; font-size: 15px; }

/* Settings */
.org-settings-row {
  display: flex;
  align-items: center;
  gap: 12px;
}
.org-settings-row label { color: #667085; font-size: 13px; }
.org-settings-row select {
  padding: 8px 12px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #fff;
}
.org-settings-danger {
  border: 1px solid #fecdca;
  border-radius: 12px;
  background: #fffbfa;
  padding: 14px 16px;
}
.org-settings-danger h4 { color: #b42318; }
.org-settings-danger-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.org-settings-danger-row p { margin: 2px 0 0; color: #667085; font-size: 12px; }
.btn-danger {
  padding: 9px 16px;
  border: 1px solid #f04438;
  background: #f04438;
  color: #fff;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
}
.btn-danger:hover { background: #d92d20; border-color: #d92d20; }

/* ?n c?t "T? ch?c" trong b?ng T�a nh� cho role kh�ng ph?i Super Admin */
#buildingsTable.hide-org-col .bcol-org { display: none; }

/* Dark theme */
body[data-admin-theme="dark"] .org-ov-card,
body[data-admin-theme="dark"] button.linkish.org-detail-back,
body[data-admin-theme="dark"] .org-ov-action-btn,
body[data-admin-theme="dark"] .org-settings-row select {
  background: #182230;
  border-color: #344054;
  color: #e4e7ec;
}
body[data-admin-theme="dark"] .org-ov-card-head h4,
body[data-admin-theme="dark"] .org-ov-kv > div,
body[data-admin-theme="dark"] .org-ov-stat-num,
body[data-admin-theme="dark"] .org-ov-activity-act,
body[data-admin-theme="dark"] .org-detail-hero-title-row h3 {
  color: #f2f4f7;
}
body[data-admin-theme="dark"] .org-ov-progress-track { background: #101828; }
body[data-admin-theme="dark"] .org-settings-danger {
  background: #2d1512;
  border-color: #7a271a;
}

body[data-admin-theme="dark"] .overview-date-input {
  background: #182230;
  border-color: #344054;
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-nav-kpis > div {
  background: #182230;
  border-color: #344054;
}

body[data-admin-theme="dark"] .overview-health-track {
  background: #101828;
}

body[data-admin-theme="dark"] .org-detail-subnav {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] .org-detail-subnav-btn.active,
body[data-admin-theme="dark"] .org-detail-subnav-btn:hover {
  background: #101828;
  color: #a4bcfd;
}

.overview-revexp-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.overview-period-seg {
  display: inline-flex;
  padding: 3px;
  border-radius: 10px;
  background: #f2f4f7;
  gap: 2px;
}

.overview-period-btn {
  border: 0;
  background: transparent;
  color: #667085;
  font-size: 12px;
  font-weight: 600;
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
}

.overview-period-btn.is-active {
  background: #fff;
  color: #3538cd;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.08);
}

.overview-revexp-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.overview-revexp-total {
  display: flex;
  align-items: center;
  gap: 10px;
}

.overview-revexp-total span {
  display: block;
  font-size: 12px;
  color: #667085;
}

.overview-revexp-total strong {
  font-size: 22px;
  color: #101828;
}

.overview-revexp-donut {
  width: 44px;
  height: 44px;
  transform: rotate(-90deg);
}

.overview-revexp-donut-bg {
  fill: none;
  stroke: #eaecf0;
  stroke-width: 3.2;
}

.overview-revexp-donut-rev,
.overview-revexp-donut-exp {
  fill: none;
  stroke-width: 3.2;
  stroke-linecap: round;
}

.overview-revexp-donut-rev { stroke: #f79009; }
.overview-revexp-donut-exp { stroke: #ee46bc; }

.overview-revexp-legend {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.overview-revexp-legend > div {
  display: grid;
  grid-template-columns: 10px auto;
  grid-template-rows: auto auto;
  column-gap: 8px;
  align-items: center;
}

.overview-revexp-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  grid-row: 1 / span 2;
}

.overview-revexp-legend.is-rev i,
.overview-revexp-legend > .is-rev i { background: #f79009; }
.overview-revexp-legend > .is-exp i { background: #ee46bc; }

.overview-revexp-legend span {
  font-size: 12px;
  color: #667085;
}

.overview-revexp-legend strong {
  font-size: 16px;
  color: #101828;
}

.overview-revexp-chart-body {
  position: relative;
  border-top: 1px solid #f2f4f7;
  padding-top: 8px;
  overflow-x: auto;
}

.overview-revexp-plot {
  position: relative;
  height: 140px;
  min-width: 100%;
}

.overview-revexp-bar-row,
.overview-revexp-meta-row {
  display: flex;
  gap: 8px;
  padding: 0 4px;
  min-width: max-content;
  width: 100%;
}

.overview-revexp-bar-row {
  height: 140px;
  align-items: flex-end;
  position: relative;
  z-index: 1;
}

.overview-revexp-meta-row {
  align-items: flex-start;
  margin-top: 6px;
}

.overview-revexp-col {
  flex: 1 1 0;
  min-width: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.overview-revexp-col--bar {
  height: 100%;
  justify-content: flex-end;
}

.overview-revexp-bars {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  min-height: 160px;
  padding: 8px 4px 0;
  border-top: 1px solid #f2f4f7;
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
  z-index: 1;
}

.overview-revexp-vals {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1px;
  line-height: 1.2;
  min-height: 3.6em;
}

.overview-revexp-vals .is-rev {
  font-size: 11px;
  font-weight: 600;
  color: #f79009;
}

.overview-revexp-vals .is-exp {
  font-size: 11px;
  font-weight: 600;
  color: #ee46bc;
}

.overview-revexp-vals .is-profit {
  font-size: 11px;
  font-weight: 700;
  color: #12b76a;
}

.overview-revexp-vals .is-profit.is-neg {
  color: #f04438;
}

.overview-revexp-sublabel {
  font-size: 10px;
  color: #98a2b3;
  white-space: nowrap;
}

body[data-admin-theme="dark"] .overview-revexp-sublabel {
  color: #98a2b3;
}

.overview-revexp-stats--compact {
  justify-content: flex-start;
}

.overview-revexp-period-title {
  font-size: 13px;
  font-weight: 600;
  color: #344054;
  margin: 0 0 8px;
  letter-spacing: 0.01em;
}

.overview-revexp-col.is-future {
  opacity: 0.35;
}

body[data-admin-theme="dark"] .overview-revexp-period-title {
  color: #e4e7ec;
}

.overview-revexp-pair {
  width: 100%;
  height: 140px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
}

.overview-revexp-bar {
  width: 42%;
  max-width: 14px;
  min-height: 2px;
  border-radius: 6px 6px 2px 2px;
}

.overview-revexp-bar.is-rev { background: #f79009; }
.overview-revexp-bar.is-exp { background: #ee46bc; }

.overview-revexp-xlabel {
  font-size: 11px;
  color: #98a2b3;
  white-space: nowrap;
}

.overview-revexp-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 12px;
  flex-wrap: wrap;
}

body[data-admin-theme="dark"] .overview-period-seg {
  background: #101828;
}

body[data-admin-theme="dark"] .overview-period-btn.is-active {
  background: #182230;
  color: #a4bcfd;
}

body[data-admin-theme="dark"] .overview-revexp-total strong,
body[data-admin-theme="dark"] .overview-revexp-legend strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-revexp-bars {
  border-top-color: #344054;
}

body[data-admin-theme="dark"] .overview-revexp-donut-bg {
  stroke: #344054;
}

/* Tòa nhà — cột thao tác vừa nút, không chiếm 420px */
.admin-main #buildingsTable th:last-child,
.admin-main #buildingsTable td.actions-cell {
  width: 320px;
  min-width: 320px;
  max-width: 320px;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  padding-right: 12px !important;
  vertical-align: middle;
}

.admin-main #buildingsTable .building-actions {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}

.admin-main #buildingsTable .building-actions button,
.admin-main #buildingsTable .building-actions .ba-btn {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* AD13 — Cột thao tác bảng tổ chức: đủ chỗ 2 nút, không cắt */
.admin-main #orgOrganizationsTable .org-actions-header,
.admin-main #orgOrganizationsTable .org-actions-cell {
  width: 232px;
  min-width: 232px;
  max-width: 240px;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  padding-right: 16px !important;
}

.org-row-actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  flex-wrap: nowrap;
}

.admin-main .org-row-action-btn {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 6px 8px;
  border: 1px solid #d0d5dd;
  border-radius: 7px;
  background: #fff;
  color: #344054;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  flex: 0 0 auto;
  transition:
    background-color 0.16s ease,
    border-color 0.16s ease,
    color 0.16s ease,
    box-shadow 0.16s ease,
    transform 0.16s ease;
}

.admin-main .org-row-action-btn svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.admin-main .org-row-detail-btn {
  border-color: #b2ccff;
  background: #eff8ff;
  color: #175cd3;
}

.admin-main .org-row-status-btn.is-danger {
  border-color: #fecdca;
  background: #fff;
  color: #b42318;
}

.admin-main .org-row-status-btn.is-success {
  border-color: #abefc6;
  background: #ecfdf3;
  color: #067647;
}

.admin-main .org-row-action-btn:hover {
  filter: none;
  box-shadow: 0 2px 5px rgba(16, 24, 40, 0.1);
  transform: translateY(-1px);
}

.admin-main .org-row-detail-btn:hover {
  border-color: #84adff;
  background: #d1e9ff;
}

.admin-main .org-row-status-btn.is-danger:hover {
  border-color: #f97066;
  background: #fef3f2;
}

.admin-main .org-row-status-btn.is-success:hover {
  border-color: #47cd89;
  background: #dcfae6;
}

body[data-admin-theme="dark"] .admin-main .org-row-detail-btn {
  border-color: #3538cd;
  background: #1d2939;
  color: #84adff;
}

body[data-admin-theme="dark"] .admin-main .org-row-status-btn.is-danger {
  border-color: #912018;
  background: #1d2939;
  color: #fda29b;
}

body[data-admin-theme="dark"] .admin-main .org-row-status-btn.is-success {
  border-color: #085d3a;
  background: #1d2939;
  color: #75e0a7;
}

@media (prefers-reduced-motion: reduce) {
  .finance-subpanel.is-active,
  .admin-main .tab-content[style*="block"],
  .billing-org-list-panel:not([style*="display: none"]),
  .billing-tab-body:not([style*="display: none"]) {
    animation: none;
  }
}

/* AD20 ? Overview chart hierarchy: donut + horizontal bars + borderless cards */
#tab-overview .analytics-chart-card,
#tab-overview .org-overview-card {
  border-color: transparent !important;
  box-shadow: 0 2px 10px rgba(16, 24, 40, 0.055);
}

#tab-overview .overview-widget:hover,
#tab-overview .org-overview-card:hover {
  box-shadow: 0 5px 16px rgba(16, 24, 40, 0.075);
}

.overview-widget--growth .overview-widget-head {
  margin-bottom: 2px;
}

.overview-widget--growth .ov-growth-chart-scroll {
  margin-left: -4px;
  width: calc(100% + 8px);
}

.overview-donut-layout {
  display: grid;
  grid-template-columns: minmax(132px, 0.8fr) minmax(180px, 1.2fr);
  align-items: center;
  gap: 26px;
  min-height: 142px;
  padding: 4px 10px 2px;
}

.overview-donut {
  position: relative;
  width: min(142px, 100%);
  aspect-ratio: 1;
  margin: auto;
  border-radius: 50%;
  box-shadow: inset 0 0 0 1px rgba(16, 24, 40, 0.025);
}

.overview-donut::after {
  content: "";
  position: absolute;
  inset: 25%;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 24, 40, 0.035);
}

.overview-donut-center {
  position: absolute;
  z-index: 1;
  inset: 25%;
  display: grid;
  place-content: center;
  text-align: center;
}

.overview-donut-center strong {
  color: #101828;
  font-size: 24px;
  line-height: 1;
}

.overview-donut-center span {
  margin-top: 5px;
  color: #98a2b3;
  font-size: 10px;
  white-space: nowrap;
}

.overview-donut-legend {
  display: grid;
  gap: 8px;
}

.overview-donut-legend-row {
  display: grid;
  grid-template-columns: 9px minmax(0, 1fr) auto 36px;
  align-items: center;
  gap: 8px;
  min-height: 32px;
  color: #475467;
  font-size: 12px;
}

.overview-donut-legend-row.is-clickable {
  cursor: pointer;
  border-radius: 8px;
  padding: 0 6px;
  transition: background-color 0.16s ease;
}

.overview-donut-legend-row.is-clickable:hover {
  background: #f8fafc;
}

.overview-donut-legend-row i {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.overview-donut-legend-row i.accent-green { background: #12b76a; }
.overview-donut-legend-row i.accent-orange { background: #f79009; }
.overview-donut-legend-row i.accent-red { background: #f04438; }
.overview-donut-legend-row i.accent-blue { background: #2e90fa; }
.overview-donut-legend-row i.accent-purple { background: #7a5af8; }
.overview-donut-legend-row i.accent-gray { background: #98a2b3; }

.overview-donut-legend-row strong {
  color: #101828;
  font-size: 13px;
}

.overview-donut-legend-row small {
  color: #98a2b3;
  text-align: right;
}

#ov-body-subscription .overview-dist-list {
  gap: 17px;
  padding: 8px 4px 2px;
}

#ov-body-subscription .overview-dist-track {
  height: 9px;
}

body[data-admin-theme="dark"] #tab-overview .analytics-chart-card,
body[data-admin-theme="dark"] #tab-overview .org-overview-card {
  border-color: transparent !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.24);
}

body[data-admin-theme="dark"] .overview-donut::after {
  background: #182230;
  box-shadow: 0 0 0 1px #344054;
}

body[data-admin-theme="dark"] .overview-donut-center strong,
body[data-admin-theme="dark"] .overview-donut-legend-row strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-donut-legend-row {
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .overview-donut-legend-row.is-clickable:hover {
  background: #101828;
}

@media (max-width: 520px) {
  .overview-donut-layout {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .overview-donut {
    width: 128px;
  }
}


/* AD23 ? Professional subscription data table */
#ov-w-subscription {
  min-height: 272px;
}

.overview-subscription-table-wrap {
  width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
}

.overview-subscription-table {
  width: 100%;
  min-width: 780px;
  border-collapse: collapse;
  color: #344054;
  table-layout: fixed;
}

.overview-subscription-table th,
.overview-subscription-table td {
  padding: 10px 9px;
  border-bottom: 1px solid #eaecf0;
  text-align: left;
  vertical-align: middle;
}

.overview-subscription-table th {
  color: #667085;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  white-space: nowrap;
}

.overview-subscription-table th:nth-child(1) { width: 16%; }
.overview-subscription-table th:nth-child(2) { width: 12%; }
.overview-subscription-table th:nth-child(3) { width: 19%; }
.overview-subscription-table th:nth-child(4) { width: 18%; }
.overview-subscription-table th:nth-child(5) { width: 35%; }

.overview-subscription-row {
  cursor: pointer;
  outline: none;
  transition: background-color 0.15s ease;
}

.overview-subscription-row:hover,
.overview-subscription-row:focus-visible {
  background: #f8fafc;
}

.overview-plan-badge {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  white-space: nowrap;
}

.overview-plan-badge.accent-gray {
  background: #f2f4f7;
  color: #475467;
}

.overview-plan-badge.accent-blue {
  background: #eff8ff;
  color: #175cd3;
}

.overview-plan-badge.accent-purple {
  background: #f4f3ff;
  color: #5925dc;
}

.overview-plan-count {
  color: #101828;
  font-size: 16px;
  font-weight: 800;
}

.overview-plan-revenue {
  color: #101828;
  font-size: 13px;
  font-weight: 750;
  white-space: nowrap;
}

.overview-plan-trend {
  display: flex;
  align-items: center;
  gap: 7px;
}

.overview-subscription-trend {
  flex: 0 0 auto;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
}

.overview-subscription-trend.is-up { color: #039855; }
.overview-subscription-trend.is-down { color: #d92d20; }
.overview-subscription-trend.is-flat { color: #667085; }

.overview-plan-spark {
  display: block;
  width: 58px;
  height: 25px;
  overflow: hidden;
}

.overview-plan-spark .ov-mini-chart {
  display: block;
  width: 58px;
  height: 25px;
}

.ov-mini-area.accent-blue .ov-mini-area-line { stroke: #2e90fa; }
.ov-mini-area.accent-blue .ov-mini-area-fill { fill: rgba(46, 144, 250, 0.12); }
.ov-mini-area.accent-gray .ov-mini-area-line { stroke: #667085; }
.ov-mini-area.accent-gray .ov-mini-area-fill { fill: rgba(102, 112, 133, 0.12); }

.overview-plan-health-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 5px;
  color: #667085;
  font-size: 9px;
  white-space: nowrap;
}

.overview-plan-health-meta strong {
  color: #344054;
  font-size: 10px;
}

.overview-plan-health-track {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: #f2f4f7;
}

.overview-plan-health-track i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: #12b76a;
}

.overview-plan-health-track i.accent-gray { background: #98a2b3; }
.overview-plan-health-track i.accent-blue { background: #2e90fa; }
.overview-plan-health-track i.accent-purple { background: #7a5af8; }
.overview-plan-health-track i.accent-green { background: #12b76a; }

.overview-subscription-table tfoot td {
  border-bottom: 0;
  background: #f8fafc;
  color: #344054;
  font-size: 11px;
}

.overview-subscription-table tfoot td:first-child {
  border-radius: 8px 0 0 8px;
}

.overview-subscription-table tfoot td:last-child {
  border-radius: 0 8px 8px 0;
}

.overview-subscription-table tfoot small {
  color: #98a2b3;
  font-size: 9px;
}

body[data-admin-theme="dark"] .overview-subscription-table {
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .overview-subscription-table th,
body[data-admin-theme="dark"] .overview-subscription-table td {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] .overview-subscription-row:hover,
body[data-admin-theme="dark"] .overview-subscription-row:focus-visible,
body[data-admin-theme="dark"] .overview-subscription-table tfoot td {
  background: #101828;
}

body[data-admin-theme="dark"] .overview-plan-count,
body[data-admin-theme="dark"] .overview-plan-revenue,
body[data-admin-theme="dark"] .overview-plan-health-meta strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-plan-health-track {
  background: #344054;
}

body[data-admin-theme="dark"] .overview-plan-badge.accent-gray {
  background: #344054;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .overview-plan-badge.accent-blue {
  background: rgba(46, 144, 250, 0.16);
  color: #84caff;
}

body[data-admin-theme="dark"] .overview-plan-badge.accent-purple {
  background: rgba(122, 90, 248, 0.18);
  color: #bdb4fe;
}

/* AD25 ? Subscription multi-view (Revenue by Plan / Trend / KPI strip) */
.overview-subscription-view { min-height: 200px; }
.overview-subscription-empty { padding: 32px 8px; text-align: center; }

.overview-revplan-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 14px;
  font-size: 13px;
  color: #475467;
}
.overview-revplan-head strong { font-size: 18px; color: #101828; }
.overview-revplan-list { display: flex; flex-direction: column; gap: 16px; }
.overview-revplan-row { display: flex; flex-direction: column; gap: 6px; border-radius: 8px; padding: 6px 4px; transition: background .15s ease; }
.overview-revplan-row.is-clickable { cursor: pointer; }
.overview-revplan-row.is-clickable:hover { background: rgba(46, 144, 250, 0.06); }
.overview-revplan-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.overview-revplan-meta strong { font-size: 15px; color: #101828; }
.overview-revplan-track { height: 10px; border-radius: 999px; background: #eef2f6; overflow: hidden; }
.overview-revplan-track span { display: block; height: 100%; border-radius: 999px; min-width: 4px; }
.overview-revplan-track span.accent-gray { background: #98a2b3; }
.overview-revplan-track span.accent-blue { background: #2e90fa; }
.overview-revplan-track span.accent-purple { background: #7a5af8; }
.overview-revplan-row small { color: #667085; font-size: 12px; }

.overview-trend-legend { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; font-size: 12px; color: #475467; }
.overview-trend-legend span { display: inline-flex; align-items: center; gap: 6px; }
.overview-trend-legend i { width: 12px; height: 3px; border-radius: 2px; display: inline-block; }
.overview-trend-scroll { width: 100%; overflow-x: auto; }
.overview-trend-chart { width: 100%; height: auto; display: block; }
.overview-trend-grid line { stroke: #eef2f6; stroke-width: 1; }
.overview-trend-grid text { fill: #98a2b3; font-size: 10px; }
.overview-trend-x { fill: #98a2b3; font-size: 10px; }

.overview-subscription-kpi-strip {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid #eef2f6;
}
.overview-subscription-kpi-item { display: flex; flex-direction: column; gap: 3px; }
.overview-subscription-kpi-item span { font-size: 11px; color: #667085; text-transform: uppercase; letter-spacing: .3px; }
.overview-subscription-kpi-item strong { font-size: 15px; color: #101828; }

.overview-subscription-mrr-note {
  margin: 8px 0 0;
  font-size: 12px;
  color: #98a2b3;
}

@media (max-width: 1100px) {
  .overview-subscription-kpi-strip { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
  .overview-subscription-kpi-strip { grid-template-columns: repeat(3, 1fr); }
}

.overview-billing-care-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.overview-billing-care-col h5 {
  margin: 0 0 8px;
  font-size: 13px;
  color: #344054;
}
@media (max-width: 1100px) {
  .overview-billing-care-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .overview-billing-care-grid { grid-template-columns: 1fr; }
}
body[data-admin-theme="dark"] .overview-billing-care-col h5 { color: #d0d5dd; }

.org-plan-table-wrap {
  margin-top: 14px;
  overflow-x: auto;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
}
.org-plan-options-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}
.org-plan-options-table th,
.org-plan-options-table td {
  padding: 12px 14px;
  text-align: left;
  border-bottom: 1px solid #eef2f6;
  vertical-align: middle;
}
.org-plan-options-table th {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .3px;
  color: #667085;
  background: #f9fafb;
}
.org-plan-options-table tr:last-child td { border-bottom: none; }
.org-plan-table-code {
  margin-top: 2px;
  font-size: 12px;
  color: #98a2b3;
}
.org-plan-table-action { white-space: nowrap; }
.org-plan-table-action .btn-create,
.org-plan-table-action .btn-edit {
  min-width: 110px;
}
body[data-admin-theme="dark"] .org-plan-table-wrap { border-color: #344054; }
body[data-admin-theme="dark"] .org-plan-options-table th {
  background: #1d2939;
  color: #98a2b3;
}
body[data-admin-theme="dark"] .org-plan-options-table th,
body[data-admin-theme="dark"] .org-plan-options-table td {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] .overview-revplan-head strong,
body[data-admin-theme="dark"] .overview-revplan-meta strong,
body[data-admin-theme="dark"] .overview-subscription-kpi-item strong { color: #f2f4f7; }
body[data-admin-theme="dark"] .overview-revplan-track { background: #1d2939; }
body[data-admin-theme="dark"] .overview-revplan-row.is-clickable:hover { background: rgba(46, 144, 250, 0.12); }
body[data-admin-theme="dark"] .overview-trend-grid line { stroke: #1d2939; }
body[data-admin-theme="dark"] .overview-subscription-kpi-strip { border-top-color: #1d2939; }

/* AD26 ? Subscription dashboard: m?t b? l?c, n?m kh?i d? li?u */
.overview-widget--subscription {
  padding: 24px;
}

.overview-subscription-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 0 16px;
  border-bottom: 1px solid #eaecf0;
}

.overview-subscription-quick-filter {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
}

.overview-subscription-quick-filter button {
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #667085;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  padding: 7px 10px;
  transition: background .15s ease, color .15s ease;
}

.overview-subscription-quick-filter button:hover {
  background: #f2f4f7;
  color: #344054;
}

.overview-subscription-quick-filter button.is-active {
  background: #eff8ff;
  color: #175cd3;
}

.overview-subscription-period {
  margin: 14px 0 0;
  color: #667085;
  font-size: 12px;
}

.overview-subscription-kpi-strip {
  margin: 12px 0 22px;
  padding: 16px;
  border: 0;
  border-radius: 12px;
  background: #f8fafc;
}

.overview-subscription-section {
  min-width: 0;
  padding: 18px 0 4px;
  border-top: 1px solid #eaecf0;
}

.overview-subscription-section--full {
  padding-top: 0;
  border-top: 0;
}

.overview-subscription-section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.overview-subscription-section-head h5 {
  margin: 0;
  color: #101828;
  font-size: 14px;
  font-weight: 750;
}

.overview-subscription-section-head p {
  margin: 4px 0 0;
  color: #667085;
  font-size: 11px;
}

.overview-subscription-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
  gap: 8px 28px;
  margin-top: 18px;
}

.overview-new-sub-summary,
.overview-upgrade-total {
  display: flex;
  align-items: baseline;
  gap: 7px;
  margin-bottom: 8px;
  color: #667085;
  font-size: 12px;
}

.overview-new-sub-summary strong,
.overview-upgrade-total strong {
  color: #101828;
  font-size: 22px;
}

.overview-new-sub-bar {
  fill: #2e90fa;
  opacity: .9;
}

.overview-upgrade-flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  align-items: center;
  gap: 8px;
  min-height: 126px;
}

.overview-upgrade-plan {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 76px;
  padding: 10px;
  border-radius: 12px;
  background: #f8fafc;
}

.overview-upgrade-plan span {
  color: #667085;
  font-size: 11px;
}

.overview-upgrade-plan strong {
  margin-top: 4px;
  color: #101828;
  font-size: 20px;
}

.overview-upgrade-plan.accent-blue { background: #eff8ff; }
.overview-upgrade-plan.accent-purple { background: #f4f3ff; }

.overview-upgrade-arrow {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #667085;
  line-height: 1.1;
}

.overview-upgrade-arrow > span {
  color: #98a2b3;
  font-size: 20px;
}

.overview-upgrade-arrow strong {
  color: #039855;
  font-size: 14px;
}

.overview-upgrade-arrow small {
  margin-top: 3px;
  font-size: 9px;
  white-space: nowrap;
}

.overview-upgrade-direct {
  margin: 5px 0 0;
  color: #667085;
  font-size: 11px;
  text-align: center;
}

@media (max-width: 1000px) {
  .overview-subscription-grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .overview-widget--subscription { padding: 16px; }
  .overview-subscription-toolbar { align-items: stretch; }
  .overview-subscription-toolbar > .overview-range-select { width: 100%; }
  .overview-subscription-quick-filter { width: 100%; }
  .overview-subscription-quick-filter button { flex: 1 0 auto; }
  .overview-subscription-kpi-strip { grid-template-columns: repeat(2, 1fr); }
  .overview-upgrade-flow {
    grid-template-columns: 1fr;
  }
  .overview-upgrade-arrow {
    flex-direction: row;
    justify-content: center;
    gap: 6px;
  }
  .overview-upgrade-arrow > span { transform: rotate(90deg); }
}

body[data-admin-theme="dark"] .overview-subscription-toolbar,
body[data-admin-theme="dark"] .overview-subscription-section {
  border-color: #344054;
}

body[data-admin-theme="dark"] .overview-subscription-kpi-strip,
body[data-admin-theme="dark"] .overview-upgrade-plan {
  background: #101828;
}

body[data-admin-theme="dark"] .overview-upgrade-plan.accent-blue {
  background: rgba(46, 144, 250, .12);
}

body[data-admin-theme="dark"] .overview-upgrade-plan.accent-purple {
  background: rgba(122, 90, 248, .14);
}

body[data-admin-theme="dark"] .overview-subscription-section-head h5,
body[data-admin-theme="dark"] .overview-new-sub-summary strong,
body[data-admin-theme="dark"] .overview-upgrade-total strong,
body[data-admin-theme="dark"] .overview-upgrade-plan strong {
  color: #f2f4f7;
}

body[data-admin-theme="dark"] .overview-subscription-quick-filter button:hover {
  background: #1d2939;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .overview-subscription-quick-filter button.is-active {
  background: rgba(46, 144, 250, .16);
  color: #84caff;
}

.overview-donut-note {
  margin: 10px 0 0;
  color: #667085;
  font-size: 12px;
  text-align: center;
}

body[data-admin-theme="dark"] .overview-donut-note {
  color: #98a2b3;
}

.overview-range-summary {
  margin: 10px 0 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #eff8ff;
  color: #175cd3;
  font-size: 12px;
  font-weight: 600;
}

body[data-admin-theme="dark"] .overview-range-summary {
  background: rgba(46, 144, 250, .16);
  color: #84caff;
}

/* AD27 ? Dashboard ng?n g?n theo m?c ?u ti?n */
.overview-kpi-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}

.overview-kpi-grid .overview-kpi-featured {
  grid-column: span 2;
}

.overview-kpi-grid .overview-kpi-featured .ov-value {
  font-size: clamp(25px, 2.2vw, 34px);
}

.overview-section-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 30px 0 8px;
  padding-bottom: 12px;
  border-bottom: 1px solid #eaecf0;
}

.overview-section-tabs,
.overview-section-links {
  display: flex;
  align-items: center;
  gap: 6px;
}

.overview-section-tabs button,
.overview-section-links button {
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #667085;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 650;
  padding: 8px 11px;
}

.overview-section-tabs button:hover,
.overview-section-links button:hover {
  background: #f2f4f7;
  color: #344054;
}

.overview-section-tabs button.is-active {
  background: #eff8ff;
  color: #175cd3;
}

.overview-section-links button {
  color: #175cd3;
}

.overview-widget-grid > [hidden],
.overview-tab-section > [hidden] {
  display: none !important;
}

.overview-widget-grid {
  gap: 0 28px;
}

.overview-widget-grid .overview-widget {
  margin: 0;
  padding: 32px 16px;
  border: 0;
  border-top: 1px solid #eaecf0;
  border-radius: 0;
  box-shadow: none;
}

.overview-widget-grid #ov-w-org_growth {
  border-top: 0;
}

.overview-widget-grid .overview-widget--subscription {
  padding: 32px 16px;
}

.overview-widget-grid[data-active-section="operations"] #ov-w-navigation_activity {
  grid-column: 1 / -1;
}

.overview-tasks-card {
  margin-top: 12px;
  border: 0;
  border-top: 1px solid #eaecf0;
  border-radius: 0;
  box-shadow: none;
}

@media (max-width: 1050px) {
  .overview-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .overview-kpi-grid {
    grid-template-columns: 1fr;
  }
  .overview-kpi-grid .overview-kpi-featured {
    grid-column: auto;
  }
  .overview-section-nav {
    align-items: stretch;
    flex-direction: column;
  }
  .overview-section-tabs,
  .overview-section-links {
    overflow-x: auto;
  }
  .overview-section-tabs button,
  .overview-section-links button {
    white-space: nowrap;
  }
}

body[data-admin-theme="dark"] .overview-section-nav,
body[data-admin-theme="dark"] .overview-widget-grid .overview-widget,
body[data-admin-theme="dark"] .overview-tasks-card {
  border-color: #344054;
}

body[data-admin-theme="dark"] .overview-section-tabs button:hover,
body[data-admin-theme="dark"] .overview-section-links button:hover {
  background: #1d2939;
  color: #eaecf0;
}

body[data-admin-theme="dark"] .overview-section-tabs button.is-active {
  background: rgba(46, 144, 250, .16);
  color: #84caff;
}

/* AD33 ? Maps hub (legacy) + building detail profile + profile nav anchors */
.maps-hub-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 12px 0 18px;
}
.maps-hub-stat {
  min-width: 110px;
  padding: 10px 14px;
  border: 1px solid var(--admin-border, #e4e7ec);
  border-radius: 8px;
  background: var(--admin-surface, #fff);
}
.maps-hub-stat strong {
  display: block;
  font-size: 1.35rem;
  line-height: 1.2;
}
.maps-hub-stat span {
  font-size: 12px;
  color: #667085;
}
.maps-hub-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.maps-hub-item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--admin-border, #e4e7ec);
  border-radius: 8px;
  background: var(--admin-surface, #fff);
}
.maps-hub-item h4 {
  margin: 0 0 4px;
  font-size: 15px;
}
.maps-hub-item p {
  margin: 0;
  color: #667085;
  font-size: 13px;
}
.maps-hub-meta {
  margin-top: 6px !important;
  font-size: 12px !important;
}
.maps-hub-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
button.linkish {
  background: none;
  border: none;
  padding: 0;
  color: #175cd3;
  text-decoration: underline;
  cursor: pointer;
  font: inherit;
}
.building-name-link {
  color: inherit;
  text-decoration: none;
}
.building-name-link:hover strong {
  color: #175cd3;
  text-decoration: underline;
}
.building-detail-header {
  align-items: flex-start;
}
.building-detail-header-main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
button.linkish.building-detail-back {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  margin: 0 0 6px;
  padding: 7px 11px;
  border: 1px solid #d0d5dd;
  border-radius: 8px;
  background: #fff;
  color: #344054;
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  align-self: flex-start;
}
button.linkish.building-detail-back:hover {
  border-color: #a4bcfd;
  background: #f5f8ff;
  color: #3538cd;
  text-decoration: none;
  transform: translateY(-1px);
}
.building-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.building-detail-body {
  margin-top: 8px;
}
.building-detail-hero {
  margin-bottom: 16px;
}
.building-detail-desc {
  margin: 8px 0 0;
  font-size: 15px;
  line-height: 1.55;
  color: #344054;
  max-width: 720px;
}
.building-detail-status-row {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.building-detail-banner.warn {
  margin-bottom: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fff6ed;
  color: #b54708;
  font-size: 13px;
}
.building-detail-grid {
  margin-bottom: 20px;
}
.building-detail-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}
.building-detail-people {
  list-style: none;
  margin: 0;
  padding: 0;
}
.building-detail-people li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 0;
  border-bottom: 1px solid #f2f4f7;
  font-size: 13px;
}
.building-detail-people li:last-child {
  border-bottom: 0;
}
.building-detail-people span {
  color: #667085;
  font-size: 12px;
}
.building-detail-map-cta {
  padding-top: 4px;
}
.building-detail-picker {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
.building-detail-picker-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  text-align: left;
  padding: 12px 14px;
  border: 1px solid var(--admin-border, #e4e7ec);
  border-radius: 8px;
  background: var(--admin-surface, #fff);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.building-detail-picker-item:hover {
  border-color: #98a2b3;
  background: #f9fafb;
}
.building-detail-picker-item span {
  color: #667085;
  font-size: 13px;
}
.building-detail-picker-meta {
  font-size: 12px !important;
}
.profile-section-anchor.is-nav-target {
  scroll-margin-top: 72px;
  outline: 2px solid rgba(46, 144, 250, .45);
  outline-offset: 6px;
  border-radius: 4px;
}
body[data-admin-theme="dark"] .maps-hub-stat,
body[data-admin-theme="dark"] .maps-hub-item,
body[data-admin-theme="dark"] .building-detail-picker-item {
  background: #1d2939;
  border-color: #344054;
}
body[data-admin-theme="dark"] .maps-hub-stat span,
body[data-admin-theme="dark"] .maps-hub-item p,
body[data-admin-theme="dark"] .building-detail-picker-item span,
body[data-admin-theme="dark"] .building-detail-people span,
body[data-admin-theme="dark"] .building-detail-desc {
  color: #98a2b3;
}
body[data-admin-theme="dark"] .building-detail-people li {
  border-bottom-color: #344054;
}
body[data-admin-theme="dark"] .building-detail-banner.warn {
  background: #2a1f14;
  color: #fdb022;
}

/* AD52 ? Building Resource Detail (SaaS-style) */
#tab-maps .building-detail-section {
  padding: 0 25px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#tab-maps .building-detail-header {
  margin-bottom: 0;
  padding: 2px 0 20px;
  border-bottom: 0;
}
.building-detail-title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.admin-main .building-detail-title-row h3 {
  margin: 2px 0 0;
  font-size: 26px;
  line-height: 1.25;
  letter-spacing: -.02em;
}
.building-detail-header-address {
  margin: 2px 0 0;
  color: #475467;
  font-size: 14px;
}
.building-detail-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px 16px;
  margin-top: 5px;
  color: #667085;
  font-size: 12px;
}
.building-detail-header-meta code {
  color: #475467;
  font-size: 11px;
}
.building-detail-actions {
  align-self: flex-end;
  padding-bottom: 2px;
}
.building-detail-actions button {
  min-height: 36px;
  padding: 8px 13px;
}
.building-detail-actions .building-detail-primary-action {
  border: 1px solid #465fff;
  background: #465fff;
  color: #fff;
}
.building-detail-actions .building-detail-icon-action {
  width: 38px;
  padding: 8px;
  font-size: 17px;
}
.building-detail-subnav {
  display: flex;
  gap: 4px;
  overflow-x: auto;
  margin: 0 0 22px;
  border-bottom: 1px solid #e4e7ec;
  scrollbar-width: none;
}
.building-detail-subnav[hidden] {
  display: none;
}
.building-detail-subnav::-webkit-scrollbar {
  display: none;
}
.building-detail-subnav-btn {
  position: relative;
  flex: 0 0 auto;
  padding: 11px 14px;
  border: 0;
  background: transparent;
  color: #667085;
  cursor: pointer;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
}
.building-detail-subnav-btn::after {
  position: absolute;
  right: 10px;
  bottom: -1px;
  left: 10px;
  height: 2px;
  border-radius: 2px 2px 0 0;
  background: transparent;
  content: "";
}
.building-detail-subnav-btn:hover,
.building-detail-subnav-btn.active {
  color: #3538cd;
}
.building-detail-subnav-btn.active::after {
  background: #465fff;
}
.building-detail-body {
  margin-top: 0;
}
.building-detail-desc {
  margin: 0 0 18px;
}
.resource-status {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}
.resource-status--published {
  background: #ecfdf3;
  color: #027a48;
}
.resource-status--draft {
  background: #fffaeb;
  color: #b54708;
}
.resource-status--inactive,
.resource-status--empty {
  background: #f2f4f7;
  color: #667085;
}
.resource-kpi-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}
.resource-kpi-grid--compact {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.resource-kpi {
  min-width: 0;
  padding: 16px;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .03);
}
.resource-kpi > span {
  display: block;
  margin-bottom: 8px;
  color: #667085;
  font-size: 12px;
  font-weight: 600;
}
.resource-kpi strong {
  display: block;
  overflow: hidden;
  color: #101828;
  font-size: 26px;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-kpi strong.resource-kpi-text {
  font-size: 17px;
  line-height: 1.5;
}
.resource-kpi small {
  display: block;
  overflow: hidden;
  margin-top: 7px;
  color: #98a2b3;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.resource-two-column {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 16px;
  margin-bottom: 18px;
}
.resource-panel {
  min-width: 0;
  margin-bottom: 18px;
  padding: 18px;
  border: 1px solid #e4e7ec;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .03);
}
.resource-two-column .resource-panel {
  margin-bottom: 0;
}
.resource-panel-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
}
.resource-panel-heading h4,
.resource-panel h5 {
  margin: 0;
  color: #101828;
}
.resource-panel-heading h4 {
  font-size: 15px;
}
.resource-panel h5 {
  margin-top: 16px;
  font-size: 12px;
}
.resource-panel-heading p,
.resource-settings-actions p {
  margin: 3px 0 0;
  color: #667085;
  font-size: 12px;
}
.resource-panel-heading .linkish {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid #d0d5dd;
  border-radius: 7px;
  background: #fff;
  color: #344054;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.resource-panel-heading .linkish:hover {
  border-color: #a4bcfd;
  background: #f5f8ff;
  color: #3538cd;
}
.resource-panel--table {
  padding: 0;
  overflow: hidden;
}
.resource-panel--table .resource-panel-heading {
  margin: 0;
  padding: 16px 18px;
  border-bottom: 1px solid #eaecf0;
}
.resource-property-list {
  margin: 0;
}
.resource-property-list > div {
  display: grid;
  grid-template-columns: minmax(110px, .42fr) minmax(0, 1fr);
  gap: 16px;
  padding: 9px 0;
  border-bottom: 1px solid #f2f4f7;
}
.resource-property-list > div:last-child {
  border-bottom: 0;
}
.resource-property-list dt {
  color: #667085;
  font-size: 12px;
}
.resource-property-list dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: #101828;
  font-size: 13px;
  font-weight: 600;
}
.resource-monospace {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 11px !important;
}
.resource-table-wrap {
  overflow: auto;
  scrollbar-width: none;
}
.resource-table-wrap::-webkit-scrollbar {
  display: none;
}
.resource-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
}
.resource-table th,
.resource-table td {
  padding: 11px 14px;
  border-bottom: 1px solid #f2f4f7;
  color: #344054;
  font-size: 12px;
  text-align: left;
  vertical-align: middle;
}
.resource-table th {
  background: #f9fafb;
  color: #667085;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  white-space: nowrap;
}
.resource-table tbody tr:last-child td {
  border-bottom: 0;
}
.resource-table tbody tr:hover td {
  background: #fcfcfd;
}
.resource-table td > small {
  display: block;
  margin-top: 2px;
  color: #98a2b3;
  font-size: 10px;
}
.resource-table code {
  font-size: 11px;
}
.resource-table .linkish {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 30px;
  padding: 6px 10px;
  border: 1px solid #c7d7fe;
  border-radius: 7px;
  background: #eef4ff;
  color: #3538cd;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
.resource-table .linkish:hover {
  border-color: #8098f9;
  background: #e0e7ff;
  color: #293056;
  transform: translateY(-1px);
}
.building-detail-back:focus-visible,
.resource-panel-heading .linkish:focus-visible,
.resource-table .linkish:focus-visible {
  outline: 3px solid rgba(70, 95, 255, .18);
  outline-offset: 2px;
}
.resource-empty {
  margin: 0;
  padding: 20px;
  color: #98a2b3;
  font-size: 13px;
}
.resource-timeline {
  margin: 0;
  padding: 0;
  list-style: none;
}
.resource-timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 10px;
  padding: 0 0 16px;
}
.resource-timeline li:not(:last-child)::before {
  position: absolute;
  top: 13px;
  bottom: 0;
  left: 5px;
  width: 1px;
  background: #e4e7ec;
  content: "";
}
.resource-timeline-dot {
  position: relative;
  z-index: 1;
  width: 11px;
  height: 11px;
  margin-top: 3px;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #6172f3;
  box-shadow: 0 0 0 1px #c7d7fe;
}
.resource-timeline strong {
  color: #344054;
  font-size: 13px;
}
.resource-timeline p {
  margin: 3px 0;
  color: #667085;
  font-size: 12px;
}
.resource-timeline small {
  color: #98a2b3;
  font-size: 11px;
}
.resource-spark-bars {
  display: flex;
  align-items: flex-end;
  gap: 4px;
  min-height: 76px;
  padding-top: 4px;
}
.resource-spark-bars span {
  flex: 1;
  min-width: 3px;
  max-width: 18px;
  border-radius: 3px 3px 0 0;
  background: #8098f9;
}
.resource-settings-actions {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

@media (max-width: 1100px) {
  .resource-kpi-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 760px) {
  #tab-maps .building-detail-header {
    flex-direction: column;
  }
  .building-detail-actions {
    align-self: stretch;
  }
  .resource-kpi-grid,
  .resource-kpi-grid--compact,
  .resource-two-column {
    grid-template-columns: 1fr;
  }
  .resource-settings-actions {
    align-items: flex-start;
    flex-direction: column;
  }
}

body[data-admin-theme="dark"] .building-detail-header-address,
body[data-admin-theme="dark"] .building-detail-header-meta,
body[data-admin-theme="dark"] .resource-panel-heading p,
body[data-admin-theme="dark"] .resource-settings-actions p {
  color: #98a2b3;
}
body[data-admin-theme="dark"] button.linkish.building-detail-back {
  border-color: #475467;
  background: #1d2939;
  color: #b2ccff;
}
body[data-admin-theme="dark"] button.linkish.building-detail-back:hover {
  border-color: #6172f3;
  background: #202f43;
  color: #84caff;
}
body[data-admin-theme="dark"] .resource-panel-heading .linkish {
  border-color: #475467;
  background: #101828;
  color: #d0d5dd;
}
body[data-admin-theme="dark"] .resource-panel-heading .linkish:hover {
  border-color: #6172f3;
  background: #1d2939;
  color: #b2ccff;
}
body[data-admin-theme="dark"] .resource-table .linkish {
  border-color: #3538cd;
  background: rgba(70, 95, 255, .14);
  color: #b2ccff;
}
body[data-admin-theme="dark"] .resource-table .linkish:hover {
  border-color: #8098f9;
  background: rgba(70, 95, 255, .24);
  color: #e0e7ff;
}
body[data-admin-theme="dark"] .building-detail-header-meta code,
body[data-admin-theme="dark"] .resource-kpi strong,
body[data-admin-theme="dark"] .resource-panel-heading h4,
body[data-admin-theme="dark"] .resource-panel h5,
body[data-admin-theme="dark"] .resource-property-list dd {
  color: #f2f4f7;
}
body[data-admin-theme="dark"] .building-detail-subnav {
  border-bottom-color: #344054;
}
body[data-admin-theme="dark"] .building-detail-subnav-btn {
  color: #98a2b3;
}
body[data-admin-theme="dark"] .building-detail-subnav-btn:hover,
body[data-admin-theme="dark"] .building-detail-subnav-btn.active {
  color: #84caff;
}
body[data-admin-theme="dark"] .resource-kpi,
body[data-admin-theme="dark"] .resource-panel {
  border-color: #344054;
  background: #1d2939;
}
body[data-admin-theme="dark"] .resource-panel--table .resource-panel-heading,
body[data-admin-theme="dark"] .resource-property-list > div,
body[data-admin-theme="dark"] .resource-table th,
body[data-admin-theme="dark"] .resource-table td,
body[data-admin-theme="dark"] .building-detail-people li {
  border-color: #344054;
}
body[data-admin-theme="dark"] .resource-table th {
  background: #101828;
  color: #98a2b3;
}
body[data-admin-theme="dark"] .resource-table td,
body[data-admin-theme="dark"] .resource-timeline strong {
  color: #d0d5dd;
}
body[data-admin-theme="dark"] .resource-table tbody tr:hover td {
  background: #202f43;
}
body[data-admin-theme="dark"] .resource-timeline li:not(:last-child)::before {
  background: #344054;
}

/* AD34/AD36 ? n?n li?n m?ch ch? d?nh cho tab Dashboard */
#tab-overview .admin-section {
  margin-bottom: 20px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

#tab-overview .admin-section > .section-header {
  padding: 0 0 14px;
}

body[data-admin-theme="dark"] #tab-overview .admin-section {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

/* AD35 ? nh?p card v? ph?n c?p n?i dung KPI theo dashboard tham chi?u */
.overview-header-row {
  margin-bottom: 22px;
}

.overview-toolbar {
  align-items: center;
  row-gap: 8px;
}

.overview-toolbar .overview-range-summary {
  flex-basis: 100%;
  width: fit-content;
  margin: 2px 0 0 auto;
  justify-content: center;
}

.overview-kpi-grid {
  gap: 20px;
  margin-bottom: 24px;
}

.overview-kpi-grid .org-overview-card {
  min-height: 156px;
  padding: 20px;
  border-radius: 12px;
}

.overview-kpi-grid .org-overview-card .ov-label {
  line-height: 1.35;
}

.overview-kpi-grid .org-overview-card .ov-card-main {
  min-height: 86px;
  align-items: flex-end;
  gap: 18px;
  margin-top: 10px;
}

.overview-kpi-grid .org-overview-card .ov-value-row {
  display: block;
}

.overview-kpi-grid .org-overview-card .ov-value {
  line-height: 1.15;
}

.overview-kpi-grid .org-overview-card .ov-sub {
  max-width: 240px;
  margin-top: 6px;
  color: #98a2b3;
  font-size: 12px;
}

.ov-card-visual {
  display: flex;
  min-width: 104px;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px;
}

.ov-card-visual .ov-delta {
  min-height: 16px;
  margin-right: auto;
}

.overview-section-nav {
  margin-top: 24px;
}

.overview-widget-grid {
  gap: 20px;
}

.overview-widget-grid .overview-widget,
.overview-widget-grid .overview-widget--subscription,
.overview-tasks-card {
  margin: 0;
  padding: 22px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.05);
}

.overview-widget-grid #ov-w-org_growth {
  border-top: 1px solid var(--admin-border);
}

body[data-admin-theme="dark"] .overview-widget-grid .overview-widget,
body[data-admin-theme="dark"] .overview-tasks-card {
  background: #1d2939;
  border-color: #344054;
}

@media (max-width: 700px) {
  .overview-header-row {
    margin-bottom: 18px;
  }

  .overview-toolbar .overview-range-summary {
    margin-left: 0;
  }

  .overview-kpi-grid {
    gap: 14px;
  }

  .overview-kpi-grid .org-overview-card {
    min-height: 148px;
    padding: 18px;
  }

  .overview-kpi-grid .org-overview-card .ov-card-main {
    gap: 12px;
  }

  .overview-widget-grid {
    gap: 14px;
  }
}

/* AD37 — bảng quản trị thoáng; hiện scrollbar mỏng khi cần */
#tab-buildings .table-scroll-wrapper,
#tab-organizations .table-scroll-wrapper,
#tab-registrations .table-scroll-wrapper,
#tab-billing .finance-table-wrap,
#finance-panel-invoices .finance-table-wrap,
#finance-panel-invoices .finance-table-wrap--borderless,
#tab-logs .logs-table-wrapper,
#mapVersionModal .map-versions-table-wrap {
  overflow: auto;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  scrollbar-width: thin;
  -ms-overflow-style: auto;
}

/* Tab Tòa nhà — fit viewport, ẩn thanh cuộn */
#tab-buildings .table-scroll-wrapper {
  width: 100%;
  max-width: 100%;
  max-height: none;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#tab-buildings #buildingsTable {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed;
  border-collapse: collapse;
}

#tab-buildings #buildingsTable th,
#tab-buildings #buildingsTable td {
  overflow: hidden;
  vertical-align: middle;
}

#tab-buildings #buildingsTable th:nth-child(1),
#tab-buildings #buildingsTable td:nth-child(1) { width: 22%; } /* Tên */
#tab-buildings #buildingsTable th:nth-child(2),
#tab-buildings #buildingsTable td:nth-child(2) { width: 18%; } /* Địa chỉ */
#tab-buildings #buildingsTable th:nth-child(3),
#tab-buildings #buildingsTable td:nth-child(3) { width: 7%; }  /* Số tầng */
#tab-buildings #buildingsTable th:nth-child(4),
#tab-buildings #buildingsTable td:nth-child(4) { width: 10%; } /* Trạng thái */
#tab-buildings #buildingsTable th:nth-child(5),
#tab-buildings #buildingsTable td:nth-child(5) { width: 12%; } /* Tổ chức */
#tab-buildings #buildingsTable th:nth-child(6),
#tab-buildings #buildingsTable td:nth-child(6) { width: 8%; }  /* Cập nhật */
#tab-buildings #buildingsTable th:nth-child(7),
#tab-buildings #buildingsTable td:nth-child(7),
#tab-buildings #buildingsTable td.actions-cell {
  width: 320px;
  min-width: 320px;
  max-width: 320px;
  overflow: visible !important;
  white-space: nowrap !important;
}

#tab-buildings #buildingsTable .cell-ellipsis {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#tab-buildings #buildingsTable .building-name-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  max-width: 100%;
}

#tab-buildings #buildingsTable .building-name-cell > a,
#tab-buildings #buildingsTable .building-name-cell > .building-name-row {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}

#tab-buildings #buildingsTable .building-desc-sub {
  display: block;
  font-size: 12px;
  color: #98a2b3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#tab-buildings #buildingsTable .ba-btn {
  display: inline-block;
  margin: 0;
  padding: 5px 8px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}

#tab-buildings #buildingsTable .ba-btn--detail {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

#tab-buildings #buildingsTable .ba-btn--map {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #15803d;
}

#tab-buildings #buildingsTable .ba-btn--version {
  background: #f5f3ff;
  border-color: #ddd6fe;
  color: #6d28d9;
}

#tab-buildings #buildingsTable .ba-btn--edit {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}

#tab-buildings #buildingsTable .ba-btn--danger {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

#tab-buildings #buildingsTable .ba-btn--success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

#tab-buildings #buildingsTable .ba-note {
  font-size: 11px;
  color: #667085;
}

/* Tab Users — dùng table-wrap như Places; giữ selector cũ để không vỡ theme */
#tab-users .users-table-wrapper,
#tab-users .table-wrap {
  overflow-x: auto;
  overflow-y: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  scrollbar-width: thin;
  -ms-overflow-style: auto;
}

#tab-buildings .table-scroll-wrapper::-webkit-scrollbar {
  width: 0;
  height: 0;
  display: none;
}

#tab-organizations .table-scroll-wrapper::-webkit-scrollbar,
#tab-registrations .table-scroll-wrapper::-webkit-scrollbar,
#tab-billing .finance-table-wrap::-webkit-scrollbar,
#finance-panel-invoices .finance-table-wrap::-webkit-scrollbar,
#tab-logs .logs-table-wrapper::-webkit-scrollbar,
#mapVersionModal .map-versions-table-wrap::-webkit-scrollbar {
  width: 0;
  height: 0;
}

#tab-users .table-wrap::-webkit-scrollbar,
#tab-users .users-table-wrapper::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

#tab-users .table-wrap::-webkit-scrollbar-thumb,
#tab-users .users-table-wrapper::-webkit-scrollbar-thumb {
  background: #c5cdd8;
  border-radius: 999px;
}

#tab-buildings #buildingsTable,
#tab-users .users-table,
#tab-users #usersTable,
#tab-organizations #orgOrganizationsTable,
#tab-registrations .buildings-table,
#tab-billing .billing-org-table,
#finance-panel-invoices .finance-invoice-table,
#finance-panel-invoices .finance-payment-table,
#tab-logs .logs-table,
#mapVersionModal .map-versions-table {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#tab-logs .logs-table {
  min-width: 100%;
  width: 100%;
  background: transparent;
}

#tab-logs .logs-table thead {
  background: transparent;
  color: #475467;
}

#tab-logs .logs-table th {
  border-right: 0;
  border-bottom: 1px solid #f2f4f7;
  color: #475467;
  background: transparent;
  text-transform: uppercase;
  letter-spacing: .035em;
  font-size: 11px;
}

#tab-logs .logs-table td {
  border-bottom: 1px solid #f2f4f7;
}

#tab-logs .logs-table tbody tr:last-child td {
  border-bottom: 0;
}

#mapVersionModal .map-versions-table th,
#mapVersionModal .map-versions-table td {
  border: 0;
  border-bottom: 1px solid #f2f4f7;
}

#mapVersionModal .map-versions-table tbody tr:last-child td {
  border-bottom: 0;
}

body[data-admin-theme="dark"] #tab-logs .logs-table th,
body[data-admin-theme="dark"] #tab-logs .logs-table td,
body[data-admin-theme="dark"] #mapVersionModal .map-versions-table th,
body[data-admin-theme="dark"] #mapVersionModal .map-versions-table td {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] #tab-logs .logs-table thead,
body[data-admin-theme="dark"] #tab-logs .logs-table th {
  color: #98a2b3;
  background: transparent;
}

#finance-panel-invoices .finance-invoice-table,
#finance-panel-invoices .finance-payment-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

#finance-panel-invoices .finance-invoice-table th,
#finance-panel-invoices .finance-invoice-table td,
#finance-panel-invoices .finance-payment-table th,
#finance-panel-invoices .finance-payment-table td {
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid #f2f4f7;
  line-height: 1.4;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#finance-panel-invoices .finance-invoice-table th,
#finance-panel-invoices .finance-payment-table th {
  color: #475467;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
  background: transparent;
  position: static;
}

#finance-panel-invoices .finance-invoice-table tbody tr:last-child td,
#finance-panel-invoices .finance-payment-table tbody tr:last-child td {
  border-bottom: 0;
}

/* Sổ thu tiền — phân bố cột gọn, thao tác không dư trắng */
#finance-panel-invoices .finance-payment-table th:nth-child(1),
#finance-panel-invoices .finance-payment-table td:nth-child(1) { width: 15%; } /* Ngày */
#finance-panel-invoices .finance-payment-table th:nth-child(2),
#finance-panel-invoices .finance-payment-table td:nth-child(2) { width: 14%; } /* Org */
#finance-panel-invoices .finance-payment-table th:nth-child(3),
#finance-panel-invoices .finance-payment-table td:nth-child(3) { width: 22%; } /* HĐ */
#finance-panel-invoices .finance-payment-table th:nth-child(4),
#finance-panel-invoices .finance-payment-table td:nth-child(4) { width: 10%; } /* Method */
#finance-panel-invoices .finance-payment-table th:nth-child(5),
#finance-panel-invoices .finance-payment-table td:nth-child(5) { width: 11%; } /* Số tiền */
#finance-panel-invoices .finance-payment-table th:nth-child(6),
#finance-panel-invoices .finance-payment-table td:nth-child(6) { width: 10%; } /* Status */
#finance-panel-invoices .finance-payment-table th:nth-child(7),
#finance-panel-invoices .finance-payment-table td:nth-child(7) { width: 10%; } /* Ref */
#finance-panel-invoices .finance-payment-table th:nth-child(8),
#finance-panel-invoices .finance-payment-table td:nth-child(8),
#finance-panel-invoices .finance-payment-table td.fp-actions {
  width: 88px;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

/* Bảng hóa đơn */
#finance-panel-invoices .finance-invoice-table th:nth-child(1),
#finance-panel-invoices .finance-invoice-table td:nth-child(1) { width: 22%; }
#finance-panel-invoices .finance-invoice-table th:nth-child(2),
#finance-panel-invoices .finance-invoice-table td:nth-child(2) { width: 22%; }
#finance-panel-invoices .finance-invoice-table th:nth-child(3),
#finance-panel-invoices .finance-invoice-table td:nth-child(3) { width: 10%; }
#finance-panel-invoices .finance-invoice-table th:nth-child(4),
#finance-panel-invoices .finance-invoice-table td:nth-child(4) { width: 12%; }
#finance-panel-invoices .finance-invoice-table th:nth-child(5),
#finance-panel-invoices .finance-invoice-table td:nth-child(5) { width: 12%; }
#finance-panel-invoices .finance-invoice-table th:nth-child(6),
#finance-panel-invoices .finance-invoice-table td:nth-child(6),
#finance-panel-invoices .finance-invoice-table td.fp-actions {
  width: 200px;
  white-space: nowrap;
  overflow: visible;
  text-overflow: clip;
}

#finance-panel-invoices .fp-amount {
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  color: #344054;
}

#finance-panel-invoices .fp-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: #f2f4f7;
  color: #475467;
  font-size: 11px;
  font-weight: 600;
}

#finance-panel-invoices .fp-muted {
  color: #98a2b3;
}

#finance-panel-invoices .fp-btn {
  display: inline-block;
  margin: 0 2px 0 0;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  vertical-align: middle;
}

#finance-panel-invoices .fp-btn--detail {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

#finance-panel-invoices .fp-btn--success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

#finance-panel-invoices .fp-btn--danger {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

#finance-panel-invoices .fp-btn--detail:hover { background: #dbeafe; }
#finance-panel-invoices .fp-btn--success:hover { background: #d1fae5; }
#finance-panel-invoices .fp-btn--danger:hover { background: #fee2e2; }

#finance-panel-invoices .table-pagination {
  margin-top: 10px;
}

body[data-admin-theme="dark"] #finance-panel-invoices .finance-invoice-table th,
body[data-admin-theme="dark"] #finance-panel-invoices .finance-invoice-table td,
body[data-admin-theme="dark"] #finance-panel-invoices .finance-payment-table th,
body[data-admin-theme="dark"] #finance-panel-invoices .finance-payment-table td {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] #finance-panel-invoices .fp-amount { color: #eaecf0; }
body[data-admin-theme="dark"] #finance-panel-invoices .fp-status {
  background: #253044;
  color: #d0d5dd;
}
body[data-admin-theme="dark"] #finance-panel-invoices .fp-btn--detail {
  background: rgba(59, 130, 246, 0.14);
  border-color: rgba(147, 197, 253, 0.35);
  color: #93c5fd;
}
body[data-admin-theme="dark"] #finance-panel-invoices .fp-btn--success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(110, 231, 183, 0.35);
  color: #6ee7b7;
}
body[data-admin-theme="dark"] #finance-panel-invoices .fp-btn--danger {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(252, 165, 165, 0.35);
  color: #fca5a5;
}

body[data-admin-theme="dark"] .finance-filter-row select {
  border-color: #344054;
  background: #1f2a37;
  color: #eaecf0;
}

#tab-users .users-table th,
#tab-users .users-table td,
#tab-users #usersTable th,
#tab-users #usersTable td,
#tab-organizations #orgOrganizationsTable th,
#tab-organizations #orgOrganizationsTable td,
#tab-registrations .buildings-table th,
#tab-registrations .buildings-table td {
  padding: 14px 16px !important;
  line-height: 1.45;
}

/* Users tab — layout giống Place Registry */
#tab-users .user-management-section,
#tab-users #userListView {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#tab-users .section-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

#tab-users .user-page-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

#tab-users .filter-bar {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

#tab-users .filter-bar > div {
  min-width: 0;
}

#tab-users .filter-bar label {
  display: block;
  margin-bottom: 2px;
  font-size: 12px;
  color: #667085;
}

#tab-users .filter-bar input,
#tab-users .filter-bar select {
  min-width: 120px;
  padding: 6px 10px;
  border: 1px solid #d0d5dd;
  border-radius: 6px;
  background: #fff;
  box-sizing: border-box;
}

#tab-users .filter-bar #filterUserKeyword {
  min-width: 180px;
}

#tab-users .users-meta {
  font-size: 12px;
  color: #667085;
  align-self: center;
  margin-left: 4px;
}

#tab-users .users-filter-pending {
  border-color: #e67e22 !important;
  background: #fff7ed !important;
  color: #c2410c !important;
}

#tab-users .users-filter-hint {
  margin: 0 0 12px;
}

#tab-users .table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto; /* không cắt cột Thao tác */
  -webkit-overflow-scrolling: touch;
}

#tab-users #usersTable {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}

#tab-users #usersTable thead th {
  background: transparent !important;
  color: #475467 !important;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.035em;
  text-transform: uppercase;
  white-space: nowrap;
  border-bottom: 1px solid #f2f4f7;
  position: sticky;
  top: 0;
  z-index: 2;
}

#tab-users #usersTable td {
  border-bottom: 1px solid #f2f4f7;
  vertical-align: middle;
  max-width: none;
  overflow: hidden;
}

#tab-users #usersTable tbody tr:last-child td {
  border-bottom: 0;
}

/*
  Cột Thao tác: bề rộng cố định vừa 4 nút — KHÔNG dùng width:1%
  (trước đó bị overflow-x:hidden cắt mất cột).
  Email/Họ tên: vừa phải + ellipsis.
*/
#tab-users #usersTable th:nth-child(1),
#tab-users #usersTable td:nth-child(1) { width: 18%; } /* Email */
#tab-users #usersTable th:nth-child(2),
#tab-users #usersTable td:nth-child(2) { width: 12%; } /* Họ tên */
#tab-users #usersTable th:nth-child(3),
#tab-users #usersTable td:nth-child(3) { width: 9%; }  /* SĐT */
#tab-users #usersTable th:nth-child(4),
#tab-users #usersTable td:nth-child(4) { width: 11%; } /* Vai trò */
#tab-users #usersTable th:nth-child(5),
#tab-users #usersTable td:nth-child(5) { width: 10%; } /* Trạng thái */
#tab-users #usersTable th:nth-child(6),
#tab-users #usersTable td:nth-child(6) { width: 8%; }  /* Tổ chức */
#tab-users #usersTable th:nth-child(7),
#tab-users #usersTable td:nth-child(7) { width: 7%; }  /* Tòa nhà */
#tab-users #usersTable th:nth-child(8),
#tab-users #usersTable td:nth-child(8) { width: 7%; }  /* Ngày tạo */
#tab-users #usersTable th:nth-child(9),
#tab-users #usersTable td:nth-child(9),
#tab-users #usersTable td.actions-cell {
  width: 248px;
  min-width: 248px;
  max-width: 248px;
  white-space: nowrap !important;
  overflow: visible !important;
  position: static !important;
  background: transparent !important;
  box-shadow: none !important;
  border-left: 0 !important;
  padding-left: 10px !important;
  padding-right: 8px !important;
}

#tab-users #usersTable .cell-ellipsis {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#tab-users #usersTable td.actions-cell .ua-btn,
#tab-users #usersTable td.actions-cell .btn-edit,
#tab-users #usersTable td.actions-cell .btn-logout {
  display: inline-block;
  margin: 0 4px 0 0;
  vertical-align: middle;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  padding: 5px 9px;
  white-space: nowrap;
  border-radius: 6px;
  border: 1px solid transparent;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

#tab-users #usersTable td.actions-cell .ua-btn--detail {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1d4ed8;
}

#tab-users #usersTable td.actions-cell .ua-btn--detail:hover {
  background: #dbeafe;
  border-color: #93c5fd;
}

#tab-users #usersTable td.actions-cell .ua-btn--edit {
  background: #f8fafc;
  border-color: #e2e8f0;
  color: #475569;
}

#tab-users #usersTable td.actions-cell .ua-btn--edit:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}

#tab-users #usersTable td.actions-cell .ua-btn--pwd {
  background: #f5f3ff;
  border-color: #ddd6fe;
  color: #6d28d9;
}

#tab-users #usersTable td.actions-cell .ua-btn--pwd:hover {
  background: #ede9fe;
  border-color: #c4b5fd;
}

#tab-users #usersTable td.actions-cell .ua-btn--danger {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}

#tab-users #usersTable td.actions-cell .ua-btn--danger:hover {
  background: #fee2e2;
  border-color: #fca5a5;
}

#tab-users #usersTable td.actions-cell .ua-btn--success {
  background: #ecfdf5;
  border-color: #a7f3d0;
  color: #047857;
}

#tab-users #usersTable td.actions-cell .ua-btn--success:hover {
  background: #d1fae5;
  border-color: #6ee7b7;
}

body[data-admin-theme="dark"] #tab-users #usersTable td.actions-cell .ua-btn--detail {
  background: rgba(59, 130, 246, 0.14);
  border-color: rgba(147, 197, 253, 0.35);
  color: #93c5fd;
}

body[data-admin-theme="dark"] #tab-users #usersTable td.actions-cell .ua-btn--edit {
  background: #253044;
  border-color: #344054;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] #tab-users #usersTable td.actions-cell .ua-btn--pwd {
  background: rgba(139, 92, 246, 0.14);
  border-color: rgba(196, 181, 253, 0.35);
  color: #c4b5fd;
}

body[data-admin-theme="dark"] #tab-users #usersTable td.actions-cell .ua-btn--danger {
  background: rgba(239, 68, 68, 0.12);
  border-color: rgba(252, 165, 165, 0.35);
  color: #fca5a5;
}

body[data-admin-theme="dark"] #tab-users #usersTable td.actions-cell .ua-btn--success {
  background: rgba(16, 185, 129, 0.12);
  border-color: rgba(110, 231, 183, 0.35);
  color: #6ee7b7;
}

#tab-users .user-action-note {
  display: inline-block;
  margin-left: 4px;
  font-size: 12px;
  color: #667085;
  vertical-align: middle;
}

#tab-users #userDetailPage {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

#tab-users #userDetailPageBody {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

body[data-admin-theme="dark"] #tab-users #usersTable thead th {
  color: #98a2b3 !important;
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] #tab-users #usersTable td {
  border-bottom-color: #344054;
}

body[data-admin-theme="dark"] #tab-users .filter-bar input,
body[data-admin-theme="dark"] #tab-users .filter-bar select {
  border-color: #344054;
  background: #1f2a37;
  color: #eaecf0;
}

body[data-admin-theme="dark"] #tab-users .users-meta,
body[data-admin-theme="dark"] #tab-users .filter-bar label {
  color: #98a2b3;
}

@media (max-width: 1024px) {
  #tab-users .user-page-actions {
    width: 100%;
  }

  #tab-users .user-page-actions .btn-add {
    flex: 1 1 auto;
  }
}

.user-page-header,
.user-page-actions {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.user-page-header {
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 18px;
}

.user-page-actions {
  align-items: center;
}

/* H? s? ??ng k?: header v? b? l?c th?nh hai v?ng r? r?ng. */
.registration-page-header {
  margin-bottom: 14px !important;
}

.registration-title-row {
  display: flex;
  width: 100%;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.registration-title-row h3 {
  margin: 0;
}

.registration-title-row p {
  margin: 5px 0 0;
  color: var(--admin-muted);
  font-size: 13px;
}

.registration-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  padding: 14px 16px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: #f9fafb;
}

.registration-process {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: #475467;
  font-size: 12px;
  font-weight: 600;
}

.registration-process span {
  padding: 5px 9px;
  border-radius: 999px;
  background: #fff;
  color: #344054;
}

.registration-process i {
  color: #98a2b3;
  font-style: normal;
}

.registration-filter label {
  display: block;
  margin-bottom: 5px;
  color: #475467;
  font-size: 12px;
  font-weight: 600;
}

.registration-filter select {
  min-width: 155px;
}

/* Danh s?ch g?i: b? khung, t?ng kho?ng th? v? c?n l?i ?? r?ng c?t. */
#tab-billing .billing-org-list-head {
  margin: 18px 0 12px;
}

#tab-billing .billing-org-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
}

#tab-billing .billing-org-table th,
#tab-billing .billing-org-table td {
  padding: 13px 16px;
  border: 0;
  border-bottom: 1px solid #f2f4f7;
  line-height: 1.4;
  text-align: left;
  vertical-align: middle;
}

#tab-billing .billing-org-table th {
  color: #475467;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
}

#tab-billing .billing-org-table th:first-child,
#tab-billing .billing-org-table td:first-child {
  width: 32%;
}

#tab-billing .billing-org-table th:last-child,
#tab-billing .billing-org-table td:last-child {
  width: 96px;
  text-align: right;
}

#tab-billing .billing-org-table tbody tr:last-child td {
  border-bottom: 0;
}

body[data-admin-theme="dark"] .registration-toolbar {
  background: #101828;
  border-color: #344054;
}

body[data-admin-theme="dark"] .registration-process span {
  background: #1d2939;
  color: #eaecf0;
}

body[data-admin-theme="dark"] #tab-billing .billing-org-table th,
body[data-admin-theme="dark"] #tab-billing .billing-org-table td {
  border-bottom-color: #344054;
}

/* Bảng tổ chức: không khung cuộn riêng — trang cuộn tự nhiên, ẩn scrollbar */
#tab-organizations #orgListView > .table-scroll-wrapper {
  width: 100%;
  max-width: 100%;
  max-height: none;
  margin-left: 0;
  margin-right: 0;
  overflow: visible;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

#tab-organizations #orgOrganizationsTable {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
}

#tab-organizations #orgOrganizationsTable th,
#tab-organizations #orgOrganizationsTable td {
  overflow: hidden;
  vertical-align: middle;
}

#tab-organizations #orgOrganizationsTable th:nth-child(1),
#tab-organizations #orgOrganizationsTable td:nth-child(1) {
  width: 16%;
  padding-left: 16px !important;
}
#tab-organizations #orgOrganizationsTable th:nth-child(2),
#tab-organizations #orgOrganizationsTable td:nth-child(2) {
  width: 12%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(3),
#tab-organizations #orgOrganizationsTable td:nth-child(3) {
  width: 12%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(4),
#tab-organizations #orgOrganizationsTable td:nth-child(4) {
  width: 10%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(5),
#tab-organizations #orgOrganizationsTable td:nth-child(5) {
  width: 9%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(6),
#tab-organizations #orgOrganizationsTable td:nth-child(6) {
  width: 8%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(7),
#tab-organizations #orgOrganizationsTable td:nth-child(7) {
  width: 12%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(8),
#tab-organizations #orgOrganizationsTable td:nth-child(8) {
  width: 9%;
}
#tab-organizations #orgOrganizationsTable th:nth-child(9),
#tab-organizations #orgOrganizationsTable td:nth-child(9) {
  width: 232px;
  overflow: visible;
}

#tab-organizations #orgOrganizationsTable .cell-ellipsis,
#tab-organizations #orgOrganizationsTable .org-name-link {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#tab-organizations #orgOrganizationsTable .org-admins-cell {
  max-width: 100%;
  overflow: hidden;
}

#tab-organizations #orgOrganizationsTable .org-admin-chip,
#tab-organizations #orgOrganizationsTable .org-admins-cell > span {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}

#tab-organizations #orgOrganizationsTable th:last-child,
#tab-organizations #orgOrganizationsTable td:last-child {
  padding-right: 16px !important;
}

@media (max-width: 760px) {
  .registration-title-row,
  .registration-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .registration-filter select {
    width: 100%;
  }
}

/* AD39 ? b? l?c v? b?ng G?i ??ng k? to?n chi?u r?ng */
#tab-billing .billing-tab-section {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

#tab-billing .billing-tab-toolbar {
  display: grid;
  grid-template-columns: minmax(260px, 1.5fr) minmax(180px, .8fr) auto auto;
  align-items: end;
  gap: 12px;
}

#tab-billing .billing-search-field input,
#tab-billing .billing-plan-filter select {
  width: 100%;
}

#tab-billing .billing-org-list-panel,
#tab-billing .finance-table-wrap,
#tab-billing .billing-org-table {
  width: 100%;
  max-width: none;
}

#tab-billing .billing-org-slug {
  display: inline;
  margin: 0;
  color: #667085;
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  overflow-wrap: anywhere;
}

#tab-billing .billing-org-table th:first-child,
#tab-billing .billing-org-table td:first-child {
  width: 24%;
}

#tab-billing .billing-org-table th:nth-child(2),
#tab-billing .billing-org-table td:nth-child(2) {
  width: 18%;
}

@media (max-width: 760px) {
  #tab-billing .billing-tab-toolbar {
    grid-template-columns: 1fr;
  }
}

/* AD40 ? trang Danh m?c g?i */
.plans-tab-section {
  width: 100%;
  max-width: none;
}

.plans-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.plans-page-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.plans-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 8px;
}

.plan-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 100%;
  padding: 20px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.05);
}

.plan-card.is-inactive {
  opacity: 0.72;
}

.plan-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.plan-card-code {
  display: inline-flex;
  padding: 3px 8px;
  border-radius: 999px;
  background: #eff8ff;
  color: #175cd3;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.plan-card-status {
  font-size: 12px;
  font-weight: 650;
}

.plan-card-status.is-on { color: #067647; }
.plan-card-status.is-off { color: #b42318; }

.plan-card h4 {
  margin: 0;
  font-size: 18px;
  color: var(--admin-text);
}

.plan-card-desc {
  margin: 0;
  min-height: 40px;
  color: var(--admin-muted);
  font-size: 13px;
  line-height: 1.45;
}

.plan-card-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
}

.plan-card-price strong {
  font-size: 24px;
  letter-spacing: -0.03em;
  color: var(--admin-text);
}

.plan-card-price span {
  color: #98a2b3;
  font-size: 12px;
}

.plan-card-limits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.plan-card-limits div {
  padding: 10px 12px;
  border-radius: 8px;
  background: #f9fafb;
}

.plan-card-limits span {
  display: block;
  color: #667085;
  font-size: 11px;
  font-weight: 650;
}

.plan-card-limits strong {
  display: block;
  margin-top: 4px;
  color: #101828;
  font-size: 15px;
}

.plan-card-features {
  margin: 0;
  padding-left: 18px;
  color: #344054;
  font-size: 13px;
  line-height: 1.5;
}

.plan-card-empty-features {
  margin: 0;
  color: #98a2b3;
  font-size: 12px;
}

.plan-card-actions {
  display: flex;
  gap: 8px;
  margin-top: auto;
  padding-top: 8px;
}

.plan-editor-modal {
  max-width: 640px;
}

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

.plan-editor-active {
  display: flex;
  align-items: end;
}

.plan-editor-active label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}

body[data-admin-theme="dark"] .plan-card {
  background: #1d2939;
  border-color: #344054;
}

body[data-admin-theme="dark"] .plan-card-code {
  background: rgba(46, 144, 250, .16);
  color: #84caff;
}

body[data-admin-theme="dark"] .plan-card-limits div {
  background: #101828;
}

body[data-admin-theme="dark"] .plan-card-limits strong,
body[data-admin-theme="dark"] .plan-card h4,
body[data-admin-theme="dark"] .plan-card-price strong {
  color: #f2f4f7;
}

@media (max-width: 1100px) {
  .plans-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .plans-catalog-grid,
  .plan-editor-grid {
    grid-template-columns: 1fr;
  }
}

/* AD59 ? SaaS Analytics */
.analytics-saas {
  --analytics-blue: #465fff;
  --analytics-green: #12b76a;
  --analytics-red: #f04438;
  --analytics-amber: #f79009;
  display: grid;
  gap: 28px;
}

.admin-main .analytics-saas-header {
  align-items: flex-end;
  margin: 0;
}

.analytics-saas-header h3 {
  margin: 0 0 6px;
  font-size: 24px !important;
}

.analytics-saas .analytics-toolbar,
.analytics-custom-range {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.analytics-saas .analytics-toolbar label {
  width: 100%;
  margin: 0;
}

.analytics-saas .analytics-toolbar select,
.analytics-custom-range input {
  min-height: 38px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: var(--admin-surface);
  color: var(--admin-text);
}

.analytics-custom-range[hidden] {
  display: none !important;
}

.analytics-saas-section {
  display: grid;
  gap: 14px;
}

.analytics-saas-section + .analytics-saas-section {
  padding-top: 26px;
  border-top: 1px solid var(--admin-border);
}

.analytics-saas-section-head,
.analytics-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.analytics-saas-section-head h4 {
  margin: 0 0 4px;
  color: var(--admin-text);
  font-size: 17px;
}

.analytics-saas-section-head p {
  margin: 0;
  color: var(--admin-muted);
  font-size: 13px;
}

.analytics-saas .analytics-summary-cards {
  display: grid;
  gap: 12px;
}

.analytics-saas .analytics-summary-meta {
  color: var(--admin-muted);
  font-size: 12px;
}

.analytics-saas .analytics-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.analytics-saas .analytics-summary-card {
  position: relative;
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 18px;
  color: inherit;
  text-align: left;
  cursor: pointer;
}

.analytics-saas .analytics-summary-card::before {
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  border-radius: 10px 0 0 10px;
  background: var(--analytics-blue);
  content: "";
}

.analytics-saas .analytics-card-publish::before { background: #7a5af8; }
.analytics-saas .analytics-card-invoice::before { background: var(--analytics-green); }
.analytics-saas .analytics-card-amount::before { background: var(--analytics-amber); }
.analytics-saas .analytics-card-expense::before { background: var(--analytics-red); }
.analytics-saas .analytics-card-profit::before { background: #12b76a; }

.analytics-saas .analytics-summary-value {
  overflow: hidden;
  font-size: clamp(22px, 2.2vw, 31px);
  font-weight: 750;
  letter-spacing: -0.04em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analytics-saas .analytics-summary-label {
  color: #475467;
  font-size: 13px;
  font-weight: 650;
  order: -1;
}

.analytics-summary-delta {
  color: #667085;
  font-size: 12px;
  font-weight: 700;
}

.analytics-summary-delta span {
  color: var(--admin-muted);
  font-weight: 500;
}

.analytics-summary-delta.is-up { color: var(--analytics-green); }
.analytics-summary-delta.is-down { color: var(--analytics-red); }

.analytics-saas-grid {
  display: grid;
  gap: 14px;
}

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

.analytics-saas-grid--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-main .analytics-saas .analytics-chart-card {
  min-width: 0;
  margin: 0;
  padding: 18px;
  border-radius: 12px;
  box-shadow: none;
}

.admin-main .analytics-saas .analytics-chart-card--hero {
  padding: 22px;
}

.analytics-card-head {
  margin-bottom: 12px;
}

.analytics-card-head h4,
.analytics-saas .analytics-chart-card > h4 {
  margin: 0 0 12px;
  font-size: 14px;
}

.analytics-card-head h4 {
  margin-bottom: 0;
}

.analytics-saas .linkish {
  border: 0;
  background: transparent;
  color: var(--analytics-blue);
  font-size: 12px;
  font-weight: 650;
  cursor: pointer;
}

.analytics-line-chart,
.analytics-column-chart {
  min-height: 210px;
}

.analytics-chart-card--hero .analytics-line-chart {
  min-height: 300px;
}

.analytics-svg-chart {
  display: block;
  width: 100%;
  height: 230px;
  overflow: visible;
}

.analytics-chart-card--hero .analytics-svg-chart {
  height: 300px;
}

.analytics-svg-grid line {
  stroke: #eaecf0;
  stroke-width: 1;
}

.analytics-svg-grid text {
  fill: #98a2b3;
  font-size: 10px;
}

.analytics-svg-area {
  fill: rgba(70, 95, 255, 0.12);
}

.analytics-svg-line {
  fill: none;
  stroke: var(--analytics-blue);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
}

.analytics-svg-points circle {
  fill: #fff;
  stroke: var(--analytics-blue);
  stroke-width: 1.5;
}

.analytics-columns {
  display: flex;
  align-items: stretch;
  height: 210px;
  gap: 2px;
}

.analytics-column {
  display: grid;
  grid-template-rows: 1fr 18px;
  min-width: 2px;
  flex: 1;
}

.analytics-column-track {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 100%;
  overflow: hidden;
  border-radius: 3px 3px 0 0;
}

.analytics-column-track i {
  display: block;
  width: 100%;
  min-height: 3px;
  border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, #8098f9, var(--analytics-blue));
}

.analytics-column span {
  overflow: visible;
  color: #98a2b3;
  font-size: 9px;
  text-align: center;
  white-space: nowrap;
}

.analytics-data-unavailable {
  display: grid;
  min-height: 210px;
  padding: 24px;
  place-content: center;
  border: 1px dashed var(--admin-border);
  border-radius: 10px;
  color: var(--admin-muted);
  text-align: center;
}

.analytics-data-unavailable span {
  color: var(--admin-text);
  font-weight: 700;
}

.analytics-data-unavailable p {
  max-width: 280px;
  margin: 6px 0 0;
  font-size: 12px;
}

.analytics-business-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.analytics-business-metrics article {
  display: grid;
  gap: 5px;
  padding: 16px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}

.analytics-business-metrics span,
.analytics-business-metrics small {
  color: var(--admin-muted);
  font-size: 11px;
}

.analytics-business-metrics strong {
  color: var(--admin-text);
  font-size: 21px;
}

.analytics-donut-wrap {
  display: grid;
  grid-template-columns: minmax(120px, 0.8fr) minmax(140px, 1.2fr);
  align-items: center;
  gap: 18px;
  min-height: 210px;
}

.analytics-donut {
  display: grid;
  width: min(160px, 100%);
  aspect-ratio: 1;
  margin: auto;
  padding: 22px;
  border-radius: 50%;
  place-items: center;
}

.analytics-donut > div {
  display: grid;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--admin-surface);
  place-content: center;
  text-align: center;
}

.analytics-donut strong {
  max-width: 86px;
  overflow: hidden;
  color: var(--admin-text);
  font-size: 13px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analytics-donut span {
  color: var(--admin-muted);
  font-size: 10px;
}

.analytics-donut-legend {
  display: grid;
  gap: 6px;
}

.analytics-donut-legend button {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  align-items: center;
  gap: 7px;
  padding: 6px 0;
  border: 0;
  background: transparent;
  color: var(--admin-text);
  cursor: pointer;
  text-align: left;
}

.analytics-donut-legend i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}

.analytics-donut-legend span,
.analytics-donut-legend strong {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analytics-multiline-legend {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.analytics-multiline-legend button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--admin-muted);
  font-size: 10px;
  cursor: pointer;
}

.analytics-multiline-legend i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}

.analytics-multiline-lines polyline {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.2;
}

.analytics-funnel {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 210px;
  gap: 5px;
}

.analytics-funnel-step {
  display: grid;
  grid-template-columns: 20px 1fr auto;
  align-items: center;
  min-width: 42%;
  max-width: 100%;
  padding: 9px 12px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--analytics-blue) 14%, var(--admin-surface));
  color: var(--admin-text);
  font-size: 11px;
}

.analytics-funnel-step span {
  display: grid;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--analytics-blue);
  color: #fff;
  font-size: 9px;
  place-items: center;
}

.analytics-ranking-card {
  overflow: hidden;
}

.analytics-ranking-table-wrap {
  overflow: auto;
}

.analytics-ranking-table {
  width: 100%;
  border-collapse: collapse;
}

.analytics-ranking-table th,
.analytics-ranking-table td {
  padding: 9px 8px;
  border-bottom: 1px solid var(--admin-border);
  color: var(--admin-text);
  font-size: 11px;
  text-align: right;
  white-space: nowrap;
}

.analytics-ranking-table th {
  color: var(--admin-muted);
  font-size: 10px;
  text-transform: uppercase;
}

.analytics-ranking-table th:first-child,
.analytics-ranking-table td:first-child {
  max-width: 150px;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
}

.analytics-ranking-table tbody tr[role="button"] {
  cursor: pointer;
}

.analytics-ranking-table tbody tr[role="button"]:hover {
  background: var(--admin-primary-soft);
}

.analytics-insights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.analytics-insight {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 13px 14px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}

.analytics-insight > span {
  display: grid;
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #f2f4f7;
  color: #475467;
  font-weight: 800;
  place-items: center;
}

.analytics-insight--positive > span { background: #ecfdf3; color: #027a48; }
.analytics-insight--negative > span { background: #fef3f2; color: #b42318; }
.analytics-insight--warning > span { background: #fffaeb; color: #b54708; }

.analytics-insight div {
  display: grid;
  gap: 3px;
}

.analytics-insight strong {
  color: var(--admin-text);
  font-size: 13px;
}

.analytics-insight small {
  color: var(--admin-muted);
  font-size: 10px;
}

.analytics-billing-hint-text {
  margin: 0;
  color: var(--admin-muted);
  font-size: 13px;
}

.analytics-billing-hint-btn {
  margin-top: 8px;
}

.analytics-alert-list {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.analytics-alert-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 13px 14px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}

.analytics-alert-type {
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--admin-primary-soft);
  color: var(--admin-primary);
  font-size: 10px;
  font-weight: 750;
}

.analytics-alert-body {
  display: grid;
  gap: 3px;
  color: var(--admin-muted);
  font-size: 12px;
}

.analytics-alert-body strong {
  color: var(--admin-text);
  font-size: 13px;
}

.analytics-alert-item.severity-danger { border-color: rgba(240, 68, 56, .45); }
.analytics-alert-item.severity-warn { border-color: rgba(247, 144, 9, .45); }

body[data-admin-theme="dark"] .analytics-svg-grid line {
  stroke: #344054;
}

body[data-admin-theme="dark"] .analytics-svg-points circle {
  fill: #101828;
}

body[data-admin-theme="dark"] .analytics-saas .analytics-summary-label {
  color: #98a2b3;
}

body[data-admin-theme="dark"] .analytics-insight > span {
  background: #344054;
  color: #d0d5dd;
}

body[data-admin-theme="dark"] .analytics-insight--positive > span { background: rgba(18, 183, 106, .18); color: #32d583; }
body[data-admin-theme="dark"] .analytics-insight--negative > span { background: rgba(240, 68, 56, .18); color: #f97066; }
body[data-admin-theme="dark"] .analytics-insight--warning > span { background: rgba(247, 144, 9, .18); color: #fdb022; }

@media (max-width: 1180px) {
  .analytics-saas-grid--3 {
    grid-template-columns: 1fr;
  }

  .analytics-saas-grid--3 .analytics-chart-card {
    min-height: auto;
  }
}

@media (max-width: 900px) {
  .analytics-saas .analytics-summary-grid,
  .analytics-saas-grid--2,
  .analytics-business-metrics,
  .analytics-insights {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .analytics-saas .analytics-summary-grid,
  .analytics-saas-grid--2,
  .analytics-business-metrics,
  .analytics-insights {
    grid-template-columns: 1fr;
  }

  .analytics-donut-wrap {
    grid-template-columns: 1fr;
  }

  .analytics-saas .analytics-toolbar,
  .analytics-custom-range {
    align-items: stretch;
    width: 100%;
    flex-direction: column;
  }
}
/* AD60 ? Website CMS (Landing fixed pages) */
.website-cms-section { display: grid; gap: 16px; }
.website-subpanel[hidden] { display: none !important; }
.website-legacy-notice {
  margin: 0 0 16px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid #f5d0a8;
  background: #fff8f0;
  color: #7a3e0d;
}
.website-legacy-notice strong {
  display: block;
  margin-bottom: 4px;
  font-size: 13px;
}
.website-legacy-notice p {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  color: #8a5520;
}
.website-legacy-notice code {
  font-size: 12px;
  padding: 1px 4px;
  border-radius: 4px;
  background: rgba(122, 62, 13, 0.08);
}
.admin-nav-legacy {
  display: inline-grid;
  margin-left: auto;
  padding: 2px 6px;
  border-radius: 999px;
  border: 1px solid #e8c39a;
  background: #fff4e8;
  color: #9a5b16;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  line-height: 1.2;
}
.tab-btn.is-website-legacy {
  opacity: 0.88;
}
body.admin-sidebar-collapsed .admin-nav-legacy {
  display: none;
}
.website-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.website-form-grid .span-2 { grid-column: 1 / -1; }
.website-form-grid label {
  display: grid;
  gap: 6px;
  color: var(--admin-muted);
  font-size: 12px;
  font-weight: 650;
}
.website-form-grid input,
.website-form-grid select,
.website-form-grid textarea {
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: var(--admin-surface);
  color: var(--admin-text);
}
.website-pages-table { width: 100%; }
.website-editor-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.website-editor-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.website-editor-grid {
  display: grid;
  grid-template-columns: 200px minmax(0, 1.4fr) 280px;
  gap: 12px;
  min-height: 520px;
}
.website-editor-sections,
.website-editor-preview,
.website-editor-props {
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  padding: 12px;
  overflow: auto;
}
.website-section-item {
  display: flex;
  justify-content: space-between;
  width: 100%;
  margin-bottom: 6px;
  padding: 10px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: transparent;
  color: var(--admin-text);
  cursor: pointer;
  text-align: left;
}
.website-section-item.is-active {
  border-color: var(--admin-primary);
  background: var(--admin-primary-soft);
}
.website-preview-frame {
  display: grid;
  gap: 14px;
  padding: 8px;
}
.website-preview-frame article {
  padding: 14px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
}
.wp-hero h2 { margin: 6px 0; font-size: 22px; }
.wp-eyebrow { color: var(--admin-muted); font-size: 12px; }
.wp-cta span {
  display: inline-block;
  padding: 8px 12px;
  border-radius: 8px;
  background: #465fff;
  color: #fff;
  font-size: 12px;
}
.wp-stats, .wp-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.wp-stats div, .wp-cards div {
  padding: 10px;
  border-radius: 8px;
  background: #f8fafc;
}
.website-prop-row { display: grid; gap: 5px; margin-bottom: 10px; font-size: 12px; }
.website-nav-item,
.website-media-grid,
.website-forms-grid {
  display: grid;
  gap: 10px;
}
.website-nav-item {
  grid-template-columns: 1.2fr 1.4fr 80px auto auto;
  align-items: center;
}
.website-media-grid { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.website-media-grid article,
.website-form-card {
  display: grid;
  gap: 6px;
  padding: 12px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}
.website-forms-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.website-panel-actions { display: flex; gap: 8px; margin-bottom: 12px; }
.website-audit-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.website-audit-pagination span {
  color: var(--admin-text-muted, #64748b);
  font-size: 13px;
  font-weight: 600;
}
.website-audit-pagination button:disabled {
  cursor: not-allowed;
  opacity: .45;
}
body[data-admin-theme="dark"] .wp-stats div,
body[data-admin-theme="dark"] .wp-cards div { background: #101828; }
@media (max-width: 1100px) {
  .website-editor-grid { grid-template-columns: 1fr; }
  .website-forms-grid { grid-template-columns: 1fr 1fr; }
  .website-nav-item { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .website-form-grid,
  .website-forms-grid,
  .wp-stats,
  .wp-cards { grid-template-columns: 1fr; }
}

/* AD61 ? Contact CRM mini */
.admin-nav-badge {
  display: inline-grid;
  min-width: 18px;
  height: 18px;
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 999px;
  background: #f04438;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  place-items: center;
}
.website-contact-toolbar {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.website-contact-filters { display: flex; gap: 6px; flex-wrap: wrap; }
.website-contact-filter {
  border: 1px solid var(--admin-border);
  border-radius: 999px;
  background: transparent;
  color: var(--admin-muted);
  padding: 6px 10px;
  cursor: pointer;
  font-size: 12px;
}
.website-contact-filter.is-active {
  border-color: var(--admin-primary);
  background: var(--admin-primary-soft);
  color: var(--admin-text);
}
.website-contact-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 12px;
}
.website-contact-stats article {
  padding: 12px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-surface);
}
.website-contact-stats strong { display: block; font-size: 22px; color: var(--admin-text); }
.website-contact-stats span { color: var(--admin-muted); font-size: 12px; }
.website-contact-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.9fr) minmax(0, 1.3fr);
  gap: 12px;
  min-height: 560px;
}
.website-contact-list,
.website-contact-detail {
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  overflow: auto;
}
.website-contact-list { padding: 8px; }
.website-contact-detail { padding: 16px; }
.website-contact-row {
  display: grid;
  grid-template-columns: 28px 1fr auto;
  gap: 8px;
  width: 100%;
  margin-bottom: 6px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: var(--admin-text);
  text-align: left;
  cursor: pointer;
}
.website-contact-row.is-active,
.website-contact-row:hover {
  border-color: var(--admin-border);
  background: var(--admin-primary-soft);
}
.website-contact-main { display: grid; gap: 2px; min-width: 0; }
.website-contact-main strong,
.website-contact-main small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.website-contact-main small,
.website-contact-meta time { color: var(--admin-muted); font-size: 11px; }
.website-contact-meta { display: grid; gap: 4px; justify-items: end; }
.crm-status {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  font-style: normal;
}
.crm-NEW { background: #eff8ff; color: #175cd3; }
.crm-IN_PROGRESS { background: #fffaeb; color: #b54708; }
.crm-REPLIED { background: #ecfdf3; color: #027a48; }
.crm-CLOSED { background: #f2f4f7; color: #475467; }
.crm-SPAM { background: #fef3f2; color: #b42318; }
.website-contact-detail-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.website-contact-detail-head h3 { margin: 0 0 4px; }
.website-contact-detail-head p { margin: 0; color: var(--admin-muted); }
.website-contact-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 16px;
}
.website-contact-dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 14px;
  margin: 0 0 16px;
}
.website-contact-dl dt { color: var(--admin-muted); font-size: 11px; }
.website-contact-dl dd { margin: 2px 0 0; color: var(--admin-text); font-size: 13px; word-break: break-word; }
.website-contact-message {
  padding: 12px;
  border-radius: 10px;
  background: #f8fafc;
  white-space: pre-wrap;
}
.website-contact-history { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.website-contact-history li {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border-left: 3px solid var(--admin-primary);
  background: #f8fafc;
}
.website-contact-history time { color: var(--admin-muted); font-size: 11px; }
body[data-admin-theme="dark"] .website-contact-message,
body[data-admin-theme="dark"] .website-contact-history li { background: #101828; }
@media (max-width: 980px) {
  .website-contact-layout,
  .website-contact-stats,
  .website-contact-dl { grid-template-columns: 1fr; }
}

/* ===== B6 — Cmd+K + notification drawer ===== */
.admin-notif-btn { position: relative; }
.admin-notif-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #f04438;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}
.admin-command-palette[hidden],
.admin-notif-drawer[hidden] { display: none !important; }
.admin-command-palette {
  position: fixed;
  inset: 0;
  z-index: 1200;
}
.admin-command-palette-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, .45);
}
.admin-command-palette-panel {
  position: relative;
  width: min(560px, calc(100vw - 32px));
  margin: 12vh auto 0;
  padding: 12px;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: var(--admin-surface);
  box-shadow: 0 18px 50px rgba(15, 23, 42, .25);
}
#adminCommandInput {
  width: 100%;
  min-height: 42px;
  padding: 10px 12px;
  border: 1px solid var(--admin-border);
  border-radius: 8px;
  background: var(--admin-bg, #fff);
  color: var(--admin-text);
}
.admin-command-list {
  list-style: none;
  margin: 10px 0 0;
  padding: 0;
  max-height: 320px;
  overflow: auto;
}
.admin-command-list li button {
  width: 100%;
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--admin-text);
  text-align: left;
  cursor: pointer;
}
.admin-command-list li button:hover,
.admin-command-list li.is-active button {
  background: var(--admin-primary-soft);
}
.admin-command-list code {
  color: var(--admin-muted);
  font-size: 11px;
}
.admin-command-hint {
  margin: 8px 2px 0;
  color: var(--admin-muted);
  font-size: 11px;
}
.admin-notif-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1190;
  width: min(360px, 100vw);
  height: 100vh;
  display: flex;
  flex-direction: column;
  border-left: 1px solid var(--admin-border);
  background: var(--admin-surface);
  box-shadow: -12px 0 30px rgba(15, 23, 42, .12);
}
.admin-notif-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--admin-border);
}
.admin-notif-list {
  flex: 1;
  overflow: auto;
  padding: 10px;
  display: grid;
  gap: 8px;
  align-content: start;
}
.admin-notif-item {
  position: relative;
  padding: 10px 12px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  background: var(--admin-bg, #fff);
  cursor: pointer;
  text-align: left;
}
.admin-notif-item.is-unread {
  border-color: rgba(70, 95, 255, .28);
  background: var(--admin-primary-soft, #f3f5ff);
}
.admin-notif-item.is-unread::after {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #465fff;
  content: "";
}
.admin-notif-item strong {
  display: block;
  margin-bottom: 4px;
  color: var(--admin-text);
  font-size: 13px;
}
.admin-notif-item span {
  color: var(--admin-muted);
  font-size: 12px;
}
.admin-notif-empty {
  color: var(--admin-muted);
  font-size: 13px;
  padding: 16px 8px;
}

/* C2 — Publish jobs modal */
.publish-jobs-modal {
  padding: 24px;
  backdrop-filter: blur(4px);
}
.publish-jobs-dialog {
  width: min(920px, calc(100vw - 32px));
  max-width: 920px !important;
  max-height: min(760px, calc(100vh - 48px));
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 18px !important;
  background: #fff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, .24) !important;
}
.publish-jobs-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 24px 26px 18px;
  border-bottom: 1px solid #e8edf3;
}
.publish-jobs-eyebrow {
  display: block;
  margin-bottom: 5px;
  color: #465fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.publish-jobs-head h3 {
  margin: 0;
  color: #1d2939;
  font-size: 21px;
  line-height: 1.3;
}
.publish-jobs-head p {
  margin: 6px 0 0;
  color: #667085;
  font-size: 13px;
}
.publish-jobs-close {
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  border: 0;
  border-radius: 9px;
  background: #f2f4f7;
  color: #667085;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
.publish-jobs-close:hover {
  background: #e4e7ec;
  color: #1d2939;
}
.publish-jobs-toolbar {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding: 16px 26px;
  background: #f8fafc;
  border-bottom: 1px solid #e8edf3;
}
.publish-jobs-filter {
  display: grid;
  gap: 5px;
}
.publish-jobs-filter label {
  color: #475467;
  font-size: 12px;
  font-weight: 700;
}
.publish-jobs-filter select {
  min-width: 150px;
  height: 38px;
  padding: 0 34px 0 11px;
  border: 1px solid #d0d5dd;
  border-radius: 9px;
  background: #fff;
  color: #344054;
  font-weight: 600;
}
.publish-jobs-refresh,
.publish-jobs-done {
  height: 38px;
  padding: 0 14px;
  border: 1px solid #d0d5dd;
  border-radius: 9px;
  background: #fff;
  color: #344054;
  font-weight: 700;
  cursor: pointer;
}
.publish-jobs-refresh:hover {
  border-color: #9aa8ff;
  color: #465fff;
}
.publish-jobs-summary {
  margin-left: auto;
  padding-bottom: 9px;
  color: #667085;
  font-size: 12px;
}
.publish-jobs-list {
  min-height: 180px;
  max-height: 430px;
  padding: 14px 26px 18px;
  overflow: auto;
  background: #fff;
}
.publish-jobs-table-wrap {
  overflow-x: auto;
  border: 1px solid #e4e7ec;
  border-radius: 12px;
}
.publish-jobs-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  table-layout: fixed;
}
.publish-jobs-table th {
  padding: 11px 12px;
  border-bottom: 1px solid #e4e7ec;
  background: #f9fafb;
  color: #667085;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .04em;
  text-align: left;
  text-transform: uppercase;
}
.publish-jobs-table td {
  padding: 13px 12px;
  border-bottom: 1px solid #f0f2f5;
  color: #344054;
  font-size: 12px;
  vertical-align: middle;
}
.publish-jobs-table tbody tr:last-child td {
  border-bottom: 0;
}
.publish-jobs-table tbody tr:hover {
  background: #fafbff;
}
.publish-job-building {
  display: block;
  overflow: hidden;
  color: #1d2939;
  font-size: 13px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.publish-job-meta,
.publish-job-time {
  display: block;
  margin-top: 3px;
  color: #98a2b3;
  font-size: 11px;
}
.publish-job-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 800;
}
.publish-job-status::before {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}
.publish-job-status--success { background: #ecfdf3; color: #027a48; }
.publish-job-status--failed { background: #fef3f2; color: #d92d20; }
.publish-job-status--running { background: #eff8ff; color: #175cd3; }
.publish-job-status--queued { background: #fff7e8; color: #b54708; }
.publish-job-error {
  display: -webkit-box;
  overflow: hidden;
  color: #667085;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.publish-job-retry {
  padding: 7px 11px;
  border: 1px solid #fda29b;
  border-radius: 8px;
  background: #fff;
  color: #b42318;
  font-size: 11px;
  font-weight: 800;
  cursor: pointer;
}
.publish-job-retry:hover {
  background: #fef3f2;
}
.publish-jobs-state {
  display: grid;
  min-height: 170px;
  place-items: center;
  padding: 24px;
  color: #667085;
  text-align: center;
}
.publish-jobs-state strong {
  display: block;
  margin-bottom: 5px;
  color: #344054;
  font-size: 14px;
}
.publish-jobs-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 26px;
  border-top: 1px solid #e8edf3;
  background: #f8fafc;
}
.publish-jobs-foot span {
  color: #98a2b3;
  font-size: 11px;
}
.publish-jobs-done {
  min-width: 78px;
  border-color: #465fff;
  background: #465fff;
  color: #fff;
}
.publish-jobs-done:hover {
  background: #3641f5;
}
@media (max-width: 680px) {
  .publish-jobs-modal { padding: 10px; }
  .publish-jobs-dialog {
    width: calc(100vw - 20px);
    max-height: calc(100vh - 20px);
  }
  .publish-jobs-head,
  .publish-jobs-toolbar,
  .publish-jobs-list,
  .publish-jobs-foot {
    padding-left: 16px;
    padding-right: 16px;
  }
  .publish-jobs-toolbar { align-items: stretch; flex-wrap: wrap; }
  .publish-jobs-filter { flex: 1; }
  .publish-jobs-filter select { width: 100%; }
  .publish-jobs-summary { width: 100%; margin-left: 0; padding: 2px 0 0; }
  .publish-jobs-foot span { display: none; }
  .publish-jobs-done { margin-left: auto; }
}

/* ===== Map Governance tables UI (community / verify / versions) ===== */
.mgc-table-wrap {
  overflow: auto;
  border: 1px solid var(--admin-border);
  border-radius: 12px;
  background: #fff;
}

.mgc-table {
  table-layout: fixed;
  width: 100%;
}

.mgc-table th,
.mgc-table td {
  vertical-align: middle;
}

.mgc-table--community th:nth-child(1),
.mgc-table--community td:nth-child(1) { width: 28%; }
.mgc-table--community th:nth-child(2),
.mgc-table--community td:nth-child(2) { width: 14%; }
.mgc-table--community th:nth-child(3),
.mgc-table--community td:nth-child(3) { width: 38%; }
.mgc-table--community th:nth-child(4),
.mgc-table--community td:nth-child(4) { width: 20%; }

.mgc-table--versions th:nth-child(1),
.mgc-table--versions td:nth-child(1) { width: 28%; }
.mgc-table--versions th:nth-child(2),
.mgc-table--versions td:nth-child(2) { width: 12%; }
.mgc-table--versions th:nth-child(3),
.mgc-table--versions td:nth-child(3) { width: 12%; }
.mgc-table--versions th:nth-child(4),
.mgc-table--versions td:nth-child(4) { width: 8%; }
.mgc-table--versions th:nth-child(5),
.mgc-table--versions td:nth-child(5) { width: 18%; }
.mgc-table--versions th:nth-child(6),
.mgc-table--versions td:nth-child(6) { width: 14%; }

.mgc-table--verify th:nth-child(1),
.mgc-table--verify td:nth-child(1) { width: 24%; }
.mgc-table--verify th:nth-child(2),
.mgc-table--verify td:nth-child(2) { width: 14%; }
.mgc-table--verify th:nth-child(3),
.mgc-table--verify td:nth-child(3) { width: 28%; }
.mgc-table--verify th:nth-child(4),
.mgc-table--verify td:nth-child(4) { width: 16%; }
.mgc-table--verify th:nth-child(5),
.mgc-table--verify td:nth-child(5) { width: 18%; }

.mgc-toolbar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.mgc-toolbar input[type="search"] {
  min-width: 240px;
  padding: 9px 12px;
  border: 1px solid var(--admin-border);
  border-radius: 10px;
  font: inherit;
  background: #fff;
}

.mgc-meta {
  margin: 0 0 12px;
}
.mgc-meta-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: #eef4ff;
  color: #344054;
  font-size: 13px;
}

.mgc-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
  line-height: 1.4;
}
.mgc-badge--ok { background: #dcfae6; color: #027a48; }
.mgc-badge--info { background: #e0f2fe; color: #026aa2; }
.mgc-badge--warn { background: #fef0c7; color: #b54708; }
.mgc-badge--danger { background: #fee4e2; color: #b42318; }
.mgc-badge--muted { background: #f2f4f7; color: #475467; }

.mgc-id,
.mgc-gps {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  color: #475467;
  background: #f9fafb;
  border: 1px solid #eaecf0;
  border-radius: 6px;
  padding: 2px 6px;
}

.mgc-ellipsis,
.mgc-name {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

.mgc-num { text-align: center; font-variant-numeric: tabular-nums; }
.mgc-actions { white-space: nowrap; }
.mgc-muted { color: #98a2b3; }

.mgc-btn-version {
  background: #7c3aed !important;
  color: #fff !important;
  border: none;
}

.mgc-empty {
  text-align: center;
  padding: 28px 16px;
  color: #667085;
}
.mgc-empty strong {
  display: block;
  color: #344054;
  font-size: 14px;
  margin-bottom: 6px;
}
.mgc-empty p {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
}

body[data-admin-theme="dark"] .mgc-table-wrap {
  background: var(--admin-surface);
  border-color: var(--admin-border);
}
body[data-admin-theme="dark"] .mgc-meta-pill {
  background: rgba(70, 95, 255, 0.16);
  color: var(--admin-text);
}
body[data-admin-theme="dark"] .mgc-id,
body[data-admin-theme="dark"] .mgc-gps {
  background: rgba(255,255,255,0.04);
  border-color: var(--admin-border);
  color: var(--admin-muted);
}