/* Gyro Bilgi Merkezi: zenginleştirilmiş rehber şablonu (R2 2026-11-10).
   Yalnız .kb-guide sarmalı olan makalelerde devreye girer; eski "nedir" makaleleri (sarmalsız) olduğu gibi görünür.
   İçerik WISECP Filter::article_html'den geçer: yalnız sınıf/data-* ile biçim, satır içi script/stil yok. */

.kb-guide{--kbg-gap:1.25rem;font-size:1rem;line-height:1.7}
.kb-guide>h2{margin-block:2.5rem .9rem;padding-block-start:1.25rem;border-block-start:1px solid var(--wstyle-border-color);scroll-margin-top:calc(var(--gyro-header-h,72px) + 1rem)}
.kb-guide>h2:first-of-type{border-block-start:0;padding-block-start:0}
.kb-guide h3{margin-block:1.75rem .6rem;scroll-margin-top:calc(var(--gyro-header-h,72px) + 1rem)}
.kb-guide code{padding:.1em .35em;border-radius:.35rem;background-color:color-mix(in srgb,var(--wstyle-primary) 8%,var(--wstyle-surface-bg));font-size:.875em;color:var(--wstyle-heading-color);overflow-wrap:anywhere}
.kb-guide .kb-codeblock code{padding:0;background:none;color:inherit}

/* Rehber başlık kutusu: ne öğreneceksiniz / süre / kimin için / gerekenler */
.kb-guide-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.75rem 1.25rem;margin-block:0 2rem;padding:1.15rem 1.25rem;border:1px solid color-mix(in srgb,var(--wstyle-primary) 25%,var(--wstyle-border-color));border-radius:var(--gyro-radius-lg,1rem);background:linear-gradient(135deg,color-mix(in srgb,var(--wstyle-primary) 7%,var(--wstyle-surface-bg)),var(--wstyle-surface-bg))}
.kb-guide-meta-item{display:flex;gap:.6rem;align-items:flex-start;min-inline-size:0}
.kb-values.kb-guide-meta{overflow:visible}
.kb-guide-meta .kb-value-row{padding:0;background:none!important;border:0!important}
.kb-guide-meta .kb-value-label{inline-size:auto;flex-shrink:1}
.kb-guide-meta .kb-value{font-family:inherit;font-size:.925rem;font-weight:400;overflow-wrap:normal}
.kb-guide-meta-item.is-wide{grid-column:1/-1}
.kb-guide-meta-item>.bi{flex-shrink:0;font-size:1.15rem;line-height:1.5;color:var(--wstyle-primary)}
.kb-guide-meta-label{display:block;font-size:.75rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--wstyle-muted-color)}
.kb-guide-meta-value{display:block;font-size:.925rem;color:var(--wstyle-heading-color)}
.kb-guide-meta-value p{margin:0}

/* Numaralı adım bileşeni */
.kb-guide ol.kb-steps{list-style:none;counter-reset:kbstep;margin-block:1rem 1.5rem;padding-inline-start:0}
.kb-guide ol.kb-steps>li{position:relative;counter-increment:kbstep;margin-block:.65rem;padding-inline-start:2.75rem;min-block-size:2rem}
.kb-guide ol.kb-steps>li::before{content:counter(kbstep);position:absolute;inset-inline-start:0;inset-block-start:.05rem;display:inline-flex;align-items:center;justify-content:center;inline-size:1.9rem;block-size:1.9rem;border-radius:50%;background-color:var(--wstyle-primary);color:#fff;font-weight:700;font-size:.875rem;line-height:1}
.kb-guide ol.kb-steps>li:not(:last-child)::after{content:"";position:absolute;inset-inline-start:.92rem;inset-block-start:2.1rem;inset-block-end:-.6rem;border-inline-start:2px solid color-mix(in srgb,var(--wstyle-primary) 22%,transparent)}
.kb-guide ol.kb-steps>li>ul,.kb-guide ol.kb-steps>li>ol{margin-block:.35rem}

/* Bilgi kutuları: mevcut .kb-callout + Gyro "Biliyor muydunuz?" (ipucu) */
.kb-guide .kb-callout{align-items:flex-start}
.kb-guide .kb-callout p,.kb-guide .kb-callout li{font-size:.925rem}
.kb-guide .kb-callout p+p,.kb-guide .kb-callout p+ul,.kb-guide .kb-callout ul+p{margin-block-start:.4rem}
.kb-guide .kb-callout ul{margin:.3rem 0 0;padding-inline-start:1.1rem}
.kb-callout-tip{border-inline-start-color:var(--gyro-accent,#7cb342);background-color:color-mix(in srgb,var(--gyro-accent,#7cb342) 9%,var(--wstyle-surface-bg))}
.kb-callout-tip .kb-callout-ico{color:color-mix(in srgb,var(--gyro-accent,#7cb342) 80%,#000)}
.kb-callout-tip .kb-callout-title{color:color-mix(in srgb,var(--gyro-accent,#7cb342) 55%,var(--wstyle-heading-color))}

/* Ekran görüntüsü + açıklama (mevcut .kb-figure lightbox'ıyla) */
.kb-guide .kb-figure-btn{box-shadow:var(--gyro-shadow-sm,0 1px 2px rgba(0,0,0,.06))}
.kb-guide .kb-figure figcaption{text-align:start}
.kb-guide .kb-figure-num{display:inline-block;margin-inline-end:.35rem;font-weight:700;color:var(--wstyle-heading-color)}
.kb-guide .kb-figure-ph{font-size:.85rem;text-align:center;padding:1rem}

/* Tablolar: dar ekranda yatay kaydırma */
.kb-table-wrap{margin-block:1.25rem;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--wstyle-border-color);border-radius:var(--wstyle-radius)}
.kb-table-wrap .kb-table{margin:0;min-inline-size:32rem;border:0}
.kb-guide .kb-table{inline-size:100%;border-collapse:collapse;font-size:.9rem}
.kb-guide .kb-table th,.kb-guide .kb-table td{padding:.55rem .75rem;border-block-end:1px solid var(--wstyle-border-color);vertical-align:top;text-align:start}
.kb-guide .kb-table thead th{background-color:color-mix(in srgb,var(--wstyle-primary) 6%,var(--wstyle-surface-bg));font-weight:700;color:var(--wstyle-heading-color)}
.kb-guide .kb-table tbody tr:last-child td{border-block-end:0}

/* SSS (section.kb-faq-item > p.kb-faq-q + div.kb-faq-a; FAQPage JSON-LD buradan). gyro-kb.js açılır/kapanır yapar; JS yoksa hepsi açık. */
.kb-faq{margin-block:1rem 1.5rem;border:1px solid var(--wstyle-border-color);border-radius:var(--gyro-radius,.75rem);overflow:hidden}
.kb-faq-item+.kb-faq-item{border-block-start:1px solid var(--wstyle-border-color)}
.kb-faq-q{position:relative;margin:0;padding:.85rem 2.75rem .85rem 1.1rem;color:var(--wstyle-heading-color)}
.kb-faq-q strong{font-weight:600}
.kb-faq.is-js .kb-faq-q{cursor:pointer;user-select:none}
.kb-faq.is-js .kb-faq-q:hover{background-color:color-mix(in srgb,var(--wstyle-primary) 4%,transparent)}
.kb-faq.is-js .kb-faq-q:focus-visible{outline:2px solid var(--wstyle-primary);outline-offset:-2px}
.kb-faq.is-js .kb-faq-q::after{content:"+";position:absolute;inset-inline-end:1rem;inset-block-start:50%;transform:translateY(-50%);font-size:1.25rem;font-weight:400;color:var(--wstyle-primary);transition:transform .2s var(--gyro-ease,ease)}
.kb-faq.is-js .kb-faq-item.is-open .kb-faq-q::after{transform:translateY(-50%) rotate(45deg)}
.kb-faq.is-js .kb-faq-item:not(.is-open) .kb-faq-a{display:none}
.kb-faq-a{padding:0 1.1rem 1rem}
.kb-faq-a p:last-child{margin-block-end:0}
[dir=rtl] .kb-faq-q{padding:.85rem 1.1rem .85rem 2.75rem}

/* Sıradaki adım kartı */
.kb-next{display:grid;gap:1rem;margin-block:2.5rem 1rem;padding:1.4rem 1.5rem;border-radius:var(--gyro-radius-lg,1rem);background:linear-gradient(135deg,var(--wstyle-secondary,#065174),var(--wstyle-primary,#0f7a7b));color:#fff}
.kb-next-title{margin:0;font-size:1.15rem;font-weight:700;color:#fff;border:0;padding:0}
.kb-next ul{margin:0;padding:0;list-style:none;display:grid;gap:.6rem}
.kb-next li{position:relative;padding-inline-start:1.6rem}
.kb-next li::before{content:"\2192";position:absolute;inset-inline-start:0;font-weight:700;color:var(--gyro-accent,#a5d66f)}
[dir=rtl] .kb-next li::before{content:"\2190"}
.kb-next a{color:#fff;text-decoration:underline;text-underline-offset:.2em;font-weight:600}
.kb-next a:hover{color:#fff;text-decoration-thickness:2px}
.kb-next strong{color:#fff}
.kb-next code{background-color:rgba(255,255,255,.15);color:#fff}

/* İlgili rehberler (tema; aynı kategoriden) */
.kb-related{margin-block:2rem 0}
.kb-related-title{font-size:1.05rem;font-weight:700;margin-block-end:.85rem;color:var(--wstyle-heading-color)}
.kb-related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.75rem}
.kb-related-card{display:flex;gap:.65rem;align-items:flex-start;padding:.85rem 1rem;border:1px solid var(--wstyle-border-color);border-radius:var(--gyro-radius,.75rem);background-color:var(--wstyle-surface-bg);color:var(--wstyle-heading-color);text-decoration:none;transition:border-color .2s var(--gyro-ease,ease),box-shadow .2s var(--gyro-ease,ease),transform .2s var(--gyro-ease,ease)}
.kb-related-card:hover{border-color:color-mix(in srgb,var(--wstyle-primary) 40%,var(--wstyle-border-color));box-shadow:var(--gyro-shadow,0 4px 12px rgba(0,0,0,.06));transform:translateY(-1px);color:var(--wstyle-heading-color)}
.kb-related-card .bi{flex-shrink:0;color:var(--wstyle-primary);font-size:1.1rem;line-height:1.4}
.kb-related-card span{font-size:.925rem;font-weight:600;line-height:1.4}

/* Rehber rozeti + doğrulama tarihi (başlık altı) */
.kb-guide-badge{display:inline-flex;align-items:center;gap:.3rem;padding:.15rem .6rem;border-radius:var(--gyro-radius-pill,50rem);background-color:color-mix(in srgb,var(--gyro-accent,#7cb342) 16%,transparent);color:color-mix(in srgb,var(--gyro-accent,#7cb342) 50%,var(--wstyle-heading-color));font-size:.8rem;font-weight:700}

@media (max-width:575.98px){
  .kb-guide{font-size:.975rem}
  .kb-guide-meta{padding:1rem}
  .kb-next{padding:1.15rem}
  .kb-guide ol.kb-steps>li{padding-inline-start:2.4rem}
}
@media (prefers-reduced-motion:reduce){.kb-related-card,.kb-faq-q::after{transition:none}}
@media print{.kb-next{background:none;color:inherit;border:1px solid #999}.kb-next a,.kb-next-title{color:inherit}.kb-faq.is-js .kb-faq-item .kb-faq-a{display:block!important}}
.kb-prose .kb-guide .kb-next>h2.kb-next-title,.kb-guide .kb-next .kb-next-title{margin:0;padding:0;border:0;color:#fff}
.kb-guide .kb-next p{margin:0;color:rgba(255,255,255,.92)}