/* ════════ Theme Kit — القيم الافتراضية والربط الأساسي ════════
   ضمّ هذا الملف قبل سكربت المحرّك. كل ما فيه قابل للتجاوز: المحرّك يكتب
   قيمه أنماطًا سطرية على <html> فتغلب هذه القيم بلا !important. */

:root {
  --tk-bg: #fbf9f4;
  --tk-bg-image: none;
  --tk-surface: #ffffff;
  --tk-surface-2: #f7f5ef;
  --tk-glass: linear-gradient(155deg, rgba(255,255,255,.8), rgba(255,255,255,.5));
  --tk-ink: #101a15;
  --tk-ink-2: #2c3a32;
  --tk-muted: #6b7a72;
  --tk-accent: #0e4a38;
  --tk-accent-2: #c4653f;
  --tk-accent-soft: #e8eeea;
  --tk-line: rgba(16,26,21,.1);
  --tk-line-strong: rgba(14,74,56,.3);
  --tk-field: #f5f3ee;
  --tk-radius: 18px;
  --tk-radius-sm: 11px;
  --tk-radius-lg: 24px;
  --tk-shadow-1: 0 2px 6px rgba(16,26,21,.05), 0 18px 38px -26px rgba(16,26,21,.4);
  --tk-shadow-2: 0 26px 54px -28px rgba(16,26,21,.45);
  --tk-shadow-ring: 0 0 0 3px rgba(14,74,56,.28);
  --tk-font-ui: system-ui, -apple-system, 'Segoe UI', Tahoma, sans-serif;
  --tk-font-text: 'Iowan Old Style', Georgia, serif;
  --tk-fs: 1;
  --tk-bw: 1px;
  --tk-dur: 420ms;
  --tk-ease: cubic-bezier(.22,.68,.28,1);
}

/* الربط الأساسي: يعمل فقط حين يكون المحرّك نشطًا، فلا يمسّ تطبيقك قبل التفعيل */
html[data-tk="on"] body {
  background-color: var(--tk-bg);
  background-image: var(--tk-bg-image);
  background-attachment: fixed;
  color: var(--tk-ink);
  font-family: var(--tk-font-ui);
  transition: background-color var(--tk-dur) var(--tk-ease), color var(--tk-dur) var(--tk-ease);
}

/* صنف عام: أي عنصر تضع عليه data-tk-surface يأخذ شكل «سطح» متّسق مع المظهر */
html[data-tk="on"] [data-tk-surface] {
  background: var(--tk-glass);
  border: var(--tk-bw) solid var(--tk-line);
  border-radius: var(--tk-radius);
  box-shadow: var(--tk-shadow-1);
  backdrop-filter: blur(14px);
  transition: transform var(--tk-dur) var(--tk-ease), box-shadow var(--tk-dur) var(--tk-ease), border-color var(--tk-dur) var(--tk-ease);
}

html[data-tk="on"] [data-tk-surface]:hover {
  transform: translateY(-2px);
  box-shadow: var(--tk-shadow-2);
  border-color: var(--tk-line-strong);
}

html[data-tk="on"] [data-tk-btn] {
  background: var(--tk-accent);
  color: var(--tk-surface);
  border: var(--tk-bw) solid transparent;
  border-radius: var(--tk-radius-sm);
  font-family: var(--tk-font-ui);
  transition: filter var(--tk-dur) var(--tk-ease), transform var(--tk-dur) var(--tk-ease);
}
html[data-tk="on"] [data-tk-btn]:hover { filter: brightness(1.08); transform: translateY(-1px); }
html[data-tk="on"] [data-tk-btn][data-variant="ghost"] {
  background: transparent;
  color: var(--tk-ink);
  border-color: var(--tk-line);
}

html[data-tk="on"] :focus-visible { outline: none; box-shadow: var(--tk-shadow-ring); }

@media (prefers-reduced-motion: reduce) {
  html[data-tk="on"] * { transition-duration: 1ms !important; }
}