/* ============================================================
   Examen Matemáticas Grado 11 — estilos propios del módulo
   (independiente de ../assets/themes.css del proyecto padre)
   ============================================================ */
:root{
  --blue:#2563eb; --blue-soft:#eff4ff; --blue-dark:#1d4ed8;
  --green:#16a34a; --green-soft:#ecfdf3; --green-dark:#15803d;
  --red:#dc2626; --red-soft:#fef2f2;
  --amber:#d97706; --amber-soft:#fffbeb;
  --text:#1f2937; --text-muted:#6b7280; --border:#e5e7eb;
  --bg:#f6f8fb; --card:#ffffff;
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  background:var(--bg);color:var(--text);line-height:1.5;-webkit-tap-highlight-color:transparent}
.page{max-width:720px;margin:0 auto;padding:20px}
.page-wide{max-width:1080px;margin:0 auto;padding:20px}
a{color:var(--blue);text-decoration:none}
.muted{color:var(--text-muted)} .small{font-size:12px} .hint{font-size:12.5px;color:var(--text-muted);margin:6px 0}
.eyebrow{font-size:12px;color:var(--text-muted);font-weight:600}
.page-h1{font-size:24px;font-weight:800;margin:2px 0 0}

/* Cards */
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:22px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
.card-ok{border-color:var(--green);background:var(--green-soft)}
.card-h2{font-size:17px;font-weight:700;margin:0 0 14px}
.sub-h{font-size:14px;font-weight:700;margin:18px 0 8px;color:var(--text-muted)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:6px;padding:10px 16px;border-radius:10px;font-size:14px;
  font-weight:600;border:1.5px solid transparent;cursor:pointer;transition:.15s;background:#eee;color:var(--text)}
.btn:hover{transform:translateY(-1px)}
.btn-primary{background:var(--blue);color:#fff}
.btn-success{background:var(--green);color:#fff}
.btn-outline{background:#fff;border-color:var(--border);color:var(--text)}
.btn-full{width:100%;justify-content:center}

/* Forms */
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:13px;font-weight:600;margin-bottom:6px}
.form-group input,.form-group select{width:100%;padding:11px 12px;border:1.5px solid var(--border);
  border-radius:10px;font-size:14px;font-family:inherit;background:#fff}
.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--blue)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.check-row{display:flex;align-items:center;gap:8px;font-size:13.5px;margin:8px 0}
.check-row input{width:18px;height:18px}

/* Alerts */
.alert{padding:12px 14px;border-radius:10px;font-size:13.5px;margin-bottom:14px}
.alert-error{background:var(--red-soft);color:var(--red);border:1px solid #fecaca}
.alert-warn{background:var(--amber-soft);color:var(--amber);border:1px solid #fde68a}
.alert-info{background:var(--blue-soft);color:var(--blue-dark);border:1px solid #bfdbfe}

/* Login */
.login-wrap{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:20px}
.login-card{width:100%;max-width:380px;text-align:center}
.login-logo{font-size:44px} .login-title{font-size:22px;font-weight:800;margin:6px 0 2px}
.login-sub{color:var(--text-muted);margin:0 0 18px}
.login-card form{text-align:left}
.login-hint{font-size:12px;color:var(--text-muted);margin-top:14px}

/* Admin header / panel */
.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px;flex-wrap:wrap}
.codigo-chip{font-family:monospace;background:#111827;color:#fff;padding:3px 10px;border-radius:6px;font-size:13px;font-weight:700}
.codigo-display{font-family:monospace;font-size:30px;font-weight:800;letter-spacing:2px;color:var(--blue-dark);
  background:#fff;border:2px dashed var(--blue);border-radius:12px;padding:14px;display:inline-block;margin-top:6px}
.estado-chip{font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:20px}
.estado-chip.abierto{background:var(--green-soft);color:var(--green-dark)}
.estado-chip.cerrado{background:#f3f4f6;color:var(--text-muted)}
.estado-chip.fuera{background:var(--amber-soft);color:var(--amber)}
.examen-row{display:flex;justify-content:space-between;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.examen-row-top{display:flex;gap:8px;align-items:center;margin-bottom:6px;flex-wrap:wrap}
.examen-row-nombre{font-size:17px;font-weight:700;margin:0 0 6px}
.examen-row-meta{font-size:12.5px;color:var(--text-muted);line-height:1.7}
.examen-row-actions{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}

/* Banco list */
.banco-list{max-height:420px;overflow:auto;border:1px solid var(--border);border-radius:10px;padding:8px}
.banco-item{font-family:monospace;font-size:12px;padding:5px 8px;border-bottom:1px solid #f1f5f9;color:var(--text-muted)}

/* Stat grid */
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px}
.stat-box{background:var(--blue-soft);border-radius:12px;padding:14px;text-align:center}
.stat-box.warn{background:var(--amber-soft)}
.stat-n{display:block;font-size:24px;font-weight:800}
.stat-l{font-size:12px;color:var(--text-muted)}

/* Tablas */
.tabla-scroll{overflow-x:auto}
.tabla{width:100%;border-collapse:collapse;font-size:13px}
.tabla th,.tabla td{padding:9px 10px;text-align:left;border-bottom:1px solid var(--border)}
.tabla th{font-size:11.5px;text-transform:uppercase;color:var(--text-muted);font-weight:700}
.fila-flag{background:var(--amber-soft)}

/* % acierto por pregunta */
.preg-stat{margin-bottom:14px}
.preg-stat-head{display:flex;align-items:center;gap:8px;font-size:13px;margin-bottom:4px}
.preg-stat-num{font-weight:800;color:var(--blue-dark)}
.preg-stat-file{font-family:monospace;font-size:11px;color:var(--text-muted);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.preg-stat-pct{font-weight:700}
.preg-stat-meta{font-size:11.5px;color:var(--text-muted);margin-top:3px}
.bar-track{height:10px;background:#eef2f7;border-radius:6px;overflow:hidden}
.bar-fill{height:100%;border-radius:6px}
.bar-fill.ok{background:var(--green)} .bar-fill.mid{background:var(--amber)} .bar-fill.low{background:var(--red)}

/* ============ MOTOR EXAMEN ============ */
.examen-body{padding-top:84px}  /* barra fija mide ~79px: deja holgura para no solaparse */
.timer-bar{position:fixed;top:0;left:0;right:0;z-index:50;background:#111827;color:#fff;
  display:flex;align-items:center;gap:14px;padding:10px 16px;box-shadow:0 2px 10px rgba(0,0,0,.2)}
.timer-display{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.timer-display.urgente{color:#fca5a5;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.5}}
.timer-info{font-size:11px;opacity:.7}
.bar-center{flex:1;min-width:0}
.progress-text{font-size:12px;margin-bottom:4px;text-align:center}
.progress-track{height:8px;background:rgba(255,255,255,.2);border-radius:5px;overflow:hidden}
.progress-fill{height:100%;background:#34d399;transition:width .3s}
.salidas-box{text-align:center;background:rgba(255,255,255,.1);border-radius:10px;padding:4px 12px}
.salidas-num{display:block;font-size:18px;font-weight:800;color:#fca5a5}
.salidas-lbl{font-size:10px;opacity:.7}
.examen-info{max-width:860px;margin:0 auto;padding:14px 16px 0}
.examen-nombre{font-size:13px;color:var(--text-muted);font-weight:600}
.examen-alumno{font-size:16px;font-weight:700}
.pregunta-wrap{max-width:860px;margin:14px auto;padding:0 16px}
.pregunta-topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.pregunta-num-badge{font-size:13px;font-weight:700;color:var(--blue-dark);background:var(--blue-soft);padding:4px 12px;border-radius:20px}
.estado-respuesta{font-size:12.5px;font-weight:600;color:var(--text-muted)}
.estado-respuesta.ok{color:var(--green)}
.quiz-frame{width:100%;height:min(78vh,720px);border:1px solid var(--border);border-radius:14px;background:#fff}
.pregunta-nav{display:flex;justify-content:space-between;gap:10px;margin-top:12px}

/* Navegador de preguntas (saltar / devolverse) */
.q-nav{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-top:12px}
.q-dot{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--border);background:#fff;
  font-weight:700;font-size:13px;color:var(--text-muted);cursor:pointer;transition:.12s;padding:0}
.q-dot:hover{transform:translateY(-1px)}
.q-dot.answered{background:var(--green-soft);border-color:var(--green);color:var(--green-dark)}
.q-dot.current{border-color:var(--blue);color:var(--blue-dark);box-shadow:0 0 0 2px var(--blue-soft)}
.enviar-section{max-width:560px;margin:20px auto;padding:0 16px;text-align:center;display:none}
.enviar-section.visible{display:block}
.enviar-section h3{font-size:20px;margin:6px 0}
.btn-enviar{background:linear-gradient(135deg,#16a34a,#15803d);color:#fff;border:none;border-radius:14px;
  padding:16px 28px;font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 6px 18px rgba(22,163,74,.35);margin-top:8px}

/* Resultado */
.res-card{text-align:center;max-width:520px;margin:30px auto}
.res-emoji{font-size:50px}
.res-title{font-size:22px;font-weight:800;margin:6px 0 2px}
.res-sub{color:var(--text-muted);margin:0 0 14px}
.res-score{font-size:64px;font-weight:900;line-height:1}
.res-score span{font-size:28px}
.res-ok .res-score{color:var(--green)} .res-mid .res-score{color:var(--amber)} .res-low .res-score{color:var(--red)}
.res-detalle{color:var(--text-muted);margin:4px 0 18px}
.res-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.res-item{background:#f8fafc;border-radius:10px;padding:12px}
.res-num{display:block;font-size:20px;font-weight:800}
.res-lbl{font-size:11.5px;color:var(--text-muted)}
.res-motivo{margin-top:14px;font-size:13px;color:var(--text-muted)}

/* Overlay anti-trampa */
.antitrampa-overlay{position:fixed;inset:0;z-index:200;background:rgba(17,24,39,.86);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:none;align-items:center;justify-content:center;padding:24px}
.antitrampa-overlay.show{display:flex}
.at-card{background:#fff;border-radius:18px;padding:30px;text-align:center;max-width:380px}
.at-icon{font-size:48px} .at-card h3{font-size:20px;margin:8px 0;color:var(--red)}
.at-count{margin-top:10px;font-size:14px;color:var(--text-muted)}

/* Modal */
.modal-overlay{position:fixed;inset:0;z-index:150;background:rgba(0,0,0,.5);display:none;align-items:center;justify-content:center;padding:20px}
.modal-overlay.open{display:flex}
.modal-box{background:#fff;border-radius:18px;padding:28px;text-align:center;max-width:380px}
.modal-icon{font-size:40px} .modal-box h3{font-size:19px;margin:8px 0}
.modal-actions{display:flex;gap:10px;justify-content:center;margin-top:16px}

@media (max-width:720px){
  .form-grid,.form-row{grid-template-columns:1fr}
  .res-grid{grid-template-columns:1fr 1fr}
}

/* ── Apaisado (móvil horizontal): compacta el chrome para que la pregunta
   y los botones de navegación quepan sin doble scroll ── */
@media (orientation:landscape) and (max-height:560px){
  .examen-body{padding-top:64px}  /* barra compacta mide ~61px en apaisado */
  .timer-bar{padding:5px 14px;gap:10px}
  .timer-display{font-size:17px}
  .timer-info{display:none}
  .salidas-box{padding:2px 10px}
  .salidas-num{font-size:15px}
  .examen-info{padding:5px 16px 0}
  .examen-nombre{display:none}
  .examen-alumno{font-size:13px}
  .pregunta-wrap{margin:6px auto}
  .pregunta-topbar{margin-bottom:6px}
  .quiz-frame{height:calc(100vh - 190px);min-height:180px}
  .pregunta-nav{margin-top:8px}
}
