/* Neural Sentinel API Reference: the frame shared by the two views (the
   Swagger view at the root address and the Redoc view).

   Palette and type come from the Gravity Digital Solutions site (the green
   brand on footage dark, the system font stack). The header bar is brand
   dark; the page itself is light, because Swagger UI and Redoc render light. */

:root {
  color-scheme: light;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono: "SF Mono", ui-monospace, Menlo, Consolas, "Liberation Mono", monospace;

  /* Brand. */
  --brand: #7AC943;
  --brand-ink: #071008;
  --teal: #3ADBB4;
  --bar-bg: #07090C;
  --bar-text: #EFEFF1;
  --bar-text-2: #ADADB8;
  --bar-line: rgba(255, 255, 255, 0.08);
  --code-bg: #0D1014;
  --code-text: #E6E8EB;
  --code-line: rgba(255, 255, 255, 0.08);

  /* HTTP methods: one colour per verb, white text at 5:1 or better. */
  --m-get: #0E7C66;
  --m-post: #3B7D14;
  --m-put: #A35C00;
  --m-patch: #0B6F94;
  --m-delete: #C22F2F;
  --m-other: #5B6470;

  /* Page. */
  --bg: #F7F8FA;
  --surface: #FFFFFF;
  --surface-2: #F1F4F6;
  --text: #0E1216;
  --text-2: #4B5561;
  --muted: #626B77;
  --line: #E2E6EA;
  --accent: #34700F;
  --accent-soft: rgba(122, 201, 67, 0.14);
  --radius: 12px;
}

html { box-sizing: border-box; -webkit-text-size-adjust: 100%; overflow-y: scroll; }
*, *::before, *::after { box-sizing: inherit; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.6 var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img, svg { max-width: 100%; }
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }

.gds-skip {
  position: absolute; left: 16px; top: -48px; z-index: 10;
  padding: 8px 12px; border-radius: 8px;
  background: var(--brand); color: var(--brand-ink); font-weight: 600; text-decoration: none;
}
.gds-skip:focus { top: 12px; }

/* ---------- Header bar ---------- */
.gds-bar {
  position: relative;
  background: var(--bar-bg);
  color: var(--bar-text);
  border-bottom: 1px solid var(--bar-line);
}
.gds-bar::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, rgba(122, 201, 67, 0), rgba(122, 201, 67, 0.6) 30%, rgba(58, 219, 180, 0.5) 70%, rgba(58, 219, 180, 0));
}
.gds-bar__in {
  max-width: 1180px; margin: 0 auto; padding: 12px 20px;
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px 24px; flex-wrap: wrap;
}
.gds-brand {
  display: flex; align-items: center; gap: 12px; min-width: 0;
  color: inherit; text-decoration: none;
}
.gds-brand img { width: 32px; height: 34px; flex: none; }
.gds-brand__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.gds-brand__org {
  font-size: 11px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--bar-text-2);
}
.gds-brand__product { font-size: 16px; font-weight: 700; letter-spacing: -0.01em; color: var(--bar-text); }
.gds-nav { display: flex; flex-wrap: wrap; gap: 4px; }
.gds-nav a {
  padding: 6px 12px; border-radius: 999px;
  color: var(--bar-text-2); font-size: 14px; font-weight: 500; text-decoration: none;
  transition: background-color 0.15s ease, color 0.15s ease;
}
.gds-nav a:hover { color: #FFFFFF; background: rgba(255, 255, 255, 0.07); }
.gds-nav a[aria-current="page"] { background: var(--brand); color: var(--brand-ink); font-weight: 600; }

/* ---------- Footer ---------- */
.gds-foot {
  border-top: 1px solid var(--line);
  background: var(--surface);
  color: var(--text-2);
  font-size: 14px;
}
.gds-foot__in {
  max-width: 1180px; margin: 0 auto; padding: 20px;
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px;
}
.gds-foot__in img { width: 17px; height: 18px; flex: none; }
.gds-foot strong { color: var(--text); font-weight: 600; }
.gds-foot a { color: var(--accent); overflow-wrap: anywhere; }

/* ---------- While a view loads ---------- */
.gds-loading { max-width: 1180px; margin: 0 auto; padding: 48px 20px; color: var(--text-2); }

@media (max-width: 640px) {
  .gds-bar__in { padding: 10px 16px; }
  .gds-nav { width: 100%; }
  .gds-nav a { padding: 6px 10px; }
  .gds-foot__in { padding: 16px; }
  .gds-loading { padding: 32px 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; }
}
