/*
 * TurkServis Chat — Usta Defteri (light, default theme)
 *
 * Canonical copy: turkservis/themes/usta-defteri.css
 * Served copy:    client/public/assets/themes/usta-defteri.css (keep in sync;
 *                 `npm run turkservis:sync-themes` copies canonical -> served)
 *
 * Warm, low-glare notebook surfaces; charcoal text; Iznik teal for focus,
 * selection, links, and verified state; brass for the single primary action.
 * `html:root` outranks upstream `:root` declarations regardless of load order.
 */

html:root {
  /* Warm paper base — replaces the neutral white/gray ramp */
  --white: #f7f2e7;
  --gray-20: #efe9dd;
  --gray-50: #f7f2e7;
  --gray-100: #efe8da;
  --gray-200: #e5dcc9;
  --gray-300: #cfc4ac;
  --gray-400: #9a9081;
  --gray-500: #5d564b;
  --gray-600: #443e35;
  --gray-700: #322c25;
  --gray-800: #2b2620;
  --gray-850: #1b1712;
  --gray-900: #120f0b;

  /* Iznik teal replaces the upstream green ramp (links, verified, selection) */
  --green-50: #eef7f7;
  --green-100: #d9eef0;
  --green-200: #a8dde1;
  --green-300: #6fc4cb;
  --green-400: #3aa6b0;
  --green-500: #17828d;
  --green-600: #0f5f68;
  --green-700: #0b4a52;
  --green-800: #07363d;
  --green-900: #032227;
  --green-950: #021a1e;

  /* No neon accent: retire the purple brand color in favor of teal */
  --brand-purple: #17828d;

  /* Brass: exactly one primary action per view */
  --surface-submit: #8a6a24;
  --surface-submit-hover: #74581e;

  /* Charcoal text and teal focus ring */
  --text-primary: #2b2620;
  --ring-primary: #0f5f68;

  /* Restrained radii */
  --radius: 0.375rem;
}

html:root body {
  background-color: var(--surface-primary);
  color: var(--text-primary);
  font-family: 'Inter', sans-serif;
}

/* JetBrains Mono for code surfaces */
html:root code,
html:root pre,
html:root kbd,
html:root samp,
html:root .font-mono {
  font-family: 'JetBrains Mono', 'Roboto Mono', Consolas, monospace;
}

/* Visible keyboard focus: Iznik teal, never removed */
html:root *:focus-visible {
  outline: 2px solid #0f5f68;
  outline-offset: 2px;
}

/* Teal text selection */
html:root ::selection {
  background-color: #a8dde1;
  color: #2b2620;
}

/* Respect reduced motion everywhere */
@media (prefers-reduced-motion: reduce) {
  html:root {
    --resize-dur: 0ms;
    --icon-swap-dur: 0ms;
    --avatar-dur: 0ms;
  }

  html:root *,
  html:root *::before,
  html:root *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}