/* ==========================================================================
   Uzm. Dt. M. Seda Köseoğlu Dülger — taslağın style.css'ine eklemeler.
   style.css taslaktan olduğu gibi geldi; buradaki her kural, taslağın elle
   yazılmış HTML'i yerine sistemden gelen içeriğin (zengin metin, panel
   metni, tedavi görseli) aynı görünmesi ya da kullanıcı kararıyla eklenen
   bir parça (blog süzme, yasal linkler, sistem formu) için.
   ========================================================================== */

/* --- Tedavi ikonu: taslakta emoji, burada tedavinin görseli (kullanıcı
       kararı). Emoji ile aynı kutuya oturuyor. --- */
.damga-ikon img { width: 64%; height: 64%; object-fit: contain; }
.buyuk-damga-ikon { display: grid; place-items: center; width: 80px; height: 80px; }
.buyuk-damga-ikon img { width: 100%; height: 100%; object-fit: contain; }
.alt-menu .dropdown-item span img { width: 1.15em; height: 1.15em; object-fit: contain; vertical-align: -.2em; }
.yan-liste a span img { width: 62%; height: 62%; object-fit: contain; }

/* --- Panel çok paragraflı metni (Tanışalım, Hikâyem): taslağın .metin'i --- */
.sk-metin p { color: var(--murekkep-2); font-size: 1.1rem; }
.sk-metin p:last-child { margin-bottom: 0; }
.tanis .sk-metin { margin-bottom: 1rem; }

/* --- Zengin metin (tedavi, yazı, serbest sayfa) ---
   Panel editörü sınıf yazmıyor: taslağın elle yazılmış kutuları düz
   etiketlerden üretiliyor. Editör liste maddelerini <p> ile sarıyor. */
.sk-prose { overflow-wrap: anywhere; }
.sk-prose li > p { margin: 0; }
.sk-prose img { max-width: 100%; height: auto; border-radius: 18px; }
.sk-prose table { width: 100%; border-collapse: collapse; margin: 0 0 1.4rem; display: block; overflow-x: auto; }
.sk-prose th, .sk-prose td { border: 2px solid var(--murekkep); padding: .6rem .9rem; text-align: left; }
.tedavi-metin .sk-prose > h2:first-child { margin-top: 1.6rem; }

/* Tedavide <blockquote> = taslağın "Çocuğunuza böyle anlatıyoruz" kutusu
   (.cocuk-dili-sade): ilk satır (kalın) küçük üst başlık, zürafa solda. */
.tedavi-metin .sk-prose blockquote {
  position: relative; margin: 2rem 0; padding: 18px 22px 18px 98px; min-height: 96px;
  background: var(--sari) url("../images/seda/zurafa.svg") no-repeat 22px center / 58px auto;
  border-left: 6px solid var(--fusya); border-radius: 0 18px 18px 0;
}
.tedavi-metin .sk-prose blockquote p { margin: 0; font-family: var(--baslik); font-weight: 700; font-size: 1.15rem; line-height: 1.35; color: var(--murekkep); }
.tedavi-metin .sk-prose blockquote p:first-child:has(> strong:only-child) {
  font-family: var(--govde); font-weight: 800; font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: var(--murekkep-2); margin-bottom: 4px;
}
.tedavi-metin .sk-prose blockquote p:first-child > strong:only-child { font-weight: 800; color: inherit; }
@media (max-width: 575.98px) {
  .tedavi-metin .sk-prose blockquote { padding-left: 22px; padding-top: 74px; background-position: 22px 16px; background-size: 40px auto; }
}

/* Yazıda: ilk paragraf taslağın .yazi-giris'i, <blockquote> "Kısaca" kutusu
   (.kisaca + .tikler-koyu; zemin rengi yazının etiketinden, --c). */
.sk-article > p:first-child { font-size: 1.25rem; font-weight: 600; line-height: 1.6; margin-top: 2.6rem; }
.yazi-kapak-gorsel + .icindekiler + .sk-article > p:first-child,
.yazi-kapak-gorsel + .sk-article > p:first-child { margin-top: 2.6rem; }
.sk-article blockquote { background: var(--c); border: var(--cizgi); border-radius: var(--yaricap); box-shadow: var(--golge-kucuk); padding: 22px 26px 18px; margin: 1.8rem 0; }
.sk-article blockquote > p:first-child:has(> strong:only-child) { font-family: var(--baslik); font-size: 1.4rem; line-height: 1.08; margin: 0 0 .8rem; }
.sk-article blockquote > p:first-child > strong:only-child { font-weight: 700; }
.sk-article blockquote ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.sk-article blockquote li { display: flex; gap: 12px; align-items: flex-start; font-weight: 700; color: var(--murekkep); }
.sk-article blockquote li::before { content: "✓"; display: grid; place-items: center; flex: none; width: 30px; height: 30px; margin-top: -2px; border-radius: 50%; background: var(--limon); color: var(--murekkep); border: 2px solid var(--murekkep); font-size: .95rem; }
.sk-article blockquote p:last-child { margin-bottom: 0; }
/* Sondaki "Kaynaklar" başlığı ve listesi: taslağın .kaynaklar'ı */
.sk-article h2:last-of-type:has(+ ul:last-child) { font-size: 1.3rem; margin-top: 2.4rem; padding-top: 1.4rem; border-top: 3px dashed rgba(42,21,48,.2); }
.sk-article h2:last-of-type + ul:last-child li { font-size: .98rem; }

/* --- Yazı künyesi: etiket link olduğunda --- */
.rozet-ust a:hover { text-decoration: underline !important; text-underline-offset: 3px; }

/* --- Blog: etiket düğmeleri + arama (taslakta yoktu; görünüm taslağın
       .dil-sec / .dugme dilinden) --- */
.sk-blog-bar { display: flex; align-items: flex-start; gap: 1rem 2rem; margin-bottom: 2rem; }
.sk-chips { display: flex; flex-wrap: wrap; gap: .5rem; flex: 1 1 0; min-width: 0; }
.sk-chips a { padding: .45em 1em .35em; border: 2px solid var(--murekkep); border-radius: 999px; background: #fff; font-family: var(--baslik); font-weight: 700; font-size: .98rem; color: var(--murekkep); text-decoration: none; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.sk-chips a span { margin-left: .15rem; opacity: .55; font-size: .85em; }
.sk-chips a:hover { background: var(--gok-acik); transform: translate(-1px, -1px); box-shadow: 3px 3px 0 var(--murekkep); }
.sk-chips a.active { background: var(--fusya); color: #fff; box-shadow: 3px 3px 0 var(--murekkep); }
.sk-search { position: relative; flex: 0 0 290px; margin-left: auto; }
.sk-search svg { position: absolute; left: 16px; top: 50%; width: 18px; height: 18px; transform: translateY(-50%); color: var(--murekkep-2); pointer-events: none; }
.sk-search input { width: 100%; height: 48px; padding: 0 1.1rem 0 2.8rem; border-radius: 999px; border: var(--cizgi); background: #fff; font-weight: 700; color: var(--murekkep); box-shadow: var(--golge-kucuk); }
.sk-search input:focus { outline: none; border-color: var(--fusya); box-shadow: 0 0 0 4px var(--pudra); }
.sk-filter-note { margin: -.5rem 0 2rem; color: var(--murekkep-2); font-weight: 700; }
.sk-filter-note a { margin-left: .6rem; color: var(--fusya-koyu); text-decoration: none; }
.sk-empty { text-align: center; padding: 2.5rem 1rem; color: var(--murekkep-2); font-weight: 700; }
.sk-empty span { display: block; font-size: 2.2rem; margin-bottom: .6rem; }
@media (max-width: 991.98px) {
  .sk-blog-bar { flex-direction: column; align-items: stretch; }
  .sk-search { flex: none; margin-left: 0; }
}

/* --- Blog sayfalaması (taslakta yoktu) --- */
.sk-pagination { display: flex; justify-content: center; margin-top: 3rem; }
.sk-pagination nav > div:first-child { display: none !important; }
.sk-pagination nav > div:last-child { display: flex !important; flex-direction: column; align-items: center; gap: .8rem; }
.sk-pagination p.small { margin: 0; color: var(--murekkep-2); font-weight: 700; }
.sk-pagination .pagination { --bs-pagination-color: var(--murekkep); --bs-pagination-hover-color: var(--murekkep); --bs-pagination-hover-bg: var(--gok-acik); --bs-pagination-active-bg: var(--fusya); --bs-pagination-active-border-color: var(--murekkep); --bs-pagination-border-color: var(--murekkep); --bs-pagination-border-width: 2px; --bs-pagination-bg: #fff; --bs-pagination-focus-box-shadow: none; gap: .4rem; margin: 0; }
.sk-pagination .page-link { border-radius: 999px !important; min-width: 44px; text-align: center; font-weight: 800; }

/* --- Biniş kartı: sistem formu (taslakta WhatsApp'a mesaj açıyordu) --- */
.sk-kvkk { margin-top: 14px; font-size: .92rem; color: var(--murekkep-2); font-weight: 600; }
.sk-kvkk .form-check-input { border: 2px solid var(--murekkep); }
.sk-kvkk .form-check-input:checked { background-color: var(--fusya); border-color: var(--murekkep); }
.sk-kvkk a { color: var(--fusya-koyu); font-weight: 800; }
.sk-bilet-tamam { grid-template-columns: 1fr; }
.sk-bilet-tamam .bilet-ana { border-radius: 26px; border-right: var(--cizgi); }
.sk-tamam-baslik { font-size: clamp(1.8rem, 3vw, 2.4rem); }
.sk-bilet-tamam p { color: var(--murekkep-2); font-size: 1.1rem; }

/* --- Footer: KVKK / Çerez Politikası (kullanıcı isteği) --- */
.sk-yasal { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; margin: 0; }
.sk-yasal a { color: #D9C8DE; font-weight: 700; font-size: .9rem; text-decoration: none; }
.sk-yasal a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* --- Anasayfa klinik kaydırıcısı ---
   Taslak mobilde kaydırıcıyı tam genişliğe yayıyordu: öndeki kart ekranı
   kenardan kenara kaplıyor, arkadaki kartlar ekran dışına taşıyordu.
   Mobilde daraltılıp ortalanıyor, kart görünümü ve yığın iki yanda da
   görünür kalıyor. Fotoğraf altı yazısı galerideki başlık — taslağın kısa
   yazılarından uzun, iki satıra düşünce resmin üstüne biniyordu: alttaki
   bandın içinde ortalanıp en fazla iki satır. */
.kare figcaption { top: auto; bottom: 0; height: 54px; display: flex; align-items: center; justify-content: center; padding: 0 14px; line-height: 1.15; }
.kare figcaption { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; padding-top: 7px; }
@media (max-width: 991.98px) {
  .klinik-swiper { width: min(80%, 420px); margin-inline: auto; }
  .kare figcaption { font-size: 1rem; }
}

/* --- Mobil yatay taşma koruması --- */
html, body { overflow-x: clip; }

/* Etiketsiz blog kartı: taslakta her kartın etiketi vardı ve başlığa üst boşluğu
   etiket veriyordu (.yazi-etiket margin-top). Etiketsiz yazıda başlık görselin
   çizgisine yapışıyor, Türkçe büyük harflerin noktası (İ) kesiliyordu. */
.yazi-gorsel + h2, .yazi-gorsel + h3 { margin-top: 22px; }
