/* =====================================================================
   Mis evaluaciones (pantalla del docente): lista y editor de las evaluaciones que escribe el propio docente.
   Usa la paleta de Tiza (variables --tiza-*, --line, --muted, --ink de index.php). Todas las clases empiezan con te-.
   ===================================================================== */

/* ---------- Lista ---------- */
#pantalla-evaluaciones .te-barra{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center;margin:0 0 16px}
#pantalla-evaluaciones .te-barra .te-in{flex:1 1 240px;min-width:0;max-width:420px}
#pantalla-evaluaciones .te-barra .te-sel{flex:0 1 220px;min-width:0;width:auto}
.te-cuenta{color:var(--muted);font-size:.84rem;margin-left:auto}
.te-card .acciones-tarjeta .te-ico-btn{padding:6px 9px}
.te-card .acciones-tarjeta .te-ico-btn .te-svg{display:block}
.te-pasos{list-style:none;margin:6px auto 18px;padding:0;max-width:560px;text-align:left;display:grid;gap:8px}
.te-pasos li{background:var(--tiza-claro);border-radius:12px;padding:10px 14px;font-size:.9rem;color:var(--ink)}
.te-pasos b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--tiza-azul);color:#fff;font-size:.8rem;margin-right:8px}

/* ---------- Editor: barra de arriba y estado del guardado ---------- */
.te-cab{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;margin:0 0 14px}
.te-cab .btn{display:inline-flex;align-items:center;gap:6px}
.te-estado{font-size:.86rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;min-height:22px}
.te-est{display:inline-flex;align-items:center;gap:6px}
.te-est .te-svg{width:15px;height:15px}
.te-est-ok{color:var(--ok)}
.te-est-curso{color:var(--muted)}
.te-est-mal{color:var(--error);font-weight:600}
.te-giro{width:13px;height:13px;border-radius:50%;border:2px solid var(--tiza-azul-borde);border-top-color:var(--tiza-azul);animation:te-gira .8s linear infinite;display:inline-block}
@keyframes te-gira{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.te-giro{animation:none}}
.te-enlace{background:none;border:0;padding:0;font:inherit;color:var(--blue);cursor:pointer;text-decoration:underline}
.te-editor .encabezado h1{overflow-wrap:anywhere}

/* ---------- Editor: datos e indicaciones ---------- */
.te-datos{padding:0}
.te-datos > summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;justify-content:space-between;padding:14px 18px;border-radius:14px}
.te-datos > summary::-webkit-details-marker{display:none}
.te-datos > summary::before{content:"▸";color:var(--tiza-azul);margin-right:8px;transition:transform .15s}
.te-datos[open] > summary::before{transform:rotate(90deg)}
.te-datos > summary{position:relative}
.te-datos-res{color:var(--muted);font-size:.86rem;flex:1 1 auto;text-align:right;min-width:0;overflow-wrap:anywhere}
.te-datos-cuerpo{padding:4px 18px 8px;border-top:1px solid var(--line)}
.te-datos-cuerpo .der-campo{margin-top:14px;margin-bottom:6px}
.te-otra{margin-top:8px}
.te-indic .rotulo{display:block;font-weight:600;font-size:.9rem;margin-bottom:6px}
.opc{font-weight:400;color:var(--muted);font-size:.78rem}

/* ---------- Editor: resumen de puntos ---------- */
.te-resumen{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;justify-content:space-between;background:#fff;border:1px solid var(--tiza-azul-borde);border-radius:14px;padding:10px 14px;margin:0 0 14px;box-shadow:0 2px 10px rgba(15,45,91,.06)}
@media (min-width:901px){.te-resumen{position:sticky;top:8px;z-index:6}}
.te-res-txt{flex:1 1 320px;min-width:0;font-size:.92rem;color:var(--ink);line-height:1.5}
.te-res-pts.ok b{color:var(--ok)}
.te-res-pts.aviso b{color:var(--warn)}
.te-res-ok{display:inline-flex;align-items:center;gap:4px;color:var(--ok);font-weight:600;font-size:.84rem}
.te-res-ok .te-svg{width:14px;height:14px}
.te-res-aviso{color:#7a5410;background:#fdf3e2;border-radius:8px;padding:2px 8px;font-size:.82rem}
.te-res-info{color:var(--muted);font-size:.82rem}
.te-res-bt{display:flex;flex-wrap:wrap;gap:8px}
.te-mini{padding:6px 12px;font-size:.82rem;border-radius:8px;font-weight:600}
.te-mini .te-svg{display:inline-block;vertical-align:-3px;margin-right:2px;width:14px;height:14px}
.te-global{background:#fdf3e2;color:#7a5410;border:1px solid #f2d9a6;border-radius:10px;padding:9px 12px;font-size:.88rem;margin:0 0 12px}

/* ---------- Editor: preguntas ---------- */
#te-preguntas{display:grid;gap:14px;margin:0 0 16px}
.te-q{background:#fff;border:1px solid var(--line);border-radius:14px;padding:0;transition:border-color .15s,box-shadow .15s}
.te-q:focus-within{border-color:var(--tiza-azul-borde);box-shadow:0 4px 16px rgba(30,136,255,.10)}
.te-q.te-incompleta{border-left:4px solid #e7b24a}
.te-q.te-resalta{animation:te-resalta 1.8s ease-out}
@keyframes te-resalta{0%,40%{box-shadow:0 0 0 4px rgba(231,178,74,.55)}100%{box-shadow:0 0 0 0 rgba(231,178,74,0)}}
@media (prefers-reduced-motion:reduce){.te-q.te-resalta{animation:none;box-shadow:0 0 0 3px rgba(231,178,74,.55)}}
.te-q-cab{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--tiza-claro);border-radius:14px 14px 0 0}
.te-q-n{display:inline-grid;place-items:center;min-width:28px;height:28px;border-radius:50%;background:var(--tiza-azul);color:#fff;font-size:.85rem;font-weight:700}
.te-q-tipo{font-weight:600;font-size:.9rem;color:var(--tiza-profundo)}
.te-q-nota{font-size:.74rem;color:var(--muted);background:#EEF1F6;border-radius:99px;padding:2px 9px}
.te-q-esp{flex:1 1 auto}
.te-pts{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto}
.te-pts-in{width:64px;text-align:center;padding:6px 6px;font-weight:600}
.te-pts-u{font-size:.8rem;color:var(--muted);margin-left:2px}
.te-q-mov{display:inline-flex;gap:4px;margin-left:6px;flex:0 0 auto}
.te-ico{display:inline-grid;place-items:center;border:1px solid var(--line);background:#fff;border-radius:8px;width:34px;height:32px;padding:0;cursor:pointer;color:var(--tiza-profundo);font:inherit;flex:0 0 auto}
.te-ico:hover:not(:disabled){background:var(--tiza-azul-10);border-color:var(--tiza-azul-borde)}
.te-ico:disabled{opacity:.35;cursor:default}
.te-ico-mal:hover:not(:disabled){background:#fdecea;border-color:#f0c9c4;color:var(--error)}
.te-ico-hueco{display:block;width:34px;flex:0 0 auto}
.te-svg{display:inline-block;vertical-align:-3px}
.te-ico .te-svg{display:block}
.te-q-cuerpo{padding:12px 14px 6px;display:grid;gap:14px}
.te-campo{min-width:0}
.te-rot{display:block;font-weight:600;font-size:.88rem;margin-bottom:6px;color:var(--ink)}
.te-in{font-family:inherit}
textarea.te-in{min-height:44px;resize:vertical;line-height:1.4}
.te-enun{field-sizing:content;max-height:260px}
.te-corto{width:96px}
.te-tema{padding-bottom:8px}
.te-fila-2{display:flex;flex-wrap:wrap;gap:12px}

/* Opciones de selección única y múltiple */
.te-opciones{list-style:none;margin:0 0 8px;padding:0;display:grid;gap:8px}
.te-opc{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px;align-items:center;border:1px solid transparent;border-radius:12px;padding:2px}
.te-opc.correcta{background:#E6F6EE;border-color:#b8e2cd}
.te-marca{display:inline-flex;align-items:center;gap:8px;margin:0;cursor:pointer;min-height:40px}
.te-marca input{width:18px;height:18px;margin:0;flex:0 0 auto;accent-color:var(--ok)}
.te-letra{display:inline-grid;place-items:center;min-width:26px;height:26px;border-radius:50%;background:var(--tiza-azul-10);color:var(--tiza-profundo);font-size:.8rem;font-weight:700}
.te-opc.correcta .te-letra{background:var(--ok);color:#fff}

/* Verdadero o falso */
.te-vf{display:flex;flex-wrap:wrap;gap:10px}
.te-vf-op{display:inline-flex;align-items:center;gap:8px;margin:0;border:1.5px solid var(--line);border-radius:12px;padding:10px 18px;cursor:pointer;font-size:.95rem;font-weight:600;background:#fff}
.te-vf-op input{width:18px;height:18px;margin:0;accent-color:var(--ok)}
.te-vf-op.marcada{border-color:var(--ok);background:#E6F6EE;color:#14774a}

/* Emparejar */
.te-pares{display:grid;gap:8px;margin:0 0 8px}
.te-par{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto;gap:8px;align-items:center}
.te-flecha{color:var(--tiza-azul);font-weight:700}
.te-extras{display:grid;gap:8px;margin:0 0 8px}
.te-extra{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}

/* Completar */
.te-huecos-fila{display:flex;flex-wrap:wrap;gap:8px 12px;align-items:center;margin-top:8px}
.te-huecos{font-size:.84rem;color:var(--muted);flex:1 1 220px;min-width:0;overflow-wrap:anywhere}

/* Lo que falta */
.te-falta:empty{display:none}
.te-falta{margin:6px 14px 12px;background:#fdf3e2;border:1px solid #f2d9a6;color:#7a5410;border-radius:10px;padding:8px 12px;font-size:.84rem;line-height:1.45}
.te-falta ul{margin:4px 0 0 18px;padding:0}
.te-falta-lista{margin:8px 0 0 18px;padding:0;line-height:1.5}
.te-falta-lista li{margin-bottom:4px}

/* Agregar una pregunta */
.te-agregar{background:var(--tiza-claro);border:1px dashed var(--tiza-azul-borde);border-radius:14px;padding:14px 16px;margin:0 0 18px}
.te-agregar h3{margin:0 0 10px;font-size:1rem;color:var(--tiza-profundo)}
.te-tipos{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.te-tipo{display:flex;flex-direction:column;gap:3px;text-align:left;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;cursor:pointer;font:inherit;color:var(--ink);transition:border-color .15s,box-shadow .15s}
.te-tipo:hover{border-color:var(--tiza-azul);box-shadow:0 4px 14px rgba(30,136,255,.12)}
.te-tipo b{font-size:.92rem;color:var(--tiza-profundo)}
.te-tipo span{font-size:.78rem;color:var(--muted);line-height:1.35}
.te-pie{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;margin:6px 0 24px}

/* Aviso flotante */
.te-flotante{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:300;display:none;align-items:center;gap:14px;background:var(--tiza-profundo);color:#fff;padding:10px 16px;border-radius:12px;box-shadow:0 8px 24px rgba(15,45,91,.35);font-size:.9rem;max-width:min(92vw,520px)}
.te-flotante button{background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff;border-radius:8px;padding:4px 12px;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}
.te-flotante button:hover{background:rgba(255,255,255,.15)}

/* ---------- Celular ---------- */
@media (max-width:640px){
  /* Con el dedo hace falta más superficie: botones de 40 px en lugar de 34×32 */
  .te-ico{width:40px;height:40px}
  .te-ico-hueco{width:40px}
  .te-q-mov{gap:6px;margin-left:0}
  .te-pts{gap:6px}
  .te-mini{min-height:40px;padding:8px 14px}
  .te-card .acciones-tarjeta .btn{min-height:40px}
  .te-card .acciones-tarjeta .te-ico-btn{min-width:40px}
  .te-card .acciones-tarjeta{gap:8px}
  .te-q-cab{padding:10px}
  .te-q-esp{flex-basis:100%;height:0}
  .te-q-cuerpo{padding:10px 10px 4px}
  .te-par{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"n a x" ". b ."}
  .te-par > .te-letra{grid-area:n}
  .te-par > input[data-lado="0"]{grid-area:a}
  .te-par > .te-flecha{display:none}
  .te-par > input[data-lado="1"]{grid-area:b}
  .te-par > .te-ico,.te-par > .te-ico-hueco{grid-area:x}
  .te-datos-res{text-align:left;flex-basis:100%}
  .te-resumen{padding:10px}
  .te-pie .btn{flex:1 1 140px}
  .te-cuenta{margin-left:0;flex-basis:100%}
  #pantalla-evaluaciones .te-barra .te-in,#pantalla-evaluaciones .te-barra .te-sel{flex-basis:100%;max-width:none}
}
