/* Koçi Rehberim ve «Koçi hakkında sor» (rehber-gunluk.js): sade, tek asıl iş, kolay taranan listeler.
   Renkler tema değişkenlerinden gelir (--card, --ink, --line, --primary, --muted); her temada okunur. Önek: rhb- */
.rhb-kok { display: flex; flex-direction: column; gap: 18px; padding: 6px 0 28px; color: var(--ink); }
.rhb-kok h1, .rhb-kok h2, .rhb-kok h3, .rhb-kok p { margin: 0; }
.rhb-etiket { font-size: 12px; font-weight: 800; letter-spacing: .08em; color: var(--muted); text-transform: uppercase; }
.rhb-ust h1 { font-size: 30px; line-height: 1.15; margin: 4px 0 8px; letter-spacing: -.01em; }
.rhb-mesaj { font-size: 15px; line-height: 1.5; color: var(--muted); }

/* ilerleme: adım sayısı kadar parça, bitenler yeşil, sıradaki vurgulu */
.rhb-ilerleme { display: flex; align-items: center; gap: 14px; }
.rhb-parcalar { flex: 1; display: flex; gap: 6px; }
.rhb-parcalar i { flex: 1; height: 8px; border-radius: 99px; background: color-mix(in srgb, var(--ink) 14%, transparent); }
.rhb-parcalar i.bitti { background: var(--ok, #3fd68b); }
.rhb-parcalar i.simdi { background: var(--primary); }
.rhb-ilerleme b { font-size: 14px; font-weight: 800; white-space: nowrap; }

/* asıl görev kartı */
.rhb-gorev { padding: 20px; border-radius: 22px; border: 1px solid color-mix(in srgb, var(--primary) 50%, var(--line)); background: linear-gradient(165deg, color-mix(in srgb, var(--primary) 16%, var(--card)), var(--card) 72%); display: flex; flex-direction: column; gap: 14px; }
.rhb-gorev-ust { display: flex; align-items: center; gap: 12px; }
.rhb-no { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: var(--primary); color: var(--koci-on-primary, #fff); font-size: 18px; font-weight: 800; }
.rhb-gorev h2 { font-size: 22px; line-height: 1.25; letter-spacing: -.005em; }
.rhb-neden { font-size: 15px; line-height: 1.55; opacity: .88; }
.rhb-kok button.rhb-ana { width: 100%; min-height: 54px; border: 0; border-radius: 16px; background: var(--primary); color: var(--koci-on-primary, #fff); font: inherit; font-size: 17px; font-weight: 800; cursor: pointer; box-shadow: none; }
.rhb-kok button.rhb-ana:disabled { opacity: .6; }
.rhb-kok button.rhb-ikinci { width: 100%; min-height: 48px; border: 1px solid var(--line); border-radius: 14px; background: transparent; color: var(--ink); font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; box-shadow: none; }
.rhb-nasil summary { cursor: pointer; min-height: 40px; display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 14px; font-weight: 700; list-style: none; }
.rhb-nasil summary::-webkit-details-marker { display: none; }
.rhb-nasil summary::after { content: "›"; font-size: 20px; line-height: 1; transition: transform .15s; }
.rhb-nasil[open] summary::after { transform: rotate(90deg); }
.rhb-nasil p { font-size: 14.5px; line-height: 1.55; opacity: .9; padding: 2px 0 6px; }
.rhb-not { color: var(--muted); font-size: 12.5px; line-height: 1.45; }
.rhb-hata { color: var(--bad, #e2634f); font-size: 14px; }
.rhb-hata:empty { display: none; }
.rhb-bitti { padding: 22px; border-radius: 22px; border: 1px solid var(--line); background: var(--card); display: flex; flex-direction: column; gap: 8px; }
.rhb-bitti h2 { font-size: 21px; }

/* bugünkü yol */
.rhb-baslik { font-size: 13px; font-weight: 800; letter-spacing: .06em; color: var(--muted); text-transform: uppercase; padding: 0 4px 8px; }
.rhb-kok .rhb-yol { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 18px; background: var(--card); overflow: hidden; }
.rhb-kok .rhb-yol li { margin: 0; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-top: 1px solid var(--line); font-size: 15.5px; line-height: 1.35; }
.rhb-yol li:first-child { border-top: 0; }
.rhb-isaret { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 2px solid var(--line); font-size: 13px; font-weight: 800; color: var(--muted); }
.rhb-yol li.simdi .rhb-isaret { border-color: var(--primary); color: var(--primary); }
.rhb-yol li.simdi { font-weight: 750; }
.rhb-yol li.bitti .rhb-isaret { background: var(--ok, #3fd68b); border-color: transparent; color: #06281a; }
.rhb-yol li.bitti span:last-child { opacity: .6; text-decoration: line-through; text-decoration-thickness: 1.5px; }

/* sakin satır listesi: ok işaretli, tek dokunuşluk */
.rhb-liste { border: 1px solid var(--line); border-radius: 18px; background: var(--card); overflow: hidden; }
.rhb-kok button.rhb-satir { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; min-height: 54px; padding: 10px 16px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--ink); font: inherit; font-size: 16px; font-weight: 650; text-align: left; line-height: 1.3; cursor: pointer; box-shadow: none; }
.rhb-liste > .rhb-satir:first-child { border-top: 0; }
.rhb-satir::after { content: "›"; flex: none; color: var(--muted); font-size: 22px; font-weight: 700; }
.rhb-satir[aria-expanded="true"]::after { transform: rotate(90deg); color: var(--primary); }
.rhb-satir:focus-visible, .rhb-ana:focus-visible, .rhb-ikinci:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }

/* yardım: arama alanı ve cevap */
.rhb-ara { display: flex; gap: 8px; }
.rhb-ara input { flex: 1; min-width: 0; min-height: 50px; padding: 0 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); color: var(--ink); font: inherit; font-size: 16px; }
.rhb-kok .rhb-ara button { flex: none; min-height: 50px; padding: 0 20px; border: 0; border-radius: 14px; background: var(--primary); color: var(--koci-on-primary, #fff); font: inherit; font-weight: 800; cursor: pointer; box-shadow: none; }
.rhb-cevap { padding: 16px 18px 14px; margin: 0; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--primary) 7%, var(--card)); display: flex; flex-direction: column; gap: 10px; }
.rhb-cevap h3 { font-size: 17px; line-height: 1.3; }
.rhb-cevap p { font-size: 15px; line-height: 1.55; }
.rhb-kok button.rhb-kucuk { align-self: flex-start; min-height: 44px; padding: 0 18px; border: 1px solid var(--primary); border-radius: 12px; background: transparent; color: var(--primary); font: inherit; font-size: 15px; font-weight: 750; cursor: pointer; box-shadow: none; }
.rhb-sonuc { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.rhb-sonuc:empty { display: none; }
.rhb-sonuc > .rhb-cevap { border-top: 0; }
.rhb-sonuc > .rhb-cevap + .rhb-cevap { border-top: 1px solid var(--line); }