/* ============================================================
   form.css — estilos comunes para formularios, tablas y modales
   S.I.E.S — complementa inscripcion.css / alumnos.css
   ============================================================ */
:root{
  --azul:#3d90f9;
  --azul-osc:#2c6fbb;
  --gris:#f9fafb;
  --borde:#dde3ea;
}

/* ---- Alertas ---- */
.alerta{padding:14px 18px;border-radius:10px;margin:14px 0;font-weight:500;line-height:1.4}
.alerta-ok{background:#e6f7ec;color:#1f8a3b;border:1px solid #b6e2c6}
.alerta-error{background:#fdecea;color:#c0392b;border:1px solid #f5c2bd}

/* ---- Formulario de inscripción ---- */
.form-inscripcion{text-align:left;margin-top:10px}
.form-inscripcion .campo{margin-bottom:14px}
.form-inscripcion label{display:block;font-weight:500;margin-bottom:6px;color:#444}
.form-inscripcion input,.form-inscripcion select{
  width:100%;padding:11px 12px;border:1px solid var(--borde);border-radius:8px;
  font-family:inherit;font-size:15px;background:#fff;transition:border .2s,box-shadow .2s}
.form-inscripcion input:focus,.form-inscripcion select:focus{
  outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(61,144,249,.15)}
.form-inscripcion .fila{display:flex;gap:14px}
.form-inscripcion .fila .campo{flex:1}
.sub-titulo{margin:22px 0 12px;color:var(--azul-osc);border-bottom:2px solid var(--borde);padding-bottom:6px}
@media(max-width:620px){.form-inscripcion .fila{flex-direction:column;gap:0}}

/* ---- Grid de instituciones (login) ---- */
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:18px;max-width:1100px;margin:0 auto 30px;padding:0 20px}
.cards-grid .card{background:#fff;border-radius:14px;padding:18px;text-align:center;
  box-shadow:0 4px 12px rgba(0,0,0,.08);cursor:pointer;transition:transform .15s,box-shadow .15s}
.cards-grid .card:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(61,144,249,.25)}
.cards-grid .card img{height:80px;object-fit:contain;margin-bottom:10px}
.cards-grid .card p{font-weight:500;font-size:14px}

/* ---- Modal login institución ---- */
.modal{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);
  z-index:1000;justify-content:center;align-items:center;padding:20px}
.modal-content{background:#fff;border-radius:14px;padding:28px;max-width:380px;width:100%;text-align:center}
.modal-content h3{margin-bottom:16px;color:var(--azul-osc)}
.modal-content input{width:100%;padding:12px;border:1px solid var(--borde);border-radius:8px;margin-bottom:16px;font-size:15px}
.btn-confirm,.btn-cancel{padding:10px 18px;border:none;border-radius:8px;cursor:pointer;font-weight:600;margin:0 4px}
.btn-confirm{background:var(--azul);color:#fff}
.btn-cancel{background:#e6e9ef;color:#444}

/* ---- Panel institución (lista propia) ---- */
.panel-wrap{max-width:1100px;margin:24px auto;padding:0 20px}
.panel-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.panel-top h2{color:var(--azul-osc)}
.panel-acciones{display:flex;gap:8px;flex-wrap:wrap}
.btn-mini{display:inline-block;padding:8px 14px;background:var(--azul);color:#fff;border:none;
  border-radius:8px;text-decoration:none;font-size:14px;cursor:pointer;font-family:inherit}
.btn-mini:hover{background:var(--azul-osc)}
.btn-salir{background:#888}.btn-rojo{background:#c0392b}
.barra-busqueda{display:flex;gap:8px;margin-bottom:16px;flex-wrap:wrap}
.barra-busqueda input{flex:1;min-width:200px;padding:10px 12px;border:1px solid var(--borde);border-radius:8px}

/* ---- Tablas ---- */
.tabla-scroll{overflow-x:auto}
.tabla{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,.06)}
.tabla th{background:var(--azul);color:#fff;padding:12px;text-align:left;font-weight:600;font-size:14px}
.tabla td{padding:11px 12px;border-bottom:1px solid var(--borde);font-size:14px}
.tabla tr:nth-child(even) td{background:#f5f8fd}
.tabla tr:hover td{background:#eaf2fe}
.vacio{text-align:center;color:#888;padding:24px!important}

/* ---- Estados ---- */
.estado{padding:3px 10px;border-radius:20px;font-size:12px;font-weight:600;text-transform:capitalize}
.estado-pendiente{background:#fff3cd;color:#b8860b}
.estado-confirmado{background:#d4edda;color:#1f8a3b}
.estado-rechazado{background:#f8d7da;color:#c0392b}
.estado-sorteo{background:#d6e4f7;color:#2c6fbb}

/* ---- Resultado consulta DNI ---- */
.resultado-consulta{background:var(--gris);border-radius:12px;padding:18px;margin:16px 0;text-align:left;line-height:1.7}

/* ============================================================
   Vista lista por institución (mejorada)
   ============================================================ */
.panel-sub{color:#777;font-size:14px;margin-top:2px}
.btn-gris{background:#888}

/* Tarjetas de resumen por estado */
.resumen-estados{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:12px;margin-bottom:20px}
.re-card{background:#fff;border-radius:12px;padding:16px 12px;text-align:center;
  box-shadow:0 3px 10px rgba(0,0,0,.06);border-top:4px solid var(--azul)}
.re-card.re-ok{border-top-color:#1f8a3b}
.re-card.re-warn{border-top-color:#b8860b}
.re-card.re-info{border-top-color:#2c6fbb}
.re-card.re-bad{border-top-color:#c0392b}
.re-num{display:block;font-size:28px;font-weight:700;color:#2c3440;line-height:1.1}
.re-lbl{font-size:13px;color:#777}

.barra-busqueda select{padding:10px 12px;border:1px solid var(--borde);border-radius:8px;font-family:inherit;background:#fff}
.conteo-mostrado{color:#666;font-size:14px;margin-bottom:12px}
.tabla-inscriptos small{color:#888}

/* Tabla 100% contenida, scroll horizontal SOLO interno si hace falta */
.tabla-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:12px}
.tabla-inscriptos{min-width:640px}

/* ============================================================
   Consulta por DNI (mejorada)
   ============================================================ */
.consulta-dni{display:flex;gap:10px;justify-content:center;margin:18px 0;flex-wrap:wrap}
.consulta-dni input{flex:1;max-width:260px;padding:13px 16px;border:2px solid var(--borde);
  border-radius:10px;font-size:17px;text-align:center;letter-spacing:1px}
.consulta-dni input:focus{outline:none;border-color:var(--azul);box-shadow:0 0 0 3px rgba(61,144,249,.15)}
.btn-consultar{padding:13px 22px;background:var(--azul);color:#fff;border:none;border-radius:10px;
  font-weight:600;font-size:16px;cursor:pointer;font-family:inherit}
.btn-consultar:hover{background:var(--azul-osc)}
.resultado-ok{border-left:5px solid #1f8a3b}
.res-fila{display:flex;justify-content:space-between;gap:14px;padding:8px 0;border-bottom:1px solid #e8edf3}
.res-fila:last-child{border-bottom:none}
.res-lbl{color:#777;font-weight:500}
.res-val{font-weight:600;text-align:right}
.estado-grande{font-size:18px;font-weight:700}

@media(max-width:600px){
  .res-fila{flex-direction:column;gap:2px}
  .res-val{text-align:left}
}