/* ============================================================
   BEP Hazırla — Turkuaz / Amber koyu tema katmanı
   Yalnızca [data-theme="dark"] altında çalışır; açık temayı bozmaz.
   Sıra: style.css → theme-pro.css → ui.css → theme-turkuaz.css
   ============================================================ */

:root{
  --tk-bg:#0B0F1B;
  --tk-surface:#111827;
  --tk-border:#303B56;
  --tk-primary:#2DD4BF;
  --tk-primary-hover:#5EEAD4;
  --tk-amber:#F59E0B;
  --tk-text:#F8FAFC;
  --tk-muted:#AEB8CC;
  --tk-radius-card:24px;
  --tk-radius-btn:18px;
}

/* ---------- tokenlar ---------- */
[data-theme="dark"]{
  --primary:#2DD4BF;
  --primary-hover:#5EEAD4;
  --primary-glow:rgba(45,212,191,.22);
  --secondary:#2DD4BF;
  --secondary-hover:#5EEAD4;
  --accent:#F59E0B;

  --background:#0B0F1B;
  --background-secondary:#0D1322;
  --surface:#111827;
  --surface-hover:#161F33;
  --surface-elevated:#182137;

  --text:#F8FAFC;
  --text-secondary:#D5DEEE;
  --text-muted:#AEB8CC;

  --border:rgba(48,59,86,.72);
  --border-hover:rgba(45,212,191,.38);
  --border-active:rgba(45,212,191,.62);

  --radius:16px;
  --radius-sm:12px;
  --radius-lg:var(--tk-radius-card);

  --shadow-glow:0 0 44px rgba(45,212,191,.16);
  --shadow-btn:0 6px 18px rgba(45,212,191,.26);

  --gradient-primary:linear-gradient(135deg,#2DD4BF 0%,#14B8A6 55%,#0D9488 100%);
  --gradient-secondary:linear-gradient(135deg,#2DD4BF,#5EEAD4);
  --gradient-surface:linear-gradient(160deg,rgba(17,24,39,.95),rgba(13,19,34,.95));
  --gradient-bg:none;

  --hero-gradient:linear-gradient(180deg,#0B0F1B 0%,#0C1424 60%,#0B0F1B 100%);
  --hero-accent:#2DD4BF;
  --hero-accent-end:#5EEAD4;
}

/* ---------- zemin: gradient + ışık + ince grid ---------- */
[data-theme="dark"] body{
  background-color:var(--tk-bg);
  background-image:
    radial-gradient(760px 420px at 78% -6%, rgba(45,212,191,.16), transparent 62%),
    radial-gradient(620px 380px at 8% 4%, rgba(245,158,11,.08), transparent 60%),
    linear-gradient(180deg,#0B0F1B 0%,#0A1420 45%,#0B0F1B 100%);
  background-attachment:fixed;
  color:var(--tk-text);
}
[data-theme="dark"] body:before{
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(48,59,86,.28) 1px, transparent 1px),
    linear-gradient(90deg, rgba(48,59,86,.28) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(1200px 700px at 50% 0%, rgba(0,0,0,.9), transparent 78%);
  -webkit-mask-image:radial-gradient(1200px 700px at 50% 0%, rgba(0,0,0,.9), transparent 78%);
}
[data-theme="dark"] #app,
[data-theme="dark"] .landing-page,
[data-theme="dark"] .landing-main{position:relative; z-index:1; background:transparent}

/* ---------- tipografi ---------- */
[data-theme="dark"] .hero-title{
  color:var(--tk-text);
  font-weight:800;
  letter-spacing:-.035em;
  line-height:1.06;
  font-size:clamp(34px,5vw,60px);
}
[data-theme="dark"] .hero-subtitle{color:var(--tk-muted); font-size:clamp(15px,1.5vw,18px); line-height:1.65}

/* turkuaz kelime + arkasında yarı saydam amber blok */
.tk-accent{
  position:relative;
  color:var(--tk-primary);
  display:inline;
  padding:1px 8px;
  margin:0 -4px;
  border-radius:5px;
  background-image:linear-gradient(180deg,
    rgba(245,158,11,0) 46%,
    rgba(245,158,11,.30) 46%,
    rgba(245,158,11,.30) 94%,
    rgba(245,158,11,0) 94%);
  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}
html[data-theme="dark"] .tk-accent{color:var(--tk-primary) !important;-webkit-text-fill-color:var(--tk-primary) !important}

/* ---------- butonlar ---------- */
[data-theme="dark"] .btn-primary,
[data-theme="dark"] .landing-btn-primary{
  background:linear-gradient(180deg,#2DD4BF 0%,#14B8A6 100%);
  color:#04211D;
  border:1px solid rgba(45,212,191,.55);
  border-radius:var(--tk-radius-btn);
  font-weight:800;
  box-shadow:0 1px 0 rgba(255,255,255,.28) inset, 0 8px 22px -8px rgba(45,212,191,.55);
}
[data-theme="dark"] .btn-primary:hover,
[data-theme="dark"] .landing-btn-primary:hover{
  background:linear-gradient(180deg,#5EEAD4 0%,#2DD4BF 100%);
  color:#04211D;
  transform:translateY(-1px);
}
[data-theme="dark"] .btn-outline,
[data-theme="dark"] .landing-btn-ghost,
[data-theme="dark"] .hero-cta-secondary{
  background:var(--tk-surface);
  color:var(--tk-text);
  border:1px solid var(--tk-border);
  border-radius:var(--tk-radius-btn);
  font-weight:700;
}
[data-theme="dark"] .btn-outline:hover,
[data-theme="dark"] .hero-cta-secondary:hover{
  background:#161F33;
  border-color:rgba(45,212,191,.45);
  color:var(--tk-text);
}
[data-theme="dark"] .btn-lg{border-radius:var(--tk-radius-btn)}

/* ---------- hero rozet + güven listesi ---------- */
[data-theme="dark"] .hero-badge{
  background:rgba(17,24,39,.9);
  color:#CFE9E4;
  border:1px solid var(--tk-border);
  border-radius:999px;
  box-shadow:0 0 0 1px rgba(45,212,191,.06), 0 10px 30px -22px rgba(45,212,191,.8);
  font-weight:700;
}
[data-theme="dark"] .hero-badge-icon{color:var(--tk-primary)}
[data-theme="dark"] .hero-trust-list{color:var(--tk-muted)}
[data-theme="dark"] .hero-trust-check{color:var(--tk-primary)}

/* ---------- kartlar ---------- */
[data-theme="dark"] .card,
[data-theme="dark"] .feature-card,
[data-theme="dark"] .step-card,
[data-theme="dark"] .landing-cta,
[data-theme="dark"] .hp-window{
  background:var(--tk-surface);
  border:1px solid var(--tk-border);
  border-radius:var(--tk-radius-card);
  box-shadow:0 18px 44px -30px rgba(0,0,0,.9);
}
[data-theme="dark"] .feature-card:hover,
[data-theme="dark"] .step-card:hover{
  border-color:rgba(45,212,191,.42);
  box-shadow:0 22px 50px -32px rgba(45,212,191,.55);
  transform:translateY(-2px);
}

/* ---------- adım göstergeleri: amber ---------- */
[data-theme="dark"] .step-num,
[data-theme="dark"] .hp-steps .done,
[data-theme="dark"] .hp-steps span{
  background:rgba(245,158,11,.14);
  color:var(--tk-amber);
  border:1px solid rgba(245,158,11,.35);
  border-radius:10px;
  font-weight:800;
}
[data-theme="dark"] .badge-primary{
  background:rgba(45,212,191,.14);
  color:var(--tk-primary);
  border:1px solid rgba(45,212,191,.32);
  border-radius:999px;
}
[data-theme="dark"] .badge-success{
  background:rgba(245,158,11,.14);
  color:var(--tk-amber);
  border:1px solid rgba(245,158,11,.34);
  border-radius:999px;
}

/* ---------- ürün penceresi ---------- */
[data-theme="dark"] .hp-window{overflow:hidden; backdrop-filter:blur(6px)}
[data-theme="dark"] .hp-head,
[data-theme="dark"] .hp-foot{border-color:var(--tk-border); background:rgba(13,19,34,.75)}
[data-theme="dark"] .hp-goal{background:#0E1626; border:1px solid rgba(48,59,86,.7); color:#E6EDF7}
[data-theme="dark"] .hp-chip{background:rgba(45,212,191,.12); color:#8FF0E2; border:1px solid rgba(45,212,191,.28)}
[data-theme="dark"] .hp-badge-live{background:rgba(245,158,11,.16); color:var(--tk-amber); border:1px solid rgba(245,158,11,.35)}

/* ---------- nav ---------- */
[data-theme="dark"] .landing-header{
  background:rgba(11,15,27,.78);
  border-bottom:1px solid rgba(48,59,86,.55);
  backdrop-filter:blur(14px);
}
[data-theme="dark"] .landing-nav-link{color:#C9D4E6}
[data-theme="dark"] .landing-nav-link:hover{color:var(--tk-primary)}
[data-theme="dark"] .landing-brand-badge{
  background:rgba(45,212,191,.12); color:var(--tk-primary); border:1px solid rgba(45,212,191,.3);
}

/* ---------- dashboard / panel yüzeyleri ---------- */
[data-theme="dark"] .sidebar,
[data-theme="dark"] .topbar,
[data-theme="dark"] .panel-card,
[data-theme="dark"] .stat-card{
  background:var(--tk-surface);
  border-color:var(--tk-border);
}
[data-theme="dark"] .sidebar a.active,
[data-theme="dark"] .nav-item.active{
  background:rgba(45,212,191,.12);
  color:var(--tk-primary);
  border-left-color:var(--tk-primary);
}
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea{
  background:#0E1626;
  border:1px solid var(--tk-border);
  color:var(--tk-text);
  border-radius:12px;
}
[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus{
  border-color:rgba(45,212,191,.55);
  box-shadow:0 0 0 3px rgba(45,212,191,.14);
}

/* ---------- mobil ---------- */
@media (max-width:760px){
  .tk-accent{white-space:normal}
  [data-theme="dark"] .hero-title{font-size:clamp(30px,8.4vw,40px)}
  [data-theme="dark"] .hero-subtitle{font-size:15px}
  [data-theme="dark"] .btn-primary,[data-theme="dark"] .btn-outline{border-radius:16px}
}

/* ============================================================
   SON SÖZ — theme-pro.css / ui.css içindeki !important kurallarını ezer
   ============================================================ */
html[data-theme="dark"]{
  --primary:#2DD4BF !important;
  --primary-hover:#5EEAD4 !important;
  --secondary:#2DD4BF !important;
  --background:#0B0F1B !important;
  --bg:#0B0F1B !important;
  --surface:#111827 !important;
  --surface-hover:#161F33 !important;
  --text:#F8FAFC !important;
  --text-secondary:#D5DEEE !important;
  --text-muted:#AEB8CC !important;
}
html[data-theme="dark"] body{
  background-color:#0B0F1B !important;
  background-image:
    radial-gradient(760px 420px at 78% -6%, rgba(45,212,191,.16), transparent 62%),
    radial-gradient(620px 380px at 8% 4%, rgba(245,158,11,.08), transparent 60%),
    linear-gradient(180deg,#0B0F1B 0%,#0A1420 45%,#0B0F1B 100%) !important;
  color:#F8FAFC !important;
}
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] .landing-btn-primary,
html[data-theme="dark"] .hero-cta-primary{
  background-image:linear-gradient(180deg,#2DD4BF 0%,#14B8A6 100%) !important;
  background-color:#14B8A6 !important;
  color:#04211D !important;
  border:1px solid rgba(45,212,191,.55) !important;
  border-radius:18px !important;
  font-weight:800 !important;
  box-shadow:0 1px 0 rgba(255,255,255,.28) inset, 0 10px 26px -10px rgba(45,212,191,.55) !important;
}
html[data-theme="dark"] .btn-primary:hover,
html[data-theme="dark"] .landing-btn-primary:hover,
html[data-theme="dark"] .hero-cta-primary:hover{
  background-image:linear-gradient(180deg,#5EEAD4 0%,#2DD4BF 100%) !important;
  color:#04211D !important;
}
html[data-theme="dark"] .btn-outline,
html[data-theme="dark"] .landing-btn-ghost,
html[data-theme="dark"] .hero-cta-secondary{
  background:#111827 !important;
  color:#F8FAFC !important;
  border:1px solid #303B56 !important;
  border-radius:18px !important;
  font-weight:700 !important;
}
html[data-theme="dark"] .btn-outline:hover,
html[data-theme="dark"] .hero-cta-secondary:hover{
  background:#161F33 !important;
  border-color:rgba(45,212,191,.45) !important;
  color:#F8FAFC !important;
}
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .step-card,
html[data-theme="dark"] .landing-cta,
html[data-theme="dark"] .hp-window,
html[data-theme="dark"] .panel-card,
html[data-theme="dark"] .stat-card{
  background:#111827 !important;
  border:1px solid #303B56 !important;
  border-radius:24px !important;
  box-shadow:0 18px 44px -30px rgba(0,0,0,.9) !important;
}
html[data-theme="dark"] .hero-title{color:#F8FAFC !important}
html[data-theme="dark"] .hero-subtitle{color:#AEB8CC !important}
html[data-theme="dark"] .step-num{
  background:rgba(245,158,11,.14) !important;
  color:#F59E0B !important;
  border:1px solid rgba(245,158,11,.35) !important;
  border-radius:10px !important;
}
html[data-theme="dark"] .landing-header{
  background:rgba(11,15,27,.82) !important;
  border-bottom:1px solid rgba(48,59,86,.55) !important;
}

/* ui.css :not(...) kurallarını geçmek için özgüllük yükseltildi */
html[data-theme="dark"] body .btn.btn-primary,
html[data-theme="dark"] body .btn.btn.landing-btn-primary,
html[data-theme="dark"] body .btn.btn.hero-cta-primary{
  background-image:linear-gradient(180deg,#2DD4BF 0%,#14B8A6 100%) !important;
  background-color:#14B8A6 !important;
  color:#04211D !important;
  border:1px solid rgba(45,212,191,.55) !important;
  border-radius:18px !important;
  font-weight:800 !important;
  box-shadow:0 1px 0 rgba(255,255,255,.28) inset, 0 10px 26px -10px rgba(45,212,191,.55) !important;
}
html[data-theme="dark"] body .btn.btn-primary:hover,
html[data-theme="dark"] body .btn.btn.landing-btn-primary:hover,
html[data-theme="dark"] body .btn.btn.hero-cta-primary:hover{
  background-image:linear-gradient(180deg,#5EEAD4 0%,#2DD4BF 100%) !important;
  color:#04211D !important;
}
html[data-theme="dark"] body .btn.btn-outline,
html[data-theme="dark"] body .btn.btn.landing-btn-ghost,
html[data-theme="dark"] body .btn.btn.hero-cta-secondary{
  background:#111827 !important;
  color:#F8FAFC !important;
  border:1px solid #303B56 !important;
  border-radius:18px !important;
  font-weight:700 !important;
}
html[data-theme="dark"] body .btn.btn-lg{border-radius:18px !important}

/* ---------- auth / genel birincil buton (bh-btn-primary) ---------- */
html[data-theme="dark"] body .bh-btn-primary,
html[data-theme="dark"] body button.bh-btn-primary,
html[data-theme="dark"] body .bh-auth-sub .bh-btn-primary{
  background-image:linear-gradient(180deg,#2DD4BF 0%,#14B8A6 100%) !important;
  background-color:#14B8A6 !important;
  color:#04211D !important;
  border:1px solid rgba(45,212,191,.55) !important;
  border-radius:18px !important;
  font-weight:800 !important;
  box-shadow:0 10px 24px -14px rgba(20,184,166,.6) !important;
}
html[data-theme="dark"] body .bh-btn-primary:hover{background-image:linear-gradient(180deg,#5EEAD4 0%,#2DD4BF 100%) !important}

/* ---------- logo / marka (koyu) ---------- */
html[data-theme="dark"] .landing-brand{
  color:#F8FAFC !important;
  font-weight:800 !important;
  letter-spacing:-.01em;
}
html[data-theme="dark"] .landing-brand svg,
html[data-theme="dark"] .landing-brand svg *{
  color:#2DD4BF !important;
  stroke:#2DD4BF !important;
  fill:none !important;
}
html[data-theme="dark"] .landing-brand-badge{
  background:rgba(45,212,191,.10) !important;
  color:#7FF0E2 !important;
  border:1px solid rgba(45,212,191,.32) !important;
  border-radius:999px !important;
  font-weight:700 !important;
}
/* vurgu bandı koyu zeminde daha yumuşak */
html[data-theme="dark"] .tk-accent{
  color:#5EEAD4 !important;
  -webkit-text-fill-color:#5EEAD4 !important;
  background-image:linear-gradient(180deg,
    rgba(245,158,11,0) 50%,
    rgba(245,158,11,.16) 50%,
    rgba(245,158,11,.16) 95%,
    rgba(245,158,11,0) 95%) !important;
}
/* ---------- "Hemen Başlayın" CTA bölümü (koyu) ---------- */
html[data-theme="dark"] .bh-cta-card{
  background:
    radial-gradient(680px 320px at 12% 0%, rgba(45,212,191,.16), transparent 62%),
    linear-gradient(160deg,#111827 0%,#0D1526 100%) !important;
  border:1px solid #303B56 !important;
  border-radius:24px !important;
  box-shadow:0 30px 70px -50px rgba(45,212,191,.55) !important;
}
html[data-theme="dark"] .bh-cta-eyebrow{
  background:rgba(245,158,11,.14) !important;
  color:#F59E0B !important;
  border:1px solid rgba(245,158,11,.35) !important;
  border-radius:999px !important;
  font-weight:800 !important;
  letter-spacing:.06em;
}
html[data-theme="dark"] .bh-cta h2,
html[data-theme="dark"] #cta-heading{color:#F8FAFC !important}
html[data-theme="dark"] .bh-cta p{color:#AEB8CC !important}
html[data-theme="dark"] .bh-cta .bh-cta-hint{color:#8FA0BB !important}
html[data-theme="dark"] .bh-cta-btn-primary{
  background:linear-gradient(180deg,#2DD4BF 0%,#14B8A6 100%) !important;
  color:#04211D !important;
  border:1px solid rgba(45,212,191,.55) !important;
  border-radius:18px !important;
  font-weight:800 !important;
  box-shadow:0 12px 28px -14px rgba(45,212,191,.6) !important;
}
html[data-theme="dark"] .bh-cta-btn-primary *{color:#04211D !important; -webkit-text-fill-color:#04211D !important}
html[data-theme="dark"] .bh-cta-btn-ghost{
  background:#0E1626 !important;
  color:#F8FAFC !important;
  border:1px solid #303B56 !important;
  border-radius:18px !important;
}
html[data-theme="dark"] .bh-cta-btn-ghost:hover{background:#161F33 !important; border-color:rgba(45,212,191,.45) !important}
html[data-theme="dark"] .bh-cta-btn-ghost *{color:#F8FAFC !important}

/* CTA bölümündeki eski mavi bandı kaldır */
html[data-theme="dark"] .bh-cta{background:none !important;background-image:none !important}

/* hero zeminindeki eski/çapraz gradyanları kaldır — zemin tek yerden (body) gelir */
.hero-section{background:none !important}
.hero-section:before,.hero-section:after{display:none !important}
.hero-visual,.hero-product{background:transparent !important}

html[data-theme="dark"] .hero-section{background:none !important;background-image:none !important;border:none !important}
