@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&family=Noto+Naskh+Arabic:wght@400;600&family=Amiri:wght@400&display=swap");

/* Generated by the visual editor (لوحة التحكم ← التصميم). Edit there, or add your own CSS in «CSS مخصص». */

:root {
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-2: #eef0f6;
  --text: #1a1d29;
  --muted: #6b7185;
  --border: #e2e5ee;
  --primary: #4f46e5;
  --primary-soft: #eef0ff;
  --accent: #f59e0b;
  --logo-2: #9333ea;
  --reader-bg: #ffffff;
  --reader-text: #1f2230;
  --radius: 12px;
  --font-ui: "Cairo", system-ui, sans-serif;
  --font-heading: "Cairo", system-ui, sans-serif;
  --card-min: 150px;
}

:root[data-theme="dark"] {
  --bg: #0f1117;
  --surface: #171a23;
  --surface-2: #1f2330;
  --text: #e7e9f0;
  --muted: #9097ab;
  --border: #2a2f3d;
  --primary: #818cf8;
  --primary-soft: #232644;
  --accent: #f59e0b;
  --logo-2: #9333ea;
  --reader-bg: #171a23;
  --reader-text: #d9dce6;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0f1117;
    --surface: #171a23;
    --surface-2: #1f2330;
    --text: #e7e9f0;
    --muted: #9097ab;
    --border: #2a2f3d;
    --primary: #818cf8;
    --primary-soft: #232644;
    --accent: #f59e0b;
    --logo-2: #9333ea;
    --reader-bg: #171a23;
    --reader-text: #d9dce6;
  }
}

html { font-size: 16px; }

body { font-family: var(--font-ui); }

h1, h2, h3, h4, .logo { font-family: var(--font-heading); }

.container { max-width: 1200px; }

.grid { grid-template-columns: repeat(auto-fill, minmax(var(--card-min), 1fr)); }