/* =============================================================================
   มาตรฐานระยะขอบซ้าย–ขวา (frontend-v2) — ใช้ทุกหน้าเนื้อหาภายใน
   อ้างอิง: contact-page, order-delivery-page
   วิธีใช้: ใส่ class fv2-page-gutter ที่ wrapper หน้า แล้วใช้ container custom ภายใน
   ============================================================================= */

:root {
    --fv2-page-gutter: clamp(1rem, 4.5vw, 1.25rem);
}

@media (max-width: 991.98px) {
    :root {
        --fv2-page-gutter: 1.25rem; /* 20px */
    }
}

@media (max-width: 399.98px) {
    :root {
        --fv2-page-gutter: 1rem; /* 16px — จอเล็กมาก */
    }
}

.fv2-page-gutter {
    overflow-x: clip;
}

.fv2-page-gutter .container.custom {
    box-sizing: border-box;
}

/* Tablet / mobile — ไม่ให้เนื้อหาชิดขอบจอ */
@media (max-width: 1199.98px) {
    .fv2-page-gutter .container.custom {
        padding-left: max(var(--fv2-page-gutter), env(safe-area-inset-left, 0px));
        padding-right: max(var(--fv2-page-gutter), env(safe-area-inset-right, 0px));
    }
}
