/*
 * Tablet / foldable / phone fixes (iPad mini 768x1024 + 1024x768, Surface Duo 540x720, iPhone 375-430).
 * Loaded last from template/style_global.php so it applies to every page that uses the shared head.
 */

/* Bootstrap 3 .container has a fixed width (750px at >=768px). A .container nested inside
   a padded column is wider than its parent and pushes the page sideways, which on iOS also
   zooms the layout viewport out and pushes the fixed bottom bar off-screen
   (e.g. tour detail "เงื่อนไขการจองทัวร์" tabs on iPad mini portrait). */
@media (max-width: 1199px) {
    .container .container {
        width: auto;
        max-width: 100%;
    }
}

/* Tour detail "related tours" slider arrows use right/left:-5% at <=991px, which pokes
   36px past the screen edge on iPad mini portrait / Surface Duo landscape. Keep them inside the slider. */
@media (max-width: 991px) {
    .swiper-container .material-symbols-outlined.bt-next-related {
        right: 4px;
    }

    .swiper-container .material-symbols-outlined.bt-prev-related {
        left: 4px;
    }
}