/* =====================================================================
   DCBOT — ORTAK BİLEŞENLER (tokens.css'e dayanır; style.css'ten SONRA yüklenir)
   buton · kart · input · toggle · toast · iskelet · reveal · spotlight
   ===================================================================== */
html { scroll-behavior: smooth; }
body { background: var(--c-bg); color: var(--c-body); font-family: var(--f-body); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
h1, h2, h3, h4, .brand-word { font-family: var(--f-head); letter-spacing: var(--track-head); color: var(--c-text); font-weight: 600; }
::selection { background: rgba(250,204,21,.3); color: #fff; }
a { color: var(--c-accent); }
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #262626; border-radius: 8px; border: 2px solid var(--c-bg); }
::-webkit-scrollbar-thumb:hover { background: #333; }
html { scrollbar-color: #262626 transparent; }

/* ---------- Butonlar ---------- */
.btn { border-radius: var(--r-btn); font-weight: 600; font-size: 14.5px; letter-spacing: 0; min-height: 40px; transition: border-color var(--t-base) var(--ease), background var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease), transform var(--t-fast) var(--ease), color var(--t-base) var(--ease); }
.btn:active { transform: scale(0.97); }
.btn-primary {
  color: #0B0B0C; font-weight: 600; border: 1px solid var(--c-accent-fill); background: var(--c-accent-fill); box-shadow: none;
}
.btn-primary:hover { background: #CA9A06; border-color: #CA9A06; transform: none; }
.btn-primary:active { background: #A87F05; }
.btn-primary:disabled, .btn-primary[disabled] { opacity: .45; cursor: not-allowed; }
.btn-primary svg { position: relative; z-index: 1; }
.btn-secondary { background: transparent; color: var(--c-text); border: 1px solid var(--c-line-strong); }
.btn-secondary:hover { background: var(--c-accent-soft); border-color: var(--c-line-hover); color: var(--c-text); }
.btn-danger { border-radius: var(--r-btn); }
.btn.small { min-height: 34px; }

/* ---------- Kartlar ---------- */
.card, .feature-window, .feature-fields-box { background: var(--c-card); border: 1px solid var(--c-line); border-radius: var(--r-card); box-shadow: none; transition: border-color var(--t-base) var(--ease); }
.card:hover, .feature-window:hover { border-color: var(--c-line-hover); }
.feature-window { background: var(--c-card); }

/* ---------- Form alanları ---------- */
.card input[type="text"], .card input[type="number"], .card input[type="password"], .card textarea, .card select,
.feature-window input[type="text"], .feature-window input[type="number"], .feature-window textarea, .feature-window select,
.feature-fields-box input[type="text"], .feature-fields-box input[type="number"], .feature-fields-box textarea, .feature-fields-box select {
  background: var(--c-surface); border: 1px solid var(--c-line-strong); border-radius: var(--r-btn); color: var(--c-text); min-height: 40px;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.card input:focus, .card textarea:focus, .card select:focus, .feature-window input:focus, .feature-window textarea:focus, .feature-window select:focus,
.feature-fields-box input:focus, .feature-fields-box textarea:focus, .feature-fields-box select:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(250,204,21,.14); outline: none; background: var(--c-surface); }
::placeholder { color: #6B6B74; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--c-accent); }

/* ---------- Toggle (switch) ---------- */
.switch { width: 44px; height: 24px; }
.switch-slider { background: #1A1A1A; border: 1px solid var(--c-line-strong); border-radius: var(--r-pill); transition: background var(--t-base) var(--ease), border-color var(--t-base) var(--ease), box-shadow var(--t-base) var(--ease); }
.switch-slider::before { width: 16px; height: 16px; left: 3px; bottom: 3px; background: #8A8A94; transition: transform var(--t-base) var(--ease), background var(--t-base) var(--ease); }
.switch input:checked + .switch-slider { background: rgba(250,204,21,.22); border-color: var(--c-accent);  }
.switch input:checked + .switch-slider::before { transform: translateX(20px); background: var(--c-accent); }
.switch input:focus-visible + .switch-slider { outline: 2px solid var(--c-accent); outline-offset: 2px; }

/* ---------- Toast ---------- */
.dcbot-toasts { position: fixed; right: 20px; bottom: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 10px; pointer-events: none; max-width: calc(100vw - 32px); }
.dcbot-toast { pointer-events: auto; display: flex; align-items: center; gap: 12px; min-width: 240px; max-width: 380px; padding: 12px 16px; border-radius: var(--r-btn); background: #0F0F0F; border: 1px solid var(--c-line-hover); color: var(--c-text); font-size: 14px; box-shadow: 0 12px 32px rgba(0,0,0,.6), 0 0 24px rgba(250,204,21,.08); animation: dcbot-toast-in var(--t-slow) var(--ease) both; }
.dcbot-toast.error { border-color: rgba(240,82,92,.5); }
.dcbot-toast-ico { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--c-accent-soft); color: var(--c-accent); font-size: 13px; font-weight: 800; }
.dcbot-toast.error .dcbot-toast-ico { background: rgba(240,82,92,.14); color: var(--c-danger); }
.dcbot-toast.out { animation: dcbot-toast-out var(--t-base) var(--ease) both; }
@keyframes dcbot-toast-in { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes dcbot-toast-out { to { opacity: 0; transform: translateY(8px); } }
@media (max-width: 480px) { .dcbot-toasts { left: 16px; right: 16px; bottom: 16px; } .dcbot-toast { max-width: none; } }

/* ---------- İskelet (yükleniyor) & boş durum ---------- */
.skeleton { position: relative; overflow: hidden; background: #141414; border-radius: var(--r-btn); min-height: 16px; }
.skeleton::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%); background: linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent); animation: dcbot-shimmer 1.4s infinite; }
@keyframes dcbot-shimmer { to { transform: translateX(100%); } }
.empty-state { text-align: center; padding: 32px 16px; color: var(--c-muted); border: 1px dashed var(--c-line-strong); border-radius: var(--r-card); }

/* ---------- Scroll reveal (IntersectionObserver ile .in eklenir) ---------- */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity var(--t-slow) var(--ease), transform var(--t-slow) var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
.reveal.in { opacity: 1; transform: none; }
.no-js .reveal { opacity: 1; transform: none; }

/* ---------- Fareyi izleyen spotlight (kartlar) ---------- */
.spot { position: relative; isolation: isolate; }
.spot::before { content: ''; position: absolute; inset: 0; border-radius: inherit; z-index: -1; pointer-events: none; opacity: 0; transition: opacity var(--t-base) var(--ease); background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(250,204,21,.10), transparent 60%); }
.spot:hover::before { opacity: 1; }

/* ---------- Dokunmatik / hareket tercihleri ---------- */
@media (hover: none) { .spot::before { display: none; } .btn-primary:hover { transform: none; } .card:hover, .feature-window:hover { border-color: var(--c-line); } }
@media (pointer: coarse) { .btn, .module-nav-item, .lang-btn { min-height: var(--tap); } }
/* Animasyonlar herkeste her zaman oynatılsın: prefers-reduced-motion kısıtlaması kaldırıldı. */

/* Düz kurumsal ana buton (style.css'teki eski gradient'i ezer) */
.btn.btn-primary { background: var(--c-accent-fill); border: 1px solid var(--c-accent-fill); box-shadow: none; color: #0B0B0C; text-shadow: none; }
.btn.btn-primary:hover { background: #CA9A06; border-color: #CA9A06; box-shadow: none; transform: none; }
.btn.btn-primary::after { display: none; }

.consent-note { display: block; margin-top: 6px; color: var(--c-text); font-size: .8125rem; line-height: 1.45; }
.consent-note b { color: var(--c-accent); font-weight: 600; }