
.rp-toc{
  display:block; box-sizing:border-box;
  background:#fff; border:1px solid var(--rana-kenar); border-radius:16px;
  overflow:hidden; font-family:inherit;
  box-shadow:0 4px 18px rgba(92,120,87,.08);
}
.rp-toc *{ box-sizing:border-box; }
.rp-toc [hidden]{ display:none !important; }

.rp-toc__ust{ display:flex; align-items:center; gap:10px; width:100%; cursor:pointer; text-align:left; transition:background .2s ease; }
:root .rp-toc__ust{ padding:16px 18px; margin:0; background:var(--rana-acik); border:0; border-radius:0; -webkit-appearance:none; appearance:none; font-family:inherit; }
:root .rp-toc__ust:focus{ background:var(--rana-acik); color:var(--rana-ink); }
:root .rp-toc__ust:hover{ background:#E4EDE0; }
.rp-toc__baslik{ flex:1 1 auto; }
:root .rp-toc__baslik{ color:var(--rana-ink); font-size:16px; font-weight:800; line-height:1.3; letter-spacing:normal; text-transform:none; }
.rp-toc__sayi{ flex:none; min-width:24px; padding:2px 8px; background:var(--rana-koyu); border-radius:999px; text-align:center; }
:root .rp-toc__sayi{ color:#fff; font-size:12px; font-weight:700; line-height:1.5; }
.rp-toc__ok{
  flex:none; width:18px; height:18px; color:var(--rana-koyu);
  transition:transform .25s ease;
}
.rp-toc__ust[aria-expanded="false"] .rp-toc__ok{ transform:rotate(-90deg); }

.rp-toc__ilerleme{
  height:3px; background:var(--rana-kenar);
}
.rp-toc__ilerleme span{
  display:block; height:100%; width:0;
  background:var(--rana-sari);
  transition:width .15s linear;
}

.rp-toc__liste{ counter-reset:rptoc; max-height:60vh; overflow-y:auto; }
:root .rp-toc__liste{ list-style:none; margin:0; padding:10px 0; }
.rp-toc__liste::-webkit-scrollbar{ width:5px; }
.rp-toc__liste::-webkit-scrollbar-thumb{ background:var(--rana-kenar); border-radius:3px; }

:root .rp-toc__oge{ margin:0; padding:0; }
.rp-toc__oge a{ display:block; position:relative; border-left:3px solid transparent; transition:background .18s ease, color .18s ease, border-color .18s ease; }
:root .rp-toc__oge a{ padding:9px 18px 9px 44px; color:var(--rana-metin); font-size:14.5px; font-weight:600; line-height:1.55; text-decoration:none; }
.rp-toc__oge a::before{
  counter-increment:rptoc; content:counter(rptoc) ".";
  position:absolute; left:18px; top:9px;
  color:var(--rana-yesil); font-size:13px; font-weight:700;
  font-variant-numeric:tabular-nums;
}
.rp-toc__oge a:hover{ background:var(--rana-zemin); }
:root .rp-toc__oge a:hover{ color:var(--rana-derin); }

:root .rp-toc__oge--alt a{ padding-left:60px; font-size:13.5px; font-weight:500; }
.rp-toc__oge--alt a::before{
  content:"–"; left:44px; color:var(--rana-kenar);
}

.rp-toc__oge.etkin a{ background:var(--rana-zemin); border-left-color:var(--rana-koyu); }
:root .rp-toc__oge.etkin a{ color:var(--rana-derin); font-weight:700; }
.rp-toc__oge.etkin a::before{ color:var(--rana-koyu); }

.rp-toc a:focus-visible{ outline:3px solid var(--rana-derin); outline-offset:-3px; }

@media(max-width:1024px){
  .rp-toc__liste{ max-height:none; }
}
@media(max-width:767px){
  :root .rp-toc__ust{ padding:14px 15px; }
  :root .rp-toc__baslik{ font-size:15px; }
  :root .rp-toc__oge a{ padding:9px 15px 9px 40px; font-size:14px; }
  .rp-toc__oge a::before{ left:15px; }
  :root .rp-toc__oge--alt a{ padding-left:54px; }
  .rp-toc__oge--alt a::before{ left:40px; }
}
@media(prefers-reduced-motion:reduce){
  .rp-toc__ok, .rp-toc__oge a, .rp-toc__ilerleme span{ transition:none !important; }
}
@media print{
  :root .rp-toc{ display:none; }
}
