/* Bài kiểm tra trắc nghiệm (/online/quiz/) — dùng chung cho trang làm bài, kết quả, lịch sử thi */
.qz-wrap{max-width:860px;margin:0 auto}
.qz-head{background:linear-gradient(135deg,#38a169,#68d391);color:#fff;border-radius:1rem;padding:1.1rem 1.3rem}
.qz-head ruby rt{color:rgba(255,255,255,.85)}
.qz-card{background:#fff;border:1px solid #e2e8f0;border-radius:.9rem;padding:1rem 1.1rem;margin-bottom:.9rem}
.qz-no{font-weight:700;color:#2f855a;font-size:.85rem}
.qz-ins{font-size:.92rem;color:#4a5568;margin:.15rem 0 .5rem}
.qz-stem{font-size:1.18rem;line-height:2.1;margin-bottom:.4rem;font-family:"Noto Sans JP","Yu Gothic",sans-serif}
.qz-opt{display:flex;gap:.6rem;align-items:center;border:1.5px solid #e2e8f0;border-radius:.7rem;padding:.45rem .75rem;margin-bottom:.45rem;cursor:pointer;line-height:2}
.qz-opt:hover{background:#f0fff4;border-color:#9ae6b4}
.qz-opt input{flex-shrink:0;width:1.1rem;height:1.1rem;accent-color:#38a169}
.qz-opt .lt{font-weight:700;color:#718096;width:1.2rem}
.qz-opt:has(input:checked){background:#f0fff4;border-color:#38a169}
.qz-opt .tx{font-size:1.05rem}
ruby rt{font-size:.55em;color:#718096}
.qz-bar{position:sticky;bottom:0;background:rgba(255,255,255,.96);border-top:1px solid #e2e8f0;padding:.6rem 0;z-index:5}
.qz-opt.ok{background:#f0fff4;border-color:#38a169}
.qz-opt.bad{background:#fff5f5;border-color:#e53e3e}
.qz-exp{background:#fffbea;border-left:4px solid #ecc94b;border-radius:.5rem;padding:.6rem .8rem;font-size:.93rem;line-height:1.9}
.qz-student{display:flex;gap:1rem;align-items:center}
.qz-photo{width:96px;height:128px;flex-shrink:0;border-radius:.6rem;overflow:hidden;background:#edf2f7;border:2px solid #c6f6d5;display:flex;align-items:center;justify-content:center}
.qz-photo img{width:100%;height:100%;object-fit:cover}
.qz-photo i{display:none;font-size:3rem;color:#a0aec0}
.qz-photo.none i{display:block}
.qz-name{font-size:1.25rem;font-weight:800;color:#22543d;line-height:1.3;margin-bottom:.2rem}
.qz-info{font-size:.95rem;line-height:1.7;min-width:0}
.qz-lbl{color:#718096}
.qz-top{position:sticky;top:var(--qz-top,58px);z-index:6;background:#fff;border:1px solid #e2e8f0;border-radius:.9rem;padding:.55rem .8rem;margin-bottom:.9rem;box-shadow:0 4px 14px rgba(0,0,0,.07)}
.qz-timer{font-family:ui-monospace,Consolas,monospace;font-size:1.45rem;font-weight:800;color:#2f855a;white-space:nowrap}
.qz-timer.warn{color:#dd6b20}
.qz-timer.danger{color:#e53e3e;animation:qzPulse 1s infinite}
@keyframes qzPulse{50%{opacity:.4}}
.qz-nav{display:flex;flex-wrap:wrap;gap:.3rem}
.qz-nav a{width:2.1rem;height:2.1rem;display:inline-flex;align-items:center;justify-content:center;border-radius:.45rem;background:#edf2f7;border:1.5px solid #cbd5e0;color:#4a5568;font-weight:700;font-size:.85rem;text-decoration:none}
.qz-nav a.done{background:#38a169;border-color:#38a169;color:#fff}
.qz-legend{font-size:.72rem;color:#718096;margin-top:.35rem}
.qz-legend .sw{display:inline-block;width:.8rem;height:.8rem;border-radius:.2rem;background:#edf2f7;border:1px solid #cbd5e0;vertical-align:-1px;margin:0 .25rem 0 .7rem}
.qz-legend .sw.done{background:#38a169;border-color:#38a169;margin-left:0}
#qzForm .qz-card{scroll-margin-top:230px}
.qz-over{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:3000;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;font-weight:800;text-align:center}
.qz-meta{display:flex;gap:.6rem;margin-bottom:1rem}
.qz-meta div{flex:1;border:1px solid #e2e8f0;border-radius:.6rem;padding:.45rem .7rem;font-size:.8rem;color:#718096}
.qz-meta b{display:block;font-size:1.05rem;color:#1a202c}
@media(max-width:576px){.qz-nav a{width:1.8rem;height:1.8rem;font-size:.75rem}.qz-legend{display:none}.qz-timer{font-size:1.25rem}#qzForm .qz-card{scroll-margin-top:200px}}
.qz-grid a{display:inline-flex;width:2.3rem;height:2.3rem;align-items:center;justify-content:center;border-radius:.5rem;margin:.15rem;font-weight:700;text-decoration:none;color:#fff}

/* Lịch sử thi */
.qz-hist-item{display:flex;align-items:center;gap:.8rem;border:1px solid #e2e8f0;border-radius:.8rem;padding:.6rem .8rem;margin-bottom:.55rem;background:#fff;text-decoration:none;color:inherit}
.qz-hist-item:hover{border-color:#68d391;background:#f0fff4}
.qz-hist-score{width:4.6rem;flex-shrink:0;text-align:center;font-weight:800;font-size:1.25rem;line-height:1.1}
.qz-hist-score small{display:block;font-size:.7rem;font-weight:600}
.qz-hist-main{flex:1;min-width:0}
.qz-hist-title{font-weight:700;color:#22543d;line-height:1.35;overflow-wrap:anywhere}
.qz-hist-sub{font-size:.8rem;color:#718096}
.qz-stats{display:flex;gap:.6rem;margin:.8rem 0 .2rem}
.qz-stats div{flex:1;text-align:center;border:1px solid #e2e8f0;border-radius:.6rem;padding:.4rem;font-size:.75rem;color:#718096;background:#fff}
.qz-stats b{display:block;font-size:1.2rem;color:#22543d}

/* Đề nhiều loại (2/10/2026): màu đầu trang theo loại đề */
.qz-head.k-vocab{background:linear-gradient(135deg,#2b6cb0,#63b3ed)}
.qz-head.k-conv{background:linear-gradient(135deg,#6b46c1,#9f7aea)}
.qz-head.k-listen{background:linear-gradient(135deg,#c05621,#f6ad55)}
.qz-head.k-read{background:linear-gradient(135deg,#b83280,#f687b3)}
/* Ảnh, tài liệu, âm thanh của câu hỏi */
.qz-img{margin:.3rem 0 .7rem;text-align:center}
.qz-img img{max-width:100%;max-height:440px;border:1px solid #e2e8f0;border-radius:.6rem;cursor:zoom-in;background:#fff}
.qz-doc{background:#f7fafc;border:1px solid #cbd5e0;border-left:5px solid #b83280;border-radius:.6rem;padding:.7rem .95rem;margin:.3rem 0 .7rem;font-size:1.08rem;line-height:2.15;font-family:"Noto Sans JP","Yu Gothic",sans-serif}
.qz-audio{display:flex;align-items:center;flex-wrap:wrap;gap:.4rem .8rem;background:#fffaf0;border:1.5px solid #fbd38d;border-radius:.7rem;padding:.5rem .75rem;margin:.3rem 0 .7rem}
.qz-audio .qz-play{min-width:9rem}
.qz-plays{color:#975a16;font-weight:600}
.qz-audio-ctl{display:block;width:100%;max-width:440px;margin:.3rem 0 .7rem}
/* Nhóm "1 tài liệu / 1 bài nghe – 2 câu" */
.qz-group{border-color:#fbd38d;background:#fffdf7}
.qz-in-group{border-left:4px solid #f6ad55}
.qz-glabel{display:inline-block;background:#feebc8;color:#9c4221;border-radius:.4rem;padding:0 .35rem;margin-left:.2rem}
/* Lựa chọn bằng tranh: 3 tranh 1 hàng (điện thoại vẫn 1 hàng) */
.qz-opts-img{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.qz-opts-img .qz-opt{flex-direction:column;align-items:center;justify-content:flex-start;padding:.45rem .35rem;margin:0;gap:.15rem;line-height:1.4}
.qz-opts-img .qz-opt .lt{width:auto}
.qz-opts-img .qz-opt .tx{width:100%;text-align:center}
.qz-opt-img{width:100%;max-width:210px;height:auto;border-radius:.45rem;display:block;margin:0 auto}
/* Chỗ trống + hội thoại dạng bong bóng chat */
.qz-blank{display:inline-block;min-width:3.4em;border:2px solid #e53e3e;border-radius:.35rem;line-height:1.5;text-align:center;color:#e53e3e;margin:0 .1rem}
.qz-dlg{margin:.3rem 0 .7rem}
.qz-dlg-scene{font-size:.92rem;color:#718096;margin-bottom:.35rem}
.qz-dlg-row{display:flex;align-items:flex-start;gap:.5rem;margin-bottom:.5rem}
.qz-dlg-row.r{flex-direction:row-reverse}
.qz-dlg-who{flex-shrink:0;min-width:2.5rem;min-height:2.5rem;padding:.2rem .45rem;border-radius:1.25rem;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.85rem;color:#fff;background:#dd6b20;line-height:1.2;text-align:center}
.qz-dlg-row.r .qz-dlg-who{background:#3182ce}
.qz-dlg-who rt{color:rgba(255,255,255,.9)}
.qz-dlg-bub{max-width:82%;background:#fff7ed;border:1.5px solid #fbd38d;border-radius:1rem;padding:.3rem .85rem;font-size:1.1rem;line-height:2.05;font-family:"Noto Sans JP","Yu Gothic",sans-serif}
.qz-dlg-row.l .qz-dlg-bub{border-top-left-radius:.25rem}
.qz-dlg-row.r .qz-dlg-bub{background:#ebf8ff;border-color:#90cdf4;border-top-right-radius:.25rem}
/* Lời thoại bài nghe (chỉ sau khi nộp / giáo viên xem trước) */
.qz-trans{background:#fffaf0;border:1px dashed #f6ad55;border-radius:.6rem;padding:.5rem .85rem;margin:.5rem 0 .2rem;font-size:1rem;line-height:2.05;font-family:"Noto Sans JP","Yu Gothic",sans-serif}
.qz-trans-h{font-family:inherit;font-size:.82rem;font-weight:700;color:#9c4221;line-height:1.4;margin-bottom:.15rem}
/* Bảng trong tài liệu đọc (dòng "| ô | ô |") */
.qz-tbl-wrap{overflow-x:auto;margin:.35rem 0 .45rem}
.qz-tbl{border-collapse:collapse;background:#fff;font-size:.98rem;line-height:1.9}
.qz-tbl th,.qz-tbl td{border:1px solid #a0aec0;padding:.15rem .6rem;text-align:center;vertical-align:middle}
.qz-tbl th{background:#edf2f7;font-weight:700}
.qz-stem u,.qz-doc u{text-underline-offset:4px;text-decoration-thickness:2px}
/* Phóng to ảnh */
.qz-zoom{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:4000;display:flex;align-items:center;justify-content:center;cursor:zoom-out;padding:8px}
.qz-zoom img{max-width:100%;max-height:100%;background:#fff;border-radius:.4rem}
@media(max-width:576px){.qz-doc{font-size:1rem;padding:.6rem .7rem}.qz-dlg-bub{font-size:1.02rem}.qz-opts-img{gap:.3rem}.qz-opts-img .qz-opt{padding:.3rem .2rem}}
.qz-img.qz-ctx img{max-height:170px}

/* Điện thoại (2/10/2026): dành chỗ cho đề — menu trên không dính, dãy số câu 1 hàng vuốt ngang, khung gọn hơn */
@media(max-width:576px){
  nav.navbar.sticky-top{position:relative}
  .qz-top{top:0 !important;padding:.45rem .6rem;margin-left:-.35rem;margin-right:-.35rem}
  .qz-nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .qz-nav::-webkit-scrollbar{display:none}
  .qz-nav a{flex:0 0 auto;width:2.1rem;height:2.1rem;font-size:.85rem}
  .qz-timer{font-size:1.15rem}
  #qzForm .qz-card{scroll-margin-top:105px}
  .qz-bar{padding:.4rem 0}
  .qz-bar .btn{padding:.35rem .9rem}
  .qz-head{padding:.75rem .9rem;border-radius:.8rem}
  .qz-card{padding:.8rem .75rem}
  .qz-photo{width:68px;height:90px}
  .qz-name{font-size:1.08rem}
  .qz-img.qz-ctx img{max-height:120px}
  .qz-stem{font-size:1.12rem}
}
/* Nhắc tự bấm "Nộp bài" khi gần hết giờ (12/10/2026, quiz/index.php warnTick): dòng nhắc trên thanh Nộp bài + hộp nhắc ở mốc 5 phút / 1 phút */
.qz-warn-line{width:100%;background:#fffbeb;border:1px solid #f59e0b;border-left:5px solid #f59e0b;color:#78350f;border-radius:.5rem;padding:.35rem .6rem;font-size:.9rem;line-height:1.35}
.qz-warn-line.red{background:#fef2f2;border-color:#dc2626;color:#7f1d1d;animation:qzWarnPulse 1s ease-in-out infinite}
@keyframes qzWarnPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}50%{box-shadow:0 0 0 4px rgba(220,38,38,.3)}}
.qz-warn-over{position:fixed;inset:0;z-index:2000;background:rgba(15,23,42,.5);display:flex;align-items:center;justify-content:center;padding:1rem}
.qz-warn-box{background:#fff;border-radius:.9rem;max-width:440px;width:100%;padding:1.1rem 1.1rem .9rem;border-top:6px solid #d97706;box-shadow:0 20px 50px rgba(0,0,0,.3);font-size:1rem;line-height:1.5}
.qz-warn-box.red{border-top-color:#dc2626}
.qz-warn-t{font-weight:800;font-size:1.15rem;color:#92400e;margin-bottom:.4rem}
.qz-warn-box.red .qz-warn-t{color:#b91c1c}
@media (prefers-reduced-motion:reduce){.qz-warn-line.red{animation:none}}