/* ========================================
   Enterprise V9 - Theme System
   מערכת תמות מתקדמת
   
   ⚠️ חשוב: קובץ זה משנה רק את ערכי המשתנים
   שהוגדרו ב-variables-global.css לפי התמה שנבחרת.
   
   כל המשתנים מוגדרים ב-variables-global.css
   והערכים כאן משתנים לפי [data-theme]
   ======================================== */

@layer tokens {
/* ========================================
   Dark Theme - תמה כהה (ברירת מחדל בלבד)
   ======================================== */

:root,
[data-theme="dark"],
.dark {
  /* רקעים */
  --bg-page: #1b2330;
  --bg-main: #1b2330;
  --bg-main-alt: #1f2937;
  --bg-surface: #273245;
  --bg-surface-soft: #2e3a4e;
  --bg-elevated: #323f57;
  --bg-muted: #1e293b;
  --bg-overlay: rgba(0, 0, 0, 0.7);

  /* טקסט */
  --text-main: #e9eef5;
  --text-secondary: #b8c2cf;
  --text-muted: #9aa3b4;
  --text-inverse: #ffffff;
  --text-disabled: #475569;
  --text-on-primary: #ffffff;

  /* גבולות */
  --border-subtle: rgba(148, 163, 184, 0.35);
  --border-strong: rgba(148, 163, 184, 0.6);
  --border-soft: rgba(148, 163, 184, 0.2);
  --border-focus: var(--primary-400);
  --border-error: var(--error-400);

  /* צללים */
  --shadow-soft: 0 6px 24px rgba(15, 23, 42, 0.45);
  --shadow-card: 0 4px 18px rgba(15, 23, 42, 0.55);
  --shadow-strong: 0 8px 32px rgba(15, 23, 42, 0.65);

  /* Aliasים */
  --primary-soft: rgba(77, 163, 255, 0.12);
  --primary-soft-strong: rgba(77, 163, 255, 0.18);
  --success-soft: rgba(34, 197, 94, 0.12);
  --warning-soft: rgba(251, 191, 36, 0.12);
  --danger-soft: rgba(239, 68, 68, 0.12);
  --info-soft: rgba(56, 189, 248, 0.12);
}

/* ========================================
   High Contrast Theme - תמה ניגודיות גבוהה
   ======================================== */

[data-theme="high-contrast"] {
  /* Primary Colors */
  --primary-50: #000000;
  --primary-100: #000000;
  --primary-200: #000000;
  --primary-300: #000000;
  --primary-400: #000000;
  --primary-500: #000000;
  --primary-600: #000000;
  --primary-700: #000000;
  --primary-800: #000000;
  --primary-900: #000000;

  /* Secondary Colors */
  --secondary-50: #ffffff;
  --secondary-100: #ffffff;
  --secondary-200: #ffffff;
  --secondary-300: #ffffff;
  --secondary-400: #ffffff;
  --secondary-500: #ffffff;
  --secondary-600: #ffffff;
  --secondary-700: #ffffff;
  --secondary-800: #ffffff;
  --secondary-900: #ffffff;

  /* Semantic Colors */
  --success-50: #000000;
  --success-100: #000000;
  --success-500: #000000;
  --success-600: #000000;
  --success-700: #000000;

  --warning-50: #000000;
  --warning-100: #000000;
  --warning-500: #000000;
  --warning-600: #000000;
  --warning-700: #000000;

  --error-50: #000000;
  --error-100: #000000;
  --error-500: #000000;
  --error-600: #000000;
  --error-700: #000000;

  --info-50: #000000;
  --info-100: #000000;
  --info-500: #000000;
  --info-600: #000000;
  --info-700: #000000;

  /* Neutral Colors */
  --white: #ffffff;
  --black: #000000;
  --gray-50: #ffffff;
  --gray-100: #ffffff;
  --gray-200: #ffffff;
  --gray-300: #ffffff;
  --gray-400: #ffffff;
  --gray-500: #ffffff;
  --gray-600: #000000;
  --gray-700: #000000;
  --gray-800: #000000;
  --gray-900: #000000;

  /* Background Colors */
  --bg-primary: var(--white);
  --bg-secondary: var(--white);
  --bg-tertiary: var(--white);

  /* Text Colors */
  --text-primary: var(--black);
  --text-secondary: var(--black);
  --text-tertiary: var(--black);
  --text-inverse: var(--white);

  /* Border Colors */
  --border-primary: var(--black);
  --border-secondary: var(--black);
  --border-focus: var(--black);

  /* Shadow Colors */
  --shadow-sm: 0 0 0 2px var(--black);
  --shadow-md: 0 0 0 2px var(--black);
  --shadow-lg: 0 0 0 2px var(--black);
  --shadow-xl: 0 0 0 2px var(--black);
}

/* ========================================
   Theme Transition - מעבר בין תמות
   ======================================== */
/* הוסר: קוד כפיה גלובלי - transitions יוגדרו על אלמנטים ספציפיים בלבד */
/* אלמנטים שצריכים transitions כבר מוגדרים עם transition properties שלהם */

/* ========================================
   Theme-aware Components - רכיבים מודעים לתמה
   ======================================== */

.theme-aware-bg {
  background-color: var(--bg-primary);
}

.theme-aware-text {
  color: var(--text-primary);
}

.theme-aware-border {
  border-color: var(--border-primary);
}

.theme-aware-card {
  background-color: var(--bg-primary);
  border: 1px solid var(--border-primary);
  box-shadow: var(--shadow-sm);
}

.theme-aware-button {
  background-color: var(--primary-600);
  color: var(--text-inverse);
  border: 1px solid var(--primary-600);
}

.theme-aware-button:hover {
  background-color: var(--primary-700);
  border-color: var(--primary-700);
}

.theme-aware-input {
  background-color: var(--bg-primary);
  color: var(--text-primary);
  border: 1px solid var(--border-primary);
}

.theme-aware-input:focus {
  border-color: var(--border-focus);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

/* ========================================
   Custom Theme Variables - משתני תמה מותאמים אישית
   ======================================== */

[data-theme="custom"] {
  /* Allow custom theme variables to be set via CSS custom properties */
  --custom-primary: #6366f1;
  --custom-secondary: #8b5cf6;
  --custom-accent: #06b6d4;
  --custom-background: #ffffff;
  --custom-surface: #f8fafc;
  --custom-text: #1e293b;
  --custom-text-muted: #64748b;
  --custom-border: #e2e8f0;
  --custom-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

/* ========================================
   Theme Toggle Component - רכיב החלפת תמה
   ======================================== */

.theme-toggle {
  @apply relative inline-flex h-6 w-11 items-center rounded-full transition-colors focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2;
  background-color: var(--border-secondary);
}

.theme-toggle.active {
  background-color: var(--primary-600);
}

.theme-toggle-thumb {
  @apply inline-block h-4 w-4 transform rounded-full bg-white transition-transform;
}

.theme-toggle.active .theme-toggle-thumb {
  @apply translate-x-6;
}

.theme-toggle-icon {
  @apply absolute inset-0 flex items-center justify-center text-xs;
}

.theme-toggle-icon.sun {
  @apply left-1;
  color: var(--warning-500);
}

.theme-toggle-icon.moon {
  @apply right-1;
  color: var(--info-500);
}

/* ========================================
   Theme-aware RTL Support - תמיכה RTL מודעת לתמה
   ======================================== */

[dir="rtl"][data-theme="dark"] {
  /* RTL specific dark theme adjustments */
  --text-direction: rtl;
}

[dir="rtl"][data-theme="high-contrast"] {
  /* RTL specific high contrast theme adjustments */
  --text-direction: rtl;
}

/* ========================================
   Theme-aware Print Styles - סגנונות הדפסה מודעים לתמה
   ======================================== */

@media print {
  [data-theme] {
    /* Force light theme for print */
    --bg-primary: #ffffff;
    --bg-secondary: #ffffff;
    --text-primary: #000000;
    --text-secondary: #000000;
    --border-primary: #000000;
    --shadow-sm: none;
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-xl: none;
  }
  
  .theme-toggle {
    display: none;
  }
}

/* ========================================
   Theme-aware Reduced Motion - תנועה מופחתת מודעת לתמה
   ======================================== */

@media (prefers-reduced-motion: reduce) {
  [data-theme] * {
    transition: none;
    animation: none;
  }
  
  .theme-toggle-thumb {
    transition: none;
  }
}

/* ========================================
   Theme-aware High Contrast Media Query - ניגודיות גבוהה מודעת לתמה
   ======================================== */

@media (prefers-contrast: high) {
  
  [data-theme="dark"] {
    /* Enhance contrast for dark theme when user prefers high contrast */
    --border-primary: #ffffff;
    --text-secondary: #ffffff;
  }
}

/* ========================================
   Theme-aware Color Scheme Media Query - סכמת צבעים מודעת לתמה
   ======================================== */

@media (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
    /* Auto-apply dark theme if user prefers dark color scheme */
    --bg-primary: var(--gray-800);
    --bg-secondary: var(--gray-900);
    --text-primary: var(--gray-100);
    --text-secondary: var(--gray-300);
    --border-primary: var(--gray-700);
  }
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    /* Auto-apply light theme if user prefers light color scheme */
    --bg-primary: var(--white);
    --bg-secondary: var(--gray-50);
    --text-primary: var(--gray-900);
    --text-secondary: var(--gray-600);
    --border-primary: var(--gray-200);
  }
}
} /* סיום @layer tokens */