/* Auto-generated by scripts/generate-theme.py — do not edit manually */
/* Navbar color overrides — consumed by shared/navbar.css.
   Scoped to .gs-navbar so project vars beat navbar.css's :root fallback. */
.gs-navbar, .gs-navbar * {
  --nav-bg: #2e2934;
  --nav-bg-scroll: #1a1620;
  --nav-dropdown-border: #1a1620;
  --nav-border: rgba(255, 255, 255, 0.12);
  --nav-text: #e2e8f0;
  --nav-text-dark: #ffffff;
  --nav-text-muted: #94a3b8;
  --nav-accent: #caadf4;
  --nav-accent-hover: #9b89c9;
  --nav-accent-bg: rgba(202, 173, 244, 0.15);
  --nav-accent-shadow: rgba(202,173,244,0.25);
  --nav-hover-bg: rgba(255, 255, 255, 0.06);
  --nav-active-bg: rgba(202, 173, 244, 0.18);
  --nav-avatar-bg: linear-gradient(135deg, #caadf4 0%, #9b89c9 100%);
  --nav-avatar-color: #ffffff;
  --nav-danger: #ef4444;
  --nav-danger-bg: rgba(239, 68, 68, 0.12);
}

/* === Project navbar extras (navbar-extras.css) === */
/* NEXMO navbar overrides — match nexmo-datahub.eu aesthetic
   (dark bar, lavender uppercase menu, Silkscreen font). */

@import url('https://fonts.googleapis.com/css2?family=Silkscreen&display=swap');

.gs-navbar, .gs-navbar * {
  /* Slightly taller bar to breathe at full uppercase */
  --nav-height: 72px;
  /* Force lavender on labels & accents — overrides the auto-generated
     dark-mode greys so menu items match the live nexmo-datahub aesthetic. */
  --nav-text: #caadf4;
  --nav-text-dark: #ffffff;
  --nav-text-muted: rgba(202, 173, 244, 0.65);
  --nav-border: rgba(202, 173, 244, 0.12);
  --nav-accent: #caadf4;
  --nav-hover-bg: transparent;
  --nav-active-bg: transparent;
}

.gs-navbar { border-bottom: none; }

/* The NEXMO PNG logo already contains the wordmark + "movement_data_hub"
   tagline, so hide the textual title/subtitle that navbar.js injects
   from navbar-config.json — otherwise both render side by side and look
   doubled. */
.gs-navbar .gs-navbar-brand-text { display: none; }

/* NEXMO does not surface the DOME marketplace as a separate top-level
   destination (catalogue already covers it). Hide the link instead of
   forking navbar.html. */
.gs-navbar .gs-navbar-links a[data-page="dome-catalog"] { display: none; }

/* ─── DSR CONTENT CENTERING ─── */

/* Force containers to full width */
.inner-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.main-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.page-container {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.main-content,
[class*="mainContent"],
.MuiContainer-root,
#main-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 24px !important;
  box-sizing: border-box !important;
}

/* Main nav links — uppercase, spaced, lavender on dark */
.gs-navbar .gs-navbar-links a {
  font-family: 'Silkscreen', Sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 400;
  font-size: 13px;
  padding: 10px 18px;
  border-radius: 4px;
}
.gs-navbar .gs-navbar-links a:hover,
.gs-navbar .gs-navbar-links a.active {
  color: var(--nav-accent);
  background: transparent;
}

/* Subtle underline grow on hover — closer to the live site's feel */
.gs-navbar .gs-navbar-links a {
  position: relative;
}
.gs-navbar .gs-navbar-links a::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 4px;
  height: 1.5px;
  background: var(--nav-accent);
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.2s ease;
}
.gs-navbar .gs-navbar-links a:hover::after,
.gs-navbar .gs-navbar-links a.active::after {
  transform: scaleX(1);
}

/* Bigger PNG logo so the wordmark reads cleanly on the dark bar */
.gs-navbar img.gs-navbar-logo {
  height: 36px;
  width: auto;
}

/* Auth area: language selector matches lavender tone */
.gs-navbar .gs-navbar-lang-btn {
  font-family: 'Silkscreen', Sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
  color: var(--nav-accent);
}

/* Login button — dark purple background with white uppercase text */
.gs-navbar .gs-navbar-login {
  font-family: 'Silkscreen', Sans-serif !important;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
  background: #5a4570 !important;
  color: #ffffff !important;
}


/* ─── DSR SUB-NAVBAR (horizontal menu, replaces vertical sidebar) ─── */

/* Adjust top position for NEXMO 72px navbar (vs platform 56px default) */
.gs-subnav {
  top: 72px !important;
  height: 52px !important;
  background: linear-gradient(90deg, #2e2934 0%, #3d3442 100%) !important;
  border-bottom: 1px solid rgba(202, 173, 244, 0.15) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.gs-subnav-inner {
  justify-content: center !important;
  gap: 8px !important;
}

.gs-subnav-link {
  color: #a484d0 !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  padding: 10px 18px !important;
  border-radius: 6px !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.gs-subnav-link:hover {
  color: #caadf4 !important;
  background: rgba(202, 173, 244, 0.12) !important;
}

.gs-subnav-link.active {
  color: #ffffff !important;
  background: rgba(202, 173, 244, 0.25) !important;
  border-bottom: 3px solid #caadf4 !important;
  font-weight: 600 !important;
  box-shadow: inset 0 -3px 0 0 #caadf4 !important;
}

/* DSR header styling — match Nexmo navbar dark aesthetic.
   Replace blue with dark purple (darker than navbar lila, lighter than navbar bg). */
header.header {
  background: #2d2541;
  border-bottom: 1px solid rgba(202, 173, 244, 0.15);
}

header.header .logo-section,
header.header .brand-text .brand-name {
  color: #ffffff;
}

header.header .nav-links a {
  color: #a484d0;
  text-decoration: none;
  transition: color 0.2s ease;
}

header.header .nav-links a:hover {
  color: #caadf4;
}

header.header .nav-links a.active,
header.header .nav-links a[aria-current="page"] {
  color: #caadf4;
  border-bottom: 2px solid #caadf4;
}

/* Page menu buttons — lila background when active/selected */
.page-menu .button-active {
  background-color: #caadf4 !important;
  color: #1e293b !important;
}

.page-menu .button-active .MuiSvgIcon-root {
  color: #1e293b !important;
}

/* Filter chips (primary filled) — lila claro background */
.MuiChip-filledPrimary {
  background-color: #caadf4 !important;
  color: #1e293b !important;
}

.MuiChip-filledPrimary .MuiSvgIcon-root {
  color: #1e293b !important;
}

/* Navbar dropdown — lila claro background, white text */
.gs-navbar-dropdown {
  background-color: #caadf4 !important;
  border: 1px solid #caadf4 !important;
  border-radius: 4px;
  color: #ffffff !important;
}

.gs-navbar-dropdown a {
  color: #ffffff !important;
}

.gs-navbar-dropdown-section {
  color: #ffffff !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
}

/* Separator lines between dropdown items */
.gs-navbar-dropdown a {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.gs-navbar-dropdown a:last-child {
  border-bottom: none !important;
}

.gs-navbar-dropdown-divider {
  display: none !important;
}

/* Material Icons in dropdown — white color */
.gs-navbar-dropdown-icon {
  color: #ffffff !important;
}

/* Success chip text — white */
.MuiChip-filledSuccess {
  color: #ffffff !important;
}

.MuiChip-filledSuccess .MuiChip-label {
  color: #ffffff !important;
}

.MuiChip-filledSuccess .MuiSvgIcon-root {
  color: #ffffff !important;
}

/* NOTE: do NOT add body { padding-top } here. On the static landing
   the navbar is position:sticky and lives in the document flow — any
   body padding becomes an empty white gap above the bar. On DSR pages
   dsr-shell.js sets its own padding-top after switching the container
   to position:fixed. */
