/* Hamsokhan design tokens. Values come from the approved mockups (2026-10-21). */
/* --hs-brand is overridden per site from widget_settings.colors.brand. */

:root {
  --hs-brand: #4f46e5;
  --hs-brand-soft: color-mix(in srgb, var(--hs-brand) 12%, transparent);
  --hs-on-brand: #ffffff;

  --hs-bg: #f1f5f9;
  --hs-surface: #ffffff;
  --hs-field: #f1f5f9;
  --hs-chip: #eef2f7;
  --hs-text: #0f172a;
  --hs-text-muted: #64748b;
  --hs-border: #e2e8f0;
  --hs-accent-text: #4338ca;

  --hs-success: #15803d;
  --hs-success-soft: #dcfce7;
  --hs-warning: #b45309;
  --hs-warning-soft: #fef3c7;
  --hs-danger: #b91c1c;
  --hs-danger-soft: #fee2e2;
  --hs-note: #fef9c3;
  --hs-note-border: #ca8a04;
  --hs-note-text: #713f12;
  --hs-online: #22c55e;
  --hs-badge: #dc2626;

  --hs-font: 'Vazirmatn', Tahoma, sans-serif;
  --hs-text-xs: 11px;
  --hs-text-sm: 13px;
  --hs-text-md: 14px;
  --hs-text-lg: 16px;
  --hs-text-xl: 22px;

  --hs-radius-bubble: 18px;
  --hs-radius-tail: 6px;
  --hs-radius-panel: 20px;
  --hs-radius-control: 12px;
  --hs-radius-pill: 999px;

  --hs-shadow-panel: 0 16px 48px rgb(15 23 42 / 0.18);
  --hs-shadow-card: 0 4px 16px rgb(15 23 42 / 0.08);
  --hs-shadow-launcher: 0 8px 24px rgb(15 23 42 / 0.25);

  --hs-touch: 44px;
  --hs-launcher-size: 60px;

  --hs-duration-message: 180ms;
  --hs-duration-typing: 1.2s;
  --hs-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
}

:root[data-theme='dark'] {
  --hs-bg: #0b1220;
  --hs-surface: #111a2e;
  --hs-field: #1b263d;
  --hs-chip: #1b263d;
  --hs-text: #e2e8f0;
  --hs-text-muted: #94a3b8;
  --hs-border: #22304a;
  --hs-accent-text: #a5b4fc;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme='light']) {
    --hs-bg: #0b1220;
    --hs-surface: #111a2e;
    --hs-field: #1b263d;
    --hs-chip: #1b263d;
    --hs-text: #e2e8f0;
    --hs-text-muted: #94a3b8;
    --hs-border: #22304a;
    --hs-accent-text: #a5b4fc;
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --hs-duration-message: 0ms;
    --hs-duration-typing: 0ms;
  }
}