#map.maximized {
  position: fixed !important;
  left: 0 !important;
  top: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 3000 !important;
  border-radius: 0 !important;
  border: 3px solid #27ae60 !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.35) !important;
  overflow: hidden !important;
}
:root{
  --bg:#0f1115; --card:#161a22; --muted:#8b96a8; --text:#e9eef5; --accent:#4aa4ff;
  --ok:#22c55e; --warn:#f59e0b; --err:#ef4444; --border:#242a36;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;}
h1,h2,h3{margin:0 0 .5rem 0}
h1{font-size:1.6rem}
h2{font-size:1.25rem}
h3{font-size:1.05rem}
.subtitle{color:var(--muted);margin-top:.25rem}
.container{max-width:1600px;margin:0 auto;padding:1rem}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:1rem;margin-bottom:1rem}
.grid{display:grid;gap:1rem;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:.25rem}
label{font-weight:600}
input[type="text"],input[type="datetime-local"],select{
  background:#0e1219;border:1px solid var(--border);color:var(--text);
  border-radius:10px;padding:.6rem .7rem;outline:none
}
input::placeholder{color:#738099}
.hint{color:var(--muted);font-size:.85rem}
.error{color:var(--err);font-size:.85rem;min-height:1.1em}
.map-wrap{margin:1rem 0}
#map{height:300px;border-radius:12px;border:1px solid var(--border);overflow:hidden;cursor:crosshair}
.search-row{display:flex;gap:.5rem}
.sugerencias{list-style:none;margin:.25rem 0 0 0;padding:0;background:#0e1219;border:1px solid var(--border);border-radius:10px;max-height:240px;overflow:auto}
.sugerencias li{padding:.5rem .75rem;cursor:pointer}
.sugerencias li:hover{background:#121826}
.subsection{margin-top:1rem}
.subheader{display:flex;justify-content:flex-start;align-items:center;margin-bottom:.5rem;gap:1rem}
.dyn-list{display:flex;flex-direction:column;gap:.5rem}
.dyn-row{display:flex;gap:.5rem;align-items:center}
.dyn-row select{flex:1}
.badge{background:#121826;border:1px solid var(--border);padding:.2rem .5rem;border-radius:999px;color:var(--muted);font-size:.85rem}
.actions{display:flex;gap:.6rem;margin-top:1rem}
.actions.end{justify-content:flex-end}
.btn{
  border:1px solid var(--border);background:#101623;color:var(--text);
  padding:.55rem .9rem;border-radius:10px;cursor:pointer;font-weight:600
}
.btn:hover{border-color:#2a3242}
.btn-primary{background:#153256;border-color:#1c3a60}
.btn-primary:hover{background:#173a62}
.btn-secondary{
  background: #0c7418;
  color: #fff;
  border: 1px solid #27ae60;
  transition: background 0.2s, border 0.2s;
}
.btn-secondary:hover, .btn-secondary:focus {
  background: #27ae60;
  border-color: #219150;
}
.btn-success{background:#0f3e24;border-color:#185a37}
.btn-danger{background:#491a20;border-color:#6b1f29}
.btn-ghost{background:transparent}
.table-wrap{overflow:auto;border:1px solid var(--border);border-radius:12px}
table{width:100%;border-collapse:collapse}
thead th{background:#121826;color:#aeb9ca;position:sticky;top:0}
th,td{padding:.6rem;border-bottom:1px solid var(--border);text-align:left;vertical-align:top}
.muted{color:var(--muted)}
.foot{opacity:.7}
.mensaje{margin-top:.75rem;padding:.75rem 1rem;border-radius:10px;border:1px solid var(--border)}
.toast{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:#121826;
  border:3px solid #e74c3c !important;
  box-shadow:0 0 0 4px #e74c3c44, 0 8px 30px rgba(0,0,0,.35);
  border-radius:12px;
  padding:.7rem 1rem;
  z-index:2000;
  min-width:260px;
  text-align:center;
  font-size:1.1rem;
  color:#fff;
}
.hide{display:none}

/* Estilos para el picker de fecha/hora */
.fecha-picker-wrap {
  display: flex;
  align-items: center;
  gap: 1rem;
}

/* Botón del picker de fecha/hora */
#btnPickFechaHora {
  min-width: 200px;
  padding: 0.7rem 1.2rem;
  white-space: nowrap;
  font-size: 1rem;
  background: #3a69bb;
  border-color: #2a5434;
}

#btnPickFechaHora:hover {
  background: #1f2c42;
  border-color: #324569;
}

.fecha-hora-display {
  display: inline-flex;
  align-items: center;
  min-height: 37px; /* Mismo alto que el botón */
  color: var(--text);
  background: #1a1f2a;
  padding: 0.6rem 1.2rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  font-size: 1.15rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
  white-space: nowrap;
}

/* Personalización del input datetime-local */
input[type="datetime-local"] {
  position: fixed;
  transform: translate(-50%, -50%);
  z-index: 1000; /* Asegura que esté por encima de otros elementos */
  width: auto; /* Evita que ocupe todo el ancho */
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 8px;
  font-size: 14px;
}

input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  cursor: pointer;
}

#btnRestoreMap {
  display: none !important;
  position: fixed !important;
  left: 50% !important;
  bottom: 5vh !important;
  transform: translateX(-50%) !important;
  z-index: 3101 !important;
  min-width: 160px;
  min-height: 44px;
  max-width: 220px;
  max-height: 48px;
  padding: 0.7rem 1.2rem;
  font-size: 1rem;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0,0,0,.18);
  background: #0c7418;
  color: #fff;
  border: 2.5px solid #e74c3c !important;
}
#map.maximized + #btnRestoreMap {
  display: block !important;
}

/* Fix superposición Fecha/Tipo de Control */
.field{ min-width: 0; }                 /* permite que el contenido se encoja dentro del grid */
.fecha-picker-wrap{ flex-wrap: wrap; gap: .5rem; }
.fecha-hora-display{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;              /* trunca si no entra */
}

@media (max-width: 1150px){
  .fecha-hora-display{ font-size: 1rem; padding: .5rem .8rem; }
}

/* Fullscreen del mapa (unificado) */
#map.maximized {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 9999 !important;           /* mapa arriba */
  border-radius: 0 !important;
  border: 3px solid #27ae60 !important;
  box-shadow: 0 8px 30px rgba(0,0,0,.35) !important;
  overflow: hidden !important;
}

/* Botón Volver: que quede por encima del mapa */
#btnRestoreMap { z-index: 10001 !important; }

/* Lock de scroll cuando está fullscreen */
body.map-lock { overflow: hidden; }

#escuela {
  min-width: 100%;
  width: 100%;
  max-width: 800px;   /* podés ajustar este valor según lo que necesites */
}

/* Estilos para radio buttons */
.radio-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.radio-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  cursor: pointer;
  font-weight: normal;
}

.radio-label input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
  cursor: pointer;
}

.radio-label span {
  color: var(--text);
  font-size: 0.95rem;
}

/* Estilos para filas de personal con múltiples campos */
.personal-row {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1rem;
}

.personal-fields {
  display: grid;
  grid-template-columns: 180px 150px 160px 180px 160px repeat(4, minmax(110px, 1fr));
  gap: 0.65rem;
  align-items: start;
}

.personal-fields .field {
  margin-bottom: 0;
  min-width: 0;
}

.personal-fields .field:last-child {
  display: flex;
  align-items: end;
  justify-content: center;
}

.personal-fields .radio-group {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.personal-fields .radio-label {
  font-size: 0.85rem;
}

.personal-fields .radio-label span {
  font-size: 0.85rem;
}

/* Responsive para tablets */
@media (max-width: 1400px) {
  .personal-fields {
    grid-template-columns: 160px 130px 140px 160px 140px repeat(3, minmax(100px, 1fr));
  }
}

@media (max-width: 1200px) {
  .personal-fields {
    grid-template-columns: repeat(5, minmax(140px, 1fr));
  }
}

/* Responsive para móviles */
@media (max-width: 768px) {
  .personal-fields {
    grid-template-columns: 160px repeat(3, minmax(80px, 1fr));
    gap: 0.5rem;
  }
  
  .personal-fields .field {
    font-size: 0.9rem;
  }
  
  .personal-fields label {
    font-size: 0.8rem;
  }
  
  .personal-fields input,
  .personal-fields select {
    padding: 0.4rem 0.5rem;
    font-size: 0.85rem;
  }
}

.personal-fields input[type="date"],
.personal-fields input[type="time"] {
  min-width: 120px;
  font-size: 0.9rem;
}

.personal-fields select {
  min-width: 120px;
  font-size: 0.9rem;
}

.personal-fields .btn-danger {
  padding: 0.4rem 0.6rem;
  font-size: 0.8rem;
  min-width: 80px;
}

@media (max-width: 768px) {
  .personal-fields .btn-danger {
    padding: 0.3rem 0.5rem;
    font-size: 0.75rem;
    min-width: 60px;
  }
}

.personal-fields .personal-select {
  min-width: 200px;
  font-size: 0.9rem;
}

@media (max-width: 1200px) {
  .personal-fields .personal-select {
    min-width: 180px;
  }
}

@media (max-width: 768px) {
  .personal-fields .personal-select {
    min-width: 160px;
    font-size: 0.85rem;
  }
}

/* Estilos para las filas de móviles */
.movil-fields {
  display: grid;
  grid-template-columns: 180px 200px repeat(3, minmax(120px, 1fr)) 100px;
  gap: 0.65rem;
  align-items: start;
}

.movil-fields .field {
  margin-bottom: 0;
  min-width: 0;
}

.movil-fields .field:last-child {
  display: flex;
  align-items: end;
  justify-content: center;
}

/* Responsive para móviles */
@media (max-width: 1400px) {
  .movil-fields {
    grid-template-columns: 160px 180px repeat(3, minmax(110px, 1fr)) 90px;
  }
}

@media (max-width: 1200px) {
  .movil-fields {
    grid-template-columns: repeat(4, minmax(140px, 1fr)) 80px;
  }
}

@media (max-width: 768px) {
  .movil-fields {
    grid-template-columns: 150px repeat(2, minmax(100px, 1fr)) 70px;
    gap: 0.5rem;
  }
  
  .movil-fields .field {
    font-size: 0.9rem;
  }
  
  .movil-fields label {
    font-size: 0.8rem;
  }
  
  .movil-fields input,
  .movil-fields select {
    padding: 0.4rem 0.5rem;
    font-size: 0.85rem;
  }
}

.movil-fields input[type="date"],
.movil-fields input[type="time"] {
  min-width: 120px;
  font-size: 0.9rem;
}

.movil-fields select {
  min-width: 120px;
  font-size: 0.9rem;
}

.movil-fields .btn-danger {
  padding: 0.4rem 0.6rem;
  font-size: 0.8rem;
  min-width: 80px;
}

@media (max-width: 768px) {
  .movil-fields .btn-danger {
    padding: 0.3rem 0.5rem;
    font-size: 0.75rem;
    min-width: 60px;
  }
}

/* Estilos para la sección de envío */
.submit-section {
  margin-top: 2rem;
  padding-top: 2rem;
  border-top: 2px solid var(--border);
  text-align: center;
}

.btn-large {
  padding: 1rem 2rem;
  font-size: 1.1rem;
  font-weight: 700;
  min-width: 200px;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: all 0.3s ease;
}

.btn-large:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}

.submit-hint {
  margin-top: 0.75rem;
  color: var(--muted);
  font-size: 0.9rem;
  font-style: italic;
}