/* Projedeki ana turuncu rengi tanımlayalım */
:root {
    --emn-orange: #f37a20;
}

/* Navbar'ın altındaki turuncu kalın çizgi */
.header-bottom-border {
    height: 4px;
    background-color: var(--emn-orange);
    width: 100%;
}

/* Logo için özel stil */
.navbar-brand.logo {
    font-size: 2.5rem; /* Boyutu büyütüyoruz */
    font-weight: 700;
    color: #5a5a5a; /* Gri renk */
    position: relative;
    padding-left: 55px; /* Soldaki ok için boşluk */
    line-height: 1;
}

.img-box{
    margin-top:50px;
}
.img-box img{
    width:100%;
    float:left;
}

    /* Logodaki turuncu oku ::before pseudo-elementi ile ekliyoruz */
    .navbar-brand.logo::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        width: 0;
        height: 0;
        /* Üçgen oluşturma */
        border-top: 18px solid transparent;
        border-bottom: 18px solid transparent;
        border-left: 30px solid var(--emn-orange);
    }

/* Navigasyon linkleri */
.navbar-nav .nav-link {
    color: #333; /* Koyu gri/siyah link rengi */
    font-weight: 600;
    margin: 0 0.5rem; /* Linkler arası boşluk */
}

    /* Aktif link (Home) ve üzerine gelinen link için turuncu renk */
    .navbar-nav .nav-link.active,
    .navbar-nav .nav-link:hover {
        color: var(--emn-orange);
    }

/* Arama ikonu rengi */
.nav-link .bi-search {
    color: #333;
}

.nav-link:hover .bi-search {
    color: var(--emn-orange);
}

/* === HERO BÖLÜMÜ STİLLERİ (SLAYT GÖSTERİSİ) === */

/* Ana 'hero' kapsayıcısı */
.hero-section {
    position: relative; /* Carousel'in buna göre konumlanması için */
    width: 100%;
}

/* HER BİR SLAYT ÖĞESİ (carousel-item)
  Yükseklik ve arkaplan resimlerinin temel ayarları
*/
.carousel-item {
    height: 70vh; /* Orijinal yüksekliğiniz */
    min-height: 500px; /* Orijinal min-yüksekliğiniz */
    /* Resim ayarları */
    background-size: cover;
    background-position: center;
    /* carousel-fade efekti için geçiş süresi */
    transition: opacity 0.8s ease-in-out;
}

/* SLAYT RESİMLERİNİ BURADAN BELİRLİYORUZ */
#slide1 {
    /* Senin orijinal resmin (şehir) */
    background-image: url(../img/SLIDER/slider-1.jpeg);
}

#slide2 {
    /* Senin diğer resmin (mimari) */
    background-image: url('https://images.pexels.com/photos/262353/pexels-photo-262353.jpeg');
}

#slide3 {
    /* Benim eklediğim resim (teknoloji) */
    background-image: url('https://images.pexels.com/photos/5474028/pexels-photo-5474028.jpeg');
}


/* SLAYT KONTROL OKLARI
  Artık z-index'e gerek yok, ama gölge ile görünürlüklerini artıralım
*/
.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: drop-shadow(0 0 5px rgba(0, 0, 0, 0.7));
}

.main-container {
    max-width: 1100px;
    margin: 50px auto;
    padding: 20px;
}

.header-section h1 {
    font-weight: 700;
    color: #2c3e50;
}

.header-section p {
    color: #7f8c8d;
    font-size: 1.1rem;
}

/* Accordion Stilleri */
.accordion-item {
    border: none;
    margin-bottom: 15px;
    border-radius: 12px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.accordion-button {
    border-radius: 12px !important;
    padding: 20px;
    font-weight: 600;
    color: #444;
}

    .accordion-button:not(.collapsed) {
        background-color: #fff;
        color: #2c3e50;
        box-shadow: none;
    }

    .accordion-button:focus {
        box-shadow: none;
        border-color: rgba(0,0,0,0.125);
    }

.step-number {
    display: inline-block;
    width: 35px;
    height: 35px;
    background-color: #fff2e6;
    color: #f39c12;
    text-align: center;
    line-height: 35px;
    border-radius: 8px;
    margin-right: 15px;
    font-weight: 700;
}

/* Bilgi Kartı (Sağ Taraf) */
.info-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    border-top: 5px solid #e0f2f1;
}

    .info-card .check-icon {
        width: 50px;
        height: 50px;
        background-color: #e0f2f1;
        color: #26a69a;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0 auto 20px;
    }

.doctor-name {
    color: #e67e22;
    font-weight: 700;
    margin-top: 25px;
    text-transform: uppercase;
}

.date-text {
    font-size: 0.9rem;
    color: #bdc3c7;
}











/* SAYDAM PANEL VE DİĞER STİLLER (BUNLAR ZATEN VARDI, DEĞİŞMEDİ)
   Bu kodlar artık her slaytın içindeki paneli etkileyecek
*/
.hero-transparent-panel {
    position: relative;
    padding: 3rem 2.5rem;
    background-color: rgba(233, 236, 239, 0.85);
    backdrop-filter: blur(10px);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    /* Panel animasyonu: Slaytla birlikte yumuşakça gelsin */
    animation: fadeInRight 0.8s ease-out;
}

/* Panel için basit bir giriş animasyonu */
@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.hero-transparent-panel h2 {
    font-weight: 700;
    color: #333;
}

.btn-read-more {
    background-color: var(--emn-orange);
    color: #fff;
    font-weight: 600;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 4px;
    transition: all 0.3s ease;
}

    .btn-read-more:hover {
        background-color: #333;
        color: #fff;
        transform: translateY(-2px);
    }

.decorative-icons {
    position: absolute;
    bottom: 1.5rem;
    right: 1.5rem;
    opacity: 0.8;
}

    .decorative-icons .icon-bg {
        font-size: 5rem;
        color: var(--emn-orange);
        opacity: 0.3;
    }

    .decorative-icons .icon-fg {
        font-size: 2rem;
        color: var(--emn-orange);
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
/* === YOUTUBE VİDEO BÖLÜMÜ === */

/* .video-wrapper sınıfı, iframe'in etrafını sarar.
  .shadow-lg Bootstrap'ten gelir, biz de buna
  yumuşak kenarlar (border-radius) ekliyoruz.
*/
.video-wrapper {
    border-radius: 12px; /* Köşeleri yumuşatır */
    overflow: hidden; /* iframe'in köşelerden taşmasını engeller */
    /* Hafif bir kenarlık gölgeyi daha belirgin yapar */
    border: 1px solid rgba(0, 0, 0, 0.05);
}

/* Video bölümünün arkaplan rengi Bootstrap'in .bg-light sınıfından gelir.
  İsterseniz buradan ezebilirsiniz:
*/
.video-section {
    /* background-color: #f8f9fa;  (Bootstrap'in .bg-light rengi) */
}
/* === COVID BİLGİLENDİRME BÖLÜMÜ === */

/* Sol taraftaki şık numaralı liste */
.custom-numbered-list .list-item {
    display: flex; /* Numarayı ve metni yanyana getirir */
    align-items: flex-start; /* Üstten hizalar */
    margin-bottom: 1.5rem; /* Maddeler arası boşluk */
}

.custom-numbered-list .list-number {
    font-size: 1.5rem; /* Numaraları büyüt */
    font-weight: 700;
    color: var(--emn-orange); /* Turuncu renk */
    margin-right: 1rem; /* Numara ile metin arası boşluk */
    line-height: 1.4;
}

.custom-numbered-list .list-text {
    flex: 1; /* Kalan tüm alanı kapla */
    color: #555;
    line-height: 1.6;
}

/* Sağ taraftaki şık yazar kutusu */
.covid-author-box {
    border: 2px solid var(--emn-orange);
    background-color: #fdf8f5; /* Çok açık turuncu */
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
}

    .covid-author-box .card-body {
        padding: 2rem;
    }

    /* Yazar kutusunun başındaki ikon */
    .covid-author-box .icon-box-header {
        font-size: 2.5rem;
        color: var(--emn-orange);
        margin-bottom: 1rem;
        display: block;
    }

    /* Yazarın ismini vurgula */
    .covid-author-box .author-name {
        color: var(--emn-orange);
        font-size: 1.1rem;
    }

/* style.css dosyanızda ilgili bölümü bununla değiştirin */

/* === BİLGİ/HABER SEKMELERİ BÖLÜMÜ === */

/* Arkaplan */
.info-tabs-section {
    background-color: #fff;
}

    /* Sekme Butonlarının (nav-item) kapsayıcısını ayarla */
    .info-tabs-section .nav-pills .nav-item {
        /* Butonların genişlemesini sağlar (eskiden nav-justified'in yaptığı gibi) */
        flex-grow: 1;
        /* ▼▼▼ İSTEDİĞİNİZ BOŞLUK BURADA ▼▼▼ */
        /* Her bir buton bloğunun sağına ve soluna 8px boşluk verir */
        margin: 0 8px;
    }

    /* Sekme Butonları (nav-link) - Pasif Halde */
    .info-tabs-section .nav-pills .nav-link {
        color: #333;
        font-weight: 600;
        background-color: #f8f9fa;
        border: 1px solid #dee2e6;
        border-radius: 8px;
        transition: all 0.3s ease;
        width: 100%; /* İçinde bulunduğu nav-item'ı doldurur */
    }

        /* AKTİF Sekme (Turuncu) */
        .info-tabs-section .nav-pills .nav-link.active,
        .info-tabs-section .nav-pills .show > .nav-link {
            background-color: var(--emn-orange);
            color: #fff;
            border-color: var(--emn-orange);
            box-shadow: 0 4px 10px rgba(243, 122, 32, 0.3);
        }

    /* Sekme İçeriği (Tüm listelerin olduğu kutu) */
    .info-tabs-section .tab-content {
        padding: 2rem;
        background-color: #fff;
        border-radius: 12px;
        box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
        border: 1px solid #e9ecef;
        margin-top: -1px;
    }

    /* ▼▼▼ ŞIK LİSTE STİLLERİ (Akordeon stilleri silindi) ▼▼▼ */

    /* Tıklanabilir Linklerin Stili (.list-group-item) */
    .info-tabs-section .list-group-item {
        font-weight: 500;
        border-bottom: 1px solid #eee; /* Sadece alt çizgi */
        border-left: none;
        border-right: none;
        border-top: none;
        padding-top: 1rem;
        padding-bottom: 1rem;
        border-radius: 0 !important;
    }

        .info-tabs-section .list-group-item:last-child {
            border-bottom: none; /* Son elemanda çizgi olmasın */
        }

    /* Linklerin üzerine gelince (hover) turuncu renk alması */
    .info-tabs-section .list-group-item-action:hover,
    .info-tabs-section .list-group-item-action:focus {
        color: var(--emn-orange);
        background-color: #fdf8f5; /* Çok açık turuncu */
        padding-left: 1.5rem; /* Hafifçe sağa kaysın */
        transition: all 0.2s ease-out;
    }
    .info-tabs-section .list-group-item-action[aria-expanded="true"] {
        color: var(--emn-orange);
        background-color: #fdf8f5;
        font-weight: 600;
    }

    /* Sağdaki +/- ikonu için */
    .info-tabs-section .icon-toggle::before {
        content: '+'; /* Kapalıyken + işareti göster */
        font-weight: 700;
        font-size: 1.2rem;
        color: #999;
    }

    .info-tabs-section .list-group-item-action[aria-expanded="true"] .icon-toggle::before {
        content: '−'; /* Açıkken - işareti göster */
        color: var(--emn-orange);
    }

    /* "Okuma Kısmı" (Açılan içerik kutusu) */
    .info-tabs-section .list-group-content-body {
        padding: 1.5rem 1rem; /* İçerik boşlukları */
        background-color: #fafafa; /* İçerik arkaplanı hafifçe farklı */
        color: #444;
        border-bottom: 1px solid #eee; /* Tetikleyiciyle aynı alt çizgi */
    }
    /* style.css dosyanızın en sonuna ekleyin */

/* === KLİNİK ARAŞTIRMALAR SAYFASI STİLLERİ === */

/* Sayfanın üstündeki başlık alanı */
.page-hero-banner {
    padding: 4rem 1.5rem;
    background-color: var(--emn-orange); /* Ana turuncu rengimizi kullan */
    
    /* Hafif bir gradyan geçişi */
    background-image: linear-gradient(135deg, var(--emn-orange) 0%, #d15c0e 100%);
    
    border-bottom: 4px solid rgba(0,0,0,0.1);
}

.text-white-75 {
    color: rgba(255, 255, 255, 0.75);
}


/* 2. Sekmedeki AKORDEON Stilleri */
/* (Ana sayfadakinden farklı bir stil kullanıyoruz) */

.info-tabs-section .accordion {
    /* Akordeonun etrafındaki Bootstrap kenarlığını kaldır */
    --bs-accordion-border-width: 0;
}

.info-tabs-section .accordion-item {
    border: 1px solid #dee2e6; /* Her madde arasına çizgi ekle */
    border-radius: 0.375rem; /* Kenarları yumuşat */
    margin-bottom: 1rem; /* Maddeler arası boşluk */
    overflow: hidden; /* Kenar yuvarlatmasını zorunlu kıl */
}

/* Akordeon Başlığı (Kapalıyken) */
.info-tabs-section .accordion-button {
    font-weight: 600;
    color: #333;
    background-color: #f8f9fa; /* Başlık arka planı */
}
.info-tabs-section .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: var(--emn-orange); /* Açıkken turuncu */
    box-shadow: none;
}

/* Akordeon Ok İkonunu Renklendir */
.info-tabs-section .accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Akordeon İçeriği */
.info-tabs-section .accordion-body {
    background-color: #fff;
    padding: 1.5rem;
}
.info-tabs-section .accordion-body h5 {
    color: var(--emn-orange); /* Çalışma başlıklarını turuncu yap */
}
.info-tabs-section .accordion-body ul {
    list-style-type: '— '; /* Madde imlerini çizgi yap */
    padding-left: 1.5rem;
}
/* style.css dosyanızın en sonuna ekleyin */

/* === İLAÇ DETAY SAYFASI STİLLERİ === */

.medication-content {
    background-color: #fff;
}

    /* Metin içeriğinin daha okunaklı olmasını sağla */
    .medication-content .col-lg-9 {
        line-height: 1.7; /* Satır aralığını artır */
        color: #333;
    }

    .medication-content h2 {
        font-weight: 700;
        color: var(--emn-orange); /* Ana turuncu renk */
        margin-top: 2.5rem; /* Başlıklar arasına boşluk koy */
        margin-bottom: 1.25rem;
        border-bottom: 2px solid #f0f0f0; /* Başlıkların altına hafif çizgi */
        padding-bottom: 0.5rem;
    }

    .medication-content h3 {
        font-weight: 600;
        color: #333;
        margin-top: 2rem;
        margin-bottom: 1rem;
    }

    .medication-content ul {
        list-style-type: '✓ '; /* Madde imlerini tik yap */
        padding-left: 1.5rem; /* İçeriye al */
    }

        .medication-content ul ul {
            list-style-type: '• '; /* İç içe listeler için */
            margin-top: 0.5rem;
        }

    .medication-content hr {
        opacity: 0.1;
    }
/* style.css dosyanızın en sonuna ekleyin */

/* === SUNUMLAR VİDEO GALERİSİ === */

.video-card {
    position: relative; /* Oynat ikonunu konumlandırmak için */
    text-decoration: none; /* Link alt çizgisini kaldır */
    color: #333; /* Başlık rengi */
    border: none; /* Kart kenarlığını kaldır */
    transition: all 0.3s ease; /* Yumuşak animasyon */
}

    /* Kartın üzerine gelince (hover) */
    .video-card:hover {
        transform: scale(1.03); /* Hafifçe büyüt */
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15); /* Gölgelendir */
        color: var(--emn-orange); /* Başlık rengini turuncu yap */
    }

/* Oynat İkonu (Resmin ortasında) */
.video-play-icon {
    position: absolute;
    top: 35%; /* Resmin dikey ortası (thumbnail'in yarısı) */
    left: 50%; /* Resmin yatay ortası */
    transform: translate(-50%, -50%);
    font-size: 4rem; /* İkonu büyüt */
    color: rgba(255, 255, 255, 0.9); /* Beyaz ve yarı saydam */
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); /* İkona gölge ver */

    opacity: 0; /* Normalde gizle */
    transition: all 0.3s ease;
}

/* Kartın üzerine gelince ikonu göster */
.video-card:hover .video-play-icon {
    opacity: 1;
}

/* Kartın resim alanı */
.video-card .card-img-top {
    aspect-ratio: 16 / 9; /* Resimleri 16:9 formatına zorla */
    object-fit: cover; /* Resmi kırp ama sığdır */
    filter: brightness(0.9); /* Resme hafif koyuluk ver */
    transition: all 0.3s ease;
}

/* Kartın üzerine gelince resmi parlat */
.video-card:hover .card-img-top {
    filter: brightness(1);
}
/* style.css dosyanızın en sonuna ekleyin */

/* === HATIRA DEFTERİ GALERİSİ === */

.diary-card {
    text-decoration: none;
    border: 1px solid #e0e0e0;
    transition: all 0.3s ease;
    padding-top: 1rem;
}

    .diary-card:hover {
        transform: translateY(-5px); /* Hafifçe yukarı kaldır */
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        border-color: var(--emn-orange); /* Kenar rengini turuncu yap */
    }

    .diary-card .diary-icon {
        font-size: 4rem; /* İkonu büyüt */
        color: var(--emn-orange); /* Turuncu renk */
        transition: all 0.3s ease;
    }

    .diary-card:hover .diary-icon {
        transform: scale(1.1); /* İkonu hafifçe büyüt */
    }

    .diary-card .card-title {
        color: #333; /* Başlık rengi */
        font-weight: 600;
    }

    .diary-card:hover .card-title {
        color: var(--emn-orange); /* Üzerine gelince başlık turuncu */
    }


/* === FLIPBOOK (DİJİTAL KİTAP) STİLLERİ === */

.flipbook-section {
    background-color: #f8f9fa; /* Arka planı hafif gri yap */
}

/* Turn.js'nin kitap gölgesi */
#flipbook {
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
}

/* Kitabın her bir sayfası */
.flipbook-page {
    background-color: #ffffff; /* Sayfa rengi beyaz */
    border: 1px solid #ccc;
    padding: 2rem;
    font-size: 1rem;
    line-height: 1.6;
}

/* Sayfa numaraları (Turn.js otomatik ekler) */
#flipbook .page-wrapper {
    -webkit-perspective: 2000px;
    -moz-perspective: 2000px;
    -ms-perspective: 2000px;
    perspective: 2000px;
}

#flipbook .p-odd { /* Sol sayfalar */
    background: -webkit-linear-gradient(left, #FFF 95%, #DDD 100%);
    background: -moz-linear-gradient(left, #FFF 95%, #DDD 100%);
    background: -o-linear-gradient(left, #FFF 95%, #DDD 100%);
    background: -ms-linear-gradient(left, #FFF 95%, #DDD 100%);
}

#flipbook .p-even { /* Sağ sayfalar */
    background: -webkit-linear-gradient(right, #FFF 95%, #DDD 100%);
    background: -moz-linear-gradient(right, #FFF 95%, #DDD 100%);
    background: -o-linear-gradient(right, #FFF 95%, #DDD 100%);
    background: -ms-linear-gradient(right, #FFF 95%, #DDD 100%);
}
/* style.css dosyanızın en sonuna ekleyin */

/* === HATIRA DEFTERİ GALERİSİ (HatiraDefterim.aspx) === */
/* (Bu stiller bir önceki yanıttan, hala geçerli) */

.diary-card {
    text-decoration: none;
    border: 1px solid #e0e0e0;
    transition: all 0.3s ease;
    padding-top: 1rem;
}

    .diary-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        border-color: var(--emn-orange);
    }

    .diary-card .diary-icon {
        font-size: 4rem;
        color: var(--emn-orange);
        transition: all 0.3s ease;
    }

    .diary-card:hover .diary-icon {
        transform: scale(1.1);
    }

    .diary-card .card-title {
        color: #333;
        font-weight: 600;
    }

    .diary-card:hover .card-title {
        color: var(--emn-orange);
    }


/* === HATIRA DETAY KARUSELİ (Hatira-1.aspx) === */

.hatira-carousel-section {
    /* Sayfa arka planı */
    background-color: #f8f9fa;
}

/* Her bir slaytın (hatıranın) içindeki metin kutusu */
.hatira-slide-content {
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 2.5rem 3rem; /* Bolca iç boşluk */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    /* UZUN METİNLER için çok önemli: */
    /* Ekran yüksekliğinin %80'ini geçerse kaydırma çubuğu çıkar */
    max-height: 80vh;
    overflow-y: auto; /* Dikey kaydırma çubuğu */

    line-height: 1.7; /* Okunabilirlik için satır aralığı */
}

    /* Slayt içindeki başlık (Hasta 1, Hasta 2...) */
    .hatira-slide-content h2 {
        color: var(--emn-orange);
        font-weight: 700;
        border-bottom: 2px solid #f0f0f0;
        padding-bottom: 0.5rem;
        margin-bottom: 1.5rem;
    }

/* Karusel (Slayt) Okları:
  Bootstrap'in varsayılan beyaz okları gri zeminde görünmez.
  Onları koyu renk ve görünür yapalım.
*/
.hatira-carousel-section .carousel-control-prev-icon,
.hatira-carousel-section .carousel-control-next-icon {
    /* Bootstrap'in SVG ikonunu koyu gri (%23333) ile yeniden doldurur */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23333'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
}

.hatira-carousel-section .carousel-control-next-icon {
    /* Sağ oku ters çevirir */
    transform: rotate(180deg);
}

/* Okların pozisyonu (içeriğin dışına alalım ki metni engellemesin) */
.hatira-carousel-section .carousel-control-prev {
    left: -50px; /* Okları sola taşı */
}

.hatira-carousel-section .carousel-control-next {
    right: -50px; /* Okları sağa taşı */
}

/* Karusel Göstergeleri (Alttaki çizgiler)
  Onları da koyu renk yapalım.
*/
.hatira-carousel-section .carousel-indicators [data-bs-target] {
    background-color: #999;
}

.hatira-carousel-section .carousel-indicators .active {
    background-color: var(--emn-orange); /* Aktif olan turuncu */
}

/* === FORM SAYFALARI (Login/Register) === */

.form-section {
    background-color: #f8f9fa; /* Arka planı hafif gri yap */
}

/* ASP.NET RadioButtonList'i Bootstrap 5'in
  form-check-inline görünümüne benzetmek için
*/
.custom-radio-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem; /* Dikeyde ve yatayda boşluk */
    padding-top: 0.5rem; /* Üstündeki label ile hizala */
}

    .custom-radio-list label {
        margin-right: 0.25rem;
        font-weight: 500;
    }
/* === FOOTER STİLLERİ === */

.footer-section {
    /* .mt-5 (margin-top-5) sınıfını HTML'ye ekledik.
      Bu, footer'ı bir üstündeki içerikten ayırır.
      Arka plan rengi Bootstrap'in .bg-dark sınıfından gelir.
    */
}

.footer-social-icon {
    color: #f8f9fa; /* Açık renk ikon (varsayılan) */
    text-decoration: none;
    transition: all 0.3s ease;
}

    .footer-social-icon:hover {
        color: var(--emn-orange); /* Sitenin ana turuncu rengi */
    }

    .fl{
        float:left;
        padding:20px;
    }
    .videos{
        float:left;
        width:100%;
        text-align:center;
    }