/* =============================================================
   Onremo karanlık tema
   Tüm sayfaların paylaştığı CSS değişkenlerini override eder.
   Sayfa-özel hard-coded renkler için ek seçicilerle dokunur.
   ============================================================= */

[data-theme="dark"] {
  --bg: #0F1424;
  --bg-elev: #1A1F2E;
  --ink: #E5E7F0;
  --ink-2: #C5C8D0;
  --muted: #9094A6;
  --muted-2: #707384;
  --line: #2A2F3D;
  --line-2: #2A2F3D;
  --indigo: #7C73F2;
  --indigo-ink: #A8A2FF;
  --mint: #00D9A3;
  --mint-ink: #5DEAC0;
  --amber: #F2A93B;
  --rose: #FF6B7F;
  --shadow-card: 0 1px 0 rgba(0,0,0,.32), 0 18px 40px -16px rgba(0,0,0,.55);
}

[data-theme="dark"] body {
  background: var(--bg);
  color: var(--ink);
}

/* ---------- Hard-coded white backgrounds ---------- */
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .sheet,
[data-theme="dark"] .modal,
[data-theme="dark"] .dropdown,
[data-theme="dark"] .menu,
[data-theme="dark"] .systems,
[data-theme="dark"] .incidents,
[data-theme="dark"] .stat-tile,
[data-theme="dark"] .syscard,
[data-theme="dark"] .product-card,
[data-theme="dark"] .price-card,
[data-theme="dark"] .invite-card,
[data-theme="dark"] .err-block,
[data-theme="dark"] .quick-links,
[data-theme="dark"] .ekip-row,
[data-theme="dark"] .pending-card,
[data-theme="dark"] .roles-card,
[data-theme="dark"] .billing-card,
[data-theme="dark"] .form-card,
[data-theme="dark"] .review-card {
  background: var(--bg-elev);
  color: var(--ink);
}

/* Panel-specific blocks */
[data-theme="dark"] .topnav {
  background: var(--bg-elev);
  border-bottom-color: var(--line);
}
[data-theme="dark"] .search {
  background: var(--bg);
  border-color: var(--line);
}
[data-theme="dark"] .search input { color: var(--ink); }
[data-theme="dark"] .search input::placeholder { color: var(--muted); }
[data-theme="dark"] .search kbd {
  background: var(--line);
  color: var(--muted);
  border-color: var(--line-2);
}
[data-theme="dark"] .icon-btn { color: var(--muted); }
[data-theme="dark"] .icon-btn:hover { color: var(--ink); background: var(--line); }
[data-theme="dark"] .avatar-btn { color: var(--ink); }
[data-theme="dark"] .avatar-btn:hover { background: var(--line); }
[data-theme="dark"] .avatar { background: var(--indigo); color: #fff; }

/* Hesap sidebar */
[data-theme="dark"] .side-nav { background: var(--bg-elev); }
[data-theme="dark"] .side-nav a { color: var(--muted); }
[data-theme="dark"] .side-nav a:hover { color: var(--ink); background: var(--line); }
[data-theme="dark"] .side-nav a.active {
  background: rgba(124, 115, 242, .18);
  color: var(--indigo-ink);
}

/* Form fields */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] input[type="url"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] textarea,
[data-theme="dark"] select {
  background: var(--bg) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder { color: var(--muted) !important; }
[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus { border-color: var(--indigo) !important; }

/* Buttons */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .btn.primary {
  background: var(--indigo);
  color: #fff;
}
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .btn-ghost,
[data-theme="dark"] .btn.secondary {
  background: var(--bg-elev);
  color: var(--ink);
  border-color: var(--line);
}

/* Tables */
[data-theme="dark"] table { color: var(--ink); }
[data-theme="dark"] th { color: var(--muted); border-bottom-color: var(--line); }
[data-theme="dark"] td { border-bottom-color: var(--line); }

/* Hr / divider */
[data-theme="dark"] hr { border-color: var(--line); }

/* Code / kbd */
[data-theme="dark"] code, [data-theme="dark"] pre {
  background: var(--bg);
  color: var(--ink-2);
  border: 1px solid var(--line);
}
[data-theme="dark"] kbd {
  background: var(--line);
  color: var(--muted);
}

/* Tooltips & badges */
[data-theme="dark"] .tag, [data-theme="dark"] .chip, [data-theme="dark"] .pill {
  background: var(--line);
  color: var(--muted);
  border-color: var(--line-2);
}

/* Dim brand mark slightly so it doesn't burn */
[data-theme="dark"] .brand-mark { opacity: .94; }

/* Status hero / preserve dark gradients (already dark) */
[data-theme="dark"] .status-hero { box-shadow: 0 18px 40px -16px rgba(0,0,0,.55); }

/* Subscribe / dark sections that were already dark */
[data-theme="dark"] .subscribe { background: #060914; }

/* Anchors */
[data-theme="dark"] a { color: var(--indigo-ink); }
[data-theme="dark"] a:hover { color: #C5C0FF; }

/* Auth modal & onboarding cards */
[data-theme="dark"] .auth-card,
[data-theme="dark"] .onb-card {
  background: var(--bg-elev);
  color: var(--ink);
}

/* Gradient/illustrative blocks: keep their own bg, just brighten text */
[data-theme="dark"] .gradient-block, [data-theme="dark"] .illustrative {
  color: #fff;
}

/* Image placeholders / screenshot stubs */
[data-theme="dark"] .screenshot-stub {
  background: linear-gradient(135deg, #1A1F2E 0%, #2A2F3D 100%);
}

/* Scrollbar (WebKit) */
[data-theme="dark"] ::-webkit-scrollbar { width: 12px; height: 12px; }
[data-theme="dark"] ::-webkit-scrollbar-track { background: var(--bg); }
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: var(--line); border-radius: 6px; border: 3px solid var(--bg); }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: var(--muted-2); }

/* Selection */
[data-theme="dark"] ::selection { background: var(--indigo); color: #fff; }