/* ==================== TEMA RENKLERİ ====================
   Bu dosyadaki genel kurallar renkleri bu değişkenlerden alır. Koyu tema
   (varsayılan) değerleri eski sabit renklerin BİREBİR aynısı — koyu
   görünüm değişmez. Açık temada (:root[data-theme="light"]) marka
   değişkenlerine (_Layout) bağlanır.

   Açık temada başlık/metin/link değeri "currentColor": color özelliğinde
   currentColor = ebeveynden gelen renk, yani bu kurallar rengi ZORLAMAZ;
   metin bulunduğu bileşenin rengini alır (sayfa → --brand-text, buton
   içindeki span → buton yazı rengi, uyarı kutusundaki link → uyarı rengi).
   Koyu temadaki gibi sabit bir renk zorlamak, açık zeminli bileşenlerde
   (kart, uyarı, buton) metni okunmaz yapıyordu. */
:root {
    --site-bg: #222831;              /* 🌑 Ana arka plan */
    --site-fg: #f1f1f1;              /* Açık yazılar */
    --site-heading: #ffffff;         /* tam beyaz başlık */
    --site-text: #dcdcdc;            /* açık gri */
    --site-link: #f1f1f1;
    --site-link-hover: #722323;      /* hover = vurgu rengi */
    --site-card-bg: #3C3D37;
    --site-card-fg: #f1f1f1;
    --site-outline: #f1f1f1;         /* .btn-outline-secondary çerçeve/yazı */
    --site-outline-hover-fg: #222831;
    --site-chrome-bg: #393E46;       /* header / footer / navbar */
    --site-chrome-fg: #f1f1f1;
    --site-navbar-bg: #393E46;
    /* Ana rengin METİN olarak kullanıldığı yerler (bağlantı). Koyu temada
       bordo (#722323) koyu zeminde 1.3–1.6:1 — aynı tonun açığı 5:1+. */
    --brand-primary-text: #E58585;
}

:root[data-theme="light"] {
    --site-bg: var(--brand-surface);
    --site-fg: var(--brand-text);
    --site-heading: currentColor;
    --site-text: currentColor;
    --site-link: currentColor;
    --site-link-hover: var(--brand-primary-dark);
    --site-card-bg: var(--brand-card);
    --site-card-fg: var(--brand-text);
    --site-outline: var(--brand-text);
    --site-outline-hover-fg: var(--brand-card);
    --site-chrome-bg: var(--brand-card);
    --site-chrome-fg: var(--brand-text);
    --site-navbar-bg: var(--navbar-bg);
    --brand-primary-text: var(--brand-primary-dark);
}

html, body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: var(--site-bg);
    color: var(--site-fg);
    font-family: 'Segoe UI', sans-serif;
}

/* Başlıklar */
h1, h2, h3, h4, h5, h6 {
    color: var(--site-heading);
}

/* Paragraflar ve diğer metin */
p, span, li, dt, dd {
    color: var(--site-text);
}

/* Linkler */
a {
    color: var(--site-link);
    text-decoration: none;
}

    a:hover {
        color: var(--site-link-hover);
        text-decoration: underline;
    }

/* Kart tasarımı */
.card {
    background-color: var(--site-card-bg);
    color: var(--site-card-fg);
    border: none;
    border-radius: var(--gw-card-radius, 10px);
    transition: all 0.2s ease-in-out;
}

    .card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
    }

/* Kitap kartı özel */
.book-card {
    border-radius: 10px;
    overflow: hidden;
}

.book-cover {
    height: 250px;
    object-fit: cover;
    border-radius: 10px 10px 0 0;
}

/* Butonlar — .btn-primary / .btn-outline-primary renkleri brand-theme.css'te
   (tüm hâlleriyle, temanın marka değişkenlerinden). */
.btn-outline-secondary {
    border-color: var(--site-outline);
    color: var(--site-outline);
}

    .btn-outline-secondary:hover {
        background-color: var(--site-outline);
        color: var(--site-outline-hover-fg);
    }

/* Header / Footer */
header, footer {
    background-color: var(--site-chrome-bg);
    color: var(--site-chrome-fg);
}

    /* Footer sabitlenmesin */
    footer.footer {
        position: static !important;
        flex-shrink: 0;
        margin-top: auto;
    }

/* Main alanı esnek */
main {
    flex: 1 0 auto;
}

/* Navbar arka planı */
.navbar {
    background-color: var(--site-navbar-bg) !important; /* senin footer/header rengi */
}

    /* Açık temada cam navbar'ın kaydırılmış (daha opak) hali korunur. */
    :root[data-theme="light"] .navbar.navbar-glass.scrolled {
        background-color: var(--navbar-bg-scrolled) !important;
    }

    /* Navbar metin/link renkleri */
    .navbar .nav-link,
    .navbar-brand {
        color: var(--site-chrome-fg) !important;
    }

        .navbar .nav-link:hover,
        .navbar-brand:hover {
            color: #722323 !important; /* hover = vurgu rengi */
        }


/* Rozetler / istatistikler */
.badge {
    font-size: 0.85rem;
}

    .badge.bg-danger {
        background-color: #722323 !important;
    }

    .badge.bg-secondary {
        background-color: #393E46 !important;
    }

    .badge.bg-primary {
        background-color: #3B060A !important;
    }

/* ==================== AÇIK TEMA: KONTRAST (WCAG AA) ====================
   Yalnızca açık temada geçerli — koyu tema değerleri değişmez.
   - Bootstrap 5.1 .text-muted (#6c757d) krem zeminde 4.4:1; temanın soluk
     metin rengi 5:1 (giriş/kayıt sayfalarının koyu tema için yazdığı açık
     gri .text-muted'ı da ezer).
   - Metin bağlantılarında ana rengin koyu tonu (#3D41C4, 7:1): ana renk
     (#5A5EF5) krem zeminde 4.5:1 sınırında, açık gri zeminli uyarıda 3.2:1. */
:root[data-theme="light"] .text-muted {
    color: var(--brand-muted) !important;
}

:root[data-theme="light"] :is(.link-accent, .text-primary) {
    color: var(--brand-primary-dark) !important;
}

/* Footer: koyu temadaki rgba(0,0,0,.3) krem zemini çamurlu bir griye
   çeviriyordu; açık temada yarı saydam beyaz. */
:root[data-theme="light"] footer {
    background: rgba(255, 255, 255, .6);
}

    :root[data-theme="light"] footer a {
        color: var(--brand-primary-dark);
    }

    /* "Tasarım & Geliştirme" satırı satır içi opacity:.7 ile soluk; açık
       temada bu soluklukla okunmuyordu. */
    :root[data-theme="light"] footer p[style] {
        opacity: 1 !important;
    }

/* Navbar ve giriş modalındaki .btn-outline-light koyu navbar için tasarlanmış
   (beyaz yazı); açık temada cam navbar beyaz olduğundan koyu yazı. */
:root[data-theme="light"] .btn-outline-light {
    color: var(--brand-text);
    border-color: var(--brand-border);
}

    :root[data-theme="light"] .btn-outline-light:hover,
    :root[data-theme="light"] .btn-outline-light:focus-visible {
        color: var(--brand-card);
        background-color: var(--brand-text);
        border-color: var(--brand-text);
    }

/* ==================== KOYU TEMA: KONTRAST (WCAG AA) ====================
   Yalnızca okunması gereken metinler; palet (zeminler, butonlar, kenarlıklar,
   ikonlar) aynen kalır. Ölçülen değerler koyu kart zemini (#2a2f37) içindir.
   - Bootstrap .text-muted / .form-text (#6c757d) 2.9:1 → #9aa3ad 4.6:1
   - Bordo metin bağlantıları 1.3–1.6:1 → --brand-primary-text 5.1:1+
   - Açık zeminli uyarı kutusundaki bağlantı: genel "a" rengi (#f1f1f1) açık
     zeminde 1:1 — uyarının kendi yazı rengi + altı çizili. */
:root:not([data-theme="light"]) :is(.text-muted, .form-text) {
    color: #9aa3ad !important;
}

:root:not([data-theme="light"]) :is(footer a, .link-accent) {
    color: var(--brand-primary-text);
}

:root:not([data-theme="light"]) .alert a:not(.btn) {
    color: inherit;
    text-decoration: underline;
}

/* Outline kırmızı butonun YAZISI (Bootstrap kırmızısı koyu zeminde 3.0:1);
   üzerine gelince dolgu + beyaz yazı olduğu gibi kalır. (Outline primary
   artık brand-theme.css'te — marka renginin açık tonu, 5:1.) */
:root:not([data-theme="light"]) .btn-outline-danger:not(:hover):not(:focus-visible):not(:active) {
    color: #F07178;
}

:root:not([data-theme="light"]) code {
    color: #e685b5;
}

/* 📖 Read sayfası özel */
body.read-page {
    background-color: #fdfaf6 !important;
    color: #2c2c2c !important;
}

    body.read-page .reading-wrapper {
        background-color: #fffdf8 !important;
        color: #2c2c2c !important;
    }

    body.read-page p,
    body.read-page span,
    body.read-page li,
    body.read-page dt,
    body.read-page dd {
        color: #2c2c2c !important;
    }

    body.read-page .navbar,
    body.read-page footer {
        background-color: var(--site-chrome-bg) !important;
        color: var(--site-chrome-fg) !important;
    }

    :root[data-theme="light"] body.read-page .navbar {
        background-color: var(--site-navbar-bg) !important;
    }


/* E-posta ikonu "kopyalandı" bildirimi (bkz. js/contact-email.js).
   Çerez bandının (z-index 1040) üstünde, temanın kart rengiyle. */
.gw-copy-toast {
    position: fixed;
    left: 50%;
    bottom: 24px;
    z-index: 1090;
    max-width: calc(100vw - 32px);
    padding: .6rem 1.1rem;
    border-radius: 999px;
    background: var(--brand-card, #2a2f37);
    color: var(--brand-text, #E9ECEF);
    border: 1px solid var(--brand-border, rgba(255,255,255,.10));
    box-shadow: 0 10px 30px rgba(0,0,0,.3);
    font-size: .9rem;
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, 8px);
    transition: opacity .2s ease, transform .2s ease;
}

    .gw-copy-toast.is-visible {
        opacity: 1;
        transform: translate(-50%, 0);
    }

@media (prefers-reduced-motion: reduce) {
    .gw-copy-toast {
        transition: none;
    }
}