/* livv design tokens.
 *
 * Brand color is expressed as RGB-triplet CSS variables so (a) Tailwind can
 * apply opacity via `rgb(var(--brand-600) / <alpha-value>)` and (b) a clinic
 * can override its accent by setting these vars on a wrapper element without a
 * rebuild. Default scale = deep indigo/violet.
 */
:root {
  --brand-50: 238 242 255;
  --brand-100: 224 231 255;
  --brand-200: 199 210 254;
  --brand-300: 165 180 252;
  --brand-400: 129 140 248;
  --brand-500: 99 102 241;
  --brand-600: 79 70 229;   /* primary */
  --brand-700: 67 56 202;   /* primary hover */
  --brand-800: 55 48 163;
  --brand-900: 49 46 129;

  --brand-fg: 255 255 255;  /* text on brand surfaces */
}

/* Premium-modern base: crisp, higher-contrast, humanist type. */
html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body {
  background-color: #f8fafc;   /* slate-50 */
  color: #0f172a;              /* slate-900 */
}

/* Hide Alpine-cloaked elements until Alpine initializes. */
[x-cloak] { display: none !important; }
