/**
 * Sidebar Theme: sidebar gradient, section headers and the tinted page
 * background shared by every environment. Defaults are the purple palette (local/staging);
 * production-theme.css overrides the variables with the blue palette.
 */

:root {
  --trail-sidebar-top: #1a1736;
  --trail-sidebar-mid: #463a8a;
  --trail-sidebar-bottom: #5c4fa9;
  --trail-sidebar-brand: #13112a;
  --trail-sidebar-title: #b9aef2;
  --trail-page-bg: #f7f6fc;
}

#sidebar.bg-dark-gradient {
  background: var(--trail-sidebar-mid);
  background: linear-gradient(
    180deg,
    var(--trail-sidebar-top) 0%,
    var(--trail-sidebar-mid) 55%,
    var(--trail-sidebar-bottom) 100%
  );
}

.sidebar .sidebar-brand {
  background: var(--trail-sidebar-brand);
}

/* Tabler outline icons render slightly smaller than Line Awesome at the same size */
.sidebar-nav .nav-icon.ti {
  font-size: 1.25rem;
  line-height: 1;
}

/* Section header: "CATALOG ────" */
.sidebar-nav .nav-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.75rem;
  padding: 0.75rem 1rem 0.375rem;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--trail-sidebar-title);
}

.sidebar-nav .nav-title::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(255, 255, 255, 0.12);
}

/* Long labels end in an ellipsis instead of being clipped by the sidebar edge */
.sidebar-nav .nav-link span {
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Items inside an open group: smaller type and icon, shorter rows and a subtle
   indent past the parent (top level keeps CoreUI's 4rem column untouched) */
.sidebar-nav .nav-group-items {
  --cui-sidebar-nav-icon-width: 2rem;
  --cui-sidebar-nav-icon-font-size: 1.1rem;
  padding: 0.375rem 0;
}

/* Open group: the children block gets the same faint edge above and below */
.sidebar-nav .nav-group.show .nav-group-items {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.sidebar-nav .nav-group-items .nav-link {
  padding: 0.65rem 1rem 0.65rem 4.25rem;
}

/* Sub-header inside an open group: no rule line, aligned with the child icons */
.sidebar-nav .nav-group-items .nav-title {
  padding: 0.625rem 1rem 0.25rem 2.25rem;
  font-size: 0.6rem;
}

.sidebar-nav .nav-group-items .nav-title::after {
  display: none;
}

/* Page background: solid light tint of the environment color */
.wrapper.bg-light {
  background-color: var(--trail-page-bg) !important;
}

/* Top bar: plain white with a hairline so it separates from the tinted page */
.header.bg-light {
  background-color: #fff !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

/* Space between the top bar and every page's content (the layout only pads the sides) */
.wrapper > .app-body {
  padding-top: 1.25rem;
}

/* Sidebar width: slightly wider than CoreUI's 16rem; the content offset follows it */
.sidebar {
  --cui-sidebar-width: 16.5rem;
}

.sidebar:not(.sidebar-end) ~ * {
  --cui-sidebar-occupy-start: 16.5rem;
}
