/* =========================================================
   OMYO Erişilebilirlik Aracı — v2
   Renkler sitenin main-styleV3.css paletinden alınmıştır:
     lacivert #0a294e · koyu mavi #174275 · kırmızı #bf1e1d
     açık gri #f6f6f6 · metin #3a3a3a · kenarlık #bcbcbc
   Dış kaynak kullanmaz (CSP 'self' uyumlu).
   Tüm kurallar "a11y-" önekli ve ya aracın kendi öğelerine ya da
   ziyaretçi bir ayarı açtığında <html>'e eklenen sınıflara bağlıdır;
   hiçbir ayar açık değilken sitenin görünümü DEĞİŞMEZ.
   ========================================================= */

/* ---------- Klavye odak göstergesi ----------
   Yalnızca ziyaretçi Tab tuşuyla gezinmeye başlayınca (html.a11y-kbd) görünür;
   fare kullanıcıları için sitenin mevcut görünümü aynen kalır. */
html.a11y-kbd :focus-visible {
    outline: 3px solid #ffbf47 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px #0a294e !important;
}

/* ---------- "İçeriğe geç" bağlantısı (yalnızca klavyeyle odaklanınca görünür) ---------- */
.a11y-skip {
    position: fixed;
    top: -80px;
    left: 12px;
    z-index: 2147483647;
    background: #0a294e;
    color: #fff !important;
    padding: 12px 20px;
    border-bottom: 3px solid #bf1e1d;
    font: 700 16px/1.2 "Titillium Web", Calibri, Arial, sans-serif;
    text-decoration: none !important;
    transition: top .15s;
}
.a11y-skip:focus { top: 0; }
#ana-icerik:focus { outline: none !important; box-shadow: none !important; }

/* ---------- Ortak sıfırlama (sitenin genel kuralları araca sızmasın) ---------- */
.a11y-ui, .a11y-ui * {
    box-sizing: border-box;
    font-family: "Titillium Web", Calibri, Arial, sans-serif !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    text-transform: none;
    text-shadow: none;
}
/* Sitedeki "*:hover { transition: all .7s }" kuralını araç içinde hızlandır */
.a11y-ui *:hover, .a11y-ui *:focus {
    transition: background-color .15s, border-color .15s, color .15s, box-shadow .15s, transform .15s !important;
}

/* ---------- Açma düğmesi (sol alt köşe) ---------- */
.a11y-toggle {
    position: fixed;
    left: 20px;
    bottom: 20px;
    z-index: 2147483600;
    width: 56px;
    height: 56px;
    border: 3px solid #fff;
    border-radius: 50%;
    background: #0a294e;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 3px 12px rgba(10, 41, 78, .45);
    padding: 0;
    margin: 0;
}
.a11y-toggle { transition: background-color .15s, transform .15s, box-shadow .15s; }
.a11y-toggle:hover { background: #174275; transform: scale(1.06); box-shadow: 0 5px 16px rgba(10, 41, 78, .55); }
.a11y-toggle:active { transform: scale(.97); }
.a11y-toggle svg { width: 30px; height: 30px; }

/* ---------- Panel ---------- */
.a11y-panel {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 380px;
    max-width: 100vw;
    z-index: 2147483601;
    background: #fff;
    color: #3a3a3a;
    box-shadow: 4px 0 24px rgba(10, 41, 78, .35);
    transform: translateX(-105%);
    visibility: hidden;
    display: flex;
    flex-direction: column;
    font-size: 15px !important;
    font-weight: 600;
    line-height: 1.35 !important;
}
.a11y-panel.a11y-open { transform: translateX(0); visibility: visible; }
/* Kayma animasyonu: açılırken soldan sağa, kapanırken sağdan sola.
   Seçici bilerek güçlü tutuldu: fare panelin üzerindeyken (× ile kapatırken)
   yukarıdaki ".a11y-ui *:hover" geçiş kuralı animasyonu ezip paneli bir anda kaybettiriyordu.
   Kapanırken visibility, kayma bittikten SONRA gizlenir (0s linear .3s). */
.a11y-ui .a11y-panel, .a11y-ui .a11y-panel:hover, .a11y-ui .a11y-panel:focus-within {
    transition: transform .3s ease, visibility 0s linear .3s !important;
}
.a11y-ui .a11y-panel.a11y-open, .a11y-ui .a11y-panel.a11y-open:hover, .a11y-ui .a11y-panel.a11y-open:focus-within {
    transition: transform .3s ease, visibility 0s !important;
}
@media (prefers-reduced-motion: reduce) {
    .a11y-ui .a11y-panel, .a11y-ui .a11y-panel:hover, .a11y-ui .a11y-panel:focus-within,
    .a11y-ui .a11y-panel.a11y-open, .a11y-ui .a11y-panel.a11y-open:hover, .a11y-ui .a11y-panel.a11y-open:focus-within,
    .a11y-skip { transition: none !important; }
}

.a11y-head {
    background: #0a294e;
    color: #fff;
    padding: 11px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 3px solid #bf1e1d;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
    position: relative;
    z-index: 1;
}
.a11y-head svg { width: 22px; height: 22px; flex: none; }
.a11y-title {
    font-size: 17px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 1;
    color: #fff !important;
    background: none !important;
    border: 0 !important;
}
.a11y-title strong { font-weight: 600 !important; }
.a11y-title:focus { outline: none !important; box-shadow: none !important; }
.a11y-close {
    width: 32px; height: 32px;
    border: 1px solid rgba(255,255,255,.35); border-radius: 2px;
    background: transparent;
    color: #fff;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    padding: 0; margin: 0;
}
.a11y-close:hover { background: #174275; }
.a11y-close svg { width: 20px; height: 20px; }

.a11y-body { padding: 16px; overflow-y: auto; flex: 1; background: #fff; }

/* Ortak simge (kutucuklar + profiller): zeminsiz, siyah; açık ayarda siyah daire içinde beyaz */
.a11y-ico {
    width: 40px; height: 40px; flex: none;
    border-radius: 50%;
    background: transparent; color: #000;
    display: flex; align-items: center; justify-content: center;
    transition: background-color .15s, color .15s;
}
.a11y-ico svg { width: 22px; height: 22px; }

/* Grup başlıkları (Hazır profiller / Görünüm / Metin / Gezinme ve Okuma / Diğer) */
.a11y-group + .a11y-group, .a11y-size + .a11y-group { margin-top: 18px; }
.a11y-group-label {
    display: flex; align-items: center; gap: 8px;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase;
    color: #000 !important;
    background: none !important;
    margin: 0 0 8px !important;
    padding: 0 !important;
    border: 0 !important;
}
.a11y-group-label::after { content: ""; flex: 1; height: 1px; background: #e1e6ee; }

/* Kutular: ince nötr gri kenarlık, zemin rengi yok (şeffaf).
   Üzerine gelince ya da açıkken kenarlık/zemin DEĞİŞMEZ; durum simge ve yazıyla gösterilir. */

/* Hazır profiller */
.a11y-prof-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.a11y-prof {
    position: relative;
    display: flex; align-items: center; gap: 10px;
    min-height: 64px; padding: 10px; margin: 0;
    border: 1px solid #d9d9d9; border-radius: 8px;
    background: transparent; color: #000;
    box-shadow: none;
    cursor: pointer; text-align: left;
}
.a11y-prof .a11y-ico { width: 36px; height: 36px; }
.a11y-prof .a11y-ico svg { width: 20px; height: 20px; }
.a11y-prof-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.a11y-prof-name { font-size: 14px !important; font-weight: 700; line-height: 1.2 !important; }
.a11y-prof-desc { font-size: 11.5px !important; font-weight: 400; line-height: 1.25 !important; color: #5b6b80; }
.a11y-prof[aria-pressed="true"] .a11y-ico { background: #000; color: #fff; }

/* Yazı boyutu satırı */
.a11y-body > .a11y-size:first-child { margin-top: 0; }
.a11y-size {
    display: flex; align-items: center; justify-content: space-between;
    background: transparent; border: 1px solid #d9d9d9; border-radius: 8px; box-shadow: none;
    padding: 10px 12px; margin: 18px 0 0;
}
.a11y-size-label { font-weight: 400; font-size: 14px !important; color: #000; }
.a11y-size-ctrl { display: flex; align-items: center; gap: 8px; }
.a11y-size-btn {
    width: 42px; height: 36px;
    border: 1px solid #d9d9d9; border-radius: 6px;
    background: transparent; color: #000;
    font-size: 17px !important; font-weight: 700;
    cursor: pointer; padding: 0; margin: 0;
}
.a11y-size-btn:hover { color: #bf1e1d; }
.a11y-size-btn:disabled { opacity: .35; cursor: default; color: #000; }
.a11y-size-val { min-width: 52px; text-align: center; font-weight: 600; font-size: 15px !important; color: #000; }

/* Özellik kutucukları — her kutuda aynı yapı: simge · etiket · durum satırı */
.a11y-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.a11y-tile {
    position: relative;
    display: flex; flex-direction: column; align-items: center; justify-content: flex-start;
    gap: 6px;
    padding: 14px 8px 8px;
    margin: 0;
    border: 1px solid #d9d9d9; border-radius: 8px;
    background: transparent; color: #000;
    box-shadow: none;
    cursor: pointer;
    font-size: 14px !important; font-weight: 600; line-height: 1.2 !important;
    text-align: center;
}
.a11y-lbl { display: block; color: #000; font-weight: 400; }
/* Kutu ve satır etiketleri: siyah, normal kalınlık, Open Sans (Titillium küçük boyda kalın görünüyor) */
.a11y-ui .a11y-lbl, .a11y-ui .a11y-size-label { font-family: "Open Sans", Arial, sans-serif !important; }
.a11y-sub {
    display: block; min-height: 15px;
    font-size: 11.5px !important; font-weight: 700; line-height: 15px !important;
    color: #bf1e1d;
}
.a11y-tile:hover { border-color: #9a9a9a; }
.a11y-tile[aria-pressed="true"] .a11y-ico { background: #000; color: #fff; }
.a11y-tile:disabled { opacity: .45; cursor: not-allowed; }
.a11y-tile:disabled:hover { border-color: #d9d9d9; }

/* Seviye göstergesi: sağ üst köşe */
.a11y-dots { position: absolute; top: 9px; right: 9px; display: flex; gap: 3px; }
.a11y-dots span { width: 10px; height: 3px; border-radius: 2px; background: currentColor; opacity: .22; }
.a11y-dots span.on { opacity: 1; }

/* Açık/kapalı kutucuklar ve profiller: açıkken sağ üstte onay rozeti */
.a11y-tile:not([data-lv])[aria-pressed="true"]::after,
.a11y-prof[aria-pressed="true"]::after {
    content: "";
    position: absolute; top: 7px; right: 7px;
    width: 16px; height: 16px; border-radius: 50%;
    background: #bf1e1d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 10px no-repeat;
}

/* Grupta tek kalan son kutu: iki sütuna yayılır, yatay düzende durur (boş hücre kalmaz) */
.a11y-grid > .a11y-tile:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    flex-direction: row;
    justify-content: flex-start;
    gap: 12px;
    padding: 10px 14px;
    text-align: left;
}
.a11y-grid > .a11y-tile:last-child:nth-child(odd) .a11y-sub { margin-left: auto; padding-right: 22px; }

.a11y-foot {
    padding: 12px 16px; border-top: 1px solid #e1e6ee; background: #fff;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.a11y-reset {
    display: inline-flex; align-items: center; gap: 8px;
    border: 1px solid #d5dce6; border-radius: 8px;
    border-color: #d9d9d9 !important;
    background: transparent; color: #000;
    padding: 8px 16px; margin: 0; cursor: pointer;
    font-size: 14px !important; font-weight: 700;
}
.a11y-reset:hover { color: #bf1e1d; border-color: #9a9a9a !important; }
.a11y-reset svg { width: 18px; height: 18px; }
.a11y-statement {
    border: 0; background: transparent; padding: 4px 0; margin: 0; cursor: pointer;
    color: #000 !important; font-size: 14px !important; font-weight: 600;
    text-decoration: underline !important; text-underline-offset: 3px;
}
.a11y-statement:hover { color: #bf1e1d !important; }

/* ---------- Açıklama görünümü (panel içinde; kutular gibi zeminsiz) ---------- */
.a11y-panel.a11y-info-open .a11y-body,
.a11y-panel.a11y-info-open .a11y-foot { display: none; }
.a11y-info { flex: 1; overflow-y: auto; padding: 16px; background: #fff; }
.a11y-info[hidden] { display: none; }
.a11y-info-head {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    border-bottom: 1px solid #bf1e1d; padding-bottom: 10px; margin-bottom: 14px;
}
.a11y-info-title {
    margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important;
    font-size: 16px !important; font-weight: 700 !important; line-height: 1.3 !important; color: #000 !important;
}
.a11y-info-title:focus { outline: none !important; box-shadow: none !important; }
.a11y-info-close {
    width: 34px; height: 34px; flex: none;
    border: 1px solid #d9d9d9; border-radius: 6px;
    background: transparent; color: #000;
    display: flex; align-items: center; justify-content: center;
    padding: 0; margin: 0; cursor: pointer;
}
.a11y-info-close:hover { color: #bf1e1d; }
.a11y-info-close svg { width: 18px; height: 18px; }
.a11y-info-text { font-size: 14px !important; font-weight: 400; line-height: 1.65 !important; color: #000; }
/* Açıklama metni: Open Sans (sitede yerel yüklü) — Titillium dar ve sık olduğundan küçük boyda kalın görünüyor */
.a11y-ui .a11y-info-text, .a11y-ui .a11y-info-text * { font-family: "Open Sans", Arial, sans-serif !important; }
.a11y-info-text p { margin: 0 0 10px !important; padding: 0 !important; text-align: justify; text-indent: 1.5em; -webkit-hyphens: auto; hyphens: auto; }
.a11y-info-text h4 {
    margin: 18px 0 6px !important; padding: 0 !important; border: 0 !important; background: none !important;
    font-size: 14px !important; font-weight: 700 !important; color: #000 !important;
}
.a11y-info-text ul { margin: 0 0 12px !important; padding: 0 0 0 18px !important; }
.a11y-info-text li { margin: 0 0 4px !important; list-style: disc; }
.a11y-info-text kbd {
    display: inline-block; padding: 0 6px; border: 1px solid #bcbcbc; border-radius: 4px;
    background: transparent; color: #3a3a3a; box-shadow: none;
    font-size: 12.5px !important; font-weight: 600; line-height: 1.5 !important;
}
.a11y-info-text a { color: #000 !important; text-decoration: underline !important; text-underline-offset: 3px; }
.a11y-info-text a:hover { color: #bf1e1d !important; }

/* Panel içindeki tüm yazılar: #000000, normal kalınlık (başlık şeridi hariç).
   Simge (.a11y-ico) hariç tutulur: açık ayarda siyah daire içinde beyaz kalmalı. */
.a11y-ui .a11y-body *:not(.a11y-ico):not(svg):not(path):not(circle):not(rect):not(line):not(polyline):not(polygon),
.a11y-ui .a11y-foot *:not(svg):not(path):not(circle):not(rect):not(line):not(polyline):not(polygon),
.a11y-ui .a11y-info *:not(svg):not(path):not(circle):not(rect):not(line):not(polyline):not(polygon) {
    color: #000000 !important;
    font-weight: normal !important;
}
.a11y-ui .a11y-reset:hover, .a11y-ui .a11y-reset:hover *,
.a11y-ui .a11y-size-btn:hover, .a11y-ui .a11y-statement:hover,
.a11y-ui .a11y-info-close:hover, .a11y-ui .a11y-info-text a:hover { color: #bf1e1d !important; }

@media (max-width: 420px) {
    .a11y-panel { width: 100vw; }
    .a11y-toggle { width: 50px; height: 50px; left: 12px; }
}

/* =========================================================
   UYGULANAN AYARLAR (yalnızca ziyaretçi açınca <html>'e eklenen sınıflar)
   "body > :not(.a11y-ui)" → aracın kendisi etkilenmez
   ========================================================= */

/* Satır aralığı */
html.a11y-lh-1 body > :not(.a11y-ui), html.a11y-lh-1 body > :not(.a11y-ui) * { line-height: 1.8 !important; }
html.a11y-lh-2 body > :not(.a11y-ui), html.a11y-lh-2 body > :not(.a11y-ui) * { line-height: 2.1 !important; }
html.a11y-lh-3 body > :not(.a11y-ui), html.a11y-lh-3 body > :not(.a11y-ui) * { line-height: 2.5 !important; }

/* Harf aralığı */
html.a11y-ls-1 body > :not(.a11y-ui) * { letter-spacing: .06em !important; word-spacing: .1em !important; }
html.a11y-ls-2 body > :not(.a11y-ui) * { letter-spacing: .12em !important; word-spacing: .2em !important; }
html.a11y-ls-3 body > :not(.a11y-ui) * { letter-spacing: .18em !important; word-spacing: .3em !important; }

/* Okunabilir yazı tipi (ikon fontları hariç) */
html.a11y-font body > :not(.a11y-ui) *:not(i):not(.fa):not(.fas):not(.far):not(.fab):not([class*="fa-"]):not([class*="bi-"]):not(.glyphicon):not([class*="owl-"]) {
    font-family: Verdana, Tahoma, "Segoe UI", Arial, sans-serif !important;
}

/* Renk filtreleri (ters renk / gri tonlama) — değer JS'ten gelir */
html.a11y-filter body > :not(.a11y-ui) { filter: var(--a11y-filter) !important; }
html.a11y-invert body { background: #111 !important; }
/* Ters renkte fotoğraflar doğal görünsün */
html.a11y-invert body > :not(.a11y-ui) img,
html.a11y-invert body > :not(.a11y-ui) video,
html.a11y-invert body > :not(.a11y-ui) iframe { filter: invert(1) hue-rotate(180deg) !important; }

/* Yüksek kontrast — Koyu */
html.a11y-hc-dark body { background: #000 !important; }
html.a11y-hc-dark body > :not(.a11y-ui),
html.a11y-hc-dark body > :not(.a11y-ui) * {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #fff !important;
    text-shadow: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}
html.a11y-hc-dark body > :not(.a11y-ui) a,
html.a11y-hc-dark body > :not(.a11y-ui) a * { color: #ffeb3b !important; }
html.a11y-hc-dark body > :not(.a11y-ui) h1, html.a11y-hc-dark body > :not(.a11y-ui) h2,
html.a11y-hc-dark body > :not(.a11y-ui) h3, html.a11y-hc-dark body > :not(.a11y-ui) h4,
html.a11y-hc-dark body > :not(.a11y-ui) h5, html.a11y-hc-dark body > :not(.a11y-ui) h6 { color: #7fdbff !important; }

/* Yüksek kontrast — Açık */
html.a11y-hc-light body { background: #fff !important; }
html.a11y-hc-light body > :not(.a11y-ui),
html.a11y-hc-light body > :not(.a11y-ui) * {
    background-color: #fff !important;
    color: #000 !important;
    border-color: #000 !important;
    text-shadow: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}
html.a11y-hc-light body > :not(.a11y-ui) a,
html.a11y-hc-light body > :not(.a11y-ui) a * { color: #0000c8 !important; }

/* Bağlantıları vurgula */
html.a11y-links body > :not(.a11y-ui) a {
    text-decoration: underline !important;
    text-underline-offset: 3px;
    outline: 2px solid #bf1e1d !important;
    outline-offset: 1px;
    background-color: #fff59d !important;
    color: #000 !important;
}
html.a11y-links body > :not(.a11y-ui) a * { color: #000 !important; }

/* Büyük imleç */
html.a11y-cursor, html.a11y-cursor * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 9-6.5 1.6L9 19z' fill='%23000' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4, auto !important;
}
html.a11y-cursor a, html.a11y-cursor a *, html.a11y-cursor button, html.a11y-cursor button *,
html.a11y-cursor [role="button"], html.a11y-cursor label, html.a11y-cursor select, html.a11y-cursor summary {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 24 24'%3E%3Cpath d='M4 2l15 9-6.5 1.6L9 19z' fill='%23bf1e1d' stroke='%23fff' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 4, pointer !important;
}

/* Animasyonları durdur */
html.a11y-noanim *, html.a11y-noanim *::before, html.a11y-noanim *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}
html.a11y-noanim [data-aos] { opacity: 1 !important; transform: none !important; }

/* Görselleri gizle */
html.a11y-noimg body > :not(.a11y-ui) img,
html.a11y-noimg body > :not(.a11y-ui) video,
html.a11y-noimg body > :not(.a11y-ui) picture { visibility: hidden !important; }
html.a11y-noimg body > :not(.a11y-ui) * { background-image: none !important; }

/* Okuma kılavuzu */
.a11y-guide-line {
    position: fixed; left: 0; width: 100%; height: 10px;
    background: #ffbf47; border-top: 2px solid #0a294e; border-bottom: 2px solid #0a294e;
    pointer-events: none; z-index: 2147483500; display: none;
    transform: translateY(-50%);
}
.a11y-guide-mask {
    position: fixed; left: 0; width: 100%;
    background: rgba(0, 0, 0, .6);
    pointer-events: none; z-index: 2147483500; display: none;
}
.a11y-guide-mask.a11y-top { top: 0; }
.a11y-guide-mask.a11y-bottom { bottom: 0; }

/* Sesli okumada okunan öğe */
.a11y-reading {
    outline: 3px dashed #bf1e1d !important;
    outline-offset: 3px !important;
    background-color: #fff59d !important;
    color: #000 !important;
}