/* ============================================================
   TEMA SİSTEMİ — Açık / Koyu
   html[data-tema="koyu"]  → koyu tema
   html[data-tema="acik"]  → açık tema (zorla)
   varsayılan              → sistem tercihine göre
   ============================================================ */

/* ---------- Bölüm ayraçları ---------- */
.bolum-hr {
    border: none;
    height: 1px;
    margin: 0;
    background: linear-gradient(90deg, transparent 0%, rgba(89,214,169,0.4) 20%, rgba(89,214,169,0.4) 80%, transparent 100%);
}
html[data-tema="koyu"] .bolum-hr {
    background: linear-gradient(90deg, transparent 0%, rgba(128,229,192,0.2) 20%, rgba(128,229,192,0.2) 80%, transparent 100%);
}
@media (prefers-color-scheme: dark) {
    html:not([data-tema="acik"]) .bolum-hr {
        background: linear-gradient(90deg, transparent 0%, rgba(128,229,192,0.2) 20%, rgba(128,229,192,0.2) 80%, transparent 100%);
    }
}

/* ---------- Açık tema (varsayılan) ---------- */
/* Duyurular bölümü açık temada beyaz zemin */
#duyurular { background-color: #ffffff !important; }

:root {
    --arka        : #ffffff;
    --metin       : #1a1a1a;
    --metin2      : #444;
    --sinir       : rgb(108, 103, 103);
    --tablo-cift  : #e8e8e8;
    --tablo-tek   : #f5f5f5;
    --tablo-hover : #d0d0d0;
}

/* ---------- Koyu tema ---------- */
html[data-tema="koyu"] {
    --arka        : #141f1a;
    --metin       : #ddeee5;
    --metin2      : #9dbfae;
    --sinir       : rgba(100,180,130,0.3);
    --tablo-cift  : #1e2e23;
    --tablo-tek   : #263b2c;
    --tablo-hover : #2f5040;
}

/* ---------- Sistem koyu tema (data-tema yoksa) ---------- */
@media (prefers-color-scheme: dark) {
    html:not([data-tema="acik"]) {
        --arka        : #141f1a;
        --metin       : #ddeee5;
        --metin2      : #9dbfae;
        --sinir       : rgba(100,180,130,0.3);
        --tablo-cift  : #1e2e23;
        --tablo-tek   : #263b2c;
        --tablo-hover : #2f5040;
    }
}

/* ---------- Genel ---------- */
body {
    background-color: var(--arka);
    color: var(--metin);
    transition: background-color .3s, color .3s;
}

/* ---------- KOYU TEMA renk geçersiz kılmaları ---------- */

/* Tablolar — border ve metin */
html[data-tema="koyu"] th,
html[data-tema="koyu"] td {
    border-color: rgba(100,180,130,0.25) !important;
    color: #ddeee5 !important;
}

/* Ekip tablosu */
html[data-tema="koyu"] .ekip tr         { background-color: #1e2e23 !important; }
html[data-tema="koyu"] .ekip tr:nth-child(even) { background-color: #263b2c !important; }
html[data-tema="koyu"] .ekip tr:hover   { background-color: #2f5040 !important; }

/* Çalışma saati tablosu */
html[data-tema="koyu"] #customers tr              { background-color: #1e2e23 !important; }
html[data-tema="koyu"] #customers tr:nth-child(odd) { background-color: #263b2c !important; }
html[data-tema="koyu"] #customers tr:hover        { background-color: #2f5040 !important; }

/* Başlık satırları */
html[data-tema="koyu"] .ekip-baslik th,
html[data-tema="koyu"] .ekip-bilgi th,
html[data-tema="koyu"] #customers th {
    background-color: #2d6e52 !important;
    color: #e8f5ee !important;
}

/* === DUYURULAR BÖLÜMÜ === */
html[data-tema="koyu"] #duyurular {
    background-color: rgb(18,28,22) !important;
    margin-top: 0 !important;
    padding-top: 48px !important;
    position: relative;
}
html[data-tema="koyu"] #duyurular h1 {
    font-size: 1.8em !important;
    letter-spacing: .14em !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid rgba(128,229,192,.2) !important;
    width: fit-content;
    margin: 0 auto 4px !important;
    color: #ffffff !important;
    text-shadow: none !important;
}
/* Duyuru kartları */
html[data-tema="koyu"] .duyuru-kart {
    background-color: rgba(30,61,47,.72) !important;
    color: #ffffff !important;
    border-color: rgba(128,229,192,.15) !important;
    box-shadow: 0 2px 14px rgba(0,0,0,.35);
    backdrop-filter: blur(10px) !important;
}
html[data-tema="koyu"] .duyuru-kart:hover {
    box-shadow: 0 8px 30px rgba(0,0,0,.55), 0 0 0 1px rgba(128,229,192,.22) !important;
    border-color: rgba(128,229,192,.32) !important;
}
html[data-tema="koyu"] .duyuru-baslik { color: #ffffff !important; font-size: 1.2em !important; }
html[data-tema="koyu"] .duyuru-zaman  { color: #ffffff !important; font-size: .8em !important; }
html[data-tema="koyu"] .duyuru-icerik { color: #ffffff !important; }
html[data-tema="koyu"] .duyuru-devam  { color: #ffffff !important; }
html[data-tema="koyu"] .duyuru-modal  { background: rgba(30,61,47,.95) !important; color: #ffffff !important; border-color: rgba(128,229,192,.2) !important; }
html[data-tema="koyu"] .duyuru-modal h3 { color: #ffffff !important; }
html[data-tema="koyu"] .duyuru-modal-icerik { color: #ffffff !important; }

/* Bağlantı / Önemli bölümler */
html[data-tema="koyu"] .onemli,
html[data-tema="koyu"] .baglanti { background-color: #1e3d2f; }

html[data-tema="koyu"] .onemli h1 { text-shadow: 3px 3px 5px #0a1a10; }

/* İletişim */
html[data-tema="koyu"] .formadres .ilet { background-color: #1e3d2f; border-color: #3a5a4a; }
html[data-tema="koyu"] .formadres .adres { border-color: #3a5a4a; }

/* İşlemler */
html[data-tema="koyu"] .islemtek {
    background-color: #1e5040;
    border-color: #3a7a60;
    box-shadow: 0 0 5px rgba(0,0,0,.5);
}

/* Yukarı butonu */
html[data-tema="koyu"] .yukari { background-color: #243d30; border-color: #95dcc1; }
html[data-tema="koyu"] .yukari:hover { background-color: #3a6a50; }

/* Galeri */
html[data-tema="koyu"] .baslik .bas { background-color: #1e5040; }
html[data-tema="koyu"] .foto img { border-color: #3a7a60; }

/* Doktor çubuk menü */
html[data-tema="koyu"] .doktorbar a { color: #95dcc1; }

/* Doktor tabloları — sadece normal hücreler (hekim renkleri korunur) */
html[data-tema="koyu"] .tablo td:not(.doktorisim):not(.tabloaçıklama),
html[data-tema="koyu"] .tablo th { background-color: #0e1812 !important; }

/* ---- Sistem koyu (prefers-color-scheme) ---- */
@media (prefers-color-scheme: dark) {
    html:not([data-tema="acik"]) th,
    html:not([data-tema="acik"]) td { border-color: rgba(100,180,130,0.25) !important; color: #ddeee5 !important; }
    html:not([data-tema="acik"]) .ekip tr { background-color: #1e2e23 !important; }
    html:not([data-tema="acik"]) .ekip tr:nth-child(even) { background-color: #263b2c !important; }
    html:not([data-tema="acik"]) .ekip tr:hover { background-color: #2f5040 !important; }
    html:not([data-tema="acik"]) #customers tr { background-color: #1e2e23 !important; }
    html:not([data-tema="acik"]) #customers tr:nth-child(odd) { background-color: #263b2c !important; }
    html:not([data-tema="acik"]) #customers tr:hover { background-color: #2f5040 !important; }
    html:not([data-tema="acik"]) .ekip-baslik th,
    html:not([data-tema="acik"]) .ekip-bilgi th,
    html:not([data-tema="acik"]) #customers th { background-color: #2d6e52 !important; color: #e8f5ee !important; }
    html:not([data-tema="acik"]) #duyurular { background-color: rgb(18,28,22) !important; margin-top: 0 !important; padding-top: 48px !important; position: relative; }
    html:not([data-tema="acik"]) #duyurular h1 { font-size: 1.8em !important; letter-spacing: .14em !important; padding-bottom: 16px !important; border-bottom: 1px solid rgba(128,229,192,.2) !important; width: fit-content; margin: 0 auto 4px !important; color: #ffffff !important; text-shadow: none !important; }
    html:not([data-tema="acik"]) .duyuru-kart { background-color: rgba(30,61,47,.72) !important; color: #ffffff !important; border-color: rgba(128,229,192,.15) !important; box-shadow: 0 2px 14px rgba(0,0,0,.35); backdrop-filter: blur(10px) !important; }
    html:not([data-tema="acik"]) .duyuru-baslik { color: #ffffff !important; font-size: 1.2em !important; }
    html:not([data-tema="acik"]) .duyuru-zaman  { color: #ffffff !important; font-size: .8em !important; }
    html:not([data-tema="acik"]) .duyuru-icerik { color: #ffffff !important; }
    html:not([data-tema="acik"]) .duyuru-devam  { color: #ffffff !important; }
    html:not([data-tema="acik"]) .duyuru-modal  { background: rgba(30,61,47,.95) !important; color: #ffffff !important; border-color: rgba(128,229,192,.2) !important; }
    html:not([data-tema="acik"]) .duyuru-modal h3 { color: #ffffff !important; }
    html:not([data-tema="acik"]) .duyuru-modal-icerik { color: #ffffff !important; }
    html:not([data-tema="acik"]) .duyuru-kart:hover { box-shadow: 0 8px 30px rgba(0,0,0,.55), 0 0 0 1px rgba(128,229,192,.22) !important; border-color: rgba(128,229,192,.32) !important; }
    html:not([data-tema="acik"]) .onemli,
    html:not([data-tema="acik"]) .baglanti { background-color: #1e3d2f; }
    html:not([data-tema="acik"]) .onemli h1 { text-shadow: 3px 3px 5px #0a1a10; }
    html:not([data-tema="acik"]) .formadres .ilet { background-color: #1e3d2f; border-color: #3a5a4a; }
    html:not([data-tema="acik"]) .formadres .adres { border-color: #3a5a4a; }
    html:not([data-tema="acik"]) .islemtek { background-color: #1e5040; border-color: #3a7a60; box-shadow: 0 0 5px rgba(0,0,0,.5); }
    html:not([data-tema="acik"]) .yukari { background-color: #243d30; border-color: #95dcc1; }
    html:not([data-tema="acik"]) .yukari:hover { background-color: #3a6a50; }
    html:not([data-tema="acik"]) .baslik .bas { background-color: #1e5040; }
    html:not([data-tema="acik"]) .foto img { border-color: #3a7a60; }
    html:not([data-tema="acik"]) .doktorbar a { color: #95dcc1; }
    html:not([data-tema="acik"]) .tablo td:not(.doktorisim):not(.tabloaçıklama),
    html:not([data-tema="acik"]) .tablo th { background-color: #0e1812 !important; }
}

/* ============================================================
   TEMA TOGGLE — Güneş / Ay kaydırmalı switch
   ============================================================ */

/* Header'ın sağına toggle için alan */
.header {
    position: relative;
}
.tema-header {
    margin-left: auto;
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

/* Toggle pill */
.tema-toggle {
    position: relative;
    width: 62px;
    height: 30px;
    background: rgba(255,255,255,.2);
    border: 2px solid rgba(255,255,255,.5);
    border-radius: 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 6px;
    user-select: none;
    flex-shrink: 0;
}

/* Kayan daire — z-index 0, ikonların arkasında */
.tema-toggle .t-top {
    position: absolute;
    width: 24px;
    height: 24px;
    background: white;
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    left: 3px;
    transition: left .3s;
    box-shadow: 0 1px 4px rgba(0,0,0,.25);
    z-index: 0;
}

/* İkonlar dairenin üstünde */
.tema-toggle .t-gunes,
.tema-toggle .t-ay {
    width: 15px;
    height: 15px;
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    transition: opacity .3s;
}

/* Açık tema: güneş seçili (koyu), ay silik (beyaz) */
.tema-toggle .t-gunes { stroke: #457262; fill: none; opacity: 1; }
.tema-toggle .t-ay    { fill: rgba(255,255,255,.5); stroke: rgba(255,255,255,.5); opacity: .5; }

/* Koyu tema: daire sağa, ay seçili (koyu), güneş silik */
html[data-tema="koyu"] .tema-toggle .t-top    { left: calc(100% - 27px); }
html[data-tema="koyu"] .tema-toggle .t-gunes  { stroke: rgba(255,255,255,.5); opacity: .5; }
html[data-tema="koyu"] .tema-toggle .t-ay     { fill: #457262; stroke: #457262; opacity: 1; }

@media (prefers-color-scheme: dark) {
    html:not([data-tema="acik"]) .tema-toggle .t-top   { left: calc(100% - 27px); }
    html:not([data-tema="acik"]) .tema-toggle .t-gunes { stroke: rgba(255,255,255,.5); opacity: .5; }
    html:not([data-tema="acik"]) .tema-toggle .t-ay    { fill: #457262; stroke: #457262; opacity: 1; }
}

@media screen and (max-width: 768px) {
    .tema-header { margin-left: 0; }
    .tema-toggle { width: 52px; height: 26px; padding: 0 5px; }
    .tema-toggle .t-top { width: 20px; height: 20px; }
    .tema-toggle .t-gunes, .tema-toggle .t-ay { width: 13px; height: 13px; }
    html[data-tema="koyu"] .tema-toggle .t-top { left: calc(100% - 23px); }
}

@media screen and (max-width: 768px) and (prefers-color-scheme: dark) {
    html:not([data-tema="acik"]) .tema-toggle .t-top { left: calc(100% - 23px); }
}
