@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@400;500;600;700&display=swap');

:root {
  --primary: #6658e8;
  --primary-dark: #5145cd;
  --primary-soft: #eeecff;
  --success: #16a66a;
  --success-soft: #e8f8f0;
  --warning: #f59e0b;
  --warning-soft: #fff6df;
  --danger: #ef4444;
  --danger-soft: #feecec;
  --info: #3b82f6;
  --info-soft: #eaf2ff;

  --bg: #f5f7fb;
  --surface: #ffffff;
  --surface-muted: #f8fafc;
  --text: #172033;
  --text-muted: #6b7280;
  --border: #e5e7eb;
  --sidebar: #1f2937;
  --sidebar-hover: #2d3748;

  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --shadow-sm: 0 4px 16px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 12px 30px rgba(15, 23, 42, 0.10);

  --sidebar-width: 250px;
  --topbar-height: 64px;
}

* {
  box-sizing: border-box;
}

html {
  font-family: 'Sarabun', sans-serif;
  color: var(--text);
  background: var(--bg);
}

body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
}

button, input, select, textarea {
  font-family: inherit;
}