/* Mobile polish: fixes found when reviewing the live site at 390px. Loaded last so it wins over page CSS. */

/* Hamburger icon: the 3-gradient shorthand only applied no-repeat to the last layer, so the other two bars
   tiled into a solid black block. */
.navbar-toggler-icon {
    background-repeat: no-repeat;
}

/* Car rental results: `.car-results{padding:2rem 0 4rem}` (car.css) wiped the .container side padding, so the
   result count and cards touched the screen edges on phones. Restore the container's 24px gutter. */
.container.car-results {
    padding: 2rem 24px 4rem;
}

/* Home ferry cards show the operator logo: show it whole instead of cropping it. */
.home-ferry-card .home-service-image {
    background: #fff;
}

.home-ferry-card .home-service-image > img {
    object-fit: contain;
    padding: 14px;
}

/* Promo hero: the "TRIPCETERA" eyebrow was brand-orange on an orange gradient. */
.promo-hero .eyebrow {
    color: #ffe7dd;
}

/* Login/register card: the reCAPTCHA (304px) plus the card padding was wider than a 390px screen, which made the
   whole page scroll sideways. */
@media (max-width: 420px) {
    .account-page {
        padding-left: 16px;
        padding-right: 16px;
    }

    .account-card {
        padding: 28px 18px;
    }
}

/* Hotel search page with no hotels (no destination yet, or none available): do not show an empty world map. */
.hotel-results-page .hotel-availability-map-card.is-empty-search {
    display: none;
}

/* Homes and Etcetera search forms sit on a photo: the light labels (Check-in, Rooms, Adults...) were hard to read
   on bright images. A soft shadow keeps them legible without changing the design. */
.homes-search-form label,
.etc-search-form label {
    text-shadow: 0 1px 3px rgba(0, 0, 0, .65);
}
