/*
 * YourLabs palette (from yourlabs.org wordmark):
 *   navy #22598b  magenta #ff4ec2  cyan #53daff  periwinkle #91acff  deep #183858
 * Overrides Bulma 1.0 CSS variables so djcrud's default Bulma theme follows brand.
 *
 * This file is app static (tracked). Do not put it in staticfiles/ or in
 * static/natnux_agent/ (Vite dump). See docs/design/frontend.rst.
 */

:root {
  --natnux-navy: #22598b;
  --natnux-navy-deep: #183858;
  --natnux-magenta: #ff4ec2;
  --natnux-cyan: #53daff;
  --natnux-periwinkle: #91acff;

  --bulma-scheme-h: 209;
  --bulma-scheme-s: 28%;

  --bulma-primary-h: 321deg;
  --bulma-primary-s: 100%;
  --bulma-primary-l: 45%;
  --bulma-primary-rgb: 230, 0, 150;

  --bulma-link-h: 209deg;
  --bulma-link-s: 61%;
  --bulma-link-l: 34%;
  --bulma-link-rgb: 34, 89, 139;

  --bulma-info-h: 193deg;
  --bulma-info-s: 100%;
  --bulma-info-l: 66%;
  --bulma-info-rgb: 83, 218, 255;

  --bulma-focus-h: 193deg;
  --bulma-focus-s: 100%;
}

[data-theme="light"] {
  --bulma-scheme-h: 209;
  --bulma-scheme-s: 28%;
  --bulma-primary-h: 321deg;
  --bulma-primary-s: 100%;
  --bulma-primary-l: 45%;
  --bulma-link-h: 209deg;
  --bulma-link-s: 61%;
  --bulma-link-l: 34%;
  --bulma-info-h: 193deg;
  --bulma-info-s: 100%;
  --bulma-info-l: 66%;
}

[data-theme="dark"] {
  --bulma-scheme-h: 209;
  --bulma-scheme-s: 42%;
  --bulma-primary-l: 62%;
  --bulma-primary-rgb: 255, 61, 188;
  --bulma-link-l: 70%;
  --bulma-link-rgb: 132, 180, 225;
  --bulma-info-l: 70%;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bulma-scheme-h: 209;
    --bulma-scheme-s: 42%;
    --bulma-primary-l: 62%;
    --bulma-primary-rgb: 255, 61, 188;
    --bulma-link-l: 70%;
    --bulma-link-rgb: 132, 180, 225;
    --bulma-info-l: 70%;
  }
}

.natnux-brand {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  color: inherit;
  text-decoration: none;
}

.natnux-brand img,
.natnux-brand-mark {
  display: block;
  width: 1.75rem;
  height: 1.75rem;
  flex-shrink: 0;
}

svg.natnux-brand-mark {
  overflow: visible;
}

.natnux-home-mark {
  width: 4.5rem;
  height: 4.5rem;
}

body.natnux-home main.djcrud-main,
body.natnux-legal main.djcrud-main {
  max-width: 38rem;
}

.natnux-home-hero {
  gap: 0.85rem;
}

.natnux-home-points {
  padding-left: 1.2rem;
  line-height: 1.6;
}

.natnux-home-points li + li {
  margin-top: 0.35rem;
}

@media (prefers-color-scheme: dark) {
  html,
  body {
    background-color: var(--bulma-scheme-main);
    color: var(--bulma-text);
  }

  .navbar {
    background-color: var(--bulma-scheme-main-bis);
    border-bottom-color: var(--bulma-border);
  }

  .navbar-item,
  .navbar-link {
    color: var(--bulma-text);
  }

  .navbar-item:hover,
  .navbar-link:hover {
    background-color: var(--bulma-scheme-main-ter);
    color: var(--bulma-text-strong);
  }

  .djcrud-sidebar {
    background-color: var(--bulma-scheme-main-bis);
    border-right-color: var(--bulma-border);
  }

  .menu-label {
    color: var(--bulma-text-weak);
  }

  .menu-list a {
    color: var(--bulma-text);
  }

  .menu-list a:hover {
    background-color: var(--bulma-scheme-main-ter);
    color: var(--bulma-text-strong);
  }

  .menu-list a.is-active {
    background-color: var(--bulma-primary);
    color: var(--bulma-primary-invert);
  }
}

.menu-list a.is-active {
  background-color: var(--bulma-primary);
  color: var(--bulma-primary-invert);
}