/* FULLSCREEN_PORTAL_AND_DARKMODE */
body.portal-authenticated {
  background: var(--portal-bg);
}

body.portal-authenticated .container {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.portal-authenticated .loginHeader {
  display: none;
}

body.portal-authenticated .portalShell {
  min-height: 100vh;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body.portal-authenticated .portalSidebar {
  top: 0;
  height: 100vh;
  min-height: 100vh;
}

body.portal-authenticated .portalMain {
  padding: 26px 30px 48px;
}

.themeToggle {
  min-width: 104px;
}

/* Darkmode */
html[data-theme="dark"] {
  --portal-bg: #08111f;
  --portal-surface: #111c2d;
  --portal-surface-muted: #162235;
  --portal-border: #29384f;
  --portal-text: #e5edf8;
  --portal-muted: #9aabc1;
  --portal-primary: #60a5fa;
  --portal-primary-hover: #93c5fd;
}

html[data-theme="dark"] body {
  background: #08111f;
  color: var(--portal-text);
}

html[data-theme="dark"] .portalMain,
html[data-theme="dark"] .topBar {
  background: var(--portal-bg);
}

html[data-theme="dark"] .card,
html[data-theme="dark"] .dashboardCard,
html[data-theme="dark"] .databaseItem,
html[data-theme="dark"] .userItem,
html[data-theme="dark"] .tenantItem,
html[data-theme="dark"] .detailsBox,
html[data-theme="dark"] .backupItem,
html[data-theme="dark"] .statusItem,
html[data-theme="dark"] .engineCard {
  color: var(--portal-text);
  background: var(--portal-surface);
  border-color: var(--portal-border);
  box-shadow: none;
}

html[data-theme="dark"] .card h2,
html[data-theme="dark"] .card h3,
html[data-theme="dark"] .dashboardCard strong,
html[data-theme="dark"] .engineName,
html[data-theme="dark"] .databaseItem strong {
  color: var(--portal-text);
}

html[data-theme="dark"] .hint,
html[data-theme="dark"] .muted,
html[data-theme="dark"] .userInfo,
html[data-theme="dark"] .engineDescription,
html[data-theme="dark"] .dashboardMeta {
  color: var(--portal-muted);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  color: var(--portal-text);
  background: #0b1627;
  border-color: var(--portal-border);
}

html[data-theme="dark"] button.secondary {
  color: var(--portal-text);
  background: var(--portal-surface);
  border-color: var(--portal-border);
}

html[data-theme="dark"] button.secondary:hover {
  background: var(--portal-surface-muted);
}

html[data-theme="dark"] .engineCard:hover,
html[data-theme="dark"] .engineCard.selected {
  background: #172b46;
  border-color: #3b82f6;
}

html[data-theme="dark"] .auditTable th {
  color: var(--portal-muted);
  background: var(--portal-surface-muted);
}

html[data-theme="dark"] .auditTable td,
html[data-theme="dark"] .auditTable th {
  border-color: var(--portal-border);
}

@media (min-width: 1180px) {
  body.portal-authenticated .portalLayout {
    grid-template-columns: minmax(290px, 350px) minmax(0, 1fr);
  }
}