/* ITK-QR - Themes Configuration (Light & Dark Mode) */
:root {
  /* Brand Color Tokens */
  --primary: #0066FF;
  --primary-hover: #0052CC;
  --primary-light: rgba(0, 102, 255, 0.08);
  --secondary: #00B8D9;
  --accent: #FF9800;
  
  /* Status Colors */
  --success: #10B981;
  --danger: #EF4444;
  --warning: #F59E0B;
  --info: #3B82F6;

  /* Typography */
  --font-family: 'Noto Sans Khmer', 'Inter', system-ui, -apple-system, sans-serif;
  --transition-speed: 0.25s;
}

/* Light Theme Variables (Default) */
[data-theme="light"] {
  --bg-main: #F8FAFC;
  --bg-card: #FFFFFF;
  --bg-card-sub: #F1F5F9;
  --bg-input: #FFFFFF;
  --bg-hover: #F1F5F9;
  --bg-nav: rgba(255, 255, 255, 0.85);

  --text-main: #0F172A;
  --text-muted: #64748B;
  --text-light: #94A3B8;

  --border-color: #E2E8F0;
  --border-focus: #0066FF;

  --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 -1px rgba(0, 0, 0, 0.04);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.03);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);

  --qr-preview-bg: #FFFFFF;
  --qr-preview-pattern: #F8FAFC;
}

/* Dark Theme Variables */
[data-theme="dark"] {
  --bg-main: #0F172A;
  --bg-card: #1E293B;
  --bg-card-sub: #334155;
  --bg-input: #0F172A;
  --bg-hover: #334155;
  --bg-nav: rgba(30, 41, 59, 0.85);

  --text-main: #F8FAFC;
  --text-muted: #94A3B8;
  --text-light: #64748B;

  --border-color: #334155;
  --border-focus: #38BDF8;

  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4), 0 2px 4px -1px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 10px 10px -5px rgba(0, 0, 0, 0.4);

  --qr-preview-bg: #1E293B;
  --qr-preview-pattern: #0F172A;
}