/* assets/layout.css */
:root {
  --topbar-h: 0;  /* no topbar anymore */
  --sidebar-w: 260px;
}

/* fixed sidebar that starts from the top */
.sidebar-fixed {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  width: var(--sidebar-w);
  overflow-y: auto;
  background: var(--mantine-color-body);
  border-right: 1px solid var(--mantine-color-gray-3);
}

/* main page content area */
.main-content {
  margin-left: var(--sidebar-w);
  padding: 1rem;
  background-color: var(--mantine-color-body);
  color: var(--mantine-color-text);
  min-height: 100vh;
  transition: background-color 0.2s ease, color 0.2s ease;
}

/* Dark mode specific overrides */
[data-mantine-color-scheme="dark"] body {
  background-color: var(--mantine-color-dark-7);
  color: var(--mantine-color-dark-0);
}

[data-mantine-color-scheme="light"] body {
  background-color: var(--mantine-color-gray-0);
  color: var(--mantine-color-black);
}

/* Card adjustments for better dark mode contrast if needed */
[data-mantine-color-scheme="dark"] .card {
    background-color: var(--mantine-color-dark-6);
    border-color: var(--mantine-color-dark-4);
    color: var(--mantine-color-dark-0);
}

[data-mantine-color-scheme="dark"] .card-header,
[data-mantine-color-scheme="dark"] .card-footer {
    background-color: var(--mantine-color-dark-5);
    border-color: var(--mantine-color-dark-4);
}