/* Arreglos de pantalla del QA para Play Store (2026-10-18). Archivo aparte para no chocar con otros cambios en app.css. */

/* Verificaciones (y demás páginas de staff): las tarjetas de números se salían a 360-390 px. */
@media (max-width: 640px) {
    .ops-page-hero { flex-wrap: wrap; }
    .ops-page-hero-text { flex: 1 1 100%; min-width: 0; }
    .ops-page-hero-extra { flex: 1 1 100%; min-width: 0; }
    .ops-page-hero-extra .ops-kpi-row {
        max-width: none;
        /* Ancho mínimo para que «CONDUCTORES» quepa entero; si no caben 4, bajan a otra fila. */
        grid-template-columns: repeat(auto-fit, minmax(5.4rem, 1fr));
    }
    .ops-kpi { min-width: 0; padding-left: 0.3rem; padding-right: 0.3rem; }
    /* Nunca partir una palabra («PENDIENTE·S», «CONDUCTO·RES»): solo se baja de línea entre palabras. */
    .ops-kpi-label {
        overflow-wrap: normal;
        word-break: keep-all;
        hyphens: none;
        letter-spacing: 0.02em;
        max-width: 100%;
    }
}

/* Casa / Trabajo / Pulpería / Guardar / Promo: en teléfonos angostos bajan de línea en vez de cortarse. */
@media (max-width: 420px) {
    #favorites-bar.trip-favorites-bar {
        flex-wrap: wrap;
        overflow-x: visible;
        row-gap: 0.4rem;
    }
}

/* Origen: el texto (p. ej. «Punto de carga…» en Flete) no debe quedar debajo de los botones GPS y pin. */
.trip-origin-wrap gmp-place-autocomplete::part(input),
.trip-origin-wrap gmp-basic-place-autocomplete::part(input) {
    padding-inline-end: 6.25rem;
    text-overflow: ellipsis;
}
.trip-dest-wrap gmp-place-autocomplete::part(input),
.trip-dest-wrap gmp-basic-place-autocomplete::part(input) {
    padding-inline-end: 3.25rem;
    text-overflow: ellipsis;
}

/* Menú por rol: la insignia (SUPERVISOR, CONDUCTOR…) queda a la izquierda del botón ⋮ del encabezado. */
#header-more-menu.rm-host .rm-head {
    padding-right: 44px;
    flex-wrap: wrap;
    gap: 6px;
}
@media (max-width: 380px) {
    #header-more-menu.rm-host .rm-role { font-size: 10.5px; letter-spacing: 0.4px; padding: 4px 8px; gap: 5px; }
    #header-more-menu.rm-host .rm-logo { gap: 7px; }
    #header-more-menu.rm-host .rm-logo small { font-size: 9.5px; }
}

/* La píldora «promo activa» salía vacía (amarilla) para todos: app.css le ponía display después de .hidden. */
.passenger-promo-chip.hidden,
.passenger-promo-chip:empty { display: none !important; }

/* Aviso «Pantalla de inicio»: antes iba DENTRO del panel inferior y le quitaba ~40 px (tapaba el destino la primera vez).
   Ahora flota sobre el mapa, debajo del selector de ciudad, y queda por debajo del panel (z-index 100) si este se agranda. */
#ios-install-banner.hr-install-float {
    position: absolute;
    top: calc(3.6rem + var(--safe-top, 0px));
    left: 0.75rem;
    right: 0.75rem;
    max-width: 26rem;
    z-index: 40;
    border-radius: 0.9rem;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.25);
}
#ios-install-banner.hr-install-float.hidden { display: none; }
body.is-searching #ios-install-banner.hr-install-float { display: none; }
/* No tapar avisos del viaje que usan la misma franja del mapa (oferta para el conductor, llegada estimada). */
main.app-shell:has(#driver-offer-map-hint:not(.hidden)) > #ios-install-banner,
main.app-shell:has(#eta-indicator:not(.hidden)) > #ios-install-banner { display: none; }

/* Login: enlaces a Privacidad / Términos / Eliminar cuenta visibles sin sesión. */
.login-legal-links { row-gap: 0.25rem; }
.login-legal-links a { text-underline-offset: 2px; min-height: 1.75rem; display: inline-flex; align-items: center; }
