/* ============================================================
   BELGELE — DARK MODE STYLESHEET
   Palette: #181818 bg · #242424 card · #F99040 orange
   ============================================================ */

/* ── 1. CSS VARIABLE OVERRIDES (index.html uses these) ── */
html[data-theme="dark"] {
  --primary: #F99040;
  --primary-dark: #E07820;
  --primary-light: #261300;
  --green: #34D399;
  --green-light: #022C1B;
  --text: #E8E8E8;
  --muted: #9CA3AF;
  --border: #383838;
  --bg: #181818;
  --card: #242424;
}

/* ── 2. BASE ── */
html[data-theme="dark"] body {
  background: #181818 !important;
  color: #E8E8E8 !important;
}

/* ── 3. NAV ── */
html[data-theme="dark"] nav {
  background: rgba(24,24,24,0.97) !important;
  border-color: #383838 !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.4) !important;
}
html[data-theme="dark"] .logo-name,
html[data-theme="dark"] .brand-name { color: #E8E8E8 !important; }
html[data-theme="dark"] .logo-tag   { color: #9CA3AF !important; }
html[data-theme="dark"] .nav-links a { color: #9CA3AF !important; }
html[data-theme="dark"] .nav-links a:hover { color: #E8E8E8 !important; }
html[data-theme="dark"] .back-link  { color: #9CA3AF !important; }
html[data-theme="dark"] .back-link:hover { color: #F99040 !important; }
html[data-theme="dark"] .nav-cta    { background: #F99040 !important; }

/* ── 4. FOOTER ── */
html[data-theme="dark"] footer {
  background: #111111 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] footer p    { color: #9CA3AF !important; }
html[data-theme="dark"] .footer-logo-name { color: #E8E8E8 !important; }
html[data-theme="dark"] .footer-links a { color: #64748B !important; }
html[data-theme="dark"] .footer-links a:hover { color: #9CA3AF !important; }

/* ── 5. TRUST BAR / HOW BG ── */
html[data-theme="dark"] .trust-bar,
html[data-theme="dark"] .how-bg {
  background: #1F1F1F !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .trust-item { color: #9CA3AF !important; }

/* ── 6. HERO ── */
html[data-theme="dark"] .hero h1    { color: #E8E8E8 !important; }
html[data-theme="dark"] .hero p     { color: #9CA3AF !important; }
html[data-theme="dark"] .hero-badge {
  background: #261300 !important;
  color: #F99040 !important;
  border-color: #4A2800 !important;
}

/* ── 7. SECTION HEADINGS ── */
html[data-theme="dark"] .section-title { color: #E8E8E8 !important; }
html[data-theme="dark"] .section-sub   { color: #9CA3AF !important; }
html[data-theme="dark"] .section-label { color: #F99040 !important; }

/* ── 8. CATEGORY TABS ── */
html[data-theme="dark"] .cat-tab {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #9CA3AF !important;
}
html[data-theme="dark"] .cat-tab:hover {
  border-color: #505050 !important;
  color: #E8E8E8 !important;
}
html[data-theme="dark"] .cat-tab.active {
  background: #F99040 !important;
  border-color: #F99040 !important;
  color: white !important;
}

/* ── 9. DOC CARDS (index.html grid) ── */
html[data-theme="dark"] .doc-card {
  background: #242424 !important;
  border-color: #383838 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.3) !important;
}
html[data-theme="dark"] .doc-card.soon { opacity: .45 !important; }
html[data-theme="dark"] .doc-card.available:hover {
  border-color: #F99040 !important;
  box-shadow: 0 8px 24px rgba(249,144,64,.15) !important;
}
html[data-theme="dark"] .doc-name  { color: #E8E8E8 !important; }
html[data-theme="dark"] .doc-desc,
html[data-theme="dark"] .doc-time  { color: #9CA3AF !important; }
html[data-theme="dark"] .doc-footer { border-color: #383838 !important; }
html[data-theme="dark"] .doc-arrow {
  background: #261300 !important;
  color: #F99040 !important;
}
html[data-theme="dark"] .doc-card.available:hover .doc-arrow {
  background: #F99040 !important;
  color: white !important;
}
html[data-theme="dark"] .badge-ready {
  background: #022C1B !important;
  color: #34D399 !important;
  border-color: #065F46 !important;
}
html[data-theme="dark"] .badge-soon {
  background: #1E0F00 !important;
  color: #F99040 !important;
  border-color: #5A2D00 !important;
}
html[data-theme="dark"] .badge-new {
  background: #022C1B !important;
  color: #34D399 !important;
  border-color: #065F46 !important;
}

/* ── 10. WHY / HOW CARDS ── */
html[data-theme="dark"] .why-card {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .why-card h3,
html[data-theme="dark"] .how-step h3 { color: #E8E8E8 !important; }
html[data-theme="dark"] .why-card p,
html[data-theme="dark"] .how-step p  { color: #9CA3AF !important; }
html[data-theme="dark"] .how-num {
  background: linear-gradient(135deg, #261300, #1A1030) !important;
}

/* ── 11. GENERIC CARD (document pages + rehber.html grid cards) ── */
html[data-theme="dark"] .card {
  background: #242424 !important;
  border-color: #383838 !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.4), 0 4px 20px rgba(0,0,0,.2) !important;
}
html[data-theme="dark"] .card:hover {
  border-color: #F99040 !important;
  box-shadow: 0 8px 28px rgba(249,144,64,.15) !important;
}
html[data-theme="dark"] .card h2         { color: #E8E8E8 !important; }
html[data-theme="dark"] .card p          { color: #9CA3AF !important; }
html[data-theme="dark"] .card-bottom     { border-color: #383838 !important; }
html[data-theme="dark"] .card-time       { color: #6B7280 !important; }
html[data-theme="dark"] .card-views      { color: #6B7280 !important; }
html[data-theme="dark"] .card-arrow      { color: #F99040 !important; }
html[data-theme="dark"] .card-cat {
  background: #261300 !important;
  color: #F99040 !important;
}
/* Rehber category filter buttons (.cat-btn) */
html[data-theme="dark"] .cat-btn {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #9CA3AF !important;
}
html[data-theme="dark"] .cat-btn:hover {
  background: #2C2C2C !important;
  border-color: #505050 !important;
  color: #E8E8E8 !important;
}
html[data-theme="dark"] .cat-btn.active {
  background: #F99040 !important;
  border-color: #F99040 !important;
  color: white !important;
}

/* ── 12. BUTTONS ── */
html[data-theme="dark"] .btn-secondary {
  background: #2C2C2C !important;
  color: #E8E8E8 !important;
  border-color: #4A4A4A !important;
}
html[data-theme="dark"] .btn-secondary:hover {
  background: #323232 !important;
  border-color: #606060 !important;
}
html[data-theme="dark"] .btn-hero-ghost {
  background: #242424 !important;
  color: #E8E8E8 !important;
  border-color: #4A4A4A !important;
}
html[data-theme="dark"] .btn-hero-ghost:hover {
  background: #2C2C2C !important;
  border-color: #606060 !important;
}
html[data-theme="dark"] .btn-outline {
  background: #242424 !important;
  color: #F99040 !important;
  border-color: #F99040 !important;
}
html[data-theme="dark"] .btn-outline:hover { background: #261300 !important; }

/* ── 13. INPUTS ── */
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: #1E1E1E !important;
  color: #E8E8E8 !important;
  border-color: #4A4A4A !important;
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #555 !important; }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] select:focus,
html[data-theme="dark"] textarea:focus {
  border-color: #F99040 !important;
  box-shadow: 0 0 0 3px rgba(249,144,64,.15) !important;
}
html[data-theme="dark"] label       { color: #C4C4C4 !important; }
html[data-theme="dark"] .help-text  { color: #9CA3AF !important; }
html[data-theme="dark"] .req        { color: #F87171 !important; }

/* ── 14. RADIO OPTIONS ── */
html[data-theme="dark"] .radio-opt {
  background: #1E1E1E !important;
  border-color: #4A4A4A !important;
  color: #C4C4C4 !important;
}
html[data-theme="dark"] .radio-opt:hover {
  border-color: #F99040 !important;
  background: #261300 !important;
}
html[data-theme="dark"] .radio-opt.active {
  border-color: #F99040 !important;
  background: #261300 !important;
  color: #F99040 !important;
}

/* ── 15. STEP INDICATORS (sidebar in doc pages) ── */
html[data-theme="dark"] .step-item { border-color: transparent !important; }
html[data-theme="dark"] .step-item.current {
  background: #261300 !important;
  border-color: #F99040 !important;
}
html[data-theme="dark"] .step-item.done {
  background: #022C1B !important;
  border-color: #10B981 !important;
}
html[data-theme="dark"] .step-icon.pending { background: #2C2C2C !important; }
html[data-theme="dark"] .step-item span    { color: #E8E8E8 !important; }
html[data-theme="dark"] .step-title        { color: #E8E8E8 !important; }
html[data-theme="dark"] .step-sub          { color: #9CA3AF !important; }

/* ── 16. TABLES ── */
html[data-theme="dark"] table th {
  background: #261300 !important;
  color: #F4A970 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] table td {
  border-color: #383838 !important;
  color: #E8E8E8 !important;
}
html[data-theme="dark"] tr:nth-child(even) td { background: #222222 !important; }

/* ── 17. INFO / WARN BOXES ── */
html[data-theme="dark"] .info-box {
  background: #1E1008 !important;
  border-color: #5A3010 !important;
  color: #F4A970 !important;
}
html[data-theme="dark"] .warn-box {
  background: #1A1500 !important;
  border-color: #5A4500 !important;
  color: #FBD38D !important;
}

/* ── 18. CTA BOX (rehber articles) ── */
html[data-theme="dark"] .cta-box {
  background: linear-gradient(135deg,#1E1008,#261300) !important;
  border-color: #5A3010 !important;
}
html[data-theme="dark"] .cta-box h3 { color: #F99040 !important; }
html[data-theme="dark"] .cta-box p  { color: #C4843A !important; }

/* ── 19. ARTICLE (rehber pages) ── */
html[data-theme="dark"] .article {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .art-title           { color: #E8E8E8 !important; }
html[data-theme="dark"] .art-meta            { color: #9CA3AF !important; border-color: #383838 !important; }
html[data-theme="dark"] .art-cat {
  background: #261300 !important;
  color: #F99040 !important;
}
html[data-theme="dark"] .art-body h2         { color: #E8E8E8 !important; }
html[data-theme="dark"] .art-body h3         { color: #CCCCCC !important; }
html[data-theme="dark"] .art-body p          { color: #CCCCCC !important; }
html[data-theme="dark"] .art-body li         { color: #CCCCCC !important; }
html[data-theme="dark"] .art-body strong     { color: #E8E8E8 !important; }
html[data-theme="dark"] .art-body ul li::marker,
html[data-theme="dark"] .art-body ol li::marker { color: #F99040 !important; }

/* ── 20. STEP LIST (rehber numbered steps) ── */
html[data-theme="dark"] .step-list li {
  color: #CCCCCC !important;
  border-color: #383838 !important;
}

/* ── 21. SIDEBAR (rehber) ── */
html[data-theme="dark"] .sidebar-card {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .sidebar-card h4 { color: #C4C4C4 !important; }
html[data-theme="dark"] .sidebar-link    { color: #9CA3AF !important; border-color: #383838 !important; }
html[data-theme="dark"] .sidebar-link:hover { color: #F99040 !important; }

/* ── 22. REHBER.HTML posts / search ── */
html[data-theme="dark"] .post-card {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .post-card:hover {
  border-color: #F99040 !important;
  box-shadow: 0 8px 24px rgba(249,144,64,.12) !important;
}
html[data-theme="dark"] .post-title   { color: #E8E8E8 !important; }
html[data-theme="dark"] .post-excerpt { color: #9CA3AF !important; }
html[data-theme="dark"] .post-meta    { color: #9CA3AF !important; border-color: #383838 !important; }
html[data-theme="dark"] .post-cat {
  background: #261300 !important;
  color: #F99040 !important;
}
html[data-theme="dark"] .search-bar,
html[data-theme="dark"] .search-input {
  background: #1E1E1E !important;
  border-color: #4A4A4A !important;
  color: #E8E8E8 !important;
}
html[data-theme="dark"] .filter-btn {
  background: #242424 !important;
  border-color: #383838 !important;
  color: #9CA3AF !important;
}
html[data-theme="dark"] .filter-btn.active,
html[data-theme="dark"] .filter-btn:hover {
  background: #F99040 !important;
  border-color: #F99040 !important;
  color: white !important;
}

/* ── 23. LOGIN PAGE ── */
html[data-theme="dark"] .login-wrap  { background: #1E1E1E !important; }
html[data-theme="dark"] .login-card  { background: #242424 !important; border-color: #383838 !important; }
html[data-theme="dark"] .login-title { color: #E8E8E8 !important; }
html[data-theme="dark"] .login-sub   { color: #9CA3AF !important; }
html[data-theme="dark"] .divider-text { color: #9CA3AF !important; }
html[data-theme="dark"] .divider-line { background: #383838 !important; }

/* ── 24. CREDITS PAGE ── */

/* Header (credits.html uses <header> not <nav>) */
html[data-theme="dark"] header {
  background: rgba(24,24,24,0.97) !important;
  border-color: #383838 !important;
  box-shadow: 0 1px 8px rgba(0,0,0,.4) !important;
}
html[data-theme="dark"] .logo-name { color: #E8E8E8 !important; }
html[data-theme="dark"] .sep       { background: #383838 !important; }
html[data-theme="dark"] .back-link { color: #9CA3AF !important; }
html[data-theme="dark"] .back-link:hover { color: #F99040 !important; }
html[data-theme="dark"] .btn-logout {
  background: #2C2C2C !important;
  color: #E8E8E8 !important;
  border-color: #4A4A4A !important;
}
html[data-theme="dark"] .badge-credits {
  background: linear-gradient(135deg,#022C1B,#065F46) !important;
  color: #34D399 !important;
  border-color: #10B981 !important;
}

/* Page headings */
html[data-theme="dark"] .page-title { color: #E8E8E8 !important; }
html[data-theme="dark"] .page-sub   { color: #9CA3AF !important; }

/* Package cards */
html[data-theme="dark"] .package-card {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .package-card:hover {
  border-color: #F99040 !important;
  box-shadow: 0 6px 24px rgba(249,144,64,.15) !important;
}
html[data-theme="dark"] .package-card.selected {
  border-color: #F99040 !important;
  box-shadow: 0 0 0 3px rgba(249,144,64,.2) !important;
}
html[data-theme="dark"] .package-card.popular {
  border-color: #D97706 !important;
}
html[data-theme="dark"] .pkg-credits { color: #F99040 !important; }
html[data-theme="dark"] .pkg-unit    { color: #9CA3AF !important; }
html[data-theme="dark"] .pkg-price   { color: #E8E8E8 !important; }
html[data-theme="dark"] .pkg-per     { color: #9CA3AF !important; }
html[data-theme="dark"] .pkg-docs {
  color: #9CA3AF !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .discount-badge {
  background: #022C1B !important;
  color: #34D399 !important;
  border-color: #065F46 !important;
}

/* Price table */
html[data-theme="dark"] .price-table {
  background: #242424 !important;
}
html[data-theme="dark"] .price-table h3 { color: #E8E8E8 !important; }
html[data-theme="dark"] .price-row {
  border-color: #383838 !important;
  color: #CCCCCC !important;
}

/* Difficulty level badges */
html[data-theme="dark"] .level-kolay {
  background: #022C1B !important;
  color: #34D399 !important;
}
html[data-theme="dark"] .level-orta {
  background: #1E0F00 !important;
  color: #F99040 !important;
}
html[data-theme="dark"] .level-zor {
  background: #2D0A0A !important;
  color: #F87171 !important;
}
html[data-theme="dark"] .credit-pill {
  background: #261300 !important;
  color: #F4A970 !important;
}

/* Status banners */
html[data-theme="dark"] .status-ok {
  background: #022C1B !important;
  border-color: #10B981 !important;
  color: #34D399 !important;
}
html[data-theme="dark"] .status-fail {
  background: #2D0A0A !important;
  border-color: #F87171 !important;
  color: #FCA5A5 !important;
}

/* PayTR iframe wrapper */
html[data-theme="dark"] #paytr-wrapper {
  background: #242424 !important;
  box-shadow: 0 4px 32px rgba(0,0,0,.5) !important;
}
html[data-theme="dark"] .iframe-header {
  background: #1E1E1E !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .iframe-header span { color: #CCCCCC !important; }
html[data-theme="dark"] .close-iframe { color: #9CA3AF !important; }

/* Legacy names kept for backwards compat */
html[data-theme="dark"] .pricing-card {
  background: #242424 !important;
  border-color: #383838 !important;
}
html[data-theme="dark"] .pricing-card.featured {
  border-color: #F99040 !important;
}
html[data-theme="dark"] .credit-history-item {
  background: #242424 !important;
  border-color: #383838 !important;
}

/* ── 25. DOCUMENT PREVIEW — always stays white (printed doc) ── */
html[data-theme="dark"] .doc-wrap {
  background: white !important;
  color: #111 !important;
}
/* Tüm alt elemanları beyaz arka plan üzerinde okunabilir koyu renge zorla */
html[data-theme="dark"] .doc-wrap * { color: #111 !important; background: transparent !important; }
/* Tablo hücreleri: border ve arka plan orijinal değerlerine dönsün */
html[data-theme="dark"] .doc-wrap table th { background: #f5f5f5 !important; color: #111 !important; border-color: #ccc !important; }
html[data-theme="dark"] .doc-wrap table td { background: transparent !important; color: #111 !important; border-color: #ccc !important; }

/* ── 26. DARK MODE TOGGLE BUTTON ── */
#dark-toggle {
  background: transparent;
  border: 1.5px solid #E2E8F0;
  border-radius: 9px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color .15s, background .15s;
  flex-shrink: 0;
  padding: 0;
  line-height: 1;
}
#dark-toggle:hover { border-color: #F99040; }
html[data-theme="dark"] #dark-toggle {
  border-color: #4A4A4A !important;
  background: #2C2C2C !important;
}
html[data-theme="dark"] #dark-toggle:hover { border-color: #F99040 !important; }

/* ── 27. MOBILE PROGRESS BAR ── */
html[data-theme="dark"] .mobile-progress { background: #242424 !important; }
html[data-theme="dark"] .mobile-step-dot { background: #383838 !important; }
html[data-theme="dark"] .mobile-step-dot.done { background: #10B981 !important; }
html[data-theme="dark"] .mobile-step-dot.current { background: #F99040 !important; }

/* ── 28. NAV AUTH ELEMENTS ── */
html[data-theme="dark"] [data-belgele="credit-badge"] {
  background: #022C1B !important;
  color: #34D399 !important;
  border-color: #065F46 !important;
}
html[data-theme="dark"] [data-belgele="user-info"]    { color: #E8E8E8 !important; }
html[data-theme="dark"] [data-belgele="logout-btn"] {
  background: #2C2C2C !important;
  color: #E8E8E8 !important;
  border-color: #4A4A4A !important;
}

/* ── 29. SCROLLBAR (webkit) ── */
html[data-theme="dark"] ::-webkit-scrollbar { width: 8px; height: 8px; }
html[data-theme="dark"] ::-webkit-scrollbar-track  { background: #181818; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb  { background: #3A3A3A; border-radius: 4px; }
html[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #505050; }