/* =============================================================================
   SS&C Design System Theme
   Fonts and colors derived from exported Figma design tokens.
   ============================================================================= */

/* ── Barlow (primary brand typeface) ──────────────────────────────────────── */
@import url("https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500&display=swap");

/* ── Brand colour tokens ──────────────────────────────────────────────────── */
:root {
  --ssc-blue:       #0077c8;
  --ssc-cobalt:     #0b4d99;
  --ssc-navy:       #131e58;
  --ssc-teal:       #1099ac;
  --ssc-yellow:     #f5ab0a;
  --ssc-blue-light: #e5f1f9;
  --ssc-blue-soft:  #cce4f4;
  --ssc-text-hard:  #0d1116;
  --ssc-text-base:  #1b212d;
  --ssc-text-muted: #5d6779;
  --ssc-gray-200:   #e7e8ec;
  --ssc-gray-100:   #f3f4f5;
}

/* ── App-wide font ────────────────────────────────────────────────────────── */
body {
  font-family: 'Barlow', sans-serif;
  color: var(--ssc-text-base);
}

/* ── Heading sizes & weights (from typography tokens) ─────────────────────── */

/* ── Handoff app chrome — accent / highlight colour ───────────────────────── */

/* Primary accent used across the app UI (replaces Tailwind sky-600) */
.text-sky-600 {
  color: var(--ssc-blue) !important;
}

/* Active sidebar nav item */
div > ul > li > a.group[data-active] {
  background-color: var(--ssc-blue);
  color: #fff;
}

/* Active sidebar item (data attribute variant) */
.data-\[active\=true\]\:text-sidebar-accent-foreground[data-active="true"] {
  color: var(--ssc-cobalt);
  background-color: var(--ssc-blue-light);
}

/* Copy / action button */
div.grid > div.flex > button.bg-gray-800 {
  background-color: var(--ssc-navy);
}

/* ── App top navigation bar ───────────────────────────────────────────────── */
body > div > div > div.sticky.z-50 {
  background-color: #fff;
  box-shadow: none;
  border-bottom: 1px solid var(--ssc-gray-200);
}

/* ── Hide decorative background gradient shown on the Handoff default theme ─ */
body > div > div > div.absolute {
  display: none;
}

/* ── Page title area ──────────────────────────────────────────────────────── */
div.flex h1 + p.text-lg {
  font-weight: 300;
  max-width: 780px;
  margin-top: 10px;
  margin-bottom: 40px;
  color: var(--ssc-text-muted);
}

h1 + div.mt-3 > button { display: none; }
h1 + div.mt-3 > p {
  max-width: 600px;
  font-weight: 300;
  color: var(--ssc-text-muted);
}

/* ── Hide the prose / markdown description block on component pages ───────── */
main.pl-8 > div > div.prose {
  display: none;
}


/* Handoff Appearance Override — generated by /account/appearance */
:root {
  --accent: 204 62% 94%;
  --primary: 41 92% 50%;
  --sidebar-primary: 214 41% 93%;
  --primary-foreground: 220 25% 14%;
  --font-sans: 'Barlow', sans-serif;
  --font-mono: 'Barlow', monospace;
}