/* ===========================================================================
   UNaIVERSE — Material for MkDocs
   Direction: minimal / clean tech (Vercel · Linear · Stripe docs vibe)
   - white-first, one accent used sparingly
   - no gradients, no glow, flat surfaces, hairline borders
   - generous whitespace, strong typography
   =========================================================================== */

:root {
  /* Single accent — everything else is ink / grey / hairline */
  --una-accent:        #1a5cff;
  --una-accent-strong: #0e44d6;
  --una-accent-soft:   rgba(26, 92, 255, 0.08);
}

/* ---- Light scheme --------------------------------------------------------- */
[data-md-color-scheme="default"] {
  --md-default-bg-color:          #ffffff;
  --md-default-fg-color:          #1a1d23;
  --md-default-fg-color--light:   #5b6573;
  --md-default-fg-color--lighter: #8b94a3;
  --md-default-fg-color--lightest: #e7e9ee;   /* hairline */

  --md-primary-fg-color:          #ffffff;
  --md-primary-bg-color:          #1a1d23;

  --md-accent-fg-color:           var(--una-accent);
  --md-accent-fg-color--transparent: var(--una-accent-soft);

  --md-typeset-a-color:           var(--una-accent);

  --md-code-bg-color:             #f6f7f9;
  --md-code-fg-color:             #2b303a;

  --una-hairline:                 #e7e9ee;
  --una-surface:                  #fafbfc;
}

/* ---- Dark scheme — near-black, NOT navy ----------------------------------- */
[data-md-color-scheme="slate"] {
  --md-hue: 222;
  --md-default-bg-color:          #0c0d10;
  --md-default-fg-color:          #e7e9ee;
  --md-default-fg-color--light:   #9aa3b2;
  --md-default-fg-color--lighter: #6b7280;
  --md-default-fg-color--lightest: #23262d;   /* hairline */

  --md-primary-fg-color:          #0c0d10;
  --md-primary-bg-color:          #e7e9ee;

  --md-accent-fg-color:           #5b8bff;
  --md-accent-fg-color--transparent: rgba(91, 139, 255, 0.12);
  --md-typeset-a-color:           #6b9bff;

  --md-code-bg-color:             #16181d;
  --md-code-fg-color:             #d6dae2;

  --una-hairline:                 #23262d;
  --una-surface:                  #141619;
}

/* ===========================================================================
   Header — white, flat, hairline underline (no gradient)
   =========================================================================== */
.md-header {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color);
  border-bottom: 1px solid var(--una-hairline);
  box-shadow: none !important;
}
.md-header__title { font-weight: 650; letter-spacing: -0.01em; }
.md-header .md-icon,
.md-header__button { color: var(--md-default-fg-color); }

/* Search — quiet grey field instead of translucent-on-color */
.md-search__form {
  background: var(--una-surface);
  border: 1px solid var(--una-hairline);
  border-radius: 8px;
  box-shadow: none;
}
.md-search__form:hover { background: var(--una-surface); }
.md-search__input { color: var(--md-default-fg-color); }
.md-search__input::placeholder { color: var(--md-default-fg-color--lighter); }
.md-search__icon { color: var(--md-default-fg-color--light); }

/* Tabs — flat, muted, accent underline on the active tab */
.md-tabs {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color--light);
  border-bottom: 1px solid var(--una-hairline);
}
.md-tabs__link {
  opacity: 1;
  color: var(--md-default-fg-color--light);
  font-weight: 500;
  transition: color 120ms ease;
}
.md-tabs__link:hover,
.md-tabs__link--active {
  color: var(--md-default-fg-color);
}
.md-tabs__item {
  position: relative;
}
.md-tabs__link--active::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 2px;
  background: var(--una-accent);
  border-radius: 2px 2px 0 0;
}

/* ===========================================================================
   Typography & reading column
   =========================================================================== */
.md-grid { max-width: 72rem; }

.md-typeset {
  font-size: 0.82rem;
  line-height: 1.72;
}
.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-weight: 700;
  letter-spacing: -0.018em;
  color: var(--md-default-fg-color);
}
.md-typeset h1 { font-size: 2rem; line-height: 1.15; }
.md-typeset h2 {
  font-size: 1.4rem;
  margin-top: 2.4em;
  padding-bottom: 0.3em;
  border-bottom: 1px solid var(--una-hairline);
}
.md-typeset h3 { font-size: 1.1rem; margin-top: 1.8em; }

/* Sidebar nav — quieter, accent only on the active item */
.md-nav { font-size: 0.72rem; }
.md-nav__link--active,
.md-nav__link--active:focus,
.md-nav__link--active:hover {
  color: var(--una-accent);
  font-weight: 600;
}
.md-nav__item .md-nav__link:hover { color: var(--md-default-fg-color); }

/* ===========================================================================
   Links
   =========================================================================== */
.md-typeset a {
  text-decoration: none;
  transition: color 100ms ease;
}
.md-typeset a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
}

/* ===========================================================================
   Buttons — flat, no shadow, no lift
   =========================================================================== */
.md-typeset .md-button {
  border-radius: 8px;
  font-weight: 600;
  padding: 0.5em 1.1em;
  border: 1px solid var(--una-hairline);
  color: var(--md-default-fg-color);
  background: transparent;
  box-shadow: none;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}
.md-typeset .md-button:hover {
  background: var(--una-surface);
  border-color: var(--md-default-fg-color--lighter);
  color: var(--md-default-fg-color);
  transform: none;
  box-shadow: none;
}
.md-typeset .md-button--primary {
  background: var(--una-accent);
  border-color: var(--una-accent);
  color: #fff;
}
.md-typeset .md-button--primary:hover {
  background: var(--una-accent-strong);
  border-color: var(--una-accent-strong);
  color: #fff;
}

/* ===========================================================================
   Grid cards — hairline, flat, subtle hover (no lift / no shadow)
   =========================================================================== */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card {
  border-radius: 10px;
  border: 1px solid var(--una-hairline);
  background: var(--md-default-bg-color);
  padding: 1.1rem 1.2rem;
  box-shadow: none;
  transition: border-color 130ms ease, background-color 130ms ease;
}
.md-typeset .grid.cards > ul > li:hover,
.md-typeset .grid > .card:hover {
  border-color: var(--una-accent);
  background: var(--una-surface);
  transform: none;
  box-shadow: none;
}
.md-typeset .grid.cards > ul > li > hr {
  margin: 0.6em 0;
  border-color: var(--una-hairline);
}
/* Card icons in accent, but small and quiet */
.md-typeset .grid.cards .lg.middle svg,
.md-typeset .grid.cards .twemoji.lg svg { fill: var(--una-accent); }

/* ===========================================================================
   Admonitions — flat, thin left rule, small radius
   =========================================================================== */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 8px;
  border: 1px solid var(--una-hairline);
  border-left-width: 3px;
  box-shadow: none;
  font-size: 0.78rem;
}

/* ===========================================================================
   Tables — flat, hairline, quiet header
   =========================================================================== */
.md-typeset table:not([class]) {
  border-radius: 8px;
  border: 1px solid var(--una-hairline);
  box-shadow: none;
  overflow: hidden;
}
.md-typeset table:not([class]) th {
  background: var(--una-surface);
  font-weight: 600;
  border-bottom: 1px solid var(--una-hairline);
}
.md-typeset table:not([class]) td { border-top: 1px solid var(--una-hairline); }

/* ===========================================================================
   Code
   =========================================================================== */
.md-typeset code { border-radius: 5px; }
.md-typeset pre > code { border-radius: 8px; }
.md-typeset .highlight { border-radius: 8px; }

/* ===========================================================================
   API reference (mkdocstrings) polish
   =========================================================================== */
.md-typeset .doc-heading code { background: var(--md-accent-fg-color--transparent); }
.doc-symbol-heading { font-weight: 600; }
.doc-symbol[data-doc-symbol-type] { border-radius: 4px; }

/* ===========================================================================
   Footer — light, hairline top (no navy block)
   =========================================================================== */
.md-footer {
  background: var(--md-default-bg-color);
  color: var(--md-default-fg-color--light);
  border-top: 1px solid var(--una-hairline);
}
.md-footer-meta {
  background: transparent;
  color: var(--md-default-fg-color--light);
}
.md-footer__link { opacity: 1; }
.md-footer__title { color: var(--md-default-fg-color); }
.md-copyright { color: var(--md-default-fg-color--lighter); }

/* ===========================================================================
   Hero (index.md) — solid bold headline, no gradient text
   =========================================================================== */
.una-hero {
  text-align: center;
  padding: 3.5rem 0 1.5rem;
}
.una-hero h1 {
  font-size: 3rem;
  line-height: 1.08;
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--md-default-fg-color);
  margin-bottom: 0.6rem;
  /* clear any inherited gradient-text treatment */
  background: none;
  -webkit-text-fill-color: currentColor;
}
.una-hero .una-tagline {
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--md-default-fg-color--light);
  max-width: 40rem;
  margin: 0 auto 1.8rem;
}
.una-hero .md-button { margin: 0.3rem; }