/* --- EVRENKENT KALEMLERİ TAM UYUMLU SÖZLÜK TASARIMI --- */

/* --- 1. ARAMA ÇUBUĞU VE BUTONU --- */
.dictionary .terms_search {
    display: flex;
    flex-wrap: wrap;
    justify-content: center !important;
    margin-bottom: 30px;
    gap: 10px;
}
.dictionary .terms_search input[type="text"] {
    padding: 10px 20px;
    border: 2px solid #e9ecef;
    border-radius: 30px; /* Modern yuvarlak hatlar */
    font-size: 1rem;
    outline: none;
    width: 100%;
    max-width: 400px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02) inset;
}
.dictionary .terms_search input[type="text"]:focus {
    border-color: #003366; /* Odaklanınca Koyu Mavi */
    box-shadow: 0 0 8px rgba(0, 51, 102, 0.15);
}
.dictionary .terms_search input[type="submit"] {
    background-color: #003366;
    border: none;
    border-radius: 30px;
    color: #fff;
    padding: 10px 25px;
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.dictionary .terms_search input[type="submit"]:hover {
    background-color: #b32d2e; /* Üzerine gelince Kırmızı */
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

/* --- 2. HARF BUTONLARI (A, B, C...) --- */
.dictionary .letters {
    border-bottom: 1px solid #eaeaea;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-bottom: 25px;
    margin-bottom: 25px;
    gap: 8px;
}
.dictionary .letters .letter {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 12px; /* Zarif yuvarlak kare */
    font-size: 1.15rem;
    font-weight: 600;
    color: #495057;
    text-decoration: none;
    width: 45px;
    height: 45px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.2s ease;
}
.dictionary .letters .letter:hover {
    background: #b32d2e;
    color: #fff;
    border-color: #b32d2e;
    transform: translateY(-2px);
}
.dictionary .letters .letter.current {
    background: #003366; /* Aktif harf Koyu Mavi */
    color: #fff;
    border-color: #003366;
    box-shadow: 0 4px 8px rgba(0,51,102,0.2);
}

/* --- 3. KART VE TERİM İÇİ DÜZENLEMELER --- */
.dictionary .terms .term { width: 100%; display: block; } 
.dictionary .terms .term .attachment-dictionary-thumbnail { width: auto; height: 100px; margin: 0 15px 10px 0; float: left; border-radius: 6px; }
.dictionary .terms .term a { text-decoration: none; }
.back-to-all { display: block; margin-top: 20px; text-align: center; color: #003366; font-weight: bold; text-decoration: none; transition: 0.2s; }
.back-to-all:hover { color: #b32d2e; text-decoration: underline; }

/* --- 4. ULAMLAR LİSTESİ (Açılır Kapanır ve Duyarlı Yapı) --- */
.td-ulams-wrapper { border-bottom: 1px solid #eaeaea; margin-bottom: 25px; padding-bottom: 15px; text-align: center; }
.td-ulams-container { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; max-height: 85px; overflow: hidden; transition: max-height 0.4s ease-in-out; }
@media (min-width: 768px) { .td-ulams-container { max-height: 40px; } }
.td-ulams-container.expanded { max-height: 1000px !important; }

/* Ulam Butonları */
.td-tag-btn { display: inline-flex; white-space: nowrap !important; padding: 8px 16px; border-radius: 30px; font-size: 0.9rem; font-weight: 500; text-decoration: none !important; box-shadow: 0 2px 4px rgba(0,0,0,0.05); transition: all 0.3s ease; }
.td-tag-btn:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0,0,0,0.1); }
.td-tag-small { display: inline-block; white-space: nowrap !important; background: #f0efea; color: #495057; padding: 5px 12px; border-radius: 20px; font-size: 0.8rem; text-decoration: none !important; transition: all 0.3s ease; }
.td-tag-small:hover { background: #b32d2e !important; color: #fff !important; }
.td-ulams-toggle { background: none; border: none; color: #b32d2e; font-size: 0.9rem; font-weight: 600; cursor: pointer; padding: 10px 10px 0 10px; margin-top: 5px; transition: 0.2s; }
.td-ulams-toggle:hover { color: #003366; }

/* --- 5. ZARİF SAYFALANDIRMA (PAGINATION) --- */
.dictionary .td-pagination { margin-top: 40px; text-align: center; display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }
.dictionary .td-pagination a, .dictionary .td-pagination span { background-color: #ffffff; border: 1px solid #d1d5db; border-radius: 50%; color: #495057; text-decoration: none !important; display: inline-flex; justify-content: center; align-items: center; width: 40px; height: 40px; font-size: 1rem; font-weight: 600; transition: all 0.3s ease; box-shadow: 0 2px 4px rgba(0,0,0,0.02); }
.dictionary .td-pagination a:hover { background-color: #b32d2e; color: #ffffff; border-color: #b32d2e; transform: translateY(-2px); }
.dictionary .td-pagination .current { background-color: #003366 !important; color: #ffffff !important; border-color: #003366 !important; box-shadow: 0 4px 8px rgba(0,51,102,0.2); }

/* --- 6. SIRALAMA SEÇENEKLERİ TASARIMI --- */
.td-sorting-options {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 20px;
}
.td-sorting-btn {
    background-color: #f8f9fa;
    color: #495057 !important;
    border: 1px solid #dee2e6;
    padding: 6px 15px;
    border-radius: 20px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.2s ease;
}
.td-sorting-btn:hover {
    background-color: #e9ecef;
    border-color: #d3d9df;
}
.td-sorting-btn.active {
    background-color: #003366;
    color: #ffffff !important;
    border-color: #003366;
}

/* --- 7. ALINTI / ÖRNEK CÜMLE TASARIMI --- */
.td-quote-box {
    background-color: #fcfcfc;
    border-left: 4px solid #b32d2e;
    padding: 15px 20px;
    margin: 15px 0 25px 0;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: #555;
    box-shadow: 0 2px 5px rgba(0,0,0,0.02);
}
.td-quote-text {
    font-size: 1.05rem;
    line-height: 1.6;
    margin-bottom: 8px;
}
.td-quote-author {
    font-size: 0.9rem;
    font-weight: bold;
    color: #003366;
    text-align: right;
    font-style: normal;
}

/* --- KELİMECE (WORDLE) OYUNU TASARIMI --- */
#td-wordle-app { max-width: 450px; margin: 0 auto 40px auto; display: flex; flex-direction: column; align-items: center; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; position: relative; }
.td-w-header { display: flex; justify-content: space-between; align-items: center; width: 100%; border-bottom: 1px solid #d3d6da; padding-bottom: 10px; margin-bottom: 20px; }
.td-w-header h2 { margin: 0; font-size: 1.8rem; font-weight: 800; color: #003366; letter-spacing: 2px; }
.td-w-icon-btn { background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #777; transition: 0.2s; padding: 5px; }
.td-w-icon-btn:hover { color: #b32d2e; }

#td-w-board { display: grid; grid-template-rows: repeat(6, 1fr); grid-gap: 5px; margin-bottom: 30px; width: 300px; height: 360px; }
.td-w-row { display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 5px; }
.td-w-tile { width: 100%; height: 100%; border: 2px solid #d3d6da; display: flex; justify-content: center; align-items: center; font-size: 2rem; font-weight: bold; text-transform: uppercase; color: #111; user-select: none; transition: transform 0.2s; box-sizing: border-box; }
.td-w-tile[data-state="active"] { border-color: #878a8c; animation: pop 0.1s; }
@keyframes pop { 50% { transform: scale(1.1); } }
.td-w-tile[data-status="correct"] { background-color: #538d4e; border-color: #538d4e; color: white; }
.td-w-tile[data-status="present"] { background-color: #b59f3b; border-color: #b59f3b; color: white; }
.td-w-tile[data-status="absent"] { background-color: #787c7e; border-color: #787c7e; color: white; }

#td-w-keyboard { width: 100%; display: flex; flex-direction: column; gap: 8px; user-select: none; }
.td-w-key-row { display: flex; justify-content: center; gap: 6px; }
.td-w-key { background-color: #d3d6da; border: none; border-radius: 4px; font-weight: bold; font-size: 0.9rem; cursor: pointer; padding: 15px 10px; flex: 1; transition: 0.2s; color: #111; display: flex; justify-content: center; align-items: center; }
.td-w-key:hover { background-color: #c2c5c9; }
.td-w-key-wide { flex: 1.5; font-size: 0.8rem; }
.td-w-key[data-status="correct"] { background-color: #538d4e; color: white; }
.td-w-key[data-status="present"] { background-color: #b59f3b; color: white; }
.td-w-key[data-status="absent"] { background-color: #787c7e; color: white; }

.td-w-toast-container { position: absolute; top: 60px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; z-index: 100000; pointer-events: none; }
.td-w-toast { background-color: #111; color: #fff; padding: 12px 20px; border-radius: 6px; font-weight: bold; margin-bottom: 10px; opacity: 1; transition: opacity 0.5s; font-size: 0.95rem; }

/* Modal Tasarımı */
.td-w-modal-overlay { display: none; position: fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index: 9999; justify-content: center; align-items: center; }
.td-w-modal { background: #fff; width: 90%; max-width: 400px; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); overflow: hidden; display: flex; flex-direction: column; }
.td-w-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 15px 20px; border-bottom: 1px solid #eaeaea; }
.td-w-modal-header h3 { margin: 0; font-size: 1.2rem; color: #003366; }
.td-w-modal-body { padding: 20px; text-align: center; }
.td-w-modal-close { background: none; border: none; font-size: 1.5rem; cursor: pointer; color: #888; }
.td-w-stat-grid { display: flex; justify-content: space-around; margin-bottom: 20px; }
.td-w-stat-box { display: flex; flex-direction: column; align-items: center; }
.td-w-stat-num { font-size: 2rem; font-weight: bold; color: #111; }
.td-w-stat-lbl { font-size: 0.75rem; color: #777; text-transform: uppercase; }
.td-w-btn-share { background: #25D366; color: #fff; border: none; padding: 12px 20px; border-radius: 25px; font-weight: bold; font-size: 1rem; cursor: pointer; width: 100%; margin-bottom: 10px; transition: 0.2s; display: flex; justify-content: center; align-items: center; gap: 8px;}
.td-w-btn-share:hover { background: #1ebd5a; }
.td-w-btn-dic { background: #003366; color: #fff; border: none; padding: 12px 20px; border-radius: 25px; font-weight: bold; font-size: 1rem; cursor: pointer; width: 100%; text-decoration: none; transition: 0.2s; display: inline-block; box-sizing: border-box; }
.td-w-btn-dic:hover { background: #b32d2e; color:#fff; }

/* --- KELİMECE MOBİL VE ERİŞİLEBİLİRLİK (A11Y) TASARIMI --- */
@media (max-width: 480px) {
    .td-w-key { padding: 12px 6px; font-size: 0.85rem; }
    .td-w-key-wide { padding: 12px 4px; font-size: 0.75rem; flex: 1.8; }
    .td-w-key-row { gap: 4px; }
    #td-w-board { width: 100%; max-width: 300px; height: 350px; grid-gap: 4px; }
    .td-w-row { grid-gap: 4px; }
    .td-w-tile { font-size: 1.8rem; }
}

/* Görme Engelli Ekran Okuyucuları İçin Görünmez Katman */
.sr-only { 
    position: absolute; width: 1px; height: 1px; padding: 0; 
    margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); 
    white-space: nowrap; border-width: 0; 
}

/* --- SAYFALANDIRMA (PAGINATION) NOKTA HATASI DÜZELTMESİ --- */
.dictionary .td-pagination span.dots {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #495057;
    width: auto !important;
    pointer-events: none;
}

/* --- KELİMECE (WORDLE) GENEL TASARIM --- */
.td-w-key { touch-action: manipulation; user-select: none; -webkit-user-select: none; } 
.td-w-key-foreign { background-color: #fceceb !important; color: #d35400 !important; border: 1px dashed #d35400 !important; opacity: 0.8; }
body.td-no-scroll { overflow: hidden !important; touch-action: none !important; overscroll-behavior: none !important; }
@media (max-width: 480px) { 
    .td-w-key { padding: 12px 2px !important; font-size: 0.7rem !important; } 
    .td-w-key-wide { padding: 12px 2px !important; font-size: 0.8rem !important; flex: 1.8; } 
}

/* --- EKRAN BOYUTLARINA DUYARLI PENCERE (MODAL) VE İÇ KAYDIRMA DÜZELTMESİ --- */
#td-w-player-name {
    font-size: 16px !important; /* Mobil klavye oto-yakınlaştırma kilidi */
}

.td-w-modal-overlay {
    padding: 5vh 20px !important; /* Üstten ve yanlardan güvenli boşluk */
    align-items: flex-start !important; /* Üstte kalmasını sağlar, kesilmeyi önler */
    z-index: 999999 !important; /* Yönetici çubuğunun altında kalmasını engeller */
    box-sizing: border-box !important;
}

/* Sadece Telefonlar ve Küçük Ekranlar İçin */
@media (max-width: 768px) {
    .td-w-modal {
        max-height: 70vh !important; /* Telefondaki boyutu %80'den %70'e düşürdüm, iç kaydırma artacak */
    }
}

/* Masaüstü ve 13.3 İnç / Laptolar İçin */
@media (min-width: 769px) {
    .td-w-modal-overlay {
        align-items: center !important; /* Büyük ekranlarda tam ortaya alır */
    }
    .td-w-modal {
        max-height: 75vh !important; /* Monitör boyutunu %85'ten %75'e düşürdüm */
    }
}

.td-w-modal {
    display: flex !important;
    flex-direction: column !important;
    margin: auto !important; /* Güvenli ortalama */
}

.td-w-modal-body {
    overflow-y: auto !important; /* İçerik uzunsa sadece pencerenin İÇİNDE kaydırma çubuğu çıkarır */
    -webkit-overflow-scrolling: touch !important; /* Mobilde yumuşak iç kaydırma */
}

/* --- İPUCU KUTUSU TASARIMI (Kibar ve Temaya Uygun) --- */
#td-w-hint-box {
    margin: 5px auto 15px auto;
    padding: 8px 15px;
    background-color: #f8f9fa;
    border: 1px dashed #b32d2e;
    border-radius: 20px;
    font-weight: bold;
    color: #b32d2e;
    font-size: 0.85rem;
    display: inline-block;
    max-width: 80%;
    animation: fadeIn 0.3s ease-in-out;
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ==========================================================================
   YAZI GÖNDERME FORMU (ÖZTÜRKÇE DENETİMLİ) TAM TASARIMI
   ========================================================================== */

/* Genel Kapsayıcı ve Kutu Modeli */
.td-submit-form-container { width: 100% !important; margin: 0 auto !important; }
.td-submit-form-container * { box-sizing: border-box !important; }

/* Grid (Izgara) Yapısı */
.td-form-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 20px !important; margin-bottom: 20px !important; }
@media (max-width: 600px) { 
    .td-form-grid { grid-template-columns: 1fr !important; gap: 15px !important; margin-bottom: 15px !important; } 
}
.td-form-group { margin-bottom: 20px !important; }

/* Etiketler (Başlıklar) */
.td-submit-form-container label { 
    display: block !important; 
    font-weight: 700 !important; 
    color: #003366 !important; 
    margin-bottom: 8px !important; 
    font-size: 1rem !important; 
    text-transform: none !important; 
    letter-spacing: normal !important; 
}

/* Girdi Alanları (Metin, E-posta, Sayı) ve Metin Kutuları */
.td-submit-form-container input[type="text"], 
.td-submit-form-container input[type="email"], 
.td-submit-form-container input[type="number"], 
.td-submit-form-container textarea { 
    width: 100% !important; 
    padding: 15px !important; 
    border: 2px solid #e9ecef !important; 
    border-radius: 8px !important; 
    font-size: 1.05rem !important; 
    font-family: inherit !important; 
    background: #fdfdfd !important; 
    color: #333 !important; 
    transition: 0.3s !important; 
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.02) !important; 
    line-height: 1.5 !important; 
}

/* Girdi Alanları - Odaklanma (Tıklama) Durumu */
.td-submit-form-container input:focus, 
.td-submit-form-container textarea:focus { 
    border-color: #003366 !important; 
    box-shadow: 0 0 0 3px rgba(0,51,102,0.1) !important; 
    outline: none !important; 
    background: #fff !important; 
}

/* Vurgu Cümlesi ve İçerik Kutusu Özel Ayarları */
.td-submit-form-container textarea#td-vurgu { 
    resize: none !important; 
    overflow: hidden !important; 
    min-height: 50px !important; 
}
.td-submit-form-container textarea#td-icerik { 
    min-height: 350px !important; 
    resize: vertical !important; 
}

/* Doğrulama (Matematik) Kutusu Oklarını Gizleme ve Ortalama */
.td-submit-form-container input[type=number]::-webkit-inner-spin-button, 
.td-submit-form-container input[type=number]::-webkit-outer-spin-button { 
    -webkit-appearance: none !important; 
    margin: 0 !important; 
}
.td-submit-form-container input[type=number] { 
    -moz-appearance: textfield !important; 
    text-align: center !important; 
    font-weight: bold !important; 
    font-size: 1.2rem !important; 
}

/* Canlı Denetim Ekranı */
.td-preview-section { 
    background: #f8f9fa !important; 
    border: 2px solid #e9ecef !important; 
    border-radius: 8px !important; 
    padding: 20px !important; 
    margin-top: 15px !important; 
    margin-bottom: 15px !important; 
    min-height: 150px !important; 
    font-size: 1.05rem !important; 
    line-height: 1.7 !important; 
    color: #333 !important; 
}

/* Yabancı Kelime Vurgusu (Kırmızı Alt Çizgili) */
.td-editor-highlight { 
    background: #fceceb !important; 
    color: #b32d2e !important; 
    font-weight: bold !important; 
    border-bottom: 2px dotted #b32d2e !important; 
    cursor: pointer !important; 
    transition: 0.2s !important; 
    padding: 0 3px !important; 
}
.td-editor-highlight:hover { 
    background: #b32d2e !important; 
    color: #fff !important; 
}

/* İstatistik (Kelime Sayacı) Çubuğu */
.td-editor-stats { 
    background: #e7f5fd !important; 
    padding: 15px !important; 
    border-radius: 8px !important; 
    border: 1px solid #bfe0f8 !important; 
    text-align: center !important; 
    font-size: 0.95rem !important; 
    color: #003366 !important; 
    margin-bottom: 20px !important; 
    display: flex !important; 
    justify-content: center !important; 
    flex-wrap: wrap !important; 
    gap: 10px !important; 
}

/* Gönder Düğmesi */
.td-submit-btn-wrapper { 
    display: flex !important; 
    justify-content: center !important; 
    margin-top: 30px !important; 
}
.td-submit-btn { 
    background: #003366 !important; 
    color: #fff !important; 
    border: none !important; 
    padding: 14px 40px !important; 
    font-size: 1.1rem !important; 
    font-weight: bold !important; 
    border-radius: 30px !important; 
    cursor: pointer !important; 
    width: auto !important; 
    min-width: 250px !important; 
    transition: 0.3s !important; 
    display: block !important; 
    text-align: center !important; 
}
.td-submit-btn:hover { 
    background: #b32d2e !important; 
    transform: translateY(-2px) !important; 
    box-shadow: 0 6px 15px rgba(0,0,0,0.1) !important; 
}
.td-submit-btn:disabled { 
    background: #999 !important; 
    cursor: not-allowed !important; 
    transform: none !important; 
}

/* Uyarı, Hata ve Başarı Mesajları */
.td-form-warning { 
    padding: 15px !important; 
    margin-bottom: 20px !important; 
    border-radius: 8px !important; 
    font-size: 0.95rem !important; 
    line-height: 1.5 !important; 
    background: #fff3cd !important; 
    border: 1px solid #ffe69c !important; 
    color: #856404 !important; 
}
.td-form-danger { 
    background: #f8d7da !important; 
    border-color: #f5c6cb !important; 
    color: #721c24 !important; 
}
.td-form-success { 
    background: #d4edda !important; 
    border-color: #c3e6cb !important; 
    color: #155724 !important; 
}