html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

/* Global theme tokens */
:root {
  --color-bg-light:#ffffff;
  --color-surface-light:#f8fafc;
  --color-border-light:#e2e8f0;
  --color-text-light:#0f172a;
  --color-text-muted-light:#64748b;
  --color-bg-dark:#0f172a;
  --color-surface-dark:#111827;
  --color-border-dark:#1e293b;
  --color-text-dark:#f1f5f9;
  --color-text-muted-dark:#94a3b8;
}

body.dark {
  color:var(--color-text-dark);
}

.app-card { background:#fff; border:1px solid var(--color-border-light); border-radius:10px; padding:1.25rem; }
body.dark .app-card { background:rgba(30,41,59,0.75); border-color:#334155; }

.muted { color:var(--color-text-muted-light); }
body.dark .muted { color:var(--color-text-muted-dark); }

/* High-contrast body copy helper */
.copy { color:#0f172a; }
body.dark .copy { color:#e5e7eb; }

/* Form elements */
body.dark input, body.dark select, body.dark textarea { background:#1e293b; border-color:#334155; color:#f1f5f9; }
body.dark input:focus, body.dark select:focus, body.dark textarea:focus { outline:2px solid #6366f1; }

/* Tables */
table { width:100%; border-collapse:collapse; }
th, td { padding:.6rem .75rem; border-bottom:1px solid var(--color-border-light); }
body.dark th, body.dark td { border-color:#334155; }
th { text-align:left; font-weight:600; font-size:.70rem; text-transform:uppercase; letter-spacing:.08em; color:#475569; background:#f1f5f9; }
body.dark th { color:#cbd5e1; background:#1e293b; }
tbody tr:hover { background:rgba(0,0,0,0.02); }
body.dark tbody tr:hover { background:rgba(255,255,255,0.04); }

/* Utility spacing for app pages */
.page-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.5rem; }

/* Consistent content width across pages */
/*
   Many pages used varying Tailwind max-w utilities (3xl/4xl/6xl/7xl).
   Normalize the main content width so app pages align consistently.
*/
:root { --content-max-width: 80rem; }

/* Authenticated (with sidebar) pages */
.with-sidebar main > section,
.with-sidebar main > div.max-w-3xl,
.with-sidebar main > div.max-w-4xl,
.with-sidebar main > div.max-w-5xl,
.with-sidebar main > div.max-w-6xl,
.with-sidebar main > div.max-w-7xl,
.with-sidebar main > .page-container {
  max-width: var(--content-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.with-sidebar main > section {
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Unauthenticated/marketing pages: normalize <main> direct <section> as well */
main > section {
  max-width: var(--content-max-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}