/* ==================================================
   FORCE LIGHT + VIVID (Blue / Violet / Coral-Red)
   - Dark mode olsa bile light görünür
   - Pembe minimum
   - Background beyaza yakın, canlı
   ================================================== */

/* 1) Temayı light'a zorla (form elemanları vb.) */
:root{ color-scheme: light; }

/* 2) Değişkenler: her durumda (dark/light) aynı kalsın */
:root{
    --bg: #f6f8ff;
    --panel: rgba(255,255,255,.86);
    --panel-2: rgba(255,255,255,.96);
    --text: rgba(13,18,28,.92);
    --muted: rgba(13,18,28,.62);
    --border: rgba(13,18,28,.10);

    --blue: #1f7aff;
    --violet: #6d5cff;
    --red: #ff3b5c;

    --primary: var(--blue);
    --primary-2: var(--violet);

    --shadow: 0 12px 30px rgba(13,18,28,.10);
    --shadow-2: 0 18px 55px rgba(31,122,255,.12);
    --ring: rgba(31,122,255,.25);
}

/* Dark mode'da da light görünmesi için birebir override */
@media (prefers-color-scheme: dark){
    :root{
        --bg: #f6f8ff;
        --panel: rgba(255,255,255,.86);
        --panel-2: rgba(255,255,255,.96);
        --text: rgba(13,18,28,.92);
        --muted: rgba(13,18,28,.62);
        --border: rgba(13,18,28,.10);

        --primary: var(--blue);
        --primary-2: var(--violet);

        --shadow: 0 12px 30px rgba(13,18,28,.10);
        --shadow-2: 0 18px 55px rgba(31,122,255,.12);
        --ring: rgba(31,122,255,.25);
    }
}

/* 3) Background: beyaza yakın + canlı ama gözü yormayan */
body{
    background:
            radial-gradient(900px 600px at 12% 18%, rgba(31,122,255,.18), transparent 62%),
            radial-gradient(850px 650px at 88% 20%, rgba(109,92,255,.14), transparent 64%),
            radial-gradient(900px 700px at 55% 92%, rgba(255,59,92,.12), transparent 66%),
            linear-gradient(180deg, #ffffff 0%, var(--bg) 60%, #ffffff 100%)!important;
    color: var(--text);
}

/* 4) Header/Footer artık koyu değil */
.site-header,
.footer{
    background: rgba(255,255,255,.90) !important;
    border-color: var(--border) !important;
}

/* 5) Kartlar: beyaz cam gibi */
.card,
.hero__copy,
.hero__card,
.nav,
.faq,
.toc__link,
.mode,
.mini-card,
.step{
    background: var(--panel) !important;
    border: 1px solid var(--border) !important;
    box-shadow: var(--shadow) !important;
}

/* Kartlara “mixed” hissi: sadece üstte ince accent çizgi */
.card{ position: relative; }
.card::before{
    content:"";
    position:absolute;
    left:0; right:0; top:0;
    height: 2px;
    background: linear-gradient(90deg, var(--blue), var(--violet), var(--red));
    opacity: .9;
}

/* 6) Butonlar: canlı ama pembe değil */
.btn:focus{
    outline: 3px solid var(--ring) !important;
    outline-offset: 2px;
}

.btn--primary{
    background: linear-gradient(135deg, var(--blue) 0%, var(--violet) 70%, var(--red) 130%) !important;
    color: #fff !important;
    box-shadow: var(--shadow-2) !important;
}

.btn--ghost{
    background: rgba(255,255,255,.78) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

.btn--soft{
    background: rgba(31,122,255,.10) !important;
    border-color: rgba(31,122,255,.22) !important;
    color: var(--text) !important;
}

/* 7) Pill/Tag/Callout: pembe kaldır, mavi-violet */
.pill,
.tag,
.callout{
    background: rgba(31,122,255,.08) !important;
    border-color: rgba(31,122,255,.18) !important;
    color: var(--muted) !important;
}
.callout{ border-left: 3px solid rgba(109,92,255,.45) !important; }

/* 8) Tablo başlığı daha temiz */
.table thead th{
    background: rgba(13,18,28,.04) !important;
    color: rgba(13,18,28,.65) !important;
}

/* 9) Badge uyumu (pembe yerine coral-red) */
.badge--red{ background: var(--red) !important; }
.badge--pink{ background: #ff4fb1 !important; } /* gerekiyorsa; yoksa silebilirsin */
.badge--blue{ background: var(--blue) !important; }
.badge--purple{ background: var(--violet) !important; }

/* 10) Nav hover (light) */
.nav a:hover{
    background: rgba(13,18,28,.04) !important;
    color: var(--text) !important;
}


/* ===============================
   READABILITY FIX (light bg)
   - Soldaki yazılar beyaz kaldıysa bunu ekle
   =============================== */

:root{
    --text: rgba(13,18,28,.92);
    --muted: rgba(13,18,28,.62);
}

/* genel metin rengi */
body{
    color: var(--text) !important;
}

/* kart ve içerikleri */
.card,
.hero__copy,
.hero__card,
.stat,
.faq,
.toc__link,
.mini-card,
.step,
.table-wrap,
.table,
.ranking{
    color: var(--text) !important;
}

/* “muted” metinler */
.hero p,
.footer p,
.ticker__item,
.ranking__score,
.stat__label,
.hero-card__top p,
.step__muted,
.faq__content{
    color: var(--muted) !important;
}

/* tablo yazıları (asıl sorun genelde burası) */
.table thead th{
    color: rgba(13,18,28,.68) !important;
}
.table tbody td{
    color: var(--text) !important;
}
.table tbody tr:hover{
    background: rgba(13,18,28,.03) !important;
}

/* buton/badge renklerini koru */
.btn--primary{ color:#fff !important; }
.badge{ color:#fff !important; }
.badge--cyan{ color:#052a2a !important; } /* senin orijinal davranış */