﻿/* ==================================================================
   MARKA PALETİ
   ==================================================================
   Müşterinin 01.10.2026 maildeki 8. maddesi: "Renkler fontlar ve marka
   renkleri bütün içinde doğru dağılmalı."

   Renkler Yuduline logosundan ölçüldü (panelde kayıtlı logo dosyası):
     lacivert    #0F2556   — başlıklar, koyu zemin
     mavi        #0061FE   — ana eylem rengi (düğme, bağlantı)
     mor         #5E29FF   — ikincil / gradient ucu
     camgöbeği   #00E6F3   — vurgu

   Tema değişkenleri burada eziliyor; style.css'e dokunulmuyor ki tema
   güncellemesi bu dosyayı etkilemesin. Gradientlerin tema tanımı
   "secondary → primary" olduğu için logodaki mor→mavi geçişi kendiliğinden
   oluşuyor.
   ------------------------------------------------------------------ */
:root {
    --yud-lacivert: #0F2556;
    --yud-mavi: #0061FE;
    --yud-mor: #5E29FF;
    --yud-camgobegi: #00E6F3;

    --color-primary: var(--yud-mavi);
    --color-secondary: var(--yud-mor);
    --color-heading: var(--yud-lacivert);
    --primary-opacity: #0061fe21;
}

/* ------------------------------------------------------------------
   SADE SAYFA BAŞLIĞI  (Views/Shared/_SayfaBasligi.cshtml)

   Temanın .rbt-page-banner-wrapper başlığı 235px alt boşluk bırakıyor ve
   .rbt-section-overlayping-top içeriği 175px yukarı çekiyor; yani içerik
   mavi-mor gradientin ÜZERİNE biniyor. Kart gibi opak ögelerde sorun yok,
   ama düz metinde yazı okunmaz hâle geliyordu (müşteri 01.10.2026, 2. ve
   3. madde: "metnin arkasındaki mavi-mor gradient bant metni okunmaz hale
   getiriyor").

   Metin ağırlıklı sayfalar bu yüzden gradientli bandı değil, açık zeminli
   bu başlığı kullanıyor. Örtüşme yok; metin kendi alanında kalıyor.
   ------------------------------------------------------------------ */
.yud-sayfa-basligi {
    background: linear-gradient(180deg, #F4F7FF 0%, #FFFFFF 100%);
    border-bottom: 1px solid var(--color-border, #e6e6e6);
    padding: 40px 0 36px;
}

.yud-sayfa-basligi .page-list {
    margin-bottom: 10px;
}

.yud-sayfa-basligi .yud-sayfa-adi {
    color: var(--yud-lacivert);
    margin-bottom: 8px;
}

.yud-sayfa-basligi .yud-sayfa-aciklama {
    max-width: 760px;
    margin-bottom: 0;
}

/* ------------------------------------------------------------------
   ÜST MENÜ

   Menü 3 kalemden 9 kaleme çıktı (müşterinin istediği sıralama) ve
   masaüstünde sağdan kesiliyordu: şerit, logo ile sağdaki düğmeler
   arasındaki sabit alanı paylaşıyor. İki değişiklik:

   1) Masaüstü menüsü artık 1400px'ten (xxl) itibaren gösteriliyor;
      altında hamburger menüye geçiliyor (bkz. NavBar.cshtml'deki
      d-none d-xxl-block / d-block d-xxl-none sınıfları). Müşterinin
      5. maddesi: "ekran daraldığında görünür menüye geçmeli."
   2) 1400px'ten itibaren yazı ve iç boşluk daraltılıyor. ÜST SINIR YOK:
      Bootstrap kapsayıcısı 1305px'te sabitlendiği için 1920px'lik ekran
      menüye fazladan yer VERMİYOR. Bir dönem bu daraltma 1699px ile
      sınırlıydı; 1600px üstünde tema 17px'lik boşluğa dönüyor, dokuz
      kalem 1271px'e çıkıyor ve satır 1305px'lik alanda 119px taşıyordu.
      Flex açığı en kolay kısılan kardeşten, yani LOGODAN kapatıyordu:
      logo 0x0'a inip sol üstte hiç görünmüyordu (02.10.2026, canlıda
      ölçüldü).

   Soldaki "Kategoriler" düğmesi kaldırıldı: aynı başlık üst menüde de
   vardı (müşterinin 7. maddesi "Kategoriler kısmı iki kez yazılmış") ve
   şeritten ~160px yer kazandırdı.
   ------------------------------------------------------------------ */
@media only screen and (min-width: 1400px) {
    .rbt-header .mainmenu-nav .mainmenu > li > a {
        white-space: nowrap;
    }
}

@media only screen and (min-width: 1400px) {
    .rbt-header .mainmenu-nav .mainmenu > li > a {
        font-size: 14px;
        padding: 0 9px;
    }
}

/* Yuduline'a özgü eklentiler.
   Tema dosyası (style.css) derlenmiş ve dev; değiştirmek yerine buradan
   eklemek güncellemelerde çakışmayı önler. Bu dosya style.css'ten SONRA
   yüklenir (bkz. Views/Shared/_Layout.cshtml). */

/* ------------------------------------------------------------------
   Kademeli kategori ağacı  (Views/Shared/_KategoriAgaci.cshtml)
   ------------------------------------------------------------------ */
.yud-kat-agaci {
    /* Masaustu acilir kutuda rahat okunacak genislik, dar ekranda ise
       kapsayicisini asmaz: mobil menude kutu 14px girintili bir alanin
       icinde duruyor ve sabit 260px 320px'lik ekranda yatay kaydirma
       yaratiyordu. */
    min-width: min(260px, 100%);
    max-width: 100%;
    padding: 8px 0;
}

.yud-kat-agaci .yud-kat-dal {
    border-bottom: 1px solid var(--color-border, #e6e6e6);
}

.yud-kat-agaci .yud-kat-dal:last-child {
    border-bottom: 0;
}

.yud-kat-agaci summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
    padding: 10px 16px;
    font-weight: 500;
    line-height: 1.4;
    list-style: none;
    color: var(--color-heading, #27374d);
}

/* Tarayıcının kendi üçgen işaretini gizle; ok ikonu zaten var. */
.yud-kat-agaci summary::-webkit-details-marker { display: none; }
.yud-kat-agaci summary::marker { content: ""; }

.yud-kat-agaci summary:hover {
    color: var(--color-primary, #2f57ef);
}

.yud-kat-agaci summary i {
    flex: 0 0 auto;
    font-size: 14px;
    transition: transform .2s ease;
}

.yud-kat-agaci details[open] > summary > i {
    transform: rotate(180deg);
}

.yud-kat-agaci .yud-kat-govde {
    padding: 0 0 6px 14px;
}

.yud-kat-agaci [data-yud-kat-seviye="2"] > summary {
    font-weight: 400;
    font-size: 15px;
    padding: 8px 16px 8px 4px;
}

.yud-kat-agaci .yud-kat-liste {
    list-style: none;
    margin: 0;
    padding: 0 0 4px 4px;
}

.yud-kat-agaci .yud-kat-liste > li > a {
    display: block;
    padding: 6px 12px 6px 0;
    font-size: 14px;
    line-height: 1.4;
    color: var(--color-body, #5c6574);
}

.yud-kat-agaci .yud-kat-liste > li > a:hover {
    color: var(--color-primary, #2f57ef);
}

.yud-kat-agaci .yud-kat-tarih {
    display: block;
    font-size: 12px;
    opacity: .7;
}

.yud-kat-agaci .yud-kat-tumu > a {
    font-weight: 500;
    color: var(--color-primary, #2f57ef);
}

.yud-kat-agaci .yud-kat-bos {
    padding: 8px 16px;
    margin: 0;
    font-size: 13px;
    opacity: .7;
}

/* Üst menüdeki "Kategoriler" açılır kutusu içinde kullanıldığında kutu
   genişliği menüden taşmasın, uzun listede kendi içinde kaysın. */
.mainmenu .yud-kat-agaci {
    max-height: 70vh;
    overflow-y: auto;
}

/* ------------------------------------------------------------------
   Eğitim türü rozeti (ONLINE / YÜZ YÜZE) — kart ve detay sayfaları
   ------------------------------------------------------------------ */
.yud-tur-rozet {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1.6;
}

.yud-tur-rozet.online {
    background: #e8eeff;
    color: #2f57ef;
}

.yud-tur-rozet.yuzyuze {
    background: #fff1e3;
    color: #a75504;
}

/* ------------------------------------------------------------------
   Eğitim kartlarının tek boyda durması — müşterinin 8. maddesi:
   "Görsel ölçüleri de tüm kartlarda aynı olmalı."
   ------------------------------------------------------------------ */
.rbt-card.variation-01 .rbt-card-img img {
    width: 100%;
    height: 210px;
    object-fit: cover;
}

.yud-kart-aciklama {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 44px;
}

/* ------------------------------------------------------------------
   Vaka süreç şeridi  (Views/CaseUi/_VakaSureci.cshtml)
   Müşterinin 29.09.2026 şartnamesindeki yedi adımlı takip ekranı.
   ------------------------------------------------------------------ */
.yud-kat-agaci summary span,
.yud-kat-agaci .yud-kat-liste > li > a {
    overflow-wrap: anywhere;
}

.yud-vaka-surec .yud-surec-liste {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px 0;
}

.yud-vaka-surec .yud-surec-liste > li {
    flex: 1 1 130px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    position: relative;
    padding: 0 6px;
}

/* Adımlar arası çizgi; son adımda çizilmez. */
.yud-vaka-surec .yud-surec-liste > li::after {
    content: "";
    position: absolute;
    top: 14px;
    left: 50%;
    width: 100%;
    height: 2px;
    background: var(--color-border, #e6e6e6);
    z-index: 0;
}

.yud-vaka-surec .yud-surec-liste > li:last-child::after { display: none; }

.yud-vaka-surec .yud-surec-liste > li.tamam::after { background: #0a7c42; }

.yud-vaka-surec .yud-surec-isaret {
    position: relative;
    z-index: 1;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    background: var(--color-border, #e6e6e6);
    color: var(--color-body, #5c6574);
}

.yud-vaka-surec li.tamam .yud-surec-isaret { background: #0a7c42; color: #fff; }
.yud-vaka-surec li.aktif .yud-surec-isaret { background: var(--color-primary, #2f57ef); color: #fff; }

/* Aşama ADI şeridin asıl bilgisidir, rakam yalnızca sırayı gösterir.
   Önceki hâlinde ad 12px/%60 saydamlıkla basılıyordu; ekranda yalnızca
   "1 2 3 4 5 6 7" okunuyor, adlar silikleşiyordu (müşteri, 04.10.2026:
   "1–7 rakamları aşama isimleriyle gösterilsin"). Ad artık koyu ve
   okunur; sıradaki/biten ayrımını rakam yuvarlağının rengi taşıyor. */
.yud-vaka-surec .yud-surec-ad {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-heading, #1c2a4d);
}

.yud-vaka-surec li.aktif .yud-surec-ad { font-weight: 700; }
.yud-vaka-surec li.bekliyor .yud-surec-ad { opacity: .85; }

/* Dar ekranda şerit dikey akar; yatay çizgi kapatılır. */
@media (max-width: 575px) {
    .yud-vaka-surec .yud-surec-liste { flex-direction: column; }
    .yud-vaka-surec .yud-surec-liste > li {
        flex-direction: row;
        gap: 10px;
        text-align: left;
        align-items: center;
    }
    .yud-vaka-surec .yud-surec-liste > li::after { display: none; }
    .yud-vaka-surec .yud-surec-ad { margin-top: 0; }
}

/* ------------------------------------------------------------------
   METİN AĞIRLIKLI SAYFA ÖGELERİ  (Hakkımızda vb.)

   Müşterinin 01.10.2026 maildeki 3. maddesi: "Metin yerleşimi bozuk.
   Satır sonları ve dikey hizalama düzgün değil." Okuma kolonu sınırlanıp
   satır aralığı açıldı; özet ve yönlendirme alanları kendi kutularında.
   ------------------------------------------------------------------ */
.yud-metin-alani {
    max-width: 760px;
}

.yud-metin-alani p {
    line-height: 1.8;
    margin-bottom: 18px;
}

.yud-metin-alani p:last-child {
    margin-bottom: 0;
}

.yud-metin-alani h2,
.yud-metin-alani h3,
.yud-metin-alani h4,
.yud-metin-alani h5 {
    color: var(--yud-lacivert);
    margin-top: 28px;
    margin-bottom: 12px;
}

.yud-metin-alani ul,
.yud-metin-alani ol {
    line-height: 1.8;
    margin-bottom: 18px;
    padding-left: 20px;
}

/* Özet kutusu: ana sayfadaki sayaçların sayfa içi karşılığı. */
.yud-ozet-kutusu {
    background: #F4F7FF;
    border: 1px solid var(--color-border, #e6e6e6);
    border-radius: 12px;
    padding: 24px;
}

.yud-ozet-baslik {
    color: var(--yud-lacivert);
    margin-bottom: 16px;
}

.yud-ozet-liste {
    list-style: none;
    margin: 0;
    padding: 0;
}

.yud-ozet-liste > li {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid rgba(15, 37, 86, .08);
}

.yud-ozet-liste > li:last-child {
    border-bottom: 0;
}

.yud-ozet-sayi {
    min-width: 44px;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.1;
    color: var(--yud-mavi);
}

/* Tek ve toplu yönlendirme alanı (müşteri, 4. madde: üç ayrı düğme
   sayfayla bütünleşmiyordu). */
.yud-cta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    background: linear-gradient(90deg, #F4F7FF 0%, #FFFFFF 100%);
    border: 1px solid var(--color-border, #e6e6e6);
    border-radius: 12px;
    padding: 28px 30px;
}

.yud-cta-baslik {
    color: var(--yud-lacivert);
    margin-bottom: 6px;
}

.yud-cta-metin {
    margin-bottom: 0;
}

.yud-cta-dugmeler {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

/* ------------------------------------------------------------------
   EĞİTMEN KARTI  (Views/LecturerUi/Index.cshtml)

   Temanın .team-style-default kartı kullanılamıyor: fotoğrafı 150px'lik
   daireye alıp kutunun 75px yukarısına MUTLAK konumluyor, dikdörtgen
   görsel hem kırpılıyor hem de kutunun dışına taşıyordu. Bu kart sade
   ve opak; yukarı taşma yok.
   ------------------------------------------------------------------ */
.yud-egitmen-kart {
    display: block;
    height: 100%;
    background: var(--color-white, #fff);
    border-radius: var(--radius, 10px);
    box-shadow: var(--shadow-1, 0 10px 30px rgba(15, 37, 86, .08));
    overflow: hidden;
    transition: var(--transition, .3s);
}

.yud-egitmen-kart:hover {
    transform: translateY(-4px);
}

.yud-egitmen-foto {
    width: 100%;
    height: 260px;
    object-fit: cover;
    display: block;
}

.yud-egitmen-govde {
    padding: 20px;
}

.yud-egitmen-ad {
    color: var(--yud-lacivert);
    margin-bottom: 4px;
    line-height: 1.35;
}

.yud-egitmen-unvan {
    color: var(--yud-mavi);
    font-size: 14px;
    margin-bottom: 10px;
}

/* ---------------------------------------------------------------------------
   BAŞLIK SATIRI — logonun kaybolması ve düğme metinlerinin satır atlaması

   Canlıda ölçülen durum (02.10.2026, 1568px ekran):
       .mainbar-row genişliği      1305px
       içeriğin istediği genişlik  1417px   → 112px taşma
       logo kapsayıcısı               10px  → logo 0x0, yani görünmüyor
       sağdaki düğme alanı            86px  → "Giriş Yap" iki satıra düşüyor

   Nedeni: menü (.rbt-main-navigation) flex-basis:0 + flex-grow ile satırdaki
   tüm boşluğu alıyor, flex de açığı yanındaki iki kardeşten kısıyor. Menü üç
   kalemken fark edilmiyordu; dokuz kaleme çıkınca logoyu tamamen yuttu.

   Üç tedbir birlikte uygulanıyor:
     1. Logo ve sağ blok artık KISILMIYOR (flex-shrink: 0).
     2. Logo kendi en-boy oranında sabit yükseklikle yer ayırıyor.
     3. Menü kalemlerinin daraltılması artık ÜST SINIRSIZ (yukarıdaki
        "ÜST MENÜ" bölümü); eskiden yalnızca 1699px'e kadar geçerliydi.
   --------------------------------------------------------------------------- */

.yud-logo {
    height: 52px;
    width: auto;
    max-width: none;
    display: block;
}

/* Logo tanımlı değilken basılan metin (bkz. NavBar.cshtml). */
.yud-logo-yazi {
    font-family: var(--font-primary);
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.5px;
    color: var(--yud-lacivert);
    white-space: nowrap;
}

/* Logo ve sağdaki blok artık KISILMIYOR; açık varsa menüden kısılır,
   menü de zaten kendi satırında kaydırılabilir değil — bu yüzden kalemlerin
   boşluğu yukarıda daraltıldı. */
.rbt-header .rbt-header-wrapper .mainbar-row > .header-left,
.rbt-header .rbt-header-wrapper .mainbar-row > .header-right {
    flex-shrink: 0;
}

.rbt-header .rbt-header-wrapper .mainbar-row > .header-right {
    white-space: nowrap;
}
