/* ============================================================
   Inner Expert — House of Experts brand skin for Chainlit 1.3.2
   Palette: navy #0B2545 · gold #C9A24D · cloud #F7F5F0 · ink #1B1B1B
   Body: Inter · Headers: Playfair Display (fallbacks to system fonts)
   Cosmetic only — never blocks app startup.
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@600;700&display=swap');

:root {
  --hoe-navy:  #0B2545;
  --hoe-navy-2:#081B33;
  --hoe-gold:  #C9A24D;
  --hoe-gold-2:#A9863A;
  --hoe-cloud: #F7F5F0;
  --hoe-ink:   #1B1B1B;
  --hoe-radius: 12px;
}

/* ---- Typography ---- */
html, body, .MuiTypography-root, input, textarea, button {
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}
h1, h2, h3, h4,
.MuiTypography-h1, .MuiTypography-h2, .MuiTypography-h3, .MuiTypography-h4 {
  font-family: 'Playfair Display', Georgia, 'Times New Roman', serif !important;
  letter-spacing: 0.2px;
}

/* ---- Rounded 12px corners on cards / message bubbles / inputs ---- */
.MuiPaper-root,
[class*="message"] .MuiBox-root,
.MuiCard-root,
.MuiOutlinedInput-root,
[class*="step"] {
  border-radius: var(--hoe-radius) !important;
}

/* ---- Subtle gold accent on primary CTAs ---- */
.MuiButton-containedPrimary,
button[type="submit"] {
  background-image: linear-gradient(180deg, var(--hoe-navy) 0%, var(--hoe-navy-2) 100%);
  border: 1px solid var(--hoe-gold);
  border-radius: var(--hoe-radius) !important;
  box-shadow: 0 1px 0 rgba(201,162,77,0.35);
  transition: box-shadow .15s ease, transform .05s ease;
}
.MuiButton-containedPrimary:hover,
button[type="submit"]:hover {
  box-shadow: 0 0 0 2px rgba(201,162,77,0.55);
}

/* Send button / accent icons pick up gold */
[class*="send"] svg,
.MuiIconButton-colorPrimary svg { color: var(--hoe-gold) !important; }

/* Links use navy in light mode */
a { color: var(--hoe-navy); text-decoration-color: rgba(201,162,77,0.6); }

/* Header wordmark spacing so the logo breathes */
header img { max-height: 34px; }

/* Thin gold rule under the top bar */
header, .MuiAppBar-root {
  border-bottom: 2px solid var(--hoe-gold) !important;
}

/* ---- Dark mode: keep Chainlit's dark behaviour, our palette ---- */
@media (prefers-color-scheme: dark) {
  a { color: var(--hoe-gold); }
}
[data-theme="dark"] a,
.dark a { color: var(--hoe-gold); }
[data-theme="dark"] .MuiButton-containedPrimary,
.dark .MuiButton-containedPrimary {
  background-image: linear-gradient(180deg, var(--hoe-gold) 0%, var(--hoe-gold-2) 100%);
  color: var(--hoe-navy);
  border-color: var(--hoe-navy);
}