/* ==========================================================================
   Meridyen — solsabit.css  (ülke/okul detay: page-solsabit.php)
   home.css (rte/cover/faq/altrows) + core.css (btn/yt-facade) ile birlikte yüklenir.
   ========================================================================== */
@layer components{

  /* Kapak değerlendirme (Google — Product AggregateRating; yalnız page-solsabit.php).
     Açık zeminli kapak → altın dolgu yıldız + lacivert skor. Yıldız barı iki katmanlı:
     alt katman soluk (boş yıldız), üst katman altın ve --rate kadar kırpılı (kısmi dolgu). */
  .cover__rating{display:flex;align-items:center;gap:.5rem;margin-top:.85rem;flex-wrap:wrap}
  .cover__rating-stars{--rate:90%;position:relative;display:inline-block;font-size:1.1rem;line-height:1;letter-spacing:2px;color:var(--line)}
  .cover__rating-stars::before{content:"★★★★★"}
  .cover__rating-stars::after{content:"★★★★★";position:absolute;left:0;top:0;width:var(--rate);overflow:hidden;white-space:nowrap;color:#f6a821}
  .cover__rating-score{font-weight:800;color:var(--navy)}
  .cover__rating-count{color:var(--muted);font-size:.9rem}

  .ssb-layout{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:clamp(1.5rem,4vw,3rem);align-items:start;padding:var(--sp-6) var(--gutter) var(--sp-8)}
  /* Aside boş → tek kolon (yan sütun ayrılmaz). */
  .ssb-layout--solo{grid-template-columns:minmax(0,1fr)}

  /* Sol sabit aside — uzun aside'larda alt kısım da görünsün diye viewport
     yüksekliğine sığdırılır (üstte header + 16px, altta ~16px boşluk); taşarsa
     kendi içinde kaydırılır. Kısa aside'larda kaydırma çubuğu çıkmaz. */
  .ssb-aside{position:sticky;top:calc(var(--header-h) + 16px);display:grid;gap:var(--sp-4);
    max-height:calc(100vh - var(--header-h) - 32px);overflow-y:auto;overscroll-behavior:contain;
    scrollbar-width:thin;scrollbar-color:var(--line) transparent}
  .ssb-aside::-webkit-scrollbar{width:8px}
  .ssb-aside::-webkit-scrollbar-thumb{background:var(--line);border-radius:8px}
  .ssb-aside::-webkit-scrollbar-thumb:hover{background:var(--navy-50)}
  .ssb-aside::-webkit-scrollbar-track{background:transparent}
  .ssb-aside__logo{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-4);text-align:center}
  .ssb-aside__logo img{max-width:120px;height:auto;margin-inline:auto}
  .ssb-aside__buttons{display:grid;gap:.5rem}
  .ssb-aside__buttons .btn{justify-content:center}
  .ssb-aside .toc{background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius);padding:var(--sp-3) var(--sp-3) var(--sp-4)}
  .ssb-aside .toc__title{font-weight:700;color:var(--navy);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;margin:.3rem .6rem .65rem}
  .ssb-aside .toc ul{display:grid;gap:0;list-style:none;padding:0;margin:0}
  /* Sol ray: satırlar bitişik → sol kenarda kesintisiz ince gri dikey çizgi. */
  .ssb-aside .toc__item>a{display:block;padding:.42rem .2rem .42rem .85rem;color:var(--ink);font-size:.9rem;line-height:1.4;
    border-left:2px solid var(--line);transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease)}
  .ssb-aside .toc__item>a:hover{color:var(--navy);border-left-color:var(--navy-50)}
  /* Aktif (okunan) başlık → rayın o segmenti kırmızıya döner + metin kırmızı/kalın. */
  .ssb-aside .toc__item.is-active>a{color:var(--red);font-weight:700;border-left-color:var(--red);box-shadow:inset 1px 0 0 var(--red)}
  /* h3: rayı kaydırmadan SADECE metni içeri al (padding) + soluk tire. */
  .ssb-aside .toc__item--h3>a{padding-left:1.55rem;font-size:.85rem;color:var(--muted)}
  .ssb-aside .toc__item--h3>a::before{content:"–";margin-right:.4rem;color:var(--line);font-weight:700}
  .ssb-aside .toc__item--h3>a:hover{color:var(--navy)}
  .ssb-aside .toc__item--h3.is-active>a,.ssb-aside .toc__item--h3.is-active>a::before{color:var(--red)}

  /* İçerik blokları */
  /* grid-template-columns YOK iken tek 'auto' kolon, içerikteki yatay-şerit (m-altrows)
     max-content'ine (~1900px) genişliyordu -> mobilde dev yatay taşma. minmax(0,1fr) ile
     kolon viewport'a clamp -> tablo/şerit kendi overflow-x:auto'su içinde kayar. */
  .ssb-main{min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-7)}
  /* Çapa kaydırmaları (kapak butonu + TOC) sabit başlığın altında kalmasın. */
  .ssb-block,.ssb-main :is(h2,h3)[id]{scroll-margin-top:calc(var(--header-h) + 20px)}
  .ssb-block__title{font-size:var(--fs-700);color:var(--navy);font-weight:900;margin-bottom:var(--sp-4);position:relative;padding-bottom:.5rem}
  .ssb-block__title::after{content:"";position:absolute;left:0;bottom:0;width:56px;height:4px;border-radius:4px;background:var(--red)}
  .ssb-block__body>*+*{margin-top:var(--sp-4)}

  /* İçerik tabloları (Bootstrap kalıntısı .table) → sade & modern: çerçevesiz,
     yalnız ince satır ayraçları + hover; başlıkta kutu yok, altında ince accent
     çizgi. core.js her tabloyu .table-scroll ile sarar (mobilde yatay kaydırma). */
  .ssb-block__body .table-scroll{margin:var(--sp-5) 0;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ssb-block__body table{min-width:100%;width:100%;border-collapse:collapse;font-size:.94rem;line-height:1.5;color:var(--ink);background:transparent}
  .ssb-block__body .table-scroll table{margin:0}
  .ssb-block__body thead th{text-align:left;font-weight:700;font-size:.74rem;letter-spacing:.07em;text-transform:uppercase;
    color:var(--muted);padding:.4rem 1rem .6rem;border-bottom:2px solid var(--navy);white-space:nowrap;background:transparent}
  .ssb-block__body tbody th,.ssb-block__body tbody td{padding:.82rem 1rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
  .ssb-block__body tbody tr:last-child th,.ssb-block__body tbody tr:last-child td{border-bottom:0}
  .ssb-block__body tbody th{font-weight:600;color:var(--navy)}
  .ssb-block__body tbody td{color:var(--muted)}
  .ssb-block__body tbody tr{transition:background var(--dur) var(--ease)}
  .ssb-block__body tbody tr:hover{background:var(--bg-soft)}
  /* Linkler: kırmızı/altçizgi yok → lacivert, hover'da kırmızı. */
  .ssb-block__body table a{color:var(--navy);font-weight:600;text-decoration:none;transition:color var(--dur) var(--ease)}
  .ssb-block__body table a:hover{color:var(--red)}
  .ssb-block__body table caption{caption-side:top;text-align:left;font-weight:700;color:var(--navy);padding:.2rem 0 .7rem}

  /* İlgili okullar */
  .ssb-schools{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--sp-4);list-style:none;padding:0;margin:0}
  .ssb-school a{display:grid;gap:.4rem;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm);height:100%;transition:box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}
  .ssb-school a:hover{box-shadow:var(--shadow);transform:translateY(-2px)}
  .ssb-school__img{display:block;aspect-ratio:16/10;overflow:hidden}
  .ssb-school__img img{width:100%;height:100%;object-fit:cover}
  .ssb-school__title{padding:0 var(--sp-3);font-weight:700;color:var(--navy)}
  .ssb-school__desc{padding:0 var(--sp-3);color:var(--muted);font-size:.88rem}
  .ssb-school__meta{padding:0 var(--sp-3) var(--sp-3);display:flex;flex-wrap:wrap;gap:.25rem .8rem;font-size:.8rem;color:var(--muted)}
  .ssb-school__meta span{display:inline-flex;align-items:center;gap:.3rem}

  /* Öğrenci oranları (bar) */
  .ssb-bars{display:grid;gap:.6rem;list-style:none;padding:0;margin:0}
  .ssb-bar{display:grid;grid-template-columns:120px 1fr 48px;align-items:center;gap:.75rem}
  .ssb-bar__label{font-weight:600;font-size:.9rem}
  .ssb-bar__track{height:12px;background:var(--navy-50);border-radius:var(--radius-pill);overflow:hidden}
  .ssb-bar__fill{display:block;height:100%;background:linear-gradient(90deg,var(--navy),var(--red));border-radius:var(--radius-pill)}
  .ssb-bar__val{font-weight:700;color:var(--navy);font-size:.85rem;text-align:right}

  /* Gidenler anlatıyor */
  .ssb-testimonials{display:grid;gap:var(--sp-4);list-style:none;padding:0;margin:0}
  .ssb-testimonial{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-4);background:var(--bg-soft);border-radius:var(--radius);padding:var(--sp-4)}
  .ssb-testimonial__photo{width:90px;height:90px;border-radius:50%;object-fit:cover}
  .ssb-testimonial__name{font-weight:700;color:var(--navy);margin-bottom:.3rem}

  /* Galeri (light-gallery: JS yoksa thumbnail grid'ine düşer) */
  .ssb-gallery__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.6rem;list-style:none;padding:0;margin:0}
  .ssb-gallery__list img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--radius-sm);transition:transform var(--dur) var(--ease);display:block}
  .ssb-gallery__link:hover img{transform:scale(1.04)}

  /* Galeri — JS ile zenginleştirilmiş: büyük sahne (tam görünür) + kaydırılabilir thumbnail şeridi */
  .ssb-gallery.is-enhanced{display:flex;flex-direction:column;gap:.7rem}
  .ssb-gallery__stage{position:relative;display:flex;align-items:center;justify-content:center;background:var(--bg-soft);border-radius:var(--radius);overflow:hidden;padding:var(--sp-4);min-height:240px}
  .ssb-gallery__stage-img{max-width:100%;max-height:min(72vh,560px);object-fit:contain;display:block}
  .ssb-gallery__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:42px;height:42px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.86);color:var(--navy);font-size:1.7rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);transition:background var(--dur) var(--ease)}
  .ssb-gallery__nav:hover{background:#fff}
  .ssb-gallery__nav--prev{left:10px}
  .ssb-gallery__nav--next{right:10px}
  .ssb-gallery.is-enhanced .ssb-gallery__list{display:flex;flex-wrap:nowrap;justify-content:safe center;gap:.5rem;overflow-x:auto;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;padding-bottom:.25rem}
  .ssb-gallery.is-enhanced .ssb-gallery__list::-webkit-scrollbar{height:6px}
  .ssb-gallery.is-enhanced .ssb-gallery__list::-webkit-scrollbar-thumb{background:rgba(17,33,120,.25);border-radius:3px}
  .ssb-gallery.is-enhanced .ssb-gallery__item{flex:0 0 auto;width:92px}
  .ssb-gallery.is-enhanced .ssb-gallery__link{display:block;border-radius:var(--radius-sm);overflow:hidden;opacity:.62;outline:2px solid transparent;outline-offset:-2px;transition:opacity var(--dur) var(--ease),outline-color var(--dur) var(--ease)}
  .ssb-gallery.is-enhanced .ssb-gallery__link:hover{opacity:1}
  .ssb-gallery.is-enhanced .ssb-gallery__link.is-active{opacity:1;outline-color:var(--navy)}
  .ssb-gallery.is-enhanced .ssb-gallery__link img{width:92px;height:70px;aspect-ratio:auto;border-radius:0}

  @media (max-width:600px){
    .ssb-gallery__nav{width:36px;height:36px;font-size:1.4rem}
    .ssb-gallery.is-enhanced .ssb-gallery__item{width:76px}
    .ssb-gallery.is-enhanced .ssb-gallery__link img{width:76px;height:58px}
  }

  /* Harita */
  .ssb-map iframe{width:100%;min-height:360px;border:0;border-radius:var(--radius)}

  /* CTA */
  .ssb-cta{background:var(--navy-50);border-radius:var(--radius-lg);padding:var(--sp-5);text-align:center}
  .ssb-cta .ssb-block__title::after{left:50%;transform:translateX(-50%)}
  /* Scroll ile inline form (info-form.js formu buraya taşır). Beyaz panel, ortalı. */
  .ssb-cta__mount[hidden]{display:none}
  .ssb-cta__mount{max-width:560px;margin:1.6rem auto 0;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;text-align:left;color:var(--ink);animation:ssb-inline-in .3s cubic-bezier(.16,1,.3,1)}
  @keyframes ssb-inline-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  /* Inline formda kapat butonu gereksiz (kapatılamaz, sayfanın parçası). */
  .ssb-cta__mount .info-modal__close{display:none}
  /* Inline aktifken tetikleyici buton ve bölüm başlığı gizlenir (form kendi başlığını taşır). */
  .ssb-cta.is-inline-active .ssb-cta__btn,
  .ssb-cta.is-inline-active>.ssb-block__title{display:none}
  @media (prefers-reduced-motion:reduce){.ssb-cta__mount{animation:none}}

  /* Program detayı (yaz okulu programı) */
  .prog-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--sp-3);list-style:none;padding:0;margin:0 0 var(--sp-4)}
  .prog-facts li{background:var(--bg-soft);border-radius:var(--radius);padding:var(--sp-3) var(--sp-4);display:grid;gap:.2rem}
  .prog-facts__k{font-size:.72rem;font-weight:700;letter-spacing:.04em;color:var(--red);text-transform:uppercase}
  .prog-facts__v{font-weight:600;color:var(--navy)}
  .prog-services{margin-bottom:var(--sp-4)}
  .prog-services__title{font-weight:800;color:var(--red);margin-bottom:.5rem}
  .prog-services ul,.prog-prices ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.5rem;list-style:none;padding:0;margin:0}
  .prog-service{display:flex;align-items:flex-start;gap:.5rem;padding:.5rem .7rem;border:1px solid var(--line);border-radius:var(--radius-sm)}
  .prog-service .mrd-icon{color:var(--muted);flex:none;margin-top:.15rem}
  .prog-service.is-included{border-color:rgba(26,166,75,.4);background:rgba(26,166,75,.06)}
  .prog-service.is-included .mrd-icon{color:#1aa64b}
  .prog-service small{display:block;color:var(--muted);font-size:.8rem}
  .prog-prices li{background:var(--navy);color:#fff;border-radius:var(--radius);padding:var(--sp-3);text-align:center}
  .prog-prices__amount{display:block;font-size:var(--fs-600);font-weight:900}
  .prog-prices__week{display:block;font-size:.78rem;color:var(--yellow);letter-spacing:.04em}
}

@media (max-width:900px){
  .ssb-layout{grid-template-columns:1fr}
  .ssb-aside{position:static;grid-auto-flow:row;max-height:none;overflow:visible}
}

@media (max-width:600px){
  /* Dar ekranda hücreleri ezmek yerine tabloyu yatay kaydır. */
  .ssb-block__body table{min-width:480px}
  .ssb-block__body thead th,.ssb-block__body tbody th,.ssb-block__body tbody td{padding:.55rem .7rem}
}