/* ==========================================================================
   Detay sayfasi gorunum duzeltmeleri (klinik / hastane / doktor)

   Cozulen sorunlar:
   1) Sayfa basligi 32px, ortalanmis ve kendi beyaz bandinda duruyordu; ilk
      ekranin ~130px'ini tek basina yiyor, icerikle bagi kopuyordu.
   2) Puan gostergesi 3.8 icin 4 dolu yildiz basiyordu, bos yildiz cercevesi
      olmadigi icin 5.0 ile 3.8 neredeyse ayni goruntuyu veriyordu.
   3) "Available languages" dairesel tik, "Amenities" ciplak kalin tik
      kullaniyordu; ikisi de satir basina bir base64 PNG idi.
   4) "Treatments" bolum basligi ile altindaki kategori basliklari ayni
      boyuttaydi (24px), asil icerik olan tedavi adi 13px kaliyordu; hiyerarsi
      tam tersine donmustu.
   5) Google yorum ozeti mavi bir kutuda yalnizca rakam gosteriyordu.
   ========================================================================== */

/* --- 1. Sayfa basligi ---------------------------------------------------- */

.wc-page-head {
    padding: 1.5rem 0 0.25rem;
}

/*  Ozgulluk bilincli olarak yukseltildi (.wc-page-head h1...): Bootstrap basligi
    ".h1, h1 { font-size: calc(1.375rem + 1.5vw) }" ile akiskan olarak tanimliyor
    ve genis ekranlarda 30px'i asiyor. Tek sinifla yazilsaydi ayni ozgullukte
    kalip yalnizca dosya sirasina bagli olurdu; stil sirasi degisirse baslik
    sessizce eski boyutuna donerdi. */
.wc-page-head h1.wc-page-head__title {
    margin: 0;
    font-size: 1.5rem;
    line-height: 1.3;
    font-weight: 600;
    color: #1b1f23;
    text-align: left;
}

@media (max-width: 575.98px) {
    .wc-page-head h1.wc-page-head__title {
        font-size: 1.25rem;
    }
}

/* --- 6. Overview icindeki yonetici HTML'i -------------------------------- */

/*  Klinik aciklamasi yonetim panelinden zengin metin olarak giriliyor ve
    icindeki h2/h3/h4 etiketlerinin hicbir sinifi yok. Tarayici varsayilaniyla
    h2 yaklasik 30px cikiyordu: sayfanin kendi H1'i ile ayni boyut. Uzun
    aciklamalarda (ornegin Acibadem Altunizade) bu boyutta bir düzine baslik
    ust uste geldigi icin sayfa tamamen hiyerarşisiz goruluyordu.

    Aciklama icindeki basliklar artik sayfa basliginin (1.5rem) altinda kalan
    tutarli bir olcege oturuyor. Sinif degil eleman secicisi kullanildi: metin
    admin tarafindan girildigi icin sinif eklenmesi beklenemez. */
/*  Olcek yukaridan asagi: sayfa H1 24px > bolum basligi 20px > metin ici h2 18px
    > h3 16px > h4-h6 15px. Onceki halde metin ici h2 ~30px ile sayfa basligiyla
    esitti, hatta "Overview" bolum basligindan buyuktu. */
#overview_text h1,
#overview_text h2,
.wc-rich-text h1,
.wc-rich-text h2 {
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.35;
    margin: 1.5rem 0 0.5rem;
    color: #1b1f23;
}

#overview_text h3,
.wc-rich-text h3 {
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 1.25rem 0 0.4rem;
    color: #1b1f23;
}

#overview_text h4,
#overview_text h5,
#overview_text h6,
.wc-rich-text h4,
.wc-rich-text h5,
.wc-rich-text h6 {
    font-size: 0.9375rem;
    font-weight: 600;
    line-height: 1.45;
    margin: 1rem 0 0.35rem;
    color: #374151;
}

#overview_text > :first-child,
.wc-rich-text > :first-child {
    margin-top: 0;
}

/*  Overview kisaltma.

    Sayfada zaten bir "Show more" baglantisi ve ona bagli bir tiklama isleyicisi
    vardi; isleyici #overview_text'e .text-open sinifini ekliyordu. Ancak ne
    .text-open hicbir yerde tanimliydi ne de kutunun bir max-height'i vardi:
    metin her zaman tam boyuyla basiliyor, uzun aciklamalarda sayfanin ust
    kismini tamamen kapliyordu. Eksik iki parca burada tamamlaniyor. */
#overview_text {
    position: relative;
    max-height: 17.5rem;
    overflow: hidden;
}

/*  Destinasyon sayfalarinda (ulke / sehir rehberi) sinir daha dar tutuluyor.
    Klinik aciklamalari uzun oldugu icin 17.5rem makul; sehir rehberi metinleri
    cogu zaman bunun altinda kaliyor ve "Show more" hic gorunmuyordu (ornegin
    Istanbul metni 210px). Ayirt edici sinif .wc-rich-text: klinik Overview'i
    bu sinifi tasimiyor. */
#overview_text.wc-rich-text {
    max-height: 11rem;
}

#overview_text.text-open {
    max-height: none;
    overflow: visible;
}

/*  Kapali haldeyken alt kenarda solma: metnin devam ettigini gosterir.
    pointer-events: none, altta kalan baglantilarin tiklanabilirligini korur. */
#overview_text:not(.text-open)::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 4.5rem;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #fff 85%);
    pointer-events: none;
}

.wc-show-more {
    display: inline-block;
    margin-top: 0.5rem;
    padding: 0;
    background: none;
    border: 0;
    font-size: 0.9375rem;
    font-weight: 600;
    color: #2b4eff;
    cursor: pointer;
}

.wc-show-more:hover {
    text-decoration: underline;
}

/* --- 7. Yorum yazari avatari --------------------------------------------- */

/*  Google profil fotograflari ucuncu taraf adreslerden geliyor, suresi doluyor
    ve cogu zaman hic yuklenmiyordu; geriye 1x1 seffaf placeholder kaliyordu.
    Avatar artik her zaman bir zemin ikonu uzerine biniyor: fotograf yoksa ya
    da yuklenemezse altindaki standart ikon goruluyor. */
.wc-avatar {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #eef1f5;
    color: #9aa4b2;
    overflow: hidden;
}

.wc-avatar svg {
    width: 22px;
    height: 22px;
}

.wc-avatar__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.wc-review-author {
    font-weight: 600;
    color: #1b1f23;
}

.wc-review-date {
    font-size: 0.8125rem;
    color: #6b7280;
}

/* --- 2. Yildiz cubugu ---------------------------------------------------- */

.wc-rating {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Bos yildizlar zemin, dolu yildizlar uzerine bindirilip yuzdeye gore
   kirpiliyor. Boylece 3.8 gercekten 3.8 gibi gorunuyor. */
.wc-stars {
    position: relative;
    display: inline-block;
    font-size: 1rem;
    line-height: 1;
    letter-spacing: 0.08em;
    color: #dcdfe4;
    white-space: nowrap;
}

.wc-stars__fill {
    position: absolute;
    left: 0;
    top: 0;
    overflow: hidden;
    white-space: nowrap;
    color: #f5a623;
}

.wc-rating__score {
    font-weight: 600;
    font-size: 0.9375rem;
    color: #1b1f23;
}

.wc-rating__count {
    font-size: 0.875rem;
    color: #6b7280;
}

/* --- 3. Diller / olanaklar / calisma saatleri ---------------------------- */

.wc-facts__title {
    margin: 0 0 0.75rem;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7280;
}

.wc-fact {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    margin: 0 0 0.5rem;
    font-size: 0.9375rem;
    color: #374151;
}

/* Satir basina base64 PNG yerine tek bir CSS tiki: her iki listede ayni,
   daha hafif ve sayfanin geri kalaniyla uyumlu. */
.wc-tick {
    position: relative;
    flex: 0 0 auto;
    width: 1.125rem;
    height: 1.125rem;
    margin-top: 0.15rem;
    border-radius: 50%;
    background: #e8f5ee;
}

.wc-tick::before {
    content: "";
    position: absolute;
    left: 0.4rem;
    top: 0.22rem;
    width: 0.28rem;
    height: 0.52rem;
    border: solid #1e7d4f;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.wc-hours {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: 0.9375rem;
    padding: 0.2rem 0;
}

.wc-hours__day {
    color: #374151;
}

.wc-hours__time {
    color: #6b7280;
    white-space: nowrap;
}

/* --- 4. Bolum ve tedavi basliklari --------------------------------------- */

.wc-section-title {
    margin: 2rem 0 0.75rem;
    font-size: 1.25rem;
    font-weight: 600;
    color: #1b1f23;
}

/* Kategori adi artik bolum basligindan kucuk: goz once "Treatments"i,
   sonra kategoriyi, sonra tedaviyi goruyor. */
.wc-treat-group {
    margin: 1.75rem 0 0.25rem;
    font-size: 0.8125rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #6b7280;
}

/* --- 5. Google yorum ozeti ----------------------------------------------- */

.wc-review-summary {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    margin: 1rem 0 1.5rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    background: #fff;
}

.wc-review-summary__score {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    color: #1b1f23;
}

.wc-review-summary__meta {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #6b7280;
}

/* --- 8. Sayfa altindaki blog bolumu ------------------------------------- */

/*  "Get inspiration for your next medical trip" basligi 34px basiliyordu:
    sayfanin kendi H1'inden (24px) buyuk. Bolum basligi olcegine cekildi. */
/*  .center varyanti bilincli olarak ayrica yazildi: style.css icinde
    ".main_title.center h2 { font-size: 2.125rem }" kurali var ve tek sinifla
    yazilan bir kural ondan daha az ozgul kaldigi icin uygulanmiyordu. */
/*  !important bilincli: style.css icindeki ".main_title.center h2 { 2.125rem }"
    kurali, daha ozgul bir secici (body .main_title.center h2) ve daha sonra
    yuklenen bir dosya ile bile ezilemedi. Tema dosyalarina dokunmamak icin
    burada agirlik veriliyor; yalnizca bu iki bildirimle sinirli. */
body .main_title h2 {
    font-size: 1.25rem !important;
    font-weight: 600;
    line-height: 1.3;
}

body .main_title.center h2 {
    font-size: 1.25rem !important;
    font-weight: 600;
    line-height: 1.3;
}

body .main_title p {
    font-size: 0.9375rem !important;
    color: #6b7280;
}

/*  Blog kart basligi dort sutunlu izgarada 21px ile fazla iri duruyordu.
    Iki satirda kirpiliyor ki kartlar ayni yukseklikte kalsin. */
body article.blog .post_info h2 {
    margin: 0.25rem 0 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.35;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body article.blog .post_info small {
    font-size: 0.8125rem;
    color: #6b7280;
}