/* ==========================================================================
   DÜNYA KUPASI TARİHİ NAVİGASYON CONTAINER CSS
   ========================================================================== */

/* Ana Panel Kutusu */
.dk-tarih-konteyner {
    background: #1e293b; /* Koyu tema arka planı */
    border: 1px solid #334155;
    border-radius: 8px;
    padding: 25px;
    margin-top: 40px;
    margin-bottom: 40px;
}

/* Başlıklar */
.dk-tarih-baslik {
    font-family: sans-serif;
    color: #f8fafc;
    margin: 0 0 5px 0;
    font-size: 20px;
    font-weight: bold;
}

.dk-tarih-altbaslik {
    font-family: sans-serif;
    color: #94a3b8;
font-size: 9px !important; /* Değeri 11px yaptık ve !important ile ezilmesini engelledik */
    margin: 0 0 20px 0;
    line-height: 1.4;
}

/* Grid Düzeni (Masaüstünde yan yana 5'li nizam) */
.dk-tarih-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 15px;
}

/* Ortak Kart Tasarımı */
.dk-kart {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #0f172a; /* Kartların iç koyu rengi */
    border: 1px solid #1e293b;
    border-radius: 6px;
    padding: 15px 10px;
    text-decoration: none;
    position: relative;
    transition: all 0.3s ease;
}

.dk-kart-yil {
    font-family: sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: #f8fafc;
    margin-bottom: 4px;
}

.dk-kart-ulke {
    font-family: sans-serif;
    font-size: 12px;
    color: #94a3b8;
}

/* Kartın Üzerine Gelince (Hover Efekti) */
.dk-kart:hover {
    border-color: #9af60e; /* Fıstık yeşili çerçeve parlaması */
    transform: translateY(-3px); /* Hafif yukarı zıplama */
    box-shadow: 0 4px 12px rgba(154, 246, 14, 0.15); /* Hafif yeşil gölge */
}

.dk-kart:hover .dk-kart-yil {
    color: #9af60e; /* Yazı rengi fıstık yeşiline döner */
}

/* Aktif Sayfa Kartı Tasarımı (Ziyaretçi o an hangi sayfadaysa o kart yeşil kalır) */
.dk-kart.aktif {
    border-color: #9af60e;
    background: rgba(154, 246, 14, 0.05);
    pointer-events: none; /* Kendi sayfasına tekrar tıklanmasın */
}

.dk-kart.aktif .dk-kart-yil {
    color: #9af60e;
}

.dk-kart-rozet {
    position: absolute;
    top: -8px;
    font-size: 9px;
    background: #9af60e;
    color: #000000;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: bold;
}

/* Henüz eklenmemiş pasif seneler için şık bir karartma efekti */
.dk-kart.pasif {
    opacity: 0.4;
    cursor: not-allowed;
}
.dk-kart.pasif:hover {
    transform: none;
    box-shadow: none;
    border-color: #1e293b;
}
.dk-kart.pasif .dk-kart-yil {
    color: #64748b;
}