/* ════════════════════════════════════════════════════════════════
   Brand v3 — Global Tailwind/legacy class overrides
   Eski dark theme class'larını yeni cream theme'e map et.
   Tüm sayfalara include edilir (auth, dashboard, admin, page.php)
═══════════════════════════════════════════════════════════════ */

/* Tailwind dark slate text → ink */
.text-slate-100, .text-slate-200, .text-slate-300 { color: var(--ink-mute) !important; }
.text-slate-400 { color: var(--ink-mute) !important; }
.text-slate-500, .text-slate-600 { color: var(--ink-faint) !important; }
.text-white { color: var(--ink) !important; }

/* Slate backgrounds → bone variants */
.bg-slate-800, .bg-slate-900, .bg-slate-700, .bg-bg, .bg-bg2 { background: var(--bg-elev) !important; }
.bg-slate-800\/50, .bg-slate-900\/50, .bg-slate-800\/60 { background: var(--bg-soft) !important; }

/* Border slate → border tokens */
.border-slate-600, .border-slate-700, .border-slate-800 { border-color: var(--border) !important; }
.border-brand-500\/10, .border-brand-500\/15, .border-brand-500\/20, .border-brand-500\/30 { border-color: var(--border) !important; }

/* Brand color buttons → coral */
.bg-brand-500, .bg-brand-600, .bg-brand-700 {
    background: var(--ink) !important;
    color: var(--bg) !important;
}
.bg-brand-500:hover, .bg-brand-600:hover, .bg-brand-700:hover { background: var(--accent) !important; color: #fff !important; }

.from-brand-500, .from-brand-400, .from-brand-600 { --tw-gradient-from: var(--ink) !important; }
.to-brand-600, .to-brand-700, .to-brand-500 { --tw-gradient-to: var(--accent) !important; }

.text-brand-300, .text-brand-400, .text-brand-500, .text-brand-600 { color: var(--accent) !important; }

/* Gradient text */
.grad-text, .gradient-text {
    background: none !important;
    -webkit-text-fill-color: var(--accent) !important;
    color: var(--accent) !important;
    font-family: var(--font-serif);
    font-style: italic;
    font-weight: 500;
}

/* Selection */
::selection { background: var(--accent); color: var(--bg); }

/* Common headings: serif */
h1, h2, h3 { font-family: var(--font-serif); color: var(--ink); letter-spacing: -0.02em; }
h1 { font-weight: 800; }
h2 { font-weight: 700; }
h3 { font-weight: 600; }

/* Glass override (was dark) */
.glass { background: var(--bg-elev) !important; border: 1px solid var(--border) !important; backdrop-filter: blur(12px); }

/* Glow → soft shadow */
.glow { box-shadow: var(--sh-3) !important; }

/* Buttons */
.btn-primary {
    background: var(--ink) !important;
    color: var(--bg) !important;
    border-radius: 12px !important;
    font-family: var(--font-sans) !important;
    font-weight: 600 !important;
}
.btn-primary:hover { background: var(--accent) !important; color: #fff !important; box-shadow: var(--sh-accent) !important; transform: translateY(-2px); }

.btn-ghost {
    background: transparent !important;
    color: var(--ink) !important;
    border: 1px solid var(--border-strong) !important;
}
.btn-ghost:hover { border-color: var(--ink) !important; background: var(--bg-elev) !important; }

/* Form inputs */
input[type="text"], input[type="email"], input[type="password"], input[type="tel"], input[type="url"], textarea, select {
    background: var(--bg-soft);
    color: var(--ink);
    border-color: var(--border);
}
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus,
input[type="tel"]:focus, input[type="url"]:focus, textarea:focus, select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
    background: var(--bg-elev);
}
input::placeholder, textarea::placeholder { color: var(--ink-faint); }

/* Body bg default override */
body { background: var(--bg); color: var(--ink); font-family: var(--font-sans); }

/* Mobile-friendly header on auth/dashboard */
header.fixed, header.sticky { background: rgba(244,239,230,.85) !important; backdrop-filter: blur(14px); border-bottom: 1px solid var(--border) !important; }

/* Footer (legacy) override */
footer.bg-bg2\/50, footer { background: var(--ink) !important; color: rgba(244,239,230,.7) !important; }
footer h4 { color: var(--bg) !important; }
footer a { color: rgba(244,239,230,.6) !important; }
footer a:hover { color: var(--bg) !important; }

/* Inline grid-bg */
.grid-bg { background-image: linear-gradient(var(--border) 1px, transparent 1px), linear-gradient(90deg, var(--border) 1px, transparent 1px) !important; opacity: .4; }

/* Tailwind purple/violet → terracotta (Brand v3) */
.bg-purple-500, .bg-purple-600, .bg-purple-700 { background-color: var(--accent) !important; color: #fff !important; }
.bg-purple-500\/10, .bg-purple-500\/15, .bg-purple-500\/20, .bg-purple-500\/30 { background-color: var(--accent-soft) !important; }
.text-purple-300, .text-purple-400, .text-purple-500, .text-purple-600 { color: var(--accent) !important; }
.border-purple-500, .border-purple-500\/30, .border-purple-500\/40, .border-purple-500\/50 { border-color: var(--accent) !important; }
.ring-purple-500\/50 { --tw-ring-color: var(--accent-soft) !important; }
.from-purple-500, .from-purple-600 { --tw-gradient-from: var(--accent) !important; }
.to-purple-500, .to-purple-600, .to-pink-500 { --tw-gradient-to: var(--accent-hover) !important; }
.from-pink-500 { --tw-gradient-from: var(--accent) !important; }

/* Emerald (yeşil success) → teal Brand v3 */
.text-emerald-300, .text-emerald-400, .text-emerald-500, .text-emerald-600 { color: var(--teal) !important; }
.bg-emerald-500, .bg-emerald-600 { background-color: var(--teal) !important; color: #fff !important; }
.bg-emerald-500\/10, .bg-emerald-500\/15, .bg-emerald-500\/20 { background-color: var(--teal-soft) !important; }
.from-emerald-500, .from-emerald-600 { --tw-gradient-from: var(--teal) !important; }
.to-emerald-500, .to-emerald-600, .to-emerald-700 { --tw-gradient-to: var(--teal) !important; }
.border-emerald-500, .border-emerald-500\/30, .border-emerald-500\/40 { border-color: var(--teal) !important; }

/* Amber (gold) → saffron */
.text-amber-300, .text-amber-400, .text-amber-500, .text-amber-600 { color: var(--gold) !important; }
.bg-amber-500\/10, .bg-amber-500\/15, .bg-amber-500\/20 { background-color: var(--gold-soft) !important; }

/* Rose / red — keep semantic (danger) but soften */
.text-rose-300, .text-rose-400 { color: #DC2626 !important; }
.bg-rose-500\/10, .bg-rose-500\/15, .bg-rose-500\/20 { background-color: rgba(220,38,38,0.1) !important; }

/* ────── Brand v3 utility classes ────── */
.text-ink { color: var(--ink) !important; }
.text-ink-mute { color: var(--ink-mute) !important; }
.text-ink-faint { color: var(--ink-faint) !important; }
.text-accent { color: var(--accent) !important; }
.text-teal { color: var(--teal) !important; }
.text-gold { color: var(--gold) !important; }
.bg-bg { background: var(--bg) !important; }
.bg-bg-soft { background: var(--bg-soft) !important; }
.bg-bg-elev { background: var(--bg-elev) !important; }
.bg-accent { background: var(--accent) !important; color: #fff !important; }
.bg-accent-soft { background: var(--accent-soft) !important; }
.bg-teal { background: var(--teal) !important; color: #fff !important; }
.bg-teal-soft { background: var(--teal-soft) !important; }
.bg-gold-soft { background: var(--gold-soft) !important; }
.border-brand { border-color: var(--border) !important; }
.border-accent { border-color: var(--accent) !important; }
.border-teal { border-color: var(--teal) !important; }
.placeholder-ink-faint::placeholder { color: var(--ink-faint) !important; }
.hover\:bg-bg-soft:hover { background: var(--bg-soft) !important; }
.hover\:bg-bg-elev:hover { background: var(--bg-elev) !important; }
.hover\:text-accent:hover { color: var(--accent) !important; }
.hover\:border-accent:hover { border-color: var(--accent) !important; }
.from-accent { --tw-gradient-from: var(--accent) !important; }
.to-accent-hover { --tw-gradient-to: var(--accent-hover) !important; }
.via-accent { --tw-gradient-via: var(--accent) !important; }
.from-ink { --tw-gradient-from: var(--ink) !important; }
.to-accent { --tw-gradient-to: var(--accent) !important; }