/* ===========================================================================
 *  KALENDAR2 - DIL SECICI (BAYRAKLAR)                 (2026-11-04, tasarim 3)
 *  Kod: System/dil.php (Kl2DilSeciciBas / Kl2DilListe / Kl2DilMobilDugme / Kl2DilMobilPanel)
 *
 *  Kullanici istegi: bayraklar ortadaki KALENDAR logosunun hemen ALTINDA, TEK SIRA;
 *  "sifirdan, buyuk ve cok guzel". Tasarim: logonun zincirinin altinda isiyan ince
 *  bir ray, ustunde kristal cerceveli parlak 40x27 bayraklar + altlarinda dil kodu.
 *  Uzerine gelince bayrak yukselip buyur, kod parlar. Secili dil camgobegi halka.
 *  Logo bu siraya yer acmak icin js/kl2-arkaplan.js logoOlc()'de siranin ustunde biter;
 *  masaustunde header 500 -> 528px (logo kuculmesin).
 *  <1024px: ana sayfada logo ile OYUNU INDIR arasi ayni sira (kucuk olcek);
 *  ic sayfalarda ust cubukta bayrak dugmesi + panel (.k2-dil-izgara).
 *  Tanitim sayfasi da bu dosyayi kullanir (.k2t-dil, tanitim/index.php).
 *  Renk: sitenin mavi kristal paleti (altin YOK).
 * =========================================================================== */

@media (min-width: 1024px) {
    body:not(.tam-genislik) .header { height: 528px !important; }
}

.k2-dil-sira {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 8px;
    z-index: 12;
    width: max-content;
    margin: 0 auto;
    padding: 6px 30px 4px;
    animation: k2-dil-gel .45s .1s ease-out both;
}

/* --- ray: bayraklarin ortasindan gecen isik cizgisi + uclarda elmas ------ */
.k2-dil-sira::before,
.k2t-dil::before {
    content: "";
    position: absolute;
    left: 0; right: 0;
    top: 19px;
    height: 2px;
    z-index: -1;
    background: linear-gradient(90deg, transparent, rgba(90, 190, 255, .55) 12%, rgba(185, 235, 255, .95) 50%, rgba(90, 190, 255, .55) 88%, transparent);
    box-shadow: 0 0 12px rgba(80, 190, 255, .75), 0 0 2px rgba(220, 245, 255, .9);
}
.k2-dil-sira::after,
.k2t-dil::after {
    content: "";
    position: absolute;
    left: 50%; top: 50%;
    width: 120%; height: 160%;
    transform: translate(-50%, -50%);
    z-index: -2;
    pointer-events: none;
    background: radial-gradient(ellipse at 50% 45%, rgba(2, 10, 26, .62) 0, rgba(2, 10, 26, .35) 42%, transparent 70%);
}

.k2-dil-liste {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.k2-dil-liste li { flex: 0 0 auto; margin: 0; padding: 0; list-style: none; }
.k2-dil-liste a {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 3px 2px 0;
    text-decoration: none !important;
    outline: none;
}
.k2-dil-bayrak {
    position: relative;
    display: block;
    width: 40px;
    height: 27px;
    border-radius: 5px;
    overflow: hidden;
    background: #061a36;
    box-shadow:
        0 0 0 1px rgba(170, 225, 255, .55),
        0 0 0 3px rgba(4, 22, 48, .9),
        0 0 0 4px rgba(95, 185, 255, .35),
        0 6px 12px rgba(0, 0, 0, .65);
    transform-origin: 50% 60%;
    transition: transform .16s cubic-bezier(.2, .9, .3, 1.4), box-shadow .16s ease-out, filter .16s;
    filter: saturate(.92) brightness(.94);
    will-change: transform;
}
.k2-dil-bayrak img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
}
/* cam parlakligi + alt golge (bayrak yuzeyi) */
.k2-dil-bayrak::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    background:
        linear-gradient(165deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .14) 34%, rgba(255, 255, 255, 0) 36%),
        linear-gradient(180deg, rgba(0, 0, 0, 0) 55%, rgba(0, 10, 30, .32) 100%);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
}
.k2-dil-kod {
    display: block;
    font: 700 10px/1 'Candara', 'Segoe UI', Arial, sans-serif;
    letter-spacing: 1.6px;
    color: #8fbbe0;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .9);
    transition: color .16s, text-shadow .16s, transform .16s;
}
/* tam dil adi ekran okuyucu icin; gorunen ipucu title */
.k2-dil-liste a span {
    position: absolute !important;
    width: 1px; height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}
.k2-dil-liste a:hover,
.k2-dil-liste a:focus-visible { z-index: 3; }
.k2-dil-liste a:hover .k2-dil-bayrak,
.k2-dil-liste a:focus-visible .k2-dil-bayrak {
    transform: translateY(-4px) scale(1.24);
    filter: none;
    box-shadow:
        0 0 0 1px rgba(210, 245, 255, .95),
        0 0 0 3px rgba(4, 22, 48, .95),
        0 0 0 4px rgba(120, 215, 255, .9),
        0 0 22px rgba(80, 200, 255, .85),
        0 10px 18px rgba(0, 0, 0, .6);
}
.k2-dil-liste a:hover .k2-dil-kod,
.k2-dil-liste a:focus-visible .k2-dil-kod {
    color: #ffffff;
    text-shadow: 0 0 10px rgba(110, 215, 255, .95), 0 1px 2px #000;
    transform: translateY(2px);
}
.k2-dil-liste a:active .k2-dil-bayrak { transform: translateY(-1px) scale(1.1); }
.k2-dil-liste a.k2-dil-aktif .k2-dil-bayrak {
    filter: none;
    box-shadow:
        0 0 0 1px #e6faff,
        0 0 0 3px #0a3a6e,
        0 0 0 5px #6fd0ff,
        0 0 18px rgba(70, 195, 255, .95),
        0 6px 12px rgba(0, 0, 0, .6);
}
.k2-dil-liste a.k2-dil-aktif .k2-dil-kod {
    color: #bff0ff;
    text-shadow: 0 0 8px rgba(90, 205, 255, .9), 0 1px 2px #000;
}
.k2-dil-liste .k2-ripple { display: none !important; }

@keyframes k2-dil-gel {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: none; }
}

/* Mobil ogeler masaustunde yok */
.k2-mbar-dil { display: none; }
.k2-dil-panel[hidden] { display: none !important; }

@media (max-width: 1023px) {
    /* Ic sayfalarda header 72px serit: sira yok, ust cubuktaki bayrak dugmesi var */
    body:not(.k2-anasayfa) .k2-dil-sira { display: none !important; }
    /* Ana sayfa: logo ile OYUNU INDIR / GIRIS-KAYIT (2 x 44px + 10px, alttan 16px) arasi.
       Logo kuculmesin diye header uzatildi (kl2-mobil.css 390 / telefonda 356). */
    body.k2-anasayfa .header { height: 430px !important; }
    body.k2-anasayfa .k2-dil-sira { bottom: 124px; padding: 4px 6px 2px; max-width: calc(100% - 12px); box-sizing: border-box; }
    body.k2-anasayfa .k2-dil-sira::before { top: 13px; }
    body.k2-anasayfa .k2-dil-liste { gap: 4px; }
    body.k2-anasayfa .k2-dil-liste li { flex: 0 1 24px; min-width: 0; }
    body.k2-anasayfa .k2-dil-liste a { gap: 3px; padding-top: 2px; }
    body.k2-anasayfa .k2-dil-sira .k2-dil-bayrak { width: 100%; height: auto; aspect-ratio: 3 / 2; border-radius: 3px;
        box-shadow: 0 0 0 1px rgba(170, 225, 255, .55), 0 0 0 2px rgba(4, 22, 48, .9), 0 3px 6px rgba(0, 0, 0, .6); }
    body.k2-anasayfa .k2-dil-sira a.k2-dil-aktif .k2-dil-bayrak { box-shadow: 0 0 0 1px #e6faff, 0 0 0 2px #0a3a6e, 0 0 0 3px #6fd0ff, 0 0 10px rgba(70, 195, 255, .9); }
    body.k2-anasayfa .k2-dil-sira .k2-dil-kod { font-size: 8px; letter-spacing: .8px; }    .k2-mbar .k2-mbar-dil {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        flex: 0 0 auto;
        height: 36px;
        margin: 0 !important;
        padding: 0 9px !important;
        color: #dff6ff !important;
        font: 700 13px/1 'Candara', Arial, sans-serif;
        letter-spacing: 1px;
        border: 1px solid rgba(110, 210, 255, .45) !important;
        border-radius: 0 !important;
        background: linear-gradient(180deg, rgba(10, 52, 94, .9), rgba(3, 20, 42, .92)) !important;
        clip-path: polygon(6px 0, 100% 0, 100% calc(100% - 6px), calc(100% - 6px) 100%, 0 100%, 0 6px);
        box-shadow: none !important;
        cursor: pointer;
    }
    .k2-mbar-dil img {
        width: 22px; height: 15px;
        object-fit: cover;
        border: 1px solid rgba(160, 225, 255, .5);
    }
    html.k2-dil-acik .k2-mbar-dil { border-color: #8fe4ff !important; box-shadow: 0 0 10px rgba(80, 200, 255, .55) !important; }

    .k2-dil-panel {
        position: fixed;
        z-index: 9300;
        top: calc(58px + env(safe-area-inset-top) + 8px);
        right: 10px;
        width: min(340px, calc(100vw - 20px));
        box-sizing: border-box;
        padding: 12px;
        background: linear-gradient(160deg, rgba(6, 34, 66, .98), rgba(2, 10, 24, .98));
        border: 1px solid rgba(110, 210, 255, .45);
        clip-path: polygon(12px 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%, 0 12px);
        box-shadow: 0 18px 40px rgba(0, 0, 0, .6), 0 0 22px rgba(60, 170, 255, .18);
        animation: k2-dil-gel .2s ease-out both;
    }
    .k2-dil-panel-baslik {
        margin: 0 0 10px;
        color: #8fd8ff;
        font: 700 12px/1 'Candara', Arial, sans-serif;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-align: center;
    }
    .k2-dil-izgara {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 6px;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    .k2-dil-izgara li { margin: 0; padding: 0; list-style: none; }
    .k2-dil-izgara a {
        display: flex;
        align-items: center;
        gap: 9px;
        min-height: 40px;
        padding: 0 10px;
        color: #dff6ff !important;
        font: 600 14px/1.1 'Segoe UI', Arial, sans-serif;
        text-decoration: none !important;
        background: rgba(8, 40, 76, .65);
        border: 1px solid rgba(110, 210, 255, .22);
    }
    /* panelde bayrak + tam ad; dil kodu gizli (ayni bilgi) */
    .k2-dil-izgara .k2-dil-kod { display: none; }
    .k2-dil-izgara .k2-dil-bayrak {
        flex: 0 0 auto;
        width: 28px; height: 19px;
        border-radius: 3px;
        box-shadow: 0 0 0 1px rgba(170, 225, 255, .5), 0 2px 5px rgba(0, 0, 0, .55);
    }
    .k2-dil-izgara a img {
        width: 100%; height: 100%;
        object-fit: cover;
    }
    .k2-dil-izgara a.k2-dil-aktif {
        border-color: #6fd0ff;
        background: linear-gradient(180deg, rgba(34, 140, 210, .55), rgba(6, 50, 96, .75));
        box-shadow: inset 0 0 0 1px rgba(143, 228, 255, .35);
    }
}

@media (max-width: 599px) {
    body.k2-anasayfa .header { height: 396px !important; } /* kl2-mobil.css 356 + sira */
}

@media (max-width: 380px) {
    .k2-mbar .k2-mbar-dil span { display: none; }
    .k2-mbar .k2-mbar-dil { padding: 0 7px !important; }
}

/* SEO (2026-11-04): siralama / indir sayfalarinin basliklari <h1> oldu; gorunus eskisi gibi kalsin */
h1.panel-heading { margin: 0; }
h1.k2-indir-alt { font-weight: 400; line-height: 1.5; }

/* Ana sayfa tanitim blogu (Baslangic.php .k2-ana-tanitim) */
.k2-ana-tanitim { margin-top: 14px; }
.k2-ana-tanitim h1.panel-heading { margin: 0 !important; font-size: 15px !important; line-height: 1.35 !important; font-weight: 700 !important; }
.k2-ana-tanitim .panel-body { font-size: 13.5px; line-height: 1.75; color: #cfe2f5; }
.k2-ana-tanitim .panel-body p { margin: 0 0 10px; }
.k2-ana-tanitim .panel-body b { color: #eaf6ff; }
.k2-ana-tanitim-linkler { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.k2-ana-tanitim-linkler a {
    padding: 6px 10px;
    color: #dff4ff !important;
    font-size: 12.5px;
    text-decoration: none !important;
    background: rgba(8, 40, 76, .65);
    border: 1px solid rgba(110, 210, 255, .28);
}
.k2-ana-tanitim-linkler a:hover { border-color: #6fd0ff; box-shadow: 0 0 10px rgba(70, 190, 255, .35); }

/* Arapca: icerik metni sagdan sola; site iskeleti (menu, yan sutunlar) aynen kalir */
.k2-rtl { direction: rtl; text-align: right; }
.k2-rtl ul { padding-right: 22px; padding-left: 0; }

@media (prefers-reduced-motion: reduce) {
    .k2-dil-sira, .k2-dil-panel { animation: none !important; }
    .k2-dil-liste a { transition: none !important; }
}