/* Viu Map · Etapa 17 (2-nov-2026): un mismo diseño para los modales, con el estilo de la ficha de los avisos del clima.
   Solo se aplica cuando el panel lleva la clase .mv (la pone el mapa al pintar cada modal). Sin animaciones nuevas ni
   backdrop-filter: no cuesta nada a la fluidez del mapa. */
.fondo-perfil.mv { align-items: center; padding: 12px; }
.panel-perfil.mv { background: #fff; padding: 0; border-radius: 18px; max-width: 400px; max-height: calc(100dvh - 24px);
    display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,.35); font-family: 'Inter', sans-serif; color: #1b2a33; }
.panel-perfil.mv > #contenidoPerfil { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.panel-perfil.mv .mv-pantalla { display: flex; flex-direction: column; min-height: 0; flex: 1; }
.panel-perfil.mv > .perfil-cerrar { top: 12px; right: 12px; width: 30px; height: 30px; padding: 0; border-radius: 50%; z-index: 2;
    background: rgba(255,255,255,.22); color: #fff; font-size: 15px; display: grid; place-items: center; }
.panel-perfil.mv.mv-oscuro > .perfil-cerrar { background: rgba(0,0,0,.12); color: #3d2e00; }

/* Cabecera de color */
.mv-cab { --mv-c: #2E7D32; background: var(--mv-c); color: #fff; padding: 14px 52px 14px 16px; display: flex; gap: 12px; align-items: center; flex: none; }
.mv-oscuro .mv-cab { color: #3d2e00; }
.mv-ic { width: 44px; height: 44px; border-radius: 50%; background: #fff; display: grid; place-items: center; flex: none; overflow: hidden;
    box-shadow: 0 0 0 5px rgba(255,255,255,.25); font-size: 24px; color: #1b2a33; }
.mv-ic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mv-etq { font-size: 10.5px; font-weight: 800; letter-spacing: .08em; opacity: .9; text-transform: uppercase; }
.mv-tit { font-size: 17px; font-weight: 800; line-height: 1.2; margin-top: 2px; word-break: break-word; }
.mv-zona { font-size: 12.5px; opacity: .92; margin-top: 2px; word-break: break-all; }

/* Pestañas */
.mv-pest { display: flex; gap: 6px; padding: 10px 14px 0; flex: none; }
.mv-pest button { flex: 1; text-align: center; padding: 8px 4px; border-radius: 10px; font: 700 12.5px 'Inter', sans-serif; background: #f5f7f9; color: #55646e; border: none; cursor: pointer; }
.mv-pest button.on { background: var(--mv-c, #2E7D32); color: #fff; }

/* Cuerpo */
.mv-cuerpo { padding: 12px 16px 16px; overflow-y: auto; font-size: 13.5px; line-height: 1.45; min-height: 0; flex: 1; -webkit-overflow-scrolling: touch; }
.mv-sec { font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 5px; text-transform: uppercase; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mv-cuerpo > .mv-sec:first-child, .mv-cuerpo > .perfil-mensaje + .mv-sec { margin-top: 2px; }
.mv-cuerpo .perfil-campo { margin-bottom: 0; }
.mv-cuerpo .perfil-campo label { font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 5px; text-transform: uppercase; }
.mv-cuerpo .perfil-campo input, .mv-cuerpo .perfil-campo select, .mv-in {
    width: 100%; height: 42px; border: 1px solid #e1e6ec; border-radius: 10px; background: #f5f7f9; padding: 0 12px;
    font: 15px 'Inter', sans-serif; color: #1b2a33; box-sizing: border-box; }
.mv-cuerpo .perfil-campo input:focus, .mv-cuerpo .perfil-campo select:focus { outline: none; border-color: #2E7D32; background: #fff; }
.mv-cuerpo .perfil-campo input[readonly] { background: #eceff2; color: #55646e; }
.mv-cuerpo .perfil-dato-bloqueado { height: 42px; border-radius: 10px; background: #eceff2; color: #55646e; padding: 0 12px; display: flex; align-items: center; font-size: 15px; }
.mv-cuerpo .perfil-dato-bloqueado::before { content: '🔒'; margin-right: 6px; font-size: 13px; }
.mv-cuerpo .perfil-campo-hint { font-size: 11.5px; color: #7a8790; margin-top: 4px; line-height: 1.35; }
.mv-dos { display: flex; gap: 8px; } .mv-dos > * { flex: 1; min-width: 0; }

/* Estados */
.mv-est { display: inline-flex; align-items: center; gap: 6px; font-weight: 800; font-size: 11.5px; border-radius: 10px; padding: 3px 9px; text-transform: none; letter-spacing: 0; }
.mv-est i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; display: block; }
.mv-est.ok { background: #EAF5EC; color: #2E7D32; } .mv-est.pend { background: #fff8e1; color: #8a6d00; }

/* Teléfono */
.mv-tel { display: flex; gap: 8px; }
.mv-tel input { flex: 1; min-width: 0; }
.mv-tel .mv-pre { height: 42px; border: 1px solid #e1e6ec; border-radius: 10px; background: #eceff2; color: #55646e; padding: 0 10px; display: grid; place-items: center; font-size: 15px; flex: none; }
.mv-tel .btn-validar-telefono { flex: none; height: 42px; margin: 0; padding: 0 14px; border: none; border-radius: 10px; background: #2E7D32; color: #fff; font: 700 13.5px 'Inter', sans-serif; box-shadow: 0 2px 5px rgba(0,0,0,.15); }

/* Cajas */
.mv-texto { background: #fff8e1; border-radius: 10px; padding: 8px 10px; font-size: 12.5px; color: #5d4a00; line-height: 1.45; margin-top: 6px; }
.mv-texto.azul { background: #EEF2FB; color: #1C3F7A; } .mv-texto.verde { background: #EAF5EC; color: #22502a; }
.mv-hacer { background: #fdecea; border-left: 4px solid #c62828; border-radius: 8px; padding: 8px 10px; font-size: 13px; color: #4a1010; line-height: 1.45; }

/* Interruptores (las casillas de siempre, dibujadas como interruptor) */
.mv-int { display: flex; gap: 12px; align-items: flex-start; background: #f5f7f9; border-radius: 10px; padding: 10px 12px; margin-bottom: 8px; cursor: pointer; }
.mv-int .t { flex: 1; font-size: 12.5px; color: #55646e; line-height: 1.4; }
.mv-int .t b { display: block; font-size: 14px; color: #1b2a33; margin-bottom: 2px; }
.mv-int input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 44px; height: 26px; border-radius: 13px; background: #c9ced8; position: relative; flex: none; margin: 2px 0 0; cursor: pointer; transition: background .15s; }
.mv-int input[type="checkbox"]::after { content: ''; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: left .15s; }
.mv-int input[type="checkbox"]:checked { background: #2E7D32; }
.mv-int input[type="checkbox"]:checked::after { left: 21px; }

/* Botones */
.mv-cuerpo .perfil-btn-guardar { width: 100%; border: none; border-radius: 10px; background: #2E7D32; color: #fff; font: 700 14.5px 'Inter', sans-serif; padding: 12px 8px; margin-top: 14px; box-shadow: 0 2px 5px rgba(0,0,0,.15); }
.mv-cuerpo .perfil-btn-secundario { border-radius: 10px; background: #fff; color: #1C3F7A; border: 1.5px solid #1C3F7A; font: 700 14px 'Inter', sans-serif; padding: 11px 8px; width: 100%; }
.mv-cuerpo .perfil-btn-eliminar { display: block; margin: 12px auto 0; font: 700 13px 'Inter', sans-serif; color: #C62828; background: none; border: none; }
.mv-cuerpo #confirmacionEliminarCuenta { background: #fdecea; border-radius: 12px; padding: 12px; margin-top: 12px; text-align: center; }
.mv-cuerpo #confirmacionEliminarCuenta .perfil-btn-secundario { margin-top: 8px; }
.mv-cuerpo .mv-fuente { font-size: 11px; color: #8a959c; margin-top: 10px; line-height: 1.5; }
.mv-cuerpo .perfil-mensaje:empty { display: none; }
.mv-cuerpo > .perfil-mensaje:empty + .perfil-campo > .mv-sec, .mv-cuerpo > .perfil-mensaje:empty + .perfil-campo > label,
.mv-cuerpo > .perfil-mensaje:empty + .perfil-campo-hint { margin-top: 2px; }
.mv-cuerpo .perfil-campo-telefono { margin: 0; }
.panel-perfil.mv .mv-pest { margin: 0; background: none; border-radius: 0; box-shadow: none; }
.mv-tel select.mv-pre { width: 104px; padding: 0 6px; background: #f5f7f9; color: #1b2a33; font: 15px 'Inter', sans-serif; text-overflow: ellipsis; display: block; }

/* ── Etapa 17b: Mis Rutas Viu ── */
.panel-perfil.mv .mrv-pestanas { background: none; padding: 0; gap: 6px; margin: 0 0 10px; }
.panel-perfil.mv .mrv-pestana { background: #f5f7f9; color: #55646e; padding: 8px 2px; border-radius: 10px; font-size: 12.5px; box-shadow: none; }
.panel-perfil.mv .mrv-pestana.activa { background: var(--mv-c, #2E7D32); color: #fff; box-shadow: none; }
.panel-perfil.mv .mrv-priv { text-align: left; font-size: 11px; color: #8a959c; margin-top: 12px; }
.panel-perfil.mv .mrv-borrar { display: block; margin: 12px auto 0; color: #C62828; text-decoration: none; font: 700 13px 'Inter', sans-serif; }

/* ── Etapa 17b: Agenda Viu Map ── */
.cp-calendario-nav span, .agenda-calendario-nav span { text-transform: none; }   /* «Noviembre de 2026»: la mayúscula la pone el mapa */
.panel-perfil.mv .agenda-mia-leyenda { gap: 4px 10px; font-size: 11px; color: #55646e; margin: 0 0 10px; }
.panel-perfil.mv .cp-calendario-nav { margin-bottom: 6px; }
.panel-perfil.mv .cp-calendario-nav button { width: 32px; height: 32px; border-radius: 50%; background: #f5f7f9; border: none; color: #1b2a33; font-size: 18px; }
.panel-perfil.mv .cp-calendario-nav span { font-size: 15px; font-weight: 800; color: #1b2a33; }
.panel-perfil.mv #agendaMiaGrilla { gap: 4px; margin-bottom: 4px; }
.panel-perfil.mv #agendaMiaGrilla .cp-nombre-dia { font-size: 11px; font-weight: 800; color: #6b7a85; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia { background: #f5f7f9; color: #1b2a33; border-radius: 10px; height: 42px; box-shadow: none; font-weight: 500;
    display: flex; align-items: flex-start; justify-content: center; padding-top: 7px; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia.cp-vacio { visibility: hidden; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia .mia-punto { width: 6px; height: 6px; box-shadow: none; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia .mia-puntos-dia { bottom: 6px; gap: 2px; }
/* Hoy: verde translúcido, como «A pie» en Mis Rutas Viu. El día que se toca: borde verde. */
.panel-perfil.mv #agendaMiaGrilla .cp-dia.hoy { background: #EAF5EC; color: #1b5e20; font-weight: 800; box-shadow: none; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia.seleccionado { background: #fff; color: #1b2a33; font-weight: 800; box-shadow: inset 0 0 0 2px #2E7D32; }
.panel-perfil.mv #agendaMiaGrilla .cp-dia.hoy.seleccionado { background: #EAF5EC; color: #1b5e20; box-shadow: inset 0 0 0 2px #2E7D32; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-acto-agenda, .panel-perfil.mv #agendaMiaDetalle .tarjeta-mrc { background: #f5f7f9; border-radius: 8px; border-left: 4px solid #8a959c; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-acto-tren-mia { border-left-color: #fa483b; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-acto-bus-mia { border-left-color: #14204A; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-acto-falla-mia { border-left-color: #a63ae6; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-acto-personal-mia { border-left-color: #C9A227; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-mrc-reservas { border-left-color: #7A2048; }
.panel-perfil.mv #agendaMiaDetalle .tarjeta-mrc-citas { border-left-color: #4169E1; }
.panel-perfil.mv .mrv-graf-tit b { font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; text-transform: uppercase; }

/* ── Etapa 17c: Autobús municipal (la guía de 2 pasos), en la ficha de siempre ── */
.ficha-negocio.mv-ficha { padding: 0; border-radius: 18px; display: flex; flex-direction: column; overflow: hidden; max-height: 85vh; color: #1b2a33; font-family: 'Inter', sans-serif; }
.ficha-negocio.mv-ficha .mv-cuerpo { padding: 12px 16px 16px; }
.ficha-negocio.mv-ficha > .mv-x { top: 12px; right: 12px; background: rgba(255,255,255,.22); color: #fff; box-shadow: none; font-size: 15px; }
.mv-pasos { display: flex; gap: 5px; margin-top: 7px; }
.mv-pasos .cp-paso-punto { width: 22px; height: 4px; border-radius: 2px; background: rgba(255,255,255,.35); opacity: 1; }
.mv-pasos .cp-paso-punto.activo { background: #fff; }
.mv-pasos .cp-paso-punto.completado { background: rgba(255,255,255,.7); }
.mv-zona[hidden] { display: none; }
.mv-ficha .campo-reserva { margin-bottom: 0; }
.mv-ficha .campo-reserva > label { display: block; font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 5px; text-transform: uppercase; }
.mv-ficha .mv-cuerpo > .campo-reserva:first-child > label { margin-top: 2px; }
.mv-ficha .campo-reserva { margin-top: 0 !important; }
.mv-ficha .campo-reserva select { width: 100%; height: 42px; border: 1px solid #e1e6ec; border-radius: 10px; background: #f5f7f9; padding: 0 10px; font: 15px 'Inter', sans-serif; color: #1b2a33; }
.mv-ficha .bus-btn-cercana { margin-top: 8px; border: 1.5px solid #1C3F7A; border-style: solid; background: #fff; color: #1C3F7A; border-radius: 10px; }
.mv-ficha .bus-fila-hora { flex-wrap: nowrap; align-items: flex-start; }
.mv-ficha .bus-btn-ahora { width: 100%; height: 46px; border-radius: 10px; border: 1px solid #e1e6ec; background: #f5f7f9; color: #55646e; font: 700 14.5px 'Inter', sans-serif; }
.mv-ficha .bus-btn-ahora.seleccionado { background: var(--mv-c, #14204A); border-color: var(--mv-c, #14204A); color: #fff; }
.mv-reloj { position: relative; display: flex; align-items: center; justify-content: center; height: 46px; border-radius: 10px; border: 1px solid #e1e6ec; background: #f5f7f9; cursor: pointer; overflow: hidden; }
.mv-reloj.elegido { background: var(--mv-c, #14204A); border-color: var(--mv-c, #14204A); color: #fff; }
.mv-reloj-txt { font-size: 21px; font-weight: 700; pointer-events: none; }
.mv-reloj.elegido .mv-reloj-txt { font-size: 15.5px; }
.mv-reloj input[type=time] { position: absolute; inset: 0; width: 100% !important; height: 100%; opacity: 0; cursor: pointer; border: 0; padding: 0; margin: 0; }
.mv-reloj-nota { font-size: 11.5px; color: #7a8790; text-align: center; margin-top: 4px; }
.mv-ficha .btn-confirmar-codigo { border-radius: 10px; }
.mv-ficha .campo-reserva label.mv-reloj { display: flex; align-items: center; justify-content: center; margin: 0; padding: 0; text-transform: none; letter-spacing: 0; font-size: 15px; color: #1b2a33; }
.mv-ficha .campo-reserva label.mv-reloj.elegido { color: #fff; }
.mv-ficha .bus-nota-cercana:empty { display: none; }

/* ── Etapa 17d: Reportar una incidencia ── */
.fondo-incidencia.mv { align-items: center; padding: 12px; }
.panel-incidencia.mv { background: #fff; padding: 0; border-radius: 18px; max-width: 400px; max-height: calc(100dvh - 24px);
    display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 20px 50px rgba(0,0,0,.35); font-family: 'Inter', sans-serif; color: #1b2a33; }
.panel-incidencia.mv > .perfil-cerrar { top: 12px; right: 12px; width: 30px; height: 30px; padding: 0; border-radius: 50%; z-index: 2;
    background: rgba(0,0,0,.12); color: #3d2e00; font-size: 15px; display: grid; place-items: center; }
.panel-incidencia.mv .mv-ic img { object-fit: contain; padding: 3px; box-sizing: border-box; }
#panelIncidencia.mv .campo-reserva { margin: 0; }
#panelIncidencia.mv .campo-reserva > label { display: block; font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 5px; text-transform: uppercase; }
#panelIncidencia.mv .campo-reserva input[type=text], #panelIncidencia.mv .campo-reserva textarea {
    width: 100%; border: 1px solid #e1e6ec; border-radius: 10px; background: #f5f7f9; padding: 10px 12px; font: 15px 'Inter', sans-serif; color: #1b2a33; box-sizing: border-box; }
#panelIncidencia.mv .campo-reserva input[type=text] { height: 42px; }
#panelIncidencia.mv .campo-reserva input:focus, #panelIncidencia.mv .campo-reserva textarea:focus { outline: none; border-color: #2E7D32; background: #fff; }
#panelIncidencia.mv .incidencia-ubicacion-info { border-radius: 10px; padding: 8px 10px; font-size: 12.5px; line-height: 1.45; text-align: left; }
#panelIncidencia.mv .incidencia-ubicacion-info.ok { background: #EAF5EC; color: #22502a; }
/* (Etapa 19: el emoji de ubicación se sustituyó por el pin rojo; ver más abajo) */
#panelIncidencia.mv .incidencia-contador { font-size: 11px; color: #8a959c; }
.mv-chips { display: flex; gap: 6px; }
.mv-chips button { flex: 1; border: none; border-radius: 9px; padding: 9px 2px; background: #f0f2f4; color: #55646e; font: 700 13px 'Inter', sans-serif; cursor: pointer; }
.mv-chips button.on { background: #1C3F7A; color: #fff; }
#panelIncidencia.mv .incidencia-aviso-112 { margin: 0; padding: 8px 10px; font-size: 13px; color: #4a1010; background: #fdecea; text-align: left; line-height: 1.45; }
#panelIncidencia.mv .ar-112 { margin-top: 8px; }
.mv-btn-foto { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; box-sizing: border-box; border-radius: 10px; background: #fff; color: #1C3F7A;
    border: 1.5px solid #1C3F7A; font: 700 14px 'Inter', sans-serif; padding: 11px 8px; cursor: pointer; text-transform: none !important; letter-spacing: 0 !important; margin: 0 !important; }
#panelIncidencia.mv .campo-reserva > label.mv-btn-foto { display: flex; color: #1C3F7A; font-size: 14px; }
.mv-oculto { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none; }
#panelIncidencia.mv .incidencia-nota-foto { font-size: 11.5px; color: #7a8790; margin-top: 4px; text-align: left; }
#panelIncidencia.mv .incidencia-aviso-reporte-unico { margin: 12px 0 0; text-align: left; font-size: 12.5px; }
#panelIncidencia.mv .btn-confirmar-codigo { width: 100%; border-radius: 10px; margin-top: 12px; }
#panelIncidencia.mv .perfil-mensaje:empty { display: none; }

/* ── Etapa 17e (Jaime): los iconos cuadrados (el logo de la empresa del bus y el calendario de la Agenda), más
   pequeños dentro del círculo para que no se corten los detalles. Las fotos y el icono de incidencias no cambian. ── */
#busGuiaLogo img, .mv-ic img[src*="viu-icono-calendario"] { width: 70% !important; height: 70% !important; padding: 0 !important; object-fit: contain; }

/* ── Etapa 18a: el panel compartido (#fondoBuckets) con la cabecera de color (clase .mv-b): el comparador de gasolineras ── */
.fondo-buckets:has(.mv-b) { align-items: center; padding: 12px; }
.fondo-buckets .panel-buckets.mv-b { background: #fff !important; padding: 0 !important; border-radius: 18px !important; max-width: 440px; max-height: calc(100dvh - 24px);
    box-shadow: 0 20px 50px rgba(0,0,0,.35); color: #1b2a33; }
.mv-b-ic { display: none; }
.panel-buckets.mv-b .mv-b-ic { display: grid; }
.panel-buckets.mv-b .mv-b-ic img { width: 74%; height: 74%; object-fit: contain; }
.fondo-buckets .panel-buckets.mv-b .cabecera-buckets { background: var(--mv-c); color: #fff; padding: 14px 52px 14px 16px !important; margin: 0 !important;
    display: flex; gap: 12px; align-items: center !important; justify-content: flex-start; position: relative; }
.panel-buckets.mv-b.mv-oscuro .cabecera-buckets { color: #3d2e00; }
.fondo-buckets .panel-buckets.mv-b .ceja-buckets { font-size: 10.5px !important; font-weight: 800; letter-spacing: .08em; color: inherit; opacity: .9; }
.fondo-buckets .panel-buckets.mv-b .titulo-buckets h2 { font-size: 17px !important; font-weight: 800; line-height: 1.2; color: inherit; margin-top: 2px !important; }
.fondo-buckets .panel-buckets.mv-b .subtitulo-buckets { font-size: 12.5px !important; line-height: 1.35 !important; color: inherit; opacity: .92; margin-top: 2px !important; }
.fondo-buckets .panel-buckets.mv-b .btn-cerrar-buckets { position: absolute; top: 12px; right: 12px; width: 30px !important; height: 30px !important; margin: 0 !important;
    background: rgba(255,255,255,.22); color: #fff; box-shadow: none; font-size: 15px !important; }
.panel-buckets.mv-b.mv-oscuro .btn-cerrar-buckets { background: rgba(0,0,0,.12); color: #3d2e00; }
.panel-buckets.mv-b .cuerpo-buckets { padding: 0 16px 14px; }
.panel-buckets.mv-b .pastillas-combustible-movil { position: sticky; top: 0; z-index: 1; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 10px 0 8px; background: #fff; }
.panel-buckets.mv-b .pastillas-combustible-movil::-webkit-scrollbar { display: none; }
.panel-buckets.mv-b .pastilla-combustible-movil { flex-shrink: 0; font: 700 12.5px 'Inter', sans-serif; padding: 8px 12px; border-radius: 10px; border: none; background: #f5f7f9; color: #55646e; white-space: nowrap; cursor: pointer; }
.panel-buckets.mv-b .pastilla-combustible-movil.activa { background: var(--mv-c); color: #fff; }
.panel-buckets.mv-b .tarjeta-gas-movil { background: #fff; border-radius: 0; padding: 0; box-shadow: none; }
.panel-buckets.mv-b .fila-gas-movil { display: grid; grid-template-columns: minmax(0, 1fr) auto 46px; column-gap: 10px; align-items: center; padding: 9px 0; border-top: 1px solid #eef1f4; }
.panel-buckets.mv-b .fila-gas-movil:first-child { border-top: none; }
.panel-buckets.mv-b .info-gas-movil { min-width: 0; }
.panel-buckets.mv-b .nombre-gas-movil { font: 600 13.5px 'Inter', sans-serif; color: #1b2a33; white-space: normal; line-height: 1.3; }
.panel-buckets.mv-b .detalle-gas-movil { font: 11.5px 'Inter', sans-serif; color: #8a959c; margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.panel-buckets.mv-b .etiquetas-gas-movil { display: flex; gap: 5px; margin-top: 5px; }
.panel-buckets.mv-b .precio-gas-movil { font: 800 15px 'Inter', sans-serif; color: #1b2a33; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.panel-buckets.mv-b .precio-gas-movil small { font-size: 10.5px; font-weight: 600; color: #8a959c; }
.panel-buckets.mv-b .precio-gas-movil.precio-mas-barato { color: #2E7D32; }
.panel-buckets.mv-b .precio-gas-movil.precio-segundo-barato { color: #1b5e20; }
.panel-buckets.mv-b .ir-gas-movil { display: flex; justify-content: flex-end; }
.panel-buckets.mv-b .btn-ir-gas-movil { appearance: none; -webkit-appearance: none; border: none; background: transparent; padding: 0; margin: 0; cursor: pointer; display: block; line-height: 0; }
.panel-buckets.mv-b .btn-ir-gas-movil img { display: block; width: 44px; height: 29px; }
.panel-buckets.mv-b .nota-fuente-gasolina { font-size: 11px; color: #8a959c; text-align: left; margin-top: 8px; }
.mv-mejor-precio { display: inline-block; font: 800 10.5px 'Inter', sans-serif; background: #EAF5EC; color: #2E7D32; border-radius: 8px; padding: 2px 7px; vertical-align: 1px; white-space: nowrap; }

/* ── Etapa 18b: Farmacias (verde farmacia, con el texto de la cabecera oscuro) ── */
.panel-buckets.mv-b.mv-oscuro .cabecera-buckets { color: #06382a; }
.panel-buckets.mv-b.mv-oscuro .btn-cerrar-buckets { color: #06382a; }
.mv-farmacias { padding-top: 12px; }
.mv-guardia { border-radius: 14px; padding: 12px; background: #E7FAF2; border: 1.5px solid #12cb82; }
.mv-guardia-etq { font: 800 11px 'Inter', sans-serif; color: #0b7a4e; letter-spacing: .04em; text-transform: uppercase; }
.mv-guardia-nom { display: block; font: 800 17px 'Inter', sans-serif; color: #1b2a33; margin-top: 3px; }
.mv-guardia-lugar { font-size: 12.5px; color: #55646e; margin-top: 2px; line-height: 1.4; }
.mv-guardia-tel { display: flex; align-items: center; justify-content: center; margin-top: 10px; border-radius: 10px; background: #fff; border: 1.5px solid #d5dbe8;
    padding: 10px; font: 700 14px 'Inter', sans-serif; color: #1b2a33; text-decoration: none; }
.mv-guardia .mv-sec { margin-top: 10px; }
.mv-guardia-ir { display: flex; gap: 8px; }
.mv-guardia-ir button { flex: 1; border-radius: 10px; padding: 11px 4px; font: 700 14px 'Inter', sans-serif; background: #fff; border: 1.5px solid #d5dbe8; color: #1b2a33; cursor: pointer; }
.mv-guardia-ir button.v { background: #12cb82; border-color: #12cb82; color: #06382a; }
.mv-farm-lista { border-top: 0; }
.mv-farm-fila { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid #eef1f4; }
.mv-farm-fila:last-child { border-bottom: 0; }
.mv-farm-fila .n { flex: 1; min-width: 0; font: 600 13.5px 'Inter', sans-serif; color: #1b2a33; line-height: 1.3; }
.mv-farm-fila .n small { display: block; font-weight: 400; font-size: 11.5px; color: #8a959c; margin-top: 2px; }
.mv-farm-fila .acciones-resultado { display: flex; gap: 6px; flex: none; }
.mv-fuente { font-size: 11px; color: #8a959c; margin-top: 10px; line-height: 1.5; }

/* ── Etapa 18c: Estado del mar (cabecera arena #CBBD93, con el texto oscuro) ── */
#fondoFichaMar .ficha-mar.mv-mar { padding: 0; border-radius: 18px; display: flex; flex-direction: column; overflow: hidden; max-height: 85vh; font-family: 'Inter', sans-serif; color: #1b2a33; }
#fondoFichaMar .mv-mar .mv-cab { color: #3d3420; }
#fondoFichaMar .mv-mar .mv-cab h2.mv-tit { color: inherit; font-size: 17px; text-transform: none; letter-spacing: 0; margin: 2px 0 0; }
#fondoFichaMar .mv-mar .mv-etq { color: inherit; }
#fondoFichaMar .mv-mar > .mv-x { top: 12px; right: 12px; background: rgba(0,0,0,.12); color: #3d3420; box-shadow: none; font-size: 15px; }
#fondoFichaMar .mv-mar .mv-pest[hidden] { display: none; }
#fondoFichaMar .mv-mar .mv-cuerpo { padding: 12px 16px 14px; }
#fondoFichaMar .mv-mar .clima-nav { display: none; }   /* los días van en las pestañas */
#fondoFichaMar .mv-mar .mar-hero { border-radius: 14px; }
#fondoFichaMar .mv-mar .mar-datos { gap: 6px; margin: 12px 0; }
#fondoFichaMar .mv-mar .mar-datos .clima-hero-chip { background: #f5f7f9; color: #1b2a33; border-radius: 10px; }
#fondoFichaMar .mv-mar .mar-datos .clima-hero-chip svg { color: #0277bd; }
#fondoFichaMar .mv-mar .mar-chip-etiqueta { font-size: 10.5px; font-weight: 800; color: #6b7a85; opacity: 1; letter-spacing: .04em; }
#fondoFichaMar .mv-mar .mar-chip-valor { font-size: 14px; font-weight: 800; color: #1b2a33; }
#fondoFichaMar .mv-mar .mar-franjas .clima-hora[data-periodo] { cursor: pointer; }
#fondoFichaMar .mv-mar .clima-fuente { font-size: 11px; color: #8a959c; text-align: left; }
/* Etapa 18d: «Ver en el mapa», en el verde farmacia más oscuro */
.mv-ver-mapa { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 8px; border: none; border-radius: 10px;
    background: #0a8f5b; color: #fff; font: 700 14px 'Inter', sans-serif; padding: 11px 8px; cursor: pointer; }
.mv-ver-mapa:active { opacity: .85; }

/* ── Etapa 19: los dos pines oficiales de Viu Map ──
   Rojo = información (dónde está algo). Dorado = acción (llévame allí). Sobre fondo oscuro, el dorado lleva un
   contorno blanco fino, como la G de Google en los botones del registro. */
.viu-pin-info { width: .85em; height: 1.1em; object-fit: contain; vertical-align: -.18em; display: inline-block; }
.viu-pin-accion { height: 1.35em; width: auto; object-fit: contain; vertical-align: -.32em; display: inline-block; }
.viu-pin-borde { filter: drop-shadow(1px 0 0 #fff) drop-shadow(-1px 0 0 #fff) drop-shadow(0 1px 0 #fff) drop-shadow(0 -1px 0 #fff); }
#panelIncidencia.mv .incidencia-ubicacion-info::before { content: ''; display: inline-block; width: .85em; height: 1.1em; margin-right: 5px; vertical-align: -.18em;
    background: url('/images/viu-pin-ubicacion.webp') center / contain no-repeat; }
.bus-btn-cercana { display: flex; align-items: center; justify-content: center; gap: 6px; }

/* ── Etapa 20 (boceto 20b): Avisos, Mis favoritos y Mi Falla ── */
/* Los títulos de grupo, con su icono redondo y el número */
.mv-grupo { display: flex; align-items: center; gap: 7px; font: 800 11px 'Inter', sans-serif; color: #6b7a85; letter-spacing: .04em; text-transform: uppercase; margin: 14px 0 6px; }
.mv-avisos > .mv-grupo:first-child, .mv-favs > .mv-grupo:first-child { margin-top: 12px; }
.mv-grupo .r, .mv-grupo .icono-grupo-redondo { width: 22px; height: 22px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 1px #e1e6ec; display: grid; place-items: center; overflow: hidden; flex: none; font-size: 13px; }
.mv-grupo .r img, .mv-grupo .icono-grupo-redondo img { width: 16px !important; height: 16px !important; object-fit: contain; vertical-align: 0 !important; }
.mv-grupo .icono-grupo-redondo svg { width: 16px; height: 16px; }
.mv-grupo > img.icono-grupo-anuncios { width: 22px; height: 22px; object-fit: contain; flex: none; }
.mv-grupo em { margin-left: auto; font-style: normal; background: #eef0f3; border-radius: 8px; padding: 1px 7px; color: #55646e; letter-spacing: 0; }
.mv-vacio { font-size: 12.5px; color: #8a959c; padding: 4px 0 2px; line-height: 1.4; }
/* Avisos: cada uno en su tarjeta, con la franja del color de su nivel */
.mv-avisos .item-anuncio { background: #f7f8fa; border: none; border-left: 4px solid #F9C23C; border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; }
.mv-avisos .item-anuncio.naranja { border-left-color: #EF7D00; background: #fff8f1; }
.mv-avisos .item-anuncio.rojo { border-left-color: #C62828; background: #fff5f5; }
.mv-avisos .item-anuncio:last-child { border-bottom: none; }
.panel-buckets.mv-b.mv-oscuro.mv-b-avisos .cabecera-buckets, .panel-buckets.mv-b.mv-oscuro.mv-b-avisos .btn-cerrar-buckets { color: #3d2e00; }
.panel-buckets.mv-b.mv-b-avisos .mv-b-ic img { width: 70%; height: 70%; }
/* Mis favoritos: la estrella, más grande en el círculo (Jaime) */
.panel-buckets.mv-b.mv-b-grande .mv-b-ic img { width: 92% !important; height: 92% !important; vertical-align: 0 !important; }
.panel-buckets.mv-b.mv-b-grande .mv-b-ic { font-size: 30px; }
.mv-fav { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid #eef1f4; }
.mv-fav .n { flex: 1; min-width: 0; font: 600 13.5px 'Inter', sans-serif; color: #1b2a33; line-height: 1.3; }
.mv-fav .n small { display: flex; align-items: center; gap: 3px; font-weight: 400; font-size: 11.5px; color: #8a959c; margin-top: 2px; }
.mv-fav .n small span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mv-fav .n small .viu-pin-info { height: 12px; width: auto; flex: none; }
.mv-fav .acciones-item-favorito { display: flex; gap: 6px; flex: none; }
/* Mi Falla */
.mv-falla .mv-ic img[src*="viu-icono-falla"] { width: 78%; height: 78%; object-fit: contain; }
.mv-falla-foto:empty { display: none; }
.mv-falla-foto img { display: block; width: 100%; max-height: 220px; object-fit: cover; border-radius: 14px; }
.mv-falla-desc { font-size: 13.5px; color: #1b2a33; }
.mv-cuerpo .mv-falla-agenda { display: flex; align-items: center; justify-content: center; gap: 6px; }
.mv-cuerpo .mv-falla-agenda img { height: 1.35em; width: auto; }
.mv-falla-int { margin-top: 8px; }
.mv-cuerpo .mv-falla-ver { display: flex; align-items: center; justify-content: center; gap: 6px; margin-top: 6px; }
.mv-cuerpo .mv-falla-ver .viu-pin-accion { height: 1.35em; width: auto; }

/* ── Etapa 23 (boceto 23, opción B): los horarios del tren, cabecera #fa483b ── */
.ficha-horarios-renfe.mv-tren { max-width: 400px; }
@media (min-width: 720px) { .ficha-horarios-renfe.mv-tren { max-width: 440px; } }
.mv-tren .mv-cuerpo { overflow-y: auto; }
.mv-tren .tr-foto { display: block; width: 100%; height: 120px; object-fit: cover; border-radius: 14px; margin: 0; }
.mv-tren .tr-pest { padding: 0; margin: 12px 0 2px; }
.mv-tren .tr-pest button.on { background: #fa483b; color: #fff; }
.tr-prox { display: flex; align-items: center; gap: 12px; border-radius: 14px; padding: 10px 12px; background: #fff1f0; border: 1.5px solid #fa483b; margin-top: 8px; }
.tr-prox .tr-h { font: 800 26px 'Inter', sans-serif; color: #c62f24; letter-spacing: -.5px; flex: none; }
.tr-prox .tr-t { font-size: 12px; color: #55646e; line-height: 1.35; min-width: 0; }
.tr-prox .tr-t b { display: block; font-size: 13.5px; color: #1b2a33; }
.tr-prox .tr-lu { margin-left: auto; text-align: right; font-size: 11.5px; color: #55646e; flex: none; }
.tr-prox .tr-lu b { display: block; font-size: 15px; color: #1b2a33; }
.tr-rej { display: grid; grid-template-columns: repeat(6, 1fr); gap: 5px; margin-top: 8px; }
.tr-hora { text-align: center; border-radius: 9px; padding: 6px 0; font: 700 12.5px 'Inter', sans-serif; background: #fff; border: 1px solid #d5dbe2; color: #1b2a33; }
button.tr-hora { cursor: pointer; }
button.tr-hora:active { background: #fff1f0; border-color: #fa483b; }
.tr-hora.pas { background: #f1f3f5; border-color: #f1f3f5; color: #a3adb6; text-decoration: line-through; font-weight: 600; }
.tr-hora.pro { background: #fa483b; border-color: #fa483b; color: #fff; }
.tr-ley { display: flex; gap: 10px; flex-wrap: wrap; font-size: 11px; color: #6b7a85; margin-top: 8px; }
.tr-ley i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 4px; vertical-align: -1px; background: #fff; border: 1px solid #d5dbe2; }
.tr-ley i.pas { background: #f1f3f5; border-color: #f1f3f5; }
.tr-ley i.pro { background: #fa483b; border-color: #fa483b; }
.tr-pista { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #55646e; margin-top: 8px; line-height: 1.35; }
.tr-pista img { height: 15px; flex: none; }
.tr-desc { font-size: 12px; color: #6b7a85; line-height: 1.45; margin-top: 10px; }
/* Etapa 23b (Jaime): borde gris oscuro en las horas que ya salieron y en las pestañas sin marcar; menos alto el
   próximo tren y las horas, para que el modal quepa sin barra de desplazamiento */
.tr-hora.pas, .tr-ley i.pas { border: 1px solid #8a959c; }
.mv-tren .tr-pest button:not(.on) { box-shadow: inset 0 0 0 1px #8a959c; }
.tr-prox { padding: 6px 12px; margin-top: 6px; }
.tr-prox .tr-h { line-height: 1.1; }
.tr-hora { padding: 4px 0; }
.tr-rej { gap: 4px; margin-top: 6px; }
/* Etapa 23b (Jaime): la foto más baja, recortada por arriba (se queda la parte de abajo), con sus esquinas redondeadas */
.mv-tren .tr-foto { height: auto; aspect-ratio: 900 / 266; object-fit: cover; }   /* 23d: la foto ya viene recortada como la quiere Jaime */
.mv-tren .tr-fuente a { color: #fa483b; font-weight: 700; text-decoration: none; }   /* 23c: en el rojo del modal, sin subrayar */
.mv-tren .tr-pista { font-size: 9.5px; }

/* ══ Etapa 25 (4-nov-2026) · LA RESERVA DE RESTAURANTE en 3 pasos (bocetos 25, opción A de Jaime), en vino #7a2048 ══
   Los avisos van en vino claro: el amarillo, el naranja y el rojo son solo para las alertas. */
#fondoReserva .ficha-reserva.rsv { --c: #7a2048; --cl: #f7eaf0; --cm: #e9c9d7; padding: 0; border-radius: 18px; max-width: 380px; width: 100%;
    max-height: calc(100dvh - 32px); display: flex; flex-direction: column; overflow: hidden; font: 13.5px/1.45 'Inter', sans-serif; color: #1b2a33;
    box-shadow: 0 20px 50px rgba(0,0,0,.35); }
#fondoReserva .rsv .rsv-x { top: 12px; right: 12px; width: 30px; height: 30px; padding: 0; border-radius: 50%; background: rgba(255,255,255,.22); color: #fff;
    box-shadow: none; font-size: 15px; display: grid; place-items: center; }
#fondoReserva .rsv .mv-cab h3.mv-tit { color: #fff; text-align: left; margin: 2px 0 0; font: 800 17px/1.2 'Inter', sans-serif; }
#fondoReserva .rsv .mv-ic { background: #fff; }
.rsv-pasos { display: flex; gap: 6px; padding: 12px 16px 0; flex: none; }
.rsv-pasos[hidden] { display: none; }
.rsv-pasos > div { flex: 1; min-width: 0; }
.rsv-pasos i { display: block; height: 4px; border-radius: 2px; background: #e6e9ee; }
.rsv-pasos .on i, .rsv-pasos .ya i { background: var(--c); }
.rsv-pasos small { display: block; font: 700 11px 'Inter', sans-serif; color: #8a959c; margin-top: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rsv-pasos .on small { color: var(--c); } .rsv-pasos .ya small { color: #55646e; }
.rsv-cuerpo { padding: 12px 16px 14px; overflow-y: auto; min-height: 0; flex: 1 1 auto; -webkit-overflow-scrolling: touch; }
.rsv [hidden] { display: none !important; }
.rsv-sec { font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 6px; text-transform: uppercase; display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.rsv-paso > .rsv-sec:first-child { margin-top: 2px; }
.rsv-opc { font-weight: 700; text-transform: none; letter-spacing: 0; color: #8a959c; font-size: 11.5px; flex: none; }
.rsv-hint { font-size: 11.5px; color: #7a8790; margin-top: 4px; line-height: 1.35; }
.rsv-sec + .rsv-hint { margin: -2px 0 0; }
/* Los días */
.rsv-dias { display: flex; gap: 5px; }
.rsv-dia { flex: 1 1 0; min-width: 0; border-radius: 12px; background: #f5f7f9; text-align: center; padding: 6px 1px 7px; border: 1.5px solid transparent;
    font-family: 'Inter', sans-serif; color: #1b2a33; cursor: pointer; }
.rsv-dia small { display: block; font: 700 10.5px 'Inter', sans-serif; color: #6b7a85; text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rsv-dia b { display: block; font: 800 17px/1.15 'Inter', sans-serif; }
.rsv-dia em { display: block; font: 600 10px 'Inter', sans-serif; color: #8a959c; font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rsv-dia.on { background: var(--c); color: #fff; } .rsv-dia.on small, .rsv-dia.on em { color: rgba(255,255,255,.85); }
.rsv-dia.no { opacity: .45; } .rsv-dia.no em { font-size: 8.5px; letter-spacing: -.1px; text-overflow: clip; }
.rsv-dia.otra { display: grid; place-items: center; align-content: center; gap: 2px; color: var(--c); font: 700 9.5px/1.15 'Inter', sans-serif; border: 1.5px dashed var(--cm); background: #fff; }
.rsv-fecha-oculta { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; border: 0; padding: 0; }
/* Las personas */
.rsv-pers { display: flex; align-items: center; gap: 12px; background: #f5f7f9; border-radius: 12px; padding: 8px 10px; }
.rsv-pers button { width: 38px; height: 38px; border-radius: 50%; border: 1.5px solid var(--c); background: #fff; color: var(--c); font: 700 20px 'Inter', sans-serif; display: grid; place-items: center; padding: 0; cursor: pointer; flex: none; }
.rsv-pers button.mas { background: var(--c); color: #fff; }
.rsv-pers button:disabled { opacity: .35; cursor: default; }
.rsv-pers b { font: 800 22px 'Inter', sans-serif; min-width: 26px; text-align: center; }
.rsv-pers .t { flex: 1; font-size: 12.5px; color: #55646e; line-height: 1.3; min-width: 0; }
.rsv-pers .t strong { display: block; color: #1b2a33; font-size: 14px; }
/* Las horas */
.rsv-franja { font: 700 11.5px 'Inter', sans-serif; color: #55646e; margin: 8px 0 5px; display: flex; align-items: center; gap: 6px; }
.rsv-horas { display: grid; grid-template-columns: repeat(5, 1fr); gap: 5px; }
.rsv-hora { border-radius: 9px; background: #f5f7f9; text-align: center; padding: 8px 0; font: 700 13px 'Inter', sans-serif; color: #1b2a33; border: none; cursor: pointer; }
.rsv-hora.on { background: var(--c); color: #fff; }
.rsv-hora.no { color: #b8c0c6; text-decoration: line-through; background: #fafbfc; cursor: default; }
/* Duración, sitio y comentarios */
.rsv-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.rsv-chip { border-radius: 20px; background: #f5f7f9; padding: 7px 12px; font: 700 12.5px 'Inter', sans-serif; color: #1b2a33; border: 1.5px solid transparent; cursor: pointer; }
.rsv-chip.on { background: var(--cl); color: var(--c); border-color: var(--c); }
.rsv-chip.mas::before { content: '+ '; color: var(--c); }
.rsv-ops { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.rsv-op { border-radius: 12px; background: #f5f7f9; text-align: center; padding: 10px 4px 8px; font: 700 12px 'Inter', sans-serif; border: 1.5px solid transparent; color: #1b2a33; cursor: pointer; }
.rsv-op svg { display: block; margin: 0 auto 4px; } .rsv-op.on { background: var(--cl); border-color: var(--c); color: var(--c); }
.rsv-area { width: 100%; box-sizing: border-box; border: 1px solid #e1e6ec; border-radius: 10px; background: #f5f7f9; padding: 9px 12px; font: 13.5px/1.4 'Inter', sans-serif; color: #1b2a33; min-height: 64px; margin-top: 6px; resize: vertical; }
.rsv-area:focus, .rsv-in:focus { outline: none; border-color: var(--c); background: #fff; }
/* Tus datos */
.rsv-lab { font-size: 11px; font-weight: 800; color: #6b7a85; letter-spacing: .04em; margin: 12px 0 5px; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.rsv-lab .mv-est { text-transform: none; letter-spacing: 0; }
.rsv-in { width: 100%; height: 42px; border: 1px solid #e1e6ec; border-radius: 10px; background: #f5f7f9; padding: 0 12px; font: 15px 'Inter', sans-serif; color: #1b2a33; box-sizing: border-box; }
.rsv-in.campo-bloqueado-cuenta { background: #eceff2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='11' width='14' height='10' rx='2' fill='%2355646e'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3' fill='none' stroke='%2355646e' stroke-width='2'/%3E%3C/svg%3E") 10px center / 14px no-repeat !important;
    padding-left: 30px; color: #55646e !important; }
.rsv-tel { display: flex; gap: 8px; } .rsv-tel .rsv-in:first-child { flex: none; width: 72px; } .rsv-tel .rsv-in:last-child { flex: 1; min-width: 0; }
.rsv-res { background: var(--cl); border-radius: 12px; padding: 10px 12px; margin-top: 2px; }
.rsv-res .r1 { font: 800 14.5px/1.3 'Inter', sans-serif; color: var(--c); } .rsv-res .r2 { font-size: 12.5px; color: #55646e; margin-top: 2px; }
.rsv-legal { font-size: 11px; color: #8a959c; margin-top: 10px; line-height: 1.45; text-align: center; }
/* Los avisos */
.rsv-nota { border-radius: 10px; padding: 8px 10px; font-size: 12px; line-height: 1.4; margin-top: 8px; display: flex; gap: 8px; align-items: flex-start; background: #f5f7f9; color: #55646e; }
.rsv-nota.vino { background: var(--cl); color: #5a1736; } .rsv-nota svg { flex: none; margin-top: 1px; }
/* Los botones */
.rsv-pie { display: flex; gap: 8px; padding: 10px 16px 14px; border-top: 1px solid #eef1f4; background: #fff; flex: none; }
.rsv-btn { flex: 1; border: none; border-radius: 10px; background: var(--c); color: #fff; font: 700 14.5px 'Inter', sans-serif; padding: 12px 8px; display: flex; align-items: center; justify-content: center; gap: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,.15); cursor: pointer; }
.rsv-btn.rsv-btn2 { flex: 0 0 auto; background: #fff; color: #55646e; border: 1.5px solid #dfe4ea; box-shadow: none; padding: 11px 14px; }
.rsv-btn.enviando { opacity: .85; cursor: default; }
.rsv-spin { width: 16px; height: 16px; border-radius: 50%; border: 2.5px solid rgba(255,255,255,.4); border-top-color: #fff; animation: rsvGira .8s linear infinite; }
@keyframes rsvGira { to { transform: rotate(360deg); } }
.rsv-botones { display: flex; flex-direction: column; gap: 6px; margin-top: 16px; }
.rsv-botones .rsv-btn.rsv-btn2 { flex: 1; }
/* La entrada y la confirmación */
.rsv-cen { text-align: center; margin-top: 4px; } .rsv-cen h4 { font: 800 18px 'Inter', sans-serif; margin: 0 0 4px; } .rsv-cen p { margin: 0 auto; font-size: 13px; color: #55646e; max-width: 300px; }
.rsv-lin { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; font-size: 12.5px; color: #55646e; line-height: 1.4; }
.rsv-lin b { color: #1b2a33; }
.rsv-lin .num { width: 22px; height: 22px; border-radius: 50%; background: var(--cl); color: var(--c); font: 800 12px 'Inter', sans-serif; display: grid; place-items: center; flex: none; }
.rsv-ok { width: 64px; height: 64px; border-radius: 50%; background: #EAF5EC; display: grid; place-items: center; margin: 6px auto 8px; }
#reservaConfirmacion .rsv-res { margin-top: 14px; }
.rsv-bdg { display: inline-block; padding: 2px 9px; border-radius: 20px; font: 700 11px 'Inter', sans-serif; margin-bottom: 4px; background: #EEF2FB; color: #1C3F7A; }

/* Etapa 25: en Mi Agenda (reservas y citas), «Pendiente» en azul y «Cancelada» en gris; la propuesta de otra hora, en vino claro */
.badge-estado-mrc.pendiente { background: #EEF2FB; color: #1C3F7A; }
.badge-estado-mrc.pendiente.propuesta { background: #f7eaf0; color: #7a2048; }
.badge-estado-mrc.anulada { background: #eceff2; color: #55646e; }

/* ══ Etapa 26 (4-nov-2026) · «AGENDAR CITA» en 3 pasos (bocetos 26 de Jaime), en azul (Etapa 27: #4169E1, el que era de Mis favoritos) ══
   El mismo esquema que las reservas (.rsv-*), con su color. */
#fondoCitaPrevia .ficha-reserva.rsv { --c: #4169E1; --cl: #ecf0fc; --cm: #c3cff5; padding: 0; border-radius: 18px; max-width: 380px; width: 100%;
    max-height: calc(100dvh - 32px); display: flex; flex-direction: column; overflow: hidden; font: 13.5px/1.45 'Inter', sans-serif; color: #1b2a33;
    box-shadow: 0 20px 50px rgba(0,0,0,.35); }
#fondoCitaPrevia .rsv .rsv-x { top: 12px; right: 12px; width: 30px; height: 30px; padding: 0; border-radius: 50%; background: rgba(255,255,255,.22); color: #fff;
    box-shadow: none; font-size: 15px; display: grid; place-items: center; }
#fondoCitaPrevia .rsv .mv-cab h3.mv-tit { color: #fff; text-align: left; margin: 2px 0 0; font: 800 17px/1.2 'Inter', sans-serif; }
#fondoCitaPrevia .rsv .mv-ic { background: #fff; }
.cpv .rsv-nota.vino { color: #22398a; }
.cpv .rsv-area:focus, .cpv .rsv-in:focus { border-color: var(--c); }
.cpv-lista { display: grid; gap: 6px; }
.cpv-item { display: flex; align-items: center; gap: 10px; border-radius: 12px; background: #f5f7f9; padding: 11px 12px; border: 1.5px solid transparent;
    font: 14px/1.3 'Inter', sans-serif; color: #1b2a33; text-align: left; cursor: pointer; width: 100%; }
.cpv-item .n { flex: 1; min-width: 0; } .cpv-item .n small { display: block; font-size: 12px; color: #7a8790; }
.cpv-item .dur { display: flex; align-items: center; gap: 4px; font: 700 12px 'Inter', sans-serif; color: #55646e; flex: none; background: #fff; border-radius: 20px; padding: 3px 8px; }
.cpv-item .ck { width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid #c9d1d8; display: grid; place-items: center; flex: none; background: #fff; }
.cpv-item.on { background: var(--cl); border-color: var(--c); } .cpv-item.on .ck { background: var(--c); border-color: var(--c); }
.cpv-item.on .dur { color: var(--c); } .cpv-item.on .n { color: #22398a; font-weight: 700; }
.cpv-item .av { width: 34px; height: 34px; border-radius: 50%; background: #dfe6fa; color: #22398a; font: 800 12.5px 'Inter', sans-serif; display: grid; place-items: center; flex: none; }
.cpv-item .av.igual { background: #fff; border: 1.5px dashed var(--cm); }
.cpv-eleg { display: flex; justify-content: space-between; align-items: center; gap: 8px; background: #f5f7f9; border-radius: 10px; padding: 8px 10px; font-size: 12.5px; color: #55646e; }
.cpv-eleg:empty { display: none; }
.cpv-eleg b { color: #1b2a33; } .cpv-eleg button { border: none; background: none; font: 700 12.5px 'Inter', sans-serif; color: var(--c); flex: none; cursor: pointer; padding: 0; }
.cpv .rsv-dia em { font-size: 9px; }
.cpv .rsv-dia.lleno { opacity: .6; } .cpv .rsv-dia.lleno em { color: #22398a; font-weight: 700; }
.cpv .rsv-dia.on em { color: rgba(255,255,255,.85); }
/* El botón de las citas en la ficha y en la lista de resultados, y la raya de las citas en Mi Agenda (Etapa 27: #4169E1) */
.btn-reserva-sticky.btn-sticky-cita { background: #4169E1; }
.btn-reserva-sticky.btn-sticky-cita:hover, .btn-reserva-sticky.btn-sticky-cita:active { background: #3457c4; }
.btn-accion-resultado.btn-cita-resultado { background: #4169E1; }
.btn-accion-resultado.btn-cita-resultado:hover, .btn-accion-resultado.btn-cita-resultado:active { background: #3457c4; }
.cp-dia.mia-dia-citas { background: rgba(65,105,225,0.16); }
.cp-dia.mia-dia-citas.seleccionado { background: rgba(46,125,50,0.75); }

/* ══ Etapa 27 (4-nov-2026) · LOS COLORES, AJUSTADOS (Jaime) ══
   Mis favoritos en dorado #c9a227 (tono tierra, como Viu Coins y Mi Agenda), con el texto oscuro; Agendar cita en #4169E1;
   en Mi Agenda, cada cosa con el color de su modal (tren #fa483b, bus #14204A, falla #a63ae6, citas #4169E1). */
.cp-dia.mia-dia-tren { background: rgba(250,72,59,0.16); }
.cp-dia.mia-dia-bus { background: rgba(20,32,74,0.13); }
.cp-dia.mia-dia-falla { background: rgba(166,58,230,0.16); }
.cp-dia.mia-dia-tren.seleccionado, .cp-dia.mia-dia-bus.seleccionado, .cp-dia.mia-dia-falla.seleccionado { background: rgba(46,125,50,0.75); }
/* Mis Rutas Viu: el caminante de la cabecera, en movimiento (27c: sobre los emojis de Google Noto) */
.mv-ic .mrv-anim { width: 84%; height: 84%; display: block; }
/* Mis favoritos: el texto de la cabecera en dorado muy oscuro (el oscuro general de las farmacias es verdoso) */
.panel-buckets.mv-b.mv-oscuro.mv-b-favs .cabecera-buckets, .panel-buckets.mv-b.mv-oscuro.mv-b-favs .btn-cerrar-buckets { color: #3a2a00; }

/* ══ Etapa 28 (4-nov-2026) · LAS CORRECCIONES PEQUEÑAS (Jaime) ══ */
/* 1. Gasolineras: la fuente y la fecha de actualización, en dos líneas */
.panel-buckets.mv-b .nota-fuente-gasolina { line-height: 1.5; }
/* 2 y 3. Farmacias: «¿Cómo vas?» con los dibujos animados; cuándo abren las demás */
.mv-guardia-ir button { display: flex; align-items: center; justify-content: center; gap: 6px; }
.mv-guardia-ir button .mrv-anim { flex: none; }
.mv-farm-cerrada .n small b { font-weight: 700; color: #55646e; }
.mv-farm-habitual { font-size: 11.5px; color: #7a8790; margin-top: 8px; line-height: 1.4; }
#fondoModoIr .botones-modo-ir button span:first-child { display: grid; place-items: center; min-height: 46px; }
/* 4. Mis favoritos: los lugares, metidos bajo su categoría; los iconos de la categoría, más grandes dentro de su círculo */
.mv-favs .mv-fav, .mv-favs .mv-vacio { margin-left: 29px; }
.mv-favs .mv-grupo .r { font-size: 16px; }
.mv-favs .mv-grupo .r img { width: 19px !important; height: 19px !important; }
/* 5. Avisos: los avisos, metidos bajo su grupo; la fuente, una vez al pie del grupo, con su enlace */
.mv-av-lista { margin-left: 29px; }
.mv-av-fuente { font-size: 11px; color: #8a959c; margin: -2px 0 6px; line-height: 1.4; }
.mv-av-fuente a { font-weight: 700; text-decoration: none; color: #1C3F7A; }
.mv-av-fuente-tren a { color: #fa483b; }
.mv-av-fuente-transporte a { color: #14204A; }
/* 6. Tren: los que salen más tarde, en el rosa del próximo tren, con letras y borde rojos */
.tr-hora:not(.pas):not(.pro) { background: #fff1f0; border-color: #fa483b; color: #c62f24; }
.tr-ley i:not(.pas):not(.pro) { background: #fff1f0; border-color: #fa483b; }
/* 7. Agenda de actos de una Falla: en el morado de Mi Falla */
.mv-falla-agenda .mv-ic img { width: 78%; height: 78%; object-fit: contain; }
.mv-falla-agenda .agenda-dia:hover:not(:disabled), .mv-falla-agenda .agenda-dia:active:not(:disabled) { background: #f3e6fc; }
.mv-falla-agenda .agenda-dia.seleccionado { background: #a63ae6; color: #fff; }
.mv-falla-agenda .agenda-dia.hoy { box-shadow: inset 0 0 0 2px #a63ae6; }
.mv-falla-agenda .agenda-dia.hoy.seleccionado { box-shadow: inset 0 0 0 2px #fff; }
.mv-falla-agenda .agenda-dia .punto-evento-dia { background: #a63ae6; }
.mv-falla-agenda .agenda-dia.seleccionado .punto-evento-dia { background: #fff; }
.mv-falla-agenda .agenda-falla-fecha { margin-top: 4px; }
.mv-falla-agenda .tarjeta-acto-agenda { background: #f5f7f9; border-radius: 8px; border-left: 4px solid #a63ae6; }
.mv-falla-agenda .hora-acto-agenda { color: #7b22b4; }
/* 8. Incidencias: el aviso del 112, con la letra algo más pequeña */
.incidencia-aviso-112 { font-size: 11.5px !important; line-height: 1.4 !important; }
/* 10. Reservas: «Comida» y «Cena», desplegables */
.rsv-franja.rsv-desp { width: 100%; border: none; background: #f5f7f9; border-radius: 10px; padding: 10px 12px; margin: 6px 0 0; cursor: pointer; text-align: left;
    display: flex; align-items: center; gap: 6px; font: 700 12.5px 'Inter', sans-serif; color: #1b2a33; }
.rsv-franja.rsv-desp span { flex: 1; min-width: 0; }
.rsv-franja.rsv-desp em { font-style: normal; font-weight: 700; font-size: 11.5px; color: var(--c); background: #fff; border-radius: 20px; padding: 2px 8px; flex: none; }
.rsv-franja.rsv-desp .rsv-flecha { width: 8px; height: 8px; border-right: 2px solid #8a959c; border-bottom: 2px solid #8a959c; transform: rotate(45deg); margin: -3px 2px 0 4px; flex: none; }
.rsv-franja.rsv-desp.abierto { background: var(--cl); }
.rsv-franja.rsv-desp.abierto .rsv-flecha { transform: rotate(-135deg); margin-top: 3px; }
.rsv-franja.rsv-desp.vacio { opacity: .55; cursor: default; }
.rsv-franja.rsv-desp + .rsv-horas { margin-top: 6px; }

/* Etapa 28b (Jaime): los iconos de las categorías de los avisos, más grandes dentro de su círculo, como en favoritos;
   y el horario habitual de las farmacias en dos líneas */
.mv-avisos .mv-grupo .icono-grupo-redondo img { width: 19px !important; height: 19px !important; }
.mv-avisos .mv-grupo .icono-grupo-redondo svg { width: 19px; height: 19px; }
.mv-farm-habitual { white-space: pre-line; }