:root {
  --primary-color: #FFFFFF;
  --primary-dark: #F5F5F5;
  --primary-light: #F57C00;
  --secondary-color: #F57C00;
  --background-color: #F0F0F0;
  --message-sent-color: #FFF3E0;
  --message-received-color: #FFFFFF;
  --text-color: #333333;
  --text-secondary: #666666;
  --text-light: #999999;
  --header-bg: #3D3D3D;
  --header-text: #FFFFFF;
  --input-bg: #FFFFFF;
  --input-border: #E0E0E0;
  --surface-color: #FFFFFF;
  --divider-color: #EEEEEE;
  --shadow-color: rgba(0,0,0,0.08);
  --bubble-shadow: rgba(0,0,0,0.04);
  --overlay-bg: rgba(0,0,0,0.4);
  --check-color: #999999;
  --check-read-color: #F57C00;
  --system-msg-bg: #FFF3E0;
  --system-msg-text: #E65100;
  --danger-color: #E74C3C;
  --online-color: #4CAF50;
  --recording-color: #E74C3C;
  --chat-pattern: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23000000' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

[data-theme="dark"] {
  --primary-color: #2D2D2D;
  --primary-dark: #1A1A1A;
  --primary-light: #FF9800;
  --secondary-color: #FF9800;
  --background-color: #1A1A1A;
  --message-sent-color: #3D2E1A;
  --message-received-color: #2D2D2D;
  --text-color: #E8E8E8;
  --text-secondary: #AAAAAA;
  --text-light: #888888;
  --header-bg: #2D2D2D;
  --header-text: #FFFFFF;
  --input-bg: #3D3D3D;
  --input-border: #4D4D4D;
  --surface-color: #222222;
  --divider-color: #3D3D3D;
  --shadow-color: rgba(0,0,0,0.3);
  --bubble-shadow: rgba(0,0,0,0.15);
  --overlay-bg: rgba(0,0,0,0.7);
  --check-color: rgba(255,255,255,0.45);
  --check-read-color: #FF9800;
  --system-msg-bg: rgba(245,124,0,0.15);
  --system-msg-text: #FFB74D;
  --danger-color: #EA4335;
  --online-color: #4CAF50;
  --chat-pattern: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.02'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}