/* EMT Sağlık Hizmetleri · deneme sınavları
   EMT Tasarım Sistemi tokenları (site.css). Durum rengi yok: doğru/yanlış, işaret ve kalın kelimeyle gösterilir.
   Kırmızı kullanılmaz; gölge ve renk geçişi yoktur. */

.crumbs{margin:0 0 var(--s4);font-size:15px;line-height:22px}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s1) var(--s2)}
.crumbs li{display:inline-flex;align-items:center;gap:var(--s2);color:var(--metin-grisi)}
.crumbs li+li::before{content:"/";color:var(--gri)}
.crumbs a{display:inline-flex;align-items:center;min-height:24px}

/* ---------- Liste ---------- */
.exam-cards{list-style:none;display:grid;gap:var(--s4);grid-template-columns:1fr}
@media (min-width:640px){.exam-cards{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.exam-cards{grid-template-columns:repeat(5,1fr);gap:var(--s5)}}
.exam-card{display:flex;flex-direction:column;gap:var(--s2);height:100%;background:var(--beyaz);border:1px solid var(--lacivert-20);border-radius:var(--kose-kart);padding:var(--s5);text-decoration:none;color:var(--koyu-gri)}
.exam-card:hover{border-color:var(--lacivert)}
.exam-card:hover .text-link{text-decoration:underline}
.exam-card:focus-visible{outline:3px solid var(--lacivert);outline-offset:3px}
.exam-card__no{font-family:var(--font-display);font-weight:700;font-size:48px;line-height:52px;color:var(--lacivert);font-variant-numeric:tabular-nums}
.exam-card h3{font-size:20px;line-height:28px}
.exam-card .text-link{margin-top:auto;padding-top:var(--s2);text-decoration:none;color:var(--lacivert)}

/* ---------- Sınav ---------- */
.exam-layout{display:grid;gap:var(--s6);align-items:start}
@media (min-width:1024px){.exam-layout{grid-template-columns:minmax(0,1fr) 300px;gap:var(--s7)}}

.exam__list{list-style:none;display:grid;gap:var(--s5)}
.q{scroll-margin-top:calc(var(--head-h) + 16px)}
.q fieldset{margin:0;padding:var(--s5);border:1px solid var(--lacivert-20);border-radius:var(--kose-kart);background:var(--beyaz);min-width:0}
@media (max-width:639px){.q fieldset{padding:var(--s4)}}
.q legend{display:flex;gap:var(--s3);align-items:flex-start;width:100%;margin:0 0 var(--s4);padding:0;font-family:var(--font-display);font-weight:600;font-size:20px;line-height:28px;color:var(--lacivert);float:left}
.q legend+*{clear:both}
.q__no{flex:none;min-width:36px;font-weight:700;font-variant-numeric:tabular-nums}
.q__no::after{content:"."}
.q__opts{display:grid;gap:var(--s2)}

.opt{position:relative;display:flex;align-items:flex-start;gap:var(--s3);min-height:48px;padding:var(--s3) var(--s4);border:1px solid var(--metin-grisi);border-radius:var(--kose-buton);background:var(--beyaz);cursor:pointer;font-size:16px;line-height:24px}
@media (min-width:1024px){.opt{font-size:18px;line-height:26px}}
.opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.opt__letter{flex:none;display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-top:-2px;border:2px solid var(--lacivert);border-radius:50%;font-family:var(--font-display);font-weight:700;font-size:15px;line-height:1;color:var(--lacivert);background:var(--beyaz)}
.opt__text{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.opt__mark{flex:none;display:none;align-items:center;gap:var(--s1);font-weight:700;font-size:15px;line-height:24px;white-space:nowrap}
.opt__mark svg{width:20px;height:20px;flex:none}
.opt:hover{border-color:var(--lacivert)}
.opt:has(input:focus-visible){outline:3px solid var(--lacivert);outline-offset:2px}
.opt.is-focus{outline:3px solid var(--lacivert);outline-offset:2px}
.opt.is-secili{border:2px solid var(--lacivert);padding:calc(var(--s3) - 1px) calc(var(--s4) - 1px);background:var(--lacivert-5)}
.opt.is-secili .opt__letter{background:var(--lacivert);color:var(--beyaz)}

/* Değerlendirme sonrası */
.exam.is-bitti .opt{cursor:default}
.exam.is-bitti .opt:hover{border-color:var(--metin-grisi)}
.exam.is-bitti .opt.is-secili:hover{border-color:var(--lacivert)}
.opt.is-dogru{border:2px solid var(--lacivert);padding:calc(var(--s3) - 1px) calc(var(--s4) - 1px);background:var(--lacivert-10)}
.opt.is-dogru .opt__letter{background:var(--lacivert);color:var(--beyaz)}
.opt.is-dogru .opt__text{font-weight:600;color:var(--lacivert)}
.opt.is-dogru .opt__mark{display:inline-flex;color:var(--lacivert)}
.opt.is-yanlis{border:2px solid var(--koyu-gri);padding:calc(var(--s3) - 1px) calc(var(--s4) - 1px);background:var(--beyaz)}
.opt.is-yanlis .opt__letter{background:var(--koyu-gri);border-color:var(--koyu-gri);color:var(--beyaz)}
.opt.is-yanlis .opt__mark{display:inline-flex;color:var(--koyu-gri)}
.exam.is-bitti .opt:not(.is-dogru):not(.is-yanlis){border-color:var(--lacivert-20)}
.q__result{clear:both;display:flex;align-items:center;gap:var(--s2);margin:var(--s4) 0 0;font-size:16px;line-height:24px;color:var(--koyu-gri)}
.q__result[hidden]{display:none}
.q__result svg{width:20px;height:20px;flex:none}
.q__result b{font-weight:700;color:var(--lacivert)}

.exam__actions{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.exam__notice{margin-top:var(--s4);font-weight:700;color:var(--koyu-gri)}
.exam__notice:empty{display:none}
button.btn{font-family:var(--font-display)}
.btn[hidden]{display:none}

/* Durum paneli */
.exam__side{background:var(--lacivert-5);border-radius:var(--kose-kart);padding:var(--s5)}
@media (min-width:1024px){.exam__side{position:sticky;top:calc(var(--head-h) + 16px);max-height:calc(100vh - var(--head-h) - 32px);overflow:auto}}
@media (max-width:1023px){.exam__side{order:-1}}
.exam__count{font-family:var(--font-display);font-weight:700;font-size:24px;line-height:32px;color:var(--lacivert);font-variant-numeric:tabular-nums}
.exam__bar{height:8px;margin:var(--s3) 0 var(--s4);background:var(--lacivert-20);border-radius:4px;overflow:hidden}
.exam__bar span{display:block;height:100%;width:0;background:var(--lacivert);border-radius:4px}
.exam__grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:var(--s2)}
.exam__grid a{position:relative;display:flex;align-items:center;justify-content:center;height:40px;border:1px solid var(--metin-grisi);border-radius:var(--kose-buton);background:var(--beyaz);font-family:var(--font-display);font-weight:600;font-size:16px;line-height:1;color:var(--lacivert);text-decoration:none;font-variant-numeric:tabular-nums}
.exam__grid a:hover{border-color:var(--lacivert);text-decoration:underline}
.exam__grid a.is-yanit{background:var(--lacivert);border-color:var(--lacivert);color:var(--beyaz)}
.exam.is-bitti~.exam__side .exam__grid a,.exam-layout.is-bitti .exam__grid a{background:var(--beyaz);color:var(--lacivert)}
.exam-layout.is-bitti .exam__grid a.is-dogru{background:var(--lacivert);border-color:var(--lacivert);color:var(--beyaz)}
.exam-layout.is-bitti .exam__grid a.is-yanlis{border:2px solid var(--koyu-gri);color:var(--koyu-gri);text-decoration:line-through;text-decoration-thickness:2px}
.exam-layout.is-bitti .exam__grid a.is-bos{border-style:dashed}
.exam__legend{list-style:none;display:none;gap:var(--s2);margin-top:var(--s4);font-size:15px;line-height:22px}
.exam-layout.is-bitti .exam__legend{display:grid}
.exam__legend li{display:flex;align-items:center;gap:var(--s2)}
.exam__legend i{flex:none;display:inline-block;width:20px;height:20px;border-radius:4px;border:1px solid var(--metin-grisi);background:var(--beyaz)}
.exam__legend .l-dogru{background:var(--lacivert);border-color:var(--lacivert)}
.exam__legend .l-yanlis{border:2px solid var(--koyu-gri)}
.exam__legend .l-bos{border-style:dashed}
.exam__side .btn{width:100%;margin-top:var(--s5)}

/* Sonuç */
.exam-result{background:var(--lacivert);color:var(--beyaz);border-radius:var(--kose-kart);padding:var(--s6) var(--s5);margin-bottom:var(--s6);scroll-margin-top:calc(var(--head-h) + 16px)}
@media (min-width:1024px){.exam-result{padding:var(--s7)}}
.exam-result[hidden]{display:none}
.exam-result:focus{outline:none}
.exam-result:focus-visible{outline:3px solid var(--lacivert);outline-offset:3px}
.exam-result h2{color:var(--beyaz)}
.exam-result .eyebrow{color:var(--turkuaz)}
.exam-result__score{display:flex;align-items:baseline;gap:var(--s2);margin-top:var(--s3);font-family:var(--font-display);color:var(--beyaz)}
.exam-result__score b{font-weight:700;font-size:64px;line-height:68px;font-variant-numeric:tabular-nums}
.exam-result__score span{font-weight:600;font-size:24px;line-height:32px}
.exam-result__facts{list-style:none;display:grid;gap:var(--s4);margin-top:var(--s5);grid-template-columns:repeat(3,minmax(0,1fr))}
.exam-result__facts li{border-top:2px solid var(--turkuaz);padding-top:var(--s3)}
.exam-result__facts b{display:block;font-family:var(--font-display);font-weight:700;font-size:32px;line-height:40px;font-variant-numeric:tabular-nums}
.exam-result__facts span{display:block;font-size:16px;line-height:24px}
.exam-result .btn-row{margin-top:var(--s6)}
.exam-result .btn-primary{background:var(--beyaz);color:var(--lacivert);border-color:var(--beyaz)}
.exam-result .btn-secondary{background:transparent;color:var(--beyaz);border-color:var(--beyaz)}
.exam-result :focus-visible{outline-color:var(--beyaz)}
.exam-result p{margin-top:var(--s4);max-width:60ch}

@media print{.exam__side,.exam__actions,.site-header{display:none}.q fieldset{break-inside:avoid}}

/* Dar ekran: durum panelinde yalnız sayaç; soru ızgarası sınav bitince görünür. İşaretler şık metninin altına iner. */
@media (max-width:1023px){
  .exam__side{padding:var(--s4)}
  .exam__grid{display:none}
  .exam-layout.is-bitti .exam__grid{display:grid;margin-top:var(--s2)}
  .exam__bar{margin-bottom:0}
  .exam-layout.is-bitti .exam__bar{margin-bottom:var(--s4)}
}
@media (max-width:639px){
  .opt{flex-wrap:wrap}
  .opt__text{flex:1 1 0}
  .opt.is-dogru .opt__mark,.opt.is-yanlis .opt__mark{flex-basis:100%;padding-left:40px}
  .exam-result__score b{font-size:56px;line-height:60px}
  .exam-result__facts{gap:var(--s3)}
}
