/* ==========================================================================
   📱 UI/UX & Design Custodian: Design Tokens (Clean & Bright Sunlight Theme)
   ========================================================================== */

:root {
  /* Core Palette - Bright, Crisp & Sunlight-Friendly */
  --bg-app: #f8fafc;           /* Slate 50 - สะอาด สว่าง สบายตา */
  --bg-surface: #ffffff;       /* Pure White Card */
  --bg-surface-subtle: #f1f5f9;/* Slate 100 */
  --bg-card-hover: #f8fafc;
  
  /* Primary & Accents */
  --primary: #2563eb;          /* Sapphire Blue */
  --primary-hover: #1d4ed8;
  --primary-light: #eff6ff;
  --primary-border: #bfdbfe;

  --success: #059669;          /* Emerald Green - ชัดเจนเมื่ออยู่กลางแจ้ง */
  --success-light: #ecfdf5;
  --success-border: #a7f3d0;

  --warning: #d97706;          /* Amber Gold */
  --warning-light: #fffbeb;

  --danger: #dc2626;           /* Crimson Red สำหรับแนวสาย/ปุ่มลบ */
  --danger-light: #fef2f2;

  --info-cyan: #06b6d4;        /* Cyan 500 สำหรับ Header ตาราง */
  --info-cyan-light: #cffafe;  /* Cyan Light */

  --highlight-yellow: #fef08a; /* Yellow Highlight สำหรับป้ายรูป */
  --highlight-yellow-border: #eab308;

  /* Typography */
  --text-main: #0f172a;        /* Dark Slate 900 - คมชัดสูง อ่านง่ายกลางแดด */
  --text-muted: #475569;       /* Slate 600 */
  --text-subtle: #64748b;      /* Slate 500 */
  --text-inverse: #ffffff;

  /* Borders & Shadows */
  --border-light: #e2e8f0;     /* Slate 200 */
  --border-strong: #cbd5e1;    /* Slate 300 */
  --border-focus: #3b82f6;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -4px rgba(0, 0, 0, 0.04);

  /* Radius */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* Font Families */
  --font-sans: 'Prompt', 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', 'Consolas', monospace;
}
