/* PROGARO — Estilos del selector de ubicación */

.ubi-wrap {
  border: 1px solid #ddd;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  margin-top: 0.3rem;
  color-scheme: light;   /* que no se invierta en modo oscuro del celular */
}

.ubi-controles {
  display: flex;
  gap: 0.4rem;
  padding: 0.6rem;
  background: #f8f8f6;
  flex-wrap: wrap;
  /* El celular en modo oscuro hacía que el widget de Google se pintara
     con fondo negro. Forzamos esquema claro para todo el selector. */
  color-scheme: light;
}

/* min-width:0 es lo que evita que el widget desborde el contenedor:
   sin esto, un flex item nunca se encoge por debajo de su contenido
   y la dirección larga se salía para el costado. */
.ubi-autocomplete { flex: 1 1 220px; min-width: 0; max-width: 100%; }

/* El widget de Google es un web component: solo controlamos su ancho */
.ubi-gmp-input {
  width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box;
  color-scheme: light;
}

.ubi-gps {
  margin: 0 !important;
  width: auto !important;
  padding: 0.5rem 0.8rem !important;
  background: #E8722C !important;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 0.85rem;
  cursor: pointer;
  white-space: nowrap;
}

.ubi-mapa { height: 260px; width: 100%; z-index: 0; }

.ubi-resultado {
  padding: 0.7rem;
  overflow-wrap: anywhere;   /* direcciones largas cortan en vez de desbordar */
  font-size: 0.87rem;
  background: #f8f8f6;
  border-top: 1px solid #eee;
  line-height: 1.45;
  color: #333;
}

/* Avisos temporales (permisos de GPS, errores) — no pisan la dirección elegida */
.ubi-aviso {
  display: none;
  padding: 0.55rem 0.7rem;
  font-size: 0.85rem;
  border-bottom: 1px solid #eee;
}
.ubi-aviso-info { background: #eef4fa; color: #1B3A5C; }
.ubi-aviso-error { background: #fdecea; color: #c0392b; }

/* Estado del cartel de resultado */
.ubi-vacio { color: #888; font-style: italic; }

.ubi-confirmado {
  background: #eaf6ec;
  border-top: 2px solid #2e9e4f;
  color: #1c3d24;
}
.ubi-check {
  font-size: 0.78rem;
  font-weight: 700;
  color: #2e9e4f;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  margin-bottom: 0.15rem;
}
.ubi-tip { font-size: 0.78rem; color: #5c7a63; margin-top: 0.3rem; }

/* ---- Selector de ciudades (zonas de trabajo) ---- */
.ciu-wrap { margin-top: 0.3rem; }
.ciu-buscador { margin-bottom: 0.3rem; }
.ciu-input { width: 100%; }
.ciu-ayuda { font-size: 0.79rem; color: #888; line-height: 1.4; margin-bottom: 0.4rem; }
.ciu-vacio { font-size: 0.82rem; color: #a8431f; background: #fff8e1;
             padding: 0.5rem 0.6rem; border-radius: 6px; }
.ciu-error { font-size: 0.82rem; color: #c0392b; }
.ciu-lista { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.ciudad-chip { display: inline-flex; align-items: center; gap: 0.3rem; background: #eef4fa;
               color: #1B3A5C; border-radius: 99px;
               padding: 0.25rem 0.35rem 0.25rem 0.65rem; font-size: 0.83rem; font-weight: 600; }
.ciudad-chip small { font-weight: 400; color: #7a90a6; }
.ciudad-chip button { width: auto !important; margin: 0 !important; padding: 0 0.25rem !important;
                      background: transparent !important; color: #7a90a6; font-size: 0.8rem; }
.ciudad-chip button:hover { color: #c0392b; }

/* ---- Validación de teléfono ---- */
.tel-msg { font-size: 0.78rem; line-height: 1.35; margin-top: 0.2rem; min-height: 1rem; }
.tel-msg.ok { color: #1c5c2c; font-weight: 600; }
.tel-msg.err { color: #c0392b; }
.tel-msg.neutro { color: #888; }

/* ---- Validación de teléfono ---- */
.tel-aviso {
  font-size: 0.79rem;
  line-height: 1.4;
  margin-top: 0.2rem;
  min-height: 1em;
}
.tel-aviso.ok { color: #1c5c2c; font-weight: 600; }
.tel-aviso.error { color: #c0392b; }

input.tel-ok { border-color: #2e9e4f !important; }
input.tel-error { border-color: #c0392b !important; background: #fffafa; }

/* ---- Selector de archivo prolijo ---- */
.file-picker { display:flex; align-items:center; gap:0.6rem; flex-wrap:wrap; margin-top:0.2rem; }
.file-picker-btn {
  width:auto !important; margin:0 !important; padding:0.5rem 0.9rem !important;
  font-size:0.83rem !important; background:#F1EEE7 !important; color:#1B3A5C !important;
  box-shadow:none !important; font-weight:600 !important;
}
.file-picker-nombre { font-size:0.82rem; color:#8B98A5; }
.file-picker-nombre.con-archivo { color:#2E9E4F; font-weight:600; }
.file-input-real { position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; pointer-events:none; }
