/*
 * Primary → Main brand color, primary buttons, main CTAs
 * Accent → Secondary highlights, badges, links, decorative elements, hover states
 * Muted → Subtle backgrounds, disabled states, secondary text
 */
:root {
  /* Core brand / actions */
  --color-primary: #3b5998;
  --color-primary-foreground: #ffffff;

  /* Accent / highlights (what you use on special elements) */
  --color-accent: #4a90e2;
  --color-accent-foreground: #ffffff;

  /* Neutral layers */
  --color-background: #ffffff;
  --color-surface: #f9fafb;
  --color-surface2: #f3f4f6;
  --color-surface3: #e5e7eb;

  --color-muted: #e5e7eb;
  --color-muted-foreground: #6b7280;

  --color-border: #d1d5db;
  --color-border2: #9ca3af;

  /* Text hierarchy */
  --color-foreground: #111827;
  --color-foreground-muted: #4b5563;
}
/* sitebot:defaults:nav-scoping */
/* Shared sticky nav — solid opaque bar by default; transparent overlay is page-local via transparentnav when requested */
.sb-nav {
  position: sticky;
  top: 0;
  z-index: 40;
  width: 100%;
  max-width: none;
  margin-inline: 0;
  padding-inline: 1.25rem;
  box-sizing: border-box;
  background-color: var(--color-surface, var(--color-background, #fff));
  color: var(--color-foreground, inherit);
}
@media (min-width: 1024px) {
  .sb-nav {
    padding-inline: 2rem;
  }
}
.sb-nav a:not(.sb-nav-cta):not([class^="bg-"]):not([class*=" bg-"]) {
  color: inherit;
}

/* Active nav link — accent/primary tokens; HTML uses data-sb-active only */
.sb-nav a[data-sb-active="true"] {
  color: var(--color-accent, var(--color-primary, inherit)) !important;
  font-weight: 600 !important;
}

/* sitebot:defaults:nav-cta */
.sb-nav a.sb-nav-cta,
.sb-nav a[class^="bg-"],
.sb-nav a[class*=" bg-"] {
  color: var(--color-primary-foreground, #fff) !important;
}
.sb-nav a.sb-nav-cta[data-sb-active="true"],
.sb-nav a[class^="bg-"][data-sb-active="true"],
.sb-nav a[class*=" bg-"][data-sb-active="true"] {
  color: var(--color-primary-foreground, #fff) !important;
  font-weight: inherit !important;
}

/* sitebot:defaults:nav-cta-v2 */
.sb-nav a[class^="bg-"],
.sb-nav a[class*=" bg-"] {
  color: var(--color-primary-foreground, #fff) !important;
}
.sb-nav a[class^="bg-"][data-sb-active="true"],
.sb-nav a[class*=" bg-"][data-sb-active="true"] {
  color: var(--color-primary-foreground, #fff) !important;
  font-weight: inherit !important;
}

/* sitebot:defaults:nav-cta-v3 */
/* Dropdown / hover:bg-* links keep theme foreground — not CTA white */
.sb-nav a[class*="hover:bg-"]:not(.sb-nav-cta):not([class^="bg-"]):not([class*=" bg-"]),
.sb-nav a[class*="focus:bg-"]:not(.sb-nav-cta):not([class^="bg-"]):not([class*=" bg-"]) {
  color: var(--color-foreground, inherit) !important;
}

/* sitebot:defaults:nav-fullwidth-v1 */
.sb-nav {
  width: 100% !important;
  max-width: none !important;
  margin-inline: 0 !important;
}

/* sitebot:defaults:nav-mobile-v1 */
.sb-nav .sb-nav-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.sb-nav .sb-nav-mobile[hidden],
.sb-nav .sb-nav-mobile.hidden {
  display: none !important;
}
@media (min-width: 768px) {
  .sb-nav .sb-nav-toggle,
  .sb-nav .sb-nav-mobile {
    display: none !important;
  }
}

/* sitebot:defaults:nav-mobile-v2 */
@media (max-width: 767.98px) {
  .sb-nav .sb-nav-mobile.sb-nav-open,
  .sb-nav .sb-nav-mobile.active,
  .sb-nav .sb-nav-menu.sb-nav-open,
  .sb-nav .sb-nav-menu.active {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    visibility: visible !important;
  }
}
