:root {
    --abp-red: #9e141f;
    --abp-red-dark: #87111b;
    --abp-red-light: #c0392b;
    --abp-red-bg: #fdf0ef;
    --abp-blue: #004480;
    --abp-blue-dark: #003366;
    --abp-blue-light: #1a5c9e;
    --abp-blue-bg: #eef4fb;
    --abp-navbar-bg: linear-gradient(180deg, #9e141f, #87111b);
    --abp-navbar-height: 52px;
    --abp-sidebar-width: 200px;
    --abp-content-bg: #f4f6f9;
    --abp-card-bg: #ffffff;
    --abp-border: #dee2e6;
    --abp-border-light: #ececec;
    --abp-text: #333333;
    --abp-text-muted: #6c757d;
    --abp-link: #9e141f;
    --abp-font: 'Quicksand', 'Segoe UI', Tahoma, 'Helvetica Neue', Arial, sans-serif;
}

html,
body {
    height: 100%;
    padding-top: 0;
}

body {
    font-family: var(--abp-font);
    font-weight: 500;
    font-size: 14px;
    line-height: 1.428571429;
    color: #2c3e50;
}

ul li {
    list-style: none;
}

.abp-navbar {
    background: var(--abp-red, #9e141f);
    padding-top: 6px;
    padding-bottom: 6px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

.abp-navbar .navbar-brand {
    font-family: var(--abp-font);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 0.3px;
    color: #fff;
    gap: 10px;
    display: flex;
    align-items: center;
}

.abp-navbar .navbar-brand:hover {
    color: rgba(255, 255, 255, 0.85);
}

.abp-navbar .nav-link {
    font-family: var(--abp-font);
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 0.4px;
    color: rgba(255, 255, 255, 0.88) !important;
    padding: 8px 14px !important;
    position: relative;
    transition: color .2s ease;
}

.abp-navbar .nav-link::after {
    content: '';
    position: absolute;
    bottom: 2px;
    left: 14px;
    right: 14px;
    height: 2px;
    background: #fff;
    border-radius: 2px;
    transform: scaleX(0);
    transition: transform .2s ease;
}

.abp-navbar .nav-link:hover {
    color: #fff !important;
}

.abp-navbar .nav-link:hover::after {
    transform: scaleX(1);
}

.abp-navbar .dropdown-menu {
    border: none;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    min-width: 120px;
}

.abp-navbar .dropdown-item {
    font-family: var(--abp-font);
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    color: var(--abp-text, #333);
}

.abp-navbar .dropdown-item:hover {
    background-color: var(--abp-red-bg, #fdf0ef);
    color: var(--abp-red, #9e141f);
}

h2,
.h2 {
    font-size: 18px;
}

.jumbotron {
    font-size: 14px;
}

/* ── Anasayfa Slider ──
   Eski kurallar BS3 icindi: .carousel-control ve .carousel-control.left/.right
   secicileri BS5'te yok (artik .carousel-control-prev / -next), bu yuzden
   kontroller stilsiz kaliyordu. Ayrica .carousel'e sabit height:200px
   verilmisti; uzun slayt icerigi (baslik + paragraf + 6 bag) tasiyordu. */
.carousel {
    position: relative;
    margin-bottom: 24px;
    background-color: var(--abp-content-bg, #f4f6f9);
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 8px;
}

/* Tum slaytlar ayni grid hucresinde ust uste duruyor. Boylece kutu, en uzun
   slaydin yuksekligini aliyor ve slayt degisiminde ziplamiyor. BS5 inaktif
   slaytlara display:none verdigi icin onlar yukseklige katkida bulunmuyor,
   olcumde 768px'te 150px'e varan ziplama olusuyordu (slayt1 360px / slayt2 210px).
   Yukseklik icerikten turedigi icin breakpoint basina sabit deger gerekmiyor. */
.carousel-inner {
    display: grid;
}

.carousel-item {
    grid-area: 1 / 1;
    /* Yukseklik en uzun slayta gore sabitlendigi icin kisa slaytlarda bosluk
       kaliyor; icerigi dikey ortalayarak bosluk alta yigilmasin. */
    display: grid;
    align-content: center;
    float: none;
    margin-right: 0;
    min-height: 210px;
    padding: 20px 48px 44px;
    /* Gorunmeyen slaytlar yer kaplamaya devam etsin ama baglantilari
       fare/klavye ile erisilebilir olmasin. */
    visibility: hidden;
}

.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
    visibility: visible;
}

/* Slaytlar ayni grid hucresinde ust uste durdugu icin gecis aninda iki
   slaydin metni birbirinin uzerinden okunuyordu ("hayalet yazi"). Opak zemin
   + katman sirasi ile giren slayt cikani tamamen kapatiyor. */
.carousel-item {
    background-color: var(--abp-content-bg, #f4f6f9);
    z-index: 0;
}

.carousel-item.active {
    z-index: 1;
}

/* Giren slayt en ustte kalmali, yon (ileri/geri) fark etmeksizin */
.carousel-item-next,
.carousel-item-prev {
    z-index: 2;
}

/* Slayt govdesi: gorsel + metin (onceden float-start ile kuruluyordu) */
.slide-body {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.slide-img {
    flex: 0 0 auto;
    width: 110px;
    height: auto;
    border-radius: 6px;
}

.slide-text {
    min-width: 0;
}

.slide-text h2 {
    margin: 0 0 8px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.3;
    color: var(--abp-text, #333);
}

.slide-text p {
    margin: 0;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
}

/* Diploma eki PDF baglantilari */
.ds-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.ds-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    background-color: var(--abp-card-bg, #ffffff);
    border: 1px solid var(--abp-border, #dee2e6);
    border-radius: 999px;
    color: var(--abp-text, #333);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.3;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.ds-link:hover,
.ds-link:focus-visible {
    background-color: var(--abp-red-bg, #fdf0ef);
    border-color: var(--abp-red, #9e141f);
    color: var(--abp-red, #9e141f);
    text-decoration: none;
}

.ds-link:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 2px;
}

.ds-link i.fa {
    font-size: .85em;
    color: var(--abp-text-muted, #6c757d);
}

.ds-link:hover i.fa,
.ds-link:focus-visible i.fa {
    color: inherit;
}

/* Kontroller: BS5'in beyaz SVG ikonu acik zeminde gorunmedigi icin
   FA ikonu kullaniliyor; renk ve boyut burada veriliyor. */
.carousel-control-prev,
.carousel-control-next {
    width: 40px;
    opacity: 1;
    color: var(--abp-text-muted, #6c757d);
    border-radius: 8px;
    transition: color .15s ease, background-color .15s ease;
}

.carousel-control-prev:hover,
.carousel-control-next:hover,
.carousel-control-prev:focus-visible,
.carousel-control-next:focus-visible {
    color: var(--abp-red, #9e141f);
    background-color: rgba(0, 0, 0, .04);
    opacity: 1;
}

.carousel-control-prev:focus-visible,
.carousel-control-next:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: -2px;
}

.carousel-control-prev i.fa,
.carousel-control-next i.fa {
    font-size: 18px;
}

/* Gostergeler: acik zemin icin koyu noktalar */
.carousel-indicators {
    margin-bottom: 12px;
}

.carousel-indicators [data-bs-target] {
    width: 24px;
    height: 4px;
    border: 0;
    border-radius: 2px;
    background-color: var(--abp-text-muted, #6c757d);
    opacity: .35;
}

.carousel-indicators .active {
    background-color: var(--abp-red, #9e141f);
    opacity: 1;
}

/* BS5 varsayilan odak halkasi mavi; kurumsal renge cekiliyor */
.carousel-indicators [data-bs-target]:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 3px;
    box-shadow: none;
    opacity: 1;
}

@media (max-width: 575.98px) {
    .carousel-item {
        padding: 16px 16px 40px;
    }

    .slide-body {
        flex-direction: column;
        gap: 12px;
    }

    .slide-img {
        width: 84px;
    }

    .slide-text h2 {
        font-size: 17px;
    }

    /* Dar ekranda oklar metnin uzerine biniyordu; gostergeler ve
       dokunmatik kaydirma gezinme icin yeterli. */
    .carousel-control-prev,
    .carousel-control-next {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .carousel-item {
        transition: none;
    }
}

/* .static-banner 21 view'da, .page-banner ise akademik program sayfasinda
   kullaniliyordu; ikisi ayni isi yaptigi halde gorunumleri farkliydi
   (radius yalnizca birinde). Tek kuralda birlestirildi. */
.static-banner,
.page-banner {
    display: block;
    /* width:100% degil: banner gorselleri (960px) genis ekranda dogal
       boyutunun uzerine streclenip bulaniklasmasin. */
    max-width: 100%;
    height: auto;
    margin-bottom: 24px;
    border-radius: 12px;
}

/* Sticky footer: eskiden "#wrapper { margin-bottom: -300px; padding-bottom: 300px }"
   hilesi kullaniliyordu ve footer'in tam 300px olmasina bagliydi. Footer
   yuksekligi artik icerikten turedigi icin flexbox'a gecildi; boylece kisa
   sayfalarda footer en altta kalir, uzun sayfalarda ise akista devam eder. */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

#wrapper {
    flex: 1 0 auto;
}

#footer {
    flex-shrink: 0;
}

.row {
    margin: 0;
}

/* <section class="row"><div class="container">...</div></section> deseni BS3'te
   .row sadece clearfix'ti, zararsızdı. BS5'te .row artık flex+negatif margin
   uyguluyor; .container tek başına bunun flex item'ı olunca kendi max-width/
   margin:auto ile ortalanması bozuluyor (tüm genişliğe yayılıyor). Bu section'ların
   grid'e ihtiyacı yok (tek child'ları .container), o yüzden .row'un flex
   davranışını burada iptal ediyoruz. */
section.row {
    display: block;
    margin: 0;
}

/* #main-content, .row'un flex context'i dışında kaldığı için sidebar/content
   BS5'in flexbox grid'inde yan yana değil alt alta diziliyordu; .row ile aynı
   davranışı burada da zorluyoruz. */
#main-content,
#footer footer>.container {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-top: 20px;
}

/* col-md-* sınıfları yalnızca >=768px'de genişlik tanımlar. #main-content flex
   olduğu için bu breakpoint'in altında .content bir flex item olarak içeriğine
   göre genişliyor ve geniş içerik (kart, tablo) viewport'u taşırıyordu.
   Mobilde tam satır genişliği garanti ediyoruz; md ve üstünde .col-md-9 geçerli. */
@media (max-width: 767.98px) {
    #main-content>.content {
        flex: 1 1 100%;
        min-width: 0;
    }
}

@media (min-width: 576px) {

    #main-content,
    #footer footer>.container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {

    #main-content,
    #footer footer>.container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {

    #main-content,
    #footer footer>.container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {

    #main-content,
    #footer footer>.container {
        max-width: 1140px;
    }
}

@media (min-width: 1400px) {

    #main-content,
    #footer footer>.container {
        max-width: 1320px;
    }
}

.page-header {
    font-size: 20px;
    padding-bottom: 9.5px;
    margin: 0 0 21px;
    border-bottom: 1px solid #ecf0f1;
}

.content {
    text-align: justify;
    padding: 0 0 20px 0;
}

/* ── Breadcrumb ── */
.abp-breadcrumb {
    --bs-breadcrumb-divider: "\203A";
    --bs-breadcrumb-padding-x: 16px;
    --bs-breadcrumb-padding-y: 10px;
    --bs-breadcrumb-margin-bottom: 16px;
    --bs-breadcrumb-bg: var(--abp-content-bg, #f4f6f9);
    --bs-breadcrumb-border-radius: 6px;
    --bs-breadcrumb-divider-color: #adb5bd;
    --bs-breadcrumb-item-active-color: var(--abp-text-muted, #6c757d);
    --bs-breadcrumb-font-size: 13px;
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 6px;
}

.abp-breadcrumb .breadcrumb-item a {
    color: var(--abp-red, #9e141f);
    text-decoration: none;
    transition: color .15s ease;
}

.abp-breadcrumb .breadcrumb-item a:hover {
    color: var(--abp-red-dark, #87111b);
    text-decoration: underline;
}

.side-nav {
    padding-left: 0;
}

/* ── Footer ──
   Eskiden "height: 300px" sabitti ve overflow:visible oldugu icin icerik
   koyu zeminin disina akiyordu (olcum: 1280px'te 7px, 768px'te 107px,
   500px'te 414px tasma). Yukseklik artik icerikten turiyor. */
footer {
    background: #343a40;
    border-top: 2px solid #ecf0f1;
    margin-top: 5em;
    padding: 28px 10px 24px;
}

footer ul {
    padding-left: 0;
    margin-bottom: 16px;
    list-style: none;
}

footer li {
    margin-bottom: 6px;
    font-size: 14px;
}

footer .menu-title {
    margin: 0 0 12px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .02em;
}

footer li a {
    color: #ccc;
    transition: color .15s ease;
}

footer li a:hover,
footer li a:focus-visible {
    color: #ffffff;
    text-decoration: underline;
}

footer li a:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    border-radius: 2px;
}

footer p {
    clear: left;
    margin-bottom: 0
}

/********************
----KURUMSAL CSS----
********************/
ul.akademik-program-list li {
    padding: 10px 0;
}

ul.default-list li {
    padding: 5px 0;
}

/********************
----AKADEMİK CSS----
********************/
ul.akademik-list li {
    padding: 5px 0;
}

ul.akademik-list>li.list-title {
    margin-top: 10px;
}

ul.akademik-list li.bolum {
    padding: 5px 0 5px 10px;
}

ul.akademik-list li.program {
    padding: 5px 0 5px 20px;
}

ul.akademik-list li.altProgram {
    padding: 5px 0 5px 50px;
}

ul.akademik-list li.program a,
ul.akademik-list li.bolum a,
ul.akademik-list li.altProgram a {
    color: #333;
}

ul.default-list>li>a {
    color: #333;
}

.list-group {
    margin-bottom: 0;
}

a {
    text-decoration: none;
}

/* ── Yönetim Kadrosu Kartları ── */
.management-card {
    /* Kartı saran link overlay'i (.mc-content h4 a::after) için konum referansı */
    position: relative;
    display: flex;
    align-items: center;
    gap: 20px;
    height: 100%;
    padding: 16px;
    background: var(--abp-card-bg, #ffffff);
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 8px;
    text-align: left;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.management-card:hover {
    border-color: var(--abp-border, #dee2e6);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .07);
}

.management-card .mc-img-wrap {
    flex: 0 0 auto;
}

/* Kaynak görseller 198x278 (≈1:1.404) — oran korunarak sabitlenir */
.management-card .mc-img-wrap img {
    display: block;
    width: 96px;
    height: 135px;
    object-fit: cover;
    object-position: top center;
    border-radius: 6px;
    background: var(--abp-content-bg, #f4f6f9);
}

.management-card .mc-content {
    min-width: 0;
}

.management-card .mc-content h5 {
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--abp-text-muted, #6c757d);
}

.management-card .mc-content h4 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.35;
}

.management-card .mc-content h4 a {
    color: var(--abp-text, #333);
    transition: color .15s ease;
}

/* Kartın tüm yüzeyi tek link hedefi olur; kartta ikinci bir link
   açmadığımız için ekran okuyucuda tekrar oluşmaz. */
.management-card .mc-content h4 a::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 8px;
}

.management-card:hover .mc-content h4 a,
.management-card .mc-content h4 a:hover,
.management-card .mc-content h4 a:focus-visible {
    color: var(--abp-red, #9e141f);
    text-decoration: underline;
}

.management-card:hover .mc-content i.fa,
.management-card .mc-content h4 a:hover i.fa {
    color: inherit;
}

/* Odak halkası link metni yerine kartın tamamını çevreler */
.management-card .mc-content h4 a:focus-visible {
    outline: none;
}

.management-card .mc-content h4 a:focus-visible::after {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 3px;
}

.management-card .mc-content i.fa {
    margin-left: 8px;
    font-size: .8em;
    color: var(--abp-text-muted, #6c757d);
    transition: color .15s ease;
}

@media (max-width: 575.98px) {
    .management-card {
        flex-direction: column;
        align-items: center;
        gap: 14px;
        text-align: center;
    }
}

/* ── İçerik Kartı ──
   Genel amaçlı içerik bloğu; kurumsal ve öğrenci bölümlerindeki 18 view
   "h2 + paragraf" deseniyle bu sınıfı kullanıyor, o yüzden nötr tutuldu. */
.facility-card {
    margin-bottom: 20px;
    padding: 20px 24px;
    background: var(--abp-card-bg, #ffffff);
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 8px;
}

.facility-card> :first-child {
    margin-top: 0;
}

.facility-card> :last-child {
    margin-bottom: 0;
}

.facility-card h2 {
    margin: 0 0 16px;
    padding-bottom: 10px;
    font-size: 20px;
    font-weight: 700;
    color: var(--abp-text, #333);
    border-bottom: 2px solid var(--abp-border-light, #ececec);
}

/* h3 icin kural olmadiginda BS5 varsayilani (28px) devreye giriyor ve
   alt baslik, kart basligi olan h2'den (20px) buyuk gorunuyordu. */
.facility-card h3 {
    margin: 22px 0 12px;
    font-size: 17px;
    font-weight: 700;
    color: var(--abp-text, #333);
}

/* h4 icin de kural yoktu. BS5 varsayilani h4'u 24px yapiyor, yani kart
   basligi h2'den (20px) ve ara baslik h3'ten (17px) DAHA BUYUK goruyordu;
   degisim_ogrencileri sayfasinda 8 adet h4 hiyerarsiyi tersine ceviriyordu. */
.facility-card h4 {
    margin: 18px 0 8px;
    font-size: 15px;
    font-weight: 700;
    color: var(--abp-text, #333);
}

/* Bolum ayirici; BS5 varsayilani (16px margin) uzun kartlarda iki bolumu
   yeterince ayirmiyordu. */
.facility-card hr {
    margin: 28px 0 24px;
    border-top: 1px solid var(--abp-border-light, #ececec);
    opacity: 1;
}

.facility-card p {
    margin-bottom: 12px;
    line-height: 1.7;
}

/* Kart icindeki listeler icin kural yoktu; BS5 reboot yalnizca ust bosluklari
   sifirliyor, bu yuzden maddeler paragraf satirlarina gore sikisik duruyordu
   (EN engelli olanaklari sayfasinda 4-6 maddelik listeler var). */
.facility-card ul,
.facility-card ol {
    margin: 0 0 12px;
    padding-left: 22px;
}

.facility-card li {
    margin-bottom: 8px;
    line-height: 1.7;
    /* Yukarida global bir "ul li { list-style: none }" kurali var; menu ve
       breadcrumb listeleri icin yazilmis ama icerik listelerinin de
       isaretlerini goturuyordu (madde imi olmayan girintili satirlar).
       revert, tarayici varsayilanina donduruyor: ul -> disc, ol -> decimal.
       Duzeltme karta kapsamlandi, boylece footer ve navbar listeleri
       etkilenmiyor. */
    list-style: revert;
}

.facility-card li:last-child {
    margin-bottom: 0;
}

/* Sayfa ici baglantiyla gelindiginde kart basligi ekranin en ust kenarina
   yapismasin. tabindex="-1" odagi hedef karta tasir; programatik odakta
   :focus-visible eslesmedigi icin cerceve gorunmez, klavye odaginda gorunur. */
.facility-card[id] {
    scroll-margin-top: 16px;
}

.facility-card[tabindex="-1"]:focus:not(:focus-visible) {
    outline: none;
}

/* ── Yatay Kaydirilabilir Tablo Kutusu ──
   3 kolonlu ve uzun metinli tablolar min-content genisliginin altina
   inemiyor; 375px'te sayfanin tamamini yana kaydiriyorlardi (tum sayfa
   kayarsa govde metni de okunamaz hâle gelir). Artik tasma tablonun kendi
   kutusunda kaliyor. tabindex="0" klavyeyle de kaydirmaya izin veriyor;
   fare/dokunmatik olmayan kullanici aksi hâlde kesilen kolonlara erisemez. */
.table-scroll {
    overflow-x: auto;
    margin-bottom: 16px;
}

.table-scroll>.table-abp {
    margin-bottom: 0;
}

.table-scroll:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 2px;
}

/* ── Sayi Sozlugu (degisim_ogrencileri "Sayilar" bolumu) ──
   Onceki hâli 8 kolonlu bir <table>'di: baslik hucresi yoktu, 16 bos <td>
   iceriyordu ve ekran okuyucu bir satiri "1, Bir, 11, On bir, 30, Otuz..."
   diye okudugu icin sayi-karsilik eslesmesi kayboluyordu. Ayrica 500px'te
   tabloyu daraltmak mumkun olmadigindan sayfaya yatay kaydirma ekliyordu.
   Artik <dl>: her sayi kendi karsiligiyla eslesiyor. CSS kolonlari sayesinde
   DOM sirasi artan kalirken gorsel duzen yukaridan asagi akiyor. */
.num-glossary {
    margin: 0 0 12px;
    /* en fazla 4 kolon; kolon 190px'in altina dusecekse kolon sayisi azalir */
    columns: 4 190px;
    column-gap: 28px;
}

.num-glossary>div {
    display: grid;
    /* 7.5em, en uzun deger olan "1.000.000.000"u tasirmadan aliyor; sabit
       genislik ayni kolondaki rakamlarin saga hizali kalmasini sagliyor. */
    grid-template-columns: minmax(0, 7.5em) minmax(0, 1fr);
    gap: 10px;
    padding: 6px 0;
    border-top: 1px solid var(--abp-border-light, #ececec);
    /* bir sayi-karsilik cifti iki kolona bolunmesin */
    break-inside: avoid;
}

.num-glossary dt {
    margin: 0;
    font-weight: 600;
    /* rakamlar kolon halinde hizali dursun */
    font-variant-numeric: tabular-nums;
    text-align: right;
    color: var(--abp-text-muted, #6c757d);
}

.num-glossary dd {
    margin: 0;
    color: var(--abp-text, #333);
}

/* ── Akis Icindeki Baglantilar ──
   Kart icinde paragraf/madde arasina giren duz baglantilar icin kural yoktu;
   global "a { text-decoration: none }" ile birlesince Bootstrap'in mavisine
   (#0d6efd) dusuyor ve alti cizilmiyordu. Govde metni de mavimsi (#2c3e50)
   oldugu icin baglanti yalnizca renkten ayirt ediliyordu (WCAG 1.4.1).
   Alti cizili kirmizi, renkten bagimsiz bir ipucu veriyor.
   :not([class]) sayesinde .btn-contact gibi sinifli baglantilar etkilenmiyor.
   Etkilenen sayfalar: maddi_olanak, degisim_ogrencileri, staj, akts.
   td de kapsama alindi: degisim_ogrencileri'ndeki acil numaralar tablosunda
   tel: baglantilari var ve onlar da ayni sekilde maviye dusuyordu.
   .contact-list dd a'nin kendi kurali bozulmasin diye dd disarida birakildi. */
.facility-card p a:not([class]),
.facility-card li a:not([class]),
.facility-card td a:not([class]) {
    color: var(--abp-link, #9e141f);
    text-decoration: underline;
    text-underline-offset: 2px;
    /* Uzun URL'ler dar ekranda karti tasirmasin */
    overflow-wrap: break-word;
}

.facility-card p a:not([class]):hover,
.facility-card li a:not([class]):hover,
.facility-card td a:not([class]):hover,
.facility-card p a:not([class]):focus-visible,
.facility-card li a:not([class]):focus-visible,
.facility-card td a:not([class]):focus-visible {
    color: var(--abp-red-dark, #87111b);
}

.facility-card p a:not([class]):focus-visible,
.facility-card li a:not([class]):focus-visible,
.facility-card td a:not([class]):focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ── İletişim Listesi (isim/adres sayfası) ── */
.contact-list {
    margin: 0;
    text-align: left;
}

.contact-list>div {
    display: grid;
    grid-template-columns: minmax(0, 220px) minmax(0, 1fr);
    gap: 4px 20px;
    padding: 12px 0;
    border-top: 1px solid var(--abp-border-light, #ececec);
}

.contact-list>div:first-child {
    padding-top: 0;
    border-top: 0;
}

.contact-list>div:last-child {
    padding-bottom: 0;
}

.contact-list dt {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: var(--abp-text-muted, #6c757d);
}

.contact-list dt i.fa {
    flex: 0 0 auto;
    width: 16px;
    font-size: 15px;
    text-align: center;
    color: var(--abp-red, #9e141f);
}

.contact-list dd {
    margin: 0;
    font-size: 15px;
    color: var(--abp-text, #333);
    overflow-wrap: break-word;
}

.contact-list dd address {
    margin: 0;
}

.contact-list dd a {
    color: var(--abp-link, #9e141f);
}

.contact-list dd a:hover,
.contact-list dd a:focus-visible {
    text-decoration: underline;
}

.contact-list dd a:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 2px;
    border-radius: 3px;
}

.contact-list dd i.fa {
    margin-left: 8px;
    font-size: .8em;
    color: var(--abp-text-muted, #6c757d);
}

@media (max-width: 575.98px) {
    .contact-list>div {
        grid-template-columns: minmax(0, 1fr);
        gap: 6px;
    }
}

/* ── Bootstrap 3 uyumluluk: .img-responsive ──
   BS5'te bu sinif yok ama 22 view hala kullaniyor. Tek tek img-fluid'e
   cevirmek yerine BS3 tanimini geri veriyoruz; aksi halde genis gorseller
   (ornegin 5616px'lik banner) kapsayiciyi tasiriyor. */
.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

/* ── Buton Benzeri Link (btn-contact) ──
   Kurumsal ve ogrenci bolumunde 9 view kullaniyor: bazen dis site linki,
   bazen ic sayfa navigasyonu. */
.btn-contact {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    background-color: var(--abp-card-bg, #ffffff);
    border: 1px solid var(--abp-border, #dee2e6);
    border-radius: 6px;
    color: var(--abp-text, #333);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    text-align: left;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}

.btn-contact:hover,
.btn-contact:focus-visible {
    background-color: var(--abp-red-bg, #fdf0ef);
    border-color: var(--abp-red, #9e141f);
    color: var(--abp-red, #9e141f);
    text-decoration: none;
}

.btn-contact:focus-visible {
    outline: 2px solid var(--abp-red, #9e141f);
    outline-offset: 2px;
}

.btn-contact i.fa {
    flex: 0 0 auto;
    width: 16px;
    font-size: 15px;
    text-align: center;
    color: var(--abp-red, #9e141f);
}

/* Dis link gostergesi: bas taraftaki konu ikonu kadar baskin olmamali */
.btn-contact i.fa-external-link {
    width: auto;
    font-size: .8em;
    color: var(--abp-text-muted, #6c757d);
}

.btn-contact:hover i.fa-external-link,
.btn-contact:focus-visible i.fa-external-link {
    color: inherit;
}

/* Buton icinde dosya turu/boyutu gibi ikincil bilgi */
.doc-meta {
    font-size: 12px;
    font-weight: 400;
    color: var(--abp-text-muted, #6c757d);
}

.btn-contact:hover .doc-meta,
.btn-contact:focus-visible .doc-meta {
    color: inherit;
}

/* Rehber kapak gorseli (AKTS sayfasi) */
.guide-img {
    display: inline-block;
    width: 100%;
    max-width: 260px;
    height: auto;
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 6px;
}

/* ── Program Listesi Izgarasi ──
   auto-fit sayesinde kirilma noktasi gerekmiyor; kart sayisi degisirse
   duzen kendini ayarlar. */
.program-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 12px;
}

.program-grid .btn-contact {
    justify-content: flex-start;
}

/* ── Bilgi/Uyari Notu ──
   degisim_ogrencileri sayfasinda markup'ta kullaniliyordu ama CSS tanimi
   yoktu; onemli uyari siradan paragraf gibi gorunuyordu. */
.alert-box {
    margin: 0 0 16px;
    padding: 12px 16px;
    background-color: var(--abp-red-bg, #fdf0ef);
    border: 1px solid rgba(158, 20, 31, .18);
    border-left: 4px solid var(--abp-red, #9e141f);
    border-radius: 6px;
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
}

.alert-box strong {
    color: var(--abp-red-dark, #87111b);
}

/* Bilgi tonu (uyari degil): mavi. Sinif adi "is-info", BS5'in kendi
   .alert-info kurallariyla cakismasin diye bilincli olarak farkli. */
.alert-box.is-info {
    background-color: var(--abp-blue-bg, #eef4fb);
    border-color: rgba(0, 68, 128, .18);
    border-left-color: var(--abp-blue, #004480);
}

.alert-box.is-info strong {
    color: var(--abp-blue-dark, #003366);
}

.alert-box i.fa {
    margin-right: 8px;
    color: var(--abp-red, #9e141f);
}

.alert-box.is-info i.fa {
    color: var(--abp-blue, #004480);
}

/* ── Kurum Künyesi / Etiket-Değer Listesi (hakkında sayfası) ──
   Etiket uzun olabildiği icin etiket kolonu daha genis; 20 satirda
   okunabilirligi zebra desen tasiyor, ayrica ayirici cizgi gerekmiyor. */
.spec-list {
    margin: 0;
    text-align: left;
}

.spec-list>div {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 4px 20px;
    padding: 10px 14px;
    border-radius: 4px;
}

.spec-list>div:nth-of-type(odd) {
    background-color: var(--abp-content-bg, #f4f6f9);
}

.spec-list dt {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--abp-text, #333);
}

.spec-list dd {
    margin: 0;
    font-size: 14px;
    color: var(--abp-text, #333);
    /* sayilar satirlar arasi hizali dursun */
    font-variant-numeric: tabular-nums;
}

.spec-note {
    margin: 14px 0 0;
    font-size: 13px;
    color: var(--abp-text-muted, #6c757d);
    text-align: left;
}

@media (max-width: 575.98px) {
    .spec-list>div {
        grid-template-columns: minmax(0, 1fr);
        gap: 2px;
        padding: 10px 12px;
    }

    .spec-list dt {
        font-size: 13px;
        color: var(--abp-text-muted, #6c757d);
    }
}

/* ── Ders Tab Navigasyonu ── */
.ders-tabs {
    margin: 16px 0;
    gap: 4px;
    border-bottom: 2px solid var(--abp-border-light, #ececec);
    padding-bottom: 0;
    --bs-nav-pills-border-radius: 6px 6px 0 0;
    --bs-nav-pills-link-active-bg: transparent;
    --bs-nav-pills-link-active-color: var(--abp-red, #9e141f);
}

.ders-tabs .nav-link {
    color: #555;
    font-size: 13px;
    font-weight: 600;
    padding: 8px 16px;
    border-radius: 6px 6px 0 0;
    border: 1px solid transparent;
    border-bottom: none;
    transition: color .15s ease, background-color .15s ease;
}

.ders-tabs .nav-link:hover {
    color: var(--abp-red, #9e141f);
    background-color: var(--abp-red-bg, #fdf0ef);
}

.ders-tabs .nav-link.active {
    color: var(--abp-red, #9e141f);
    font-weight: 600;
    background-color: #fff;
    border-color: var(--abp-border-light, #ececec);
    margin-bottom: -2px;
    border-bottom: 2px solid #fff;
}

/* ── Geniş Tablolar (ÖÇ-PÇ matris vb.) ── */
/* DİKKAT - kolon genişlikleri:
   table-layout:fixed altında kolonların toplamı tablonun genişliğinden küçük
   kalırsa tarayıcı artan yeri BÜTÜN kolonlara oranlı dağıtır. Aşağıdaki sabit
   min-width:1400px yüzünden az PY kolonlu sayfalarda 25px'lik kolonlar 100px'i
   aşıyor, etiket kolonu da gereksiz genişliyordu.
   Çözüm (bkz. ders/doc_pc_iliski, program/tyc_pc_iliski,
   program/ders_program_iliski view'ları): etiket kolonuna <col> ile width:100%
   verilir, PY kolonları sabit px kalır ve tablonun min-width'i kolon sayısına
   göre satır içinde hesaplanarak bu 1400px değeri geçersiz kılınır. Böylece
   artan yerin tamamını etiket kolonu alır.
   Not: fixed yerleşimde hücrelerdeki min-width yok sayılır; etiket kolonunun
   alt sınırı bu yüzden tablonun min-width'i üzerinden veriliyor. */
.table-matrix {
    table-layout: fixed;
    min-width: 1400px;
}

.table-matrix th:first-child,
.table-matrix td:first-child {
    width: 100px;
    min-width: 100px;
    text-align: left;
    white-space: normal;
    word-wrap: break-word;
    position: sticky;
    left: 0;
    z-index: 1;
    background-color: #fff;
    border-right: 2px solid var(--abp-border, #dee2e6);
}

.table-matrix thead th:first-child {
    z-index: 2;
    background-color: #fff;
}

.table-striped.table-matrix>tbody>tr:nth-of-type(odd)>td:first-child {
    background-color: #f8f9fa;
}

.table-matrix th:not(:first-child),
.table-matrix td:not(:first-child) {
    width: 25px;
    text-align: center;
    padding: 6px 4px;
}

/* ── Kurumsal Tablo (genel amaçlı) ── */
/* border-radius + overflow sarmalayıcıda */
.table-abp-wrapper {
    border-radius: 8px;
    overflow: hidden;
}

/* .content'teki "text-align: justify" tablo hucrelerine siziyor ve kelime
   aralarini acarak okunabilirligi dusuruyordu. */
.table-abp th,
.table-abp td {
    text-align: left;
}

.table-abp {
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--abp-border, #dee2e6);
}

/* Tablo adi <caption> ile veriliyor; onceden "th colspan" ile sahte baslik
   satiri olarak yaziliyordu. caption ekran okuyucuya tablonun adini bildirir. */
.table-abp caption {
    caption-side: top;
    padding: 0 0 10px;
    color: var(--abp-text, #333);
    font-size: 15px;
    font-weight: 700;
    text-align: left;
}

.table-abp thead th {
    background: var(--abp-blue, #004480);
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    padding: 10px 14px;
    border-bottom: none;
    border-color: rgba(255, 255, 255, 0.15);
    white-space: nowrap;
}

/* Tek thead satırı varsa koyu arka plan uygulanmaz;
   birden fazla satır varsa alt satırlar biraz daha koyu olur */
.table-abp thead tr+tr th {
    background: var(--abp-blue-dark, #003366);
    padding: 6px 14px;
}

/* Sayisal kolon: saga hizali ve rakamlar satirlar arasi ayni genislikte
   (tabular-nums) olsun ki fiyat listesi kolon gibi okunsun. */
.table-abp td.num,
.table-abp th.num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Iki kolonlu fiyat listesi genis ekranda gereksiz gerilmesin */
.table-price {
    max-width: 620px;
}

.table-abp tbody td {
    padding: 12px 14px;
    font-size: 13px;
    vertical-align: middle;
    border-color: var(--abp-border-light, #ececec);
}

.table-abp tbody tr:nth-of-type(even) {
    background-color: #fafbfc;
}

.table-abp tbody tr:hover,
.table-abp tbody tr:nth-of-type(even):hover {
    background-color: var(--abp-blue-bg, #eef4fb);
}

/* tfoot varsa */
.table-abp tfoot td,
.table-abp tfoot th {
    background: #f4f6f9;
    font-weight: 600;
    font-size: 13px;
    padding: 10px 14px;
    border-color: var(--abp-border-light, #ececec);
}

/* ── Yardımcı class'lar (tablo bağımsız, her yerde kullanılabilir) ── */
.abp-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background-color: #e8f5e9;
    color: #2e7d32;
    font-size: 13px;
}

.abp-badge-no {
    color: var(--abp-red, #9e141f);
    font-weight: 700;
}

.badge-py {
    display: inline-block;
    background-color: var(--abp-red);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .3px;
    padding: 5px 9px;
    border-radius: 4px;
    line-height: 1.2;
    white-space: nowrap;
}

.badge-oc {
    background-color: transparent;
    border: 1px solid #003366;
    color: #003366;
    font-size: 11px;
    cursor: default;
}

.badge-yontem {
    background-color: #eef4fb;
    border: 1px solid #b6d4f5;
    color: #2d6da8;
    font-size: .75em;
}

/* ── table-abp + table-matrix birlikte kullanım ── */
.table-abp.table-matrix thead th:first-child {
    background-color: var(--abp-blue, #004480);
    border-right-color: rgba(255, 255, 255, 0.2);
}

.table-abp.table-matrix thead tr+tr th:first-child {
    background-color: var(--abp-blue-dark, #003366);
}

/* Matris tablolarında ilk başlık satırındaki grup başlıkları aynı dikey hizada
   dursun. Aksi halde ilk hücre ".table-abp thead th" kuralından 10px, diğeri
   ".table-matrix th:not(:first-child)" kuralından 6px dikey boşluk alıyor;
   thead hücreleri alta hizalı olduğu için metinler 4px kayıyor.
   Yalnızca ilk satırı hedefler, PY numaralarının bulunduğu satır dar kalır. */
.table-abp.table-matrix thead tr:first-child th {
    padding: 10px 14px;
}

.table-abp.table-matrix thead th a {
    color: #fff;
    text-decoration: none;
}

/* PY (Program Yeterlilikleri) sütun grubu, TYÇ sütunundan renkle ayrıştırılır */
.table-abp.table-matrix thead th:not(:first-child) {
    background-color: var(--abp-red, #9e141f);
}

.table-abp.table-matrix thead tr+tr th:not(:first-child) {
    background-color: var(--abp-red-dark, #87111b);
}

.table-abp.table-matrix tbody tr:nth-of-type(even)>td:first-child {
    background-color: #fafbfc;
}

.table-abp.table-matrix tbody tr:hover>td:first-child,
.table-abp.table-matrix tbody tr:nth-of-type(even):hover>td:first-child {
    background-color: var(--abp-blue-bg, #eef4fb);
}

/* matrix ile birlikte kullanılınca overflow sarmalayıcıda olmamalı */
.table-abp-wrapper.table-matrix-wrapper {
    overflow: visible;
    border-radius: 0;
}

/* ── table-oc-pc (Ders ÖÇ - Program Yeterliliği Matrisi) ── */
.table-oc-pc th.col-oc-no,
.table-oc-pc td.col-oc-no {
    padding-left: 6px;
    padding-right: 6px;
    white-space: nowrap;
    text-align: center;
    vertical-align: middle;
    border-right: 0;
}

.table-oc-pc th.col-oc-ad,
.table-oc-pc td.col-oc-ad {
    text-align: left;
    white-space: normal;
    word-wrap: break-word;
    position: sticky;
    left: 58px;
    z-index: 1;
    background-color: #fff;
    border-right: 2px solid var(--abp-border, #dee2e6);
}

.table-oc-pc thead th.col-oc-ad {
    z-index: 2;
}

.table-abp.table-matrix.table-oc-pc thead th.col-oc-ad {
    background-color: var(--abp-blue, #004480);
}

.table-abp.table-matrix.table-oc-pc thead tr+tr th.col-oc-ad {
    background-color: var(--abp-blue-dark, #003366);
}

.table-striped.table-oc-pc>tbody>tr:nth-of-type(odd)>td.col-oc-ad {
    background-color: #f8f9fa;
}

.table-oc-pc tbody tr:nth-of-type(even)>td.col-oc-ad {
    background-color: #fafbfc;
}

.table-oc-pc tbody tr:hover>td.col-oc-ad,
.table-oc-pc tbody tr:nth-of-type(even):hover>td.col-oc-ad {
    background-color: var(--abp-blue-bg, #eef4fb);
}


/* ── Öğrenme Çıktıları / Checklist ── */
.checklist-container {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.checklist-plain {
    list-style: none;
    padding: 0;
    margin: 0;
    counter-reset: outcome-counter;
}

.checklist-plain-item {
    counter-increment: outcome-counter;
    position: relative;
    padding: 11px 4px 11px 28px;
    font-size: 14px;
    color: var(--abp-text, #333);
    line-height: 1.5;
    border-top: 1px solid var(--abp-border-light, #ececec);
}

.checklist-plain-item:first-child {
    border-top: none;
}

.checklist-plain-item::before {
    content: counter(outcome-counter) ".";
    position: absolute;
    left: 0;
    color: var(--abp-red, #9e141f);
    font-weight: 700;
    font-size: 13px;
}

.checklist-sub-item {
    list-style: none;
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 5px 4px 5px 44px;
    font-size: 13px;
    font-weight: 400;
    color: var(--abp-text-muted, #6c757d);
    line-height: 1.4;
}

.checklist-sub-item i.fa {
    color: var(--abp-red, #9e141f);
    margin-top: 2px;
    flex-shrink: 0;
    font-size: 11px;
}

/* ── Sol Menü (Side Nav) ── */
.side-nav-wrapper {
    padding-right: 20px;
}

.side-nav {
    border: none;
}

.side-nav .list-group-item {
    border: none;
    border-bottom: 1px solid var(--abp-border-light, #ececec);
    border-left: 3px solid transparent;
    border-radius: 0;
    padding: 11px 14px;
    font-size: 13px;
    color: var(--abp-text, #333);
    background: transparent;
    transition: background .15s ease, border-color .15s ease, color .15s ease;
}

.side-nav .list-group-item:first-child {
    border-top: 1px solid var(--abp-border-light, #ececec);
}

.side-nav .list-group-item:hover,
.side-nav .list-group-item:focus {
    background-color: var(--abp-red-bg, #fdf0ef);
    border-left-color: var(--abp-red, #9e141f);
    color: var(--abp-red, #9e141f);
    text-decoration: none;
}

.side-nav .list-group-item.active {
    background-color: transparent;
    border-left-color: var(--abp-red, #9e141f);
    color: var(--abp-red, #9e141f);
    font-weight: 600;
}

.side-nav .list-group-item i {
    display: none;
}

@media (min-width: 992px) {
    .side-nav.collapse {
        display: block !important;
        height: auto !important;
        visibility: visible !important;
    }

    .side-nav-wrapper {
        position: sticky;
        top: 80px;
        z-index: 100;
    }
}

/* Mobil menü butonu */
.mobile-menu-btn {
    margin-bottom: 15px;
    text-align: left;
    background-color: var(--abp-red, #9e141f);
    color: #fff;
    border-color: var(--abp-red, #9e141f);
    font-weight: 600;
    font-size: 13px;
    padding: 10px 16px;
    border-radius: 6px;
}

.mobile-menu-btn:hover,
.mobile-menu-btn:focus,
.mobile-menu-btn:active {
    background-color: var(--abp-red-dark, #87111b);
    color: #fff;
    border-color: var(--abp-red-dark, #87111b);
}

.mobile-menu-btn i.fa-bars {
    margin-right: 8px;
}

@media (max-width: 991px) {
    .side-nav-wrapper {
        padding-right: 0;
        margin-bottom: 15px;
    }

    .side-nav .list-group-item {
        border-left: none;
        border-radius: 0;
    }

    .side-nav .list-group-item:hover {
        padding-left: 16px;
        border-left: none;
    }
}

/* ── Kompakt Checklist (kısa öğeler için tag/chip görünümü) ── */
.checklist-tags {
    list-style: none;
    padding: 0;
    margin: 0;
}

.checklist-tags .checklist-title {
    background: none;
    color: var(--abp-text, #333);
    font-weight: 600;
    font-size: 13px;
    padding: 8px 14px;
    border-radius: 0;
    margin-top: 0;
    border: 1px solid var(--abp-border-light, #ececec);
    border-bottom: none;
    border-left: 3px solid var(--abp-red, #9e141f);
    border-radius: 6px 6px 0 0;
}

.checklist-tags .checklist-title:first-child {
    margin-top: 0;
}

.checklist-tags .checklist-items-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 16px;
    border: 1px solid var(--abp-border-light, #ececec);
    border-top: none;
    border-radius: 0 0 6px 6px;
    background: #fff;
}

/* checklist-title yoksa items-wrap tek başına tam yuvarlatılmış */
.checklist-tags .checklist-items-wrap:first-child {
    border-top: 1px solid var(--abp-border-light, #ececec);
    border-radius: 6px;
}

.checklist-tags .tag-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 13px;
    background: var(--abp-content-bg, #f4f6f9);
    border: 1px solid var(--abp-border-light, #ececec);
    border-radius: 20px;
    color: var(--abp-text, #333);
    transition: all .15s ease;
}

.checklist-tags .tag-item:hover {
    background: var(--abp-blue-bg, #eef4fb);
    border-color: var(--abp-blue, #004480);
    color: var(--abp-blue, #004480);
}

.checklist-tags .tag-item i.fa {
    font-size: 11px;
    color: var(--abp-red, #9e141f);
}

/* ── Bölüm Başlığı (section separator) ── */
.abp-section-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--abp-red, #9e141f);
    margin: 20px 0 5px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid var(--abp-border-light, #ececec);
    display: flex;
    align-items: center;
    gap: 8px;
}


.abp-section-title i.fa {
    color: var(--abp-red, #9e141f);
    font-size: 14px;
}

/* ── Akordiyon (Kurumsal) ── */
.accordion-abp {
    --bs-accordion-border-color: var(--abp-border, #dee2e6);
    --bs-accordion-border-radius: 8px;
    --bs-accordion-inner-border-radius: 8px;
    --bs-accordion-btn-padding-y: 12px;
    --bs-accordion-btn-padding-x: 16px;
    --bs-accordion-body-padding-y: 16px;
    --bs-accordion-body-padding-x: 16px;
    --bs-accordion-active-bg: var(--abp-red-bg, #fdf0ef);
    --bs-accordion-active-color: var(--abp-red, #9e141f);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem rgba(158, 20, 31, 0.15);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%239e141f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2387111b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}

.accordion-abp .accordion-item {
    margin-bottom: 12px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.accordion-abp .accordion-item:last-child {
    margin-bottom: 0;
}

.accordion-abp .accordion-button {
    font-family: var(--abp-font);
    font-weight: 600;
    font-size: 15px;
    color: var(--abp-text, #333333);
    background-color: #fff;
}

.accordion-abp .accordion-button:not(.collapsed) {
    box-shadow: inset 0 -1px 0 var(--abp-border-light, #ececec);
}

.accordion-abp .accordion-body {
    background-color: #fff;
}

/* ── Akordiyon araç çubuğu (Tümünü Aç / Tümünü Kapat) ── */
.accordion-toolbar-abp {
    gap: 14px;
}

.accordion-toolbar-abp button {
    border: none;
    background: none;
    padding: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--abp-red, #9e141f);
    text-decoration: none;
    cursor: pointer;
}

.accordion-toolbar-abp button:hover,
.accordion-toolbar-abp button:focus {
    color: var(--abp-red-dark, #87111b);
    text-decoration: underline;
}

.form-select {
    font-size: 0.875rem;
}