/* GSÜ OBS erişilebilirlik menüsü: sağ kenardaki sabit düğme, kayan panel ve <html> üzerindeki a11y-* tercih sınıfları
   (_AccessibilityHead ve obs.a11y.menu.js ekler). GSUWeb style.a11y.css uyarlaması.
   Panel ölçüleri px: metin boyutu kök yazı boyutunu ölçekler, panel sabit kalır ki kullanıcı menüyü kaybetmesin. */

/* ---------- Ortak ---------- */
.a11y-sr {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.a11y-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* ---------- Düğme ---------- */
.a11y-menu__toggle {
    position: fixed;
    top: 50%;
    right: 0;
    z-index: 1034;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    margin-top: -22px;
    padding: 0;
    border: 0;
    border-radius: 6px 0 0 6px;
    background: #a30200;
    color: #fff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .25);
    cursor: pointer;
    transition: right .3s ease;
}

    .a11y-menu__toggle .a11y-icon {
        width: 28px;
        height: 28px;
    }

    .a11y-menu__toggle:hover,
    .a11y-menu__toggle[aria-expanded="true"] {
        background: #7a0201;
    }

/* Panel açıkken düğme panelin kenarına taşınır; dar ekranda panel tüm genişliği kaplar, düğme altında kalır. */
.a11y-menu.is-open .a11y-menu__toggle {
    right: 360px;
}

@media (max-width: 479px) {
    .a11y-menu.is-open .a11y-menu__toggle {
        right: 0;
    }
}

/* ---------- Panel ---------- */
/* Kapalı panel ekran dışında olsa da içindeki öğeler klavyeyle odaklanabilirdi; kayma bitince gizlenir. */
.a11y-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 1035;
    width: 360px;
    max-width: 100%;
    padding: 24px 20px;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #fff;
    color: #333;
    font-size: 14px;
    line-height: 1.4;
    text-align: left;
    box-shadow: -4px 0 24px rgba(0, 0, 0, .18);
    transform: translateX(100%);
    visibility: hidden;
    transition: transform .3s ease, visibility 0s linear .3s;
}

.a11y-menu.is-open .a11y-panel {
    transform: none;
    visibility: visible;
    transition: transform .3s ease, visibility 0s linear 0s;
}

@media (max-width: 479px) {
    .a11y-panel {
        width: 100%;
        padding: 20px 16px;
    }
}

.a11y-panel__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

/* Tema başlıkları rem ve renkli; panel başlığı metin boyutundan etkilenmesin diye px. */
.a11y-panel .a11y-panel__title {
    display: flex;
    align-items: center;
    margin: 0;
    color: #222;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

    /* Odak açılışta programla verilir; obs.a11y.css'in id özgüllüğündeki çerçevesi başlıkta gösterilmez (GSUWeb ile aynı). */
    html:not(#obs-a11y):not(#a11y-menu) .a11y-panel .a11y-panel__title:focus {
        outline: none !important;
        box-shadow: none !important;
    }

.a11y-panel__logo {
    width: 28px;
    height: 28px;
    margin-right: 10px;
    color: #a30200;
}

.a11y-panel__close {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    margin-left: 10px;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 50%;
    background: #fff;
    color: #333;
    cursor: pointer;
}

    .a11y-panel__close .a11y-icon {
        width: 20px;
        height: 20px;
    }

    .a11y-panel__close:hover {
        border-color: #a30200;
        color: #a30200;
    }

.a11y-panel__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
}

.a11y-option {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 92px;
    margin: 0;
    padding: 14px 8px;
    border: 2px solid #e4e4e4;
    border-radius: 8px;
    background: #fff;
    color: #333;
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    cursor: pointer;
}

    .a11y-option > * + * {
        margin-top: 6px;
    }

    .a11y-option:hover {
        border-color: #a30200;
    }

    .a11y-option[aria-pressed="true"] {
        border-color: #a30200;
        background: #fdf1f1;
        color: #a30200;
    }

    .a11y-option--reset {
        grid-column: 1 / -1;
        flex-direction: row;
        min-height: 0;
        border-style: dashed;
    }

        .a11y-option--reset > * + * {
            margin-top: 0;
            margin-left: 8px;
        }

/* Tema odak çerçevelerini kaldırıyor (v604: body button{outline:none!important}); giriş sayfalarında obs.a11y.css yok. */
html:not(#a11y-menu) .a11y-menu :focus-visible {
    outline: 1px solid #a30200 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #fff !important;
    transition: none !important;
}

html:not(#a11y-menu) .a11y-menu .a11y-menu__toggle:focus-visible {
    outline: 2px solid #f5c000 !important;
    outline-offset: -4px !important;
    box-shadow: none !important;
}

.a11y-option__steps {
    display: flex;
}

    .a11y-option__steps span {
        width: 16px;
        height: 4px;
        margin: 0 2px;
        border-radius: 2px;
        background: #ccc;
    }

.a11y-option[data-level="1"] .a11y-option__steps span:nth-child(-n+1),
.a11y-option[data-level="2"] .a11y-option__steps span:nth-child(-n+2),
.a11y-option[data-level="3"] .a11y-option__steps span {
    background: #a30200;
}

/* Kademeli seçeneklerde seçili kademenin adı */
.a11y-option__value {
    display: none;
    font-size: 12px;
    font-weight: 400;
}

.a11y-option[data-level="1"] .a11y-option__value[data-level-label="1"],
.a11y-option[data-level="2"] .a11y-option__value[data-level-label="2"],
.a11y-option[data-level="3"] .a11y-option__value[data-level-label="3"] {
    display: block;
}

/* Değer işletim sistemi ayarından geliyorsa */
.a11y-option__auto {
    display: none;
    position: absolute;
    top: 6px;
    right: 6px;
    padding: 1px 6px;
    border-radius: 8px;
    background: #f5c000;
    color: #000;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
}

.a11y-option[data-auto="true"] .a11y-option__auto {
    display: block;
}

/* ---------- Tercihler ---------- */

/* Metin boyutu: kökü _AccessibilityHead ölçekler; temada body'nin de px boyutu var (body,html{font-size:14px}). */
html.a11y-text body {
    font-size: 1rem !important;
}

/* Masaüstü başlığının yüksekliği px; büyüyen menü bağlantıları iki satıra kayıp alt başlığın altında kalıyor, sağdaki
   dil ve kullanıcı açıcıları menünün üstüne biniyordu. Yalnız başlıktaki bu öğeler eski boyutunda tutulur (zoom, rem
   boşlukları da geri alır); açılan alt menüler ve açılır listeler büyük kalır.
   Sağdaki açıcılarda zoom açıcının kendisine değil içeriğine verilir: Popper konumu zoom'lu öğeden yanlış hesaplıyor
   (açılır liste ekranın soluna düşüyordu). */
@media (min-width: 1025px) {
    html.a11y-text .m-header-menu .m-menu__nav > .m-menu__item > .m-menu__link,
    html.a11y-text .kt-header-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link,
    html.a11y-text .m-topbar__nav > .m-nav__item > .m-nav__link > *,
    html.a11y-text .kt-header__topbar > .kt-header__topbar-item > .kt-header__topbar-wrapper > *,
    html.a11y-text .kt-header > .kt-header__title {
        zoom: var(--a11y-text-unscale, 1);
    }
}

/* Yüksek kontrast. :where ile özgüllük düşük tutulur ki aşağıdaki bağlantı ve panel kuralları kazansın. */
html.a11y-contrast body,
html.a11y-contrast body :where(*:not(img, video, iframe, canvas, svg, svg *)) {
    background-color: #000 !important;
    background-image: none !important;
    color: #fff !important;
    border-color: #fff !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html.a11y-contrast body a,
html.a11y-contrast body a * {
    color: #ff0 !important;
}

html.a11y-contrast body ::placeholder {
    color: #ccc !important;
    opacity: 1 !important;
}

/* Tema onay kutusu ve radyo işaretleri ::after ile çiziliyor; genel kural sözde öğelere uygulanmıyor. */
html.a11y-contrast .m-checkbox > span::after,
html.a11y-contrast .kt-checkbox > span::after {
    border-color: #fff !important;
}

html.a11y-contrast .m-radio > span::after,
html.a11y-contrast .kt-radio > span::after {
    border-color: #fff !important;
    background: #fff !important;
}

/* Rozetler ve etkin menü/sekme/sayfa öğesi yalnız zemin rengiyle ayrılıyordu; tek renk zeminde çerçeveyle ayrılır. */
html.a11y-contrast :where(.m-badge, .kt-badge, .badge) {
    outline: 1px solid #fff !important;
}

html.a11y-contrast :where(.m-menu__item--active > .m-menu__link, .kt-menu__item--active > .kt-menu__link, .m-menu__item--here > .m-menu__link, .kt-menu__item--here > .kt-menu__link, .nav-link.active, .page-item.active > .page-link, .m-nav__item--active > .m-nav__link) {
    outline: 2px solid #ff0 !important;
    outline-offset: -2px !important;
}

/* Düğme zemini sayfayla aynı renge döndüğü için çerçeveyle seçilir. */
html.a11y-contrast .a11y-menu__toggle {
    border: 2px solid #fff !important;
}

html.a11y-contrast .a11y-option[aria-pressed="true"],
html.a11y-contrast .a11y-option[aria-pressed="true"] * {
    color: #ff0 !important;
    border-color: #ff0 !important;
}

html.a11y-contrast .a11y-option__steps span {
    border: 1px solid #fff !important;
}

html.a11y-contrast .a11y-option[data-level="1"] .a11y-option__steps span:nth-child(-n+1),
html.a11y-contrast .a11y-option[data-level="2"] .a11y-option__steps span:nth-child(-n+2),
html.a11y-contrast .a11y-option[data-level="3"] .a11y-option__steps span {
    background-color: #ff0 !important;
}

/* obs.a11y.css odak kuralı id özgüllüğünde (html:not(#obs-a11y)); renk aynı özgüllükle ezilir. */
html.a11y-contrast:not(#obs-a11y) :focus-visible {
    outline: 3px solid #ff0 !important;
    outline-offset: 2px !important;
}

/* Form alanlarının kırmızı odak kenarlığı (obs.a11y.css) kontrast renginde */
html.a11y-contrast:not(#obs-a11y) :where(input, textarea, select):focus,
html.a11y-contrast:not(#obs-a11y) :where(.select2-container--focus, .select2-container--open) .select2-selection {
    border-color: #ff0 !important;
    box-shadow: 0 0 0 1px #ff0 !important;
}

/* Açık kontrast: beyaz zemin, siyah metin, altı çizili mavi bağlantı. */
html.a11y-contrast-light body,
html.a11y-contrast-light body :where(*:not(img, video, iframe, canvas, svg, svg *)) {
    background-color: #fff !important;
    background-image: none !important;
    color: #000 !important;
    border-color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

html.a11y-contrast-light body a,
html.a11y-contrast-light body a * {
    color: #0000c8 !important;
    text-decoration: underline !important;
}

html.a11y-contrast-light body ::placeholder {
    color: #555 !important;
    opacity: 1 !important;
}

html.a11y-contrast-light .m-checkbox > span::after,
html.a11y-contrast-light .kt-checkbox > span::after {
    border-color: #000 !important;
}

html.a11y-contrast-light .m-radio > span::after,
html.a11y-contrast-light .kt-radio > span::after {
    border-color: #000 !important;
    background: #000 !important;
}

html.a11y-contrast-light :where(.m-badge, .kt-badge, .badge) {
    outline: 1px solid #000 !important;
}

html.a11y-contrast-light :where(.m-menu__item--active > .m-menu__link, .kt-menu__item--active > .kt-menu__link, .m-menu__item--here > .m-menu__link, .kt-menu__item--here > .kt-menu__link, .nav-link.active, .page-item.active > .page-link, .m-nav__item--active > .m-nav__link) {
    outline: 2px solid #0000c8 !important;
    outline-offset: -2px !important;
}

html.a11y-contrast-light .a11y-menu__toggle {
    border: 2px solid #000 !important;
}

html.a11y-contrast-light .a11y-option[aria-pressed="true"] {
    outline: 2px solid #000 !important;
}

html.a11y-contrast-light .a11y-option__steps span {
    border: 1px solid #000 !important;
}

html.a11y-contrast-light .a11y-option[data-level="1"] .a11y-option__steps span:nth-child(-n+1),
html.a11y-contrast-light .a11y-option[data-level="2"] .a11y-option__steps span:nth-child(-n+2),
html.a11y-contrast-light .a11y-option[data-level="3"] .a11y-option__steps span {
    background-color: #000 !important;
}

html.a11y-contrast-light:not(#obs-a11y) :focus-visible {
    outline: 3px solid #0000c8 !important;
    outline-offset: 2px !important;
}

html.a11y-contrast-light:not(#obs-a11y) :where(input, textarea, select):focus,
html.a11y-contrast-light:not(#obs-a11y) :where(.select2-container--focus, .select2-container--open) .select2-selection {
    border-color: #0000c8 !important;
    box-shadow: 0 0 0 1px #0000c8 !important;
}

html.a11y-contrast-light:not(#a11y-menu) .a11y-menu .a11y-menu__toggle:focus-visible {
    outline-color: #0000c8 !important;
}

/* Gri tonlama. Kök öğeye uygulanır: filter başka öğede sabit konumlu başlık ve paneli bozar, kökte bozmaz. */
html.a11y-grayscale {
    filter: grayscale(1);
}

/* Bağlantıları vurgula */
html.a11y-links body a:not(.a11y-menu *) {
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 3px !important;
    outline: 2px solid #a30200 !important;
    outline-offset: 2px !important;
}

html.a11y-contrast.a11y-links body a:not(.a11y-menu *) {
    outline-color: #ff0 !important;
}

/* Animasyonları durdur. Süre 0 yerine .01ms: animationend/transitionend bekleyen betikler (Bootstrap, SweetAlert)
   olaysız kalmasın. Yükleniyor göstergeleri de durur; yanlarındaki metin kalır. */
html.a11y-motion,
html.a11y-motion *,
html.a11y-motion *::before,
html.a11y-motion *::after {
    animation-duration: .01ms !important;
    animation-delay: 0s !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
    scroll-behavior: auto !important;
}

/* Panelin görünürlük geçişi .01ms bile olsa açıldığı anda "hidden" okunuyor ve odak başlığa geçemiyordu (GSUWeb'de görüldü). */
html.a11y-motion .a11y-panel,
html.a11y-motion .a11y-menu__toggle {
    transition: none !important;
}

/* Okunaklı yazı tipi. İkon fontları hariç (Line Awesome, Flaticon, Font Awesome, Socicon). */
html.a11y-font body,
html.a11y-font body :where(*:not(i, .la, .fa, .fab, .fas, .far, .fal, [class^="la-"], [class*=" la-"], [class*="fa-"], [class*="flaticon"], [class*="socicon"], [class*="-icon"])) {
    font-family: Verdana, Tahoma, Arial, sans-serif !important;
}

/* Metin aralığı (WCAG 1.4.12 değerleri). Panel sabit kalır. */
html.a11y-spacing body :where(p, li, dd, dt, td, th, label, blockquote, a, span, h1, h2, h3, h4, h5, h6):not(.a11y-menu *) {
    line-height: 1.9 !important;
    letter-spacing: .12em !important;
    word-spacing: .16em !important;
}

/* Büyük imleç; tıklanabilir öğelerde kırmızı. */
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 48 48'%3E%3Cpath d='M6 4v34l9-8 6 14 6-3-6-13h12z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, auto !important;
}

html.a11y-cursor a,
html.a11y-cursor a *,
html.a11y-cursor button,
html.a11y-cursor button *,
html.a11y-cursor label,
html.a11y-cursor select,
html.a11y-cursor summary,
html.a11y-cursor [role="button"],
html.a11y-cursor [role="button"] * {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M6 4v34l9-8 6 14 6-3-6-13h12z' fill='%23a30200' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, pointer !important;
}

html.a11y-cursor input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"]),
html.a11y-cursor textarea {
    cursor: text !important;
}

/* Sola hizala. İki yana yaslı ve ortalı metin dahil (WCAG 1.4.8). */
html.a11y-align body :where(p, li, dd, dt, td, th, blockquote, figcaption, label, h1, h2, h3, h4, h5, h6, [style*="text-align"]):not(.a11y-menu *) {
    text-align: left !important;
}

/* Resimleri gizle. Yer korunur ki sayfa düzeni kaymasın. Satır içi arka plan görseli olan alanlar
   (kullanıcı kartı) koyu zemine döner; üstlerindeki beyaz metin okunur kalır. */
html.a11y-images body img,
html.a11y-images body picture,
html.a11y-images body video {
    visibility: hidden !important;
}

html.a11y-images body [style*="background-image"] {
    background-image: none !important;
    background-color: #4a4a4a !important;
}

/* Okuma rehberi: imleci izleyen çizgi ya da imleç çevresi dışını karartan maske. Konumu obs.a11y.menu.js
   --a11y-guide-y ile verir. Renkler kontrast kurallarını ezmek için !important. */
.a11y-guide > div {
    display: none;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1033;
    pointer-events: none;
}

html.a11y-guide-line .a11y-guide .a11y-guide__line {
    display: block;
    top: calc(var(--a11y-guide-y, 50vh) + 14px);
    height: 14px;
    border-top: 3px solid #f5c000 !important;
    border-bottom: 3px solid #f5c000 !important;
    background-color: #000 !important;
    opacity: .85;
}

html.a11y-guide-mask .a11y-guide .a11y-guide__top,
html.a11y-guide-mask .a11y-guide .a11y-guide__bottom {
    display: block;
    background-color: rgba(0, 0, 0, .6) !important;
}

.a11y-guide .a11y-guide__top {
    top: 0;
    height: max(0px, calc(var(--a11y-guide-y, 50vh) - 50px));
}

.a11y-guide .a11y-guide__bottom {
    top: calc(var(--a11y-guide-y, 50vh) + 50px);
    bottom: 0;
}
