/*** Responsive fixes (มือถือ / แท็บเล็ต / จอใหญ่) ***/

/* กันหน้าเว็บเลื่อนแนวนอนจาก element ที่กว้าง 100vw (เช่น carousel ด้านบน)
   ใช้ clip แทน hidden เพื่อไม่ให้ position: sticky ของ navbar เสีย */
html,
body {
    overflow-x: hidden;
}

@supports (overflow-x: clip) {
    html,
    body {
        overflow-x: clip;
    }
}

/* เนื้อหาจากระบบหลังบ้าน (HTML จาก editor): รูป ตาราง วิดีโอ ไม่ให้ล้นจอ */
.history-content,
.affiliated-content,
.committee-content,
.strategic-content,
.structure-content,
.building-content,
.executive-content,
.blog-detail-content,
.knowledge-detail-content {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.history-content img,
.affiliated-content img,
.committee-content img,
.strategic-content img,
.structure-content img,
.building-content img,
.executive-content img,
.blog-detail-content img,
.knowledge-detail-content img {
    max-width: 100% !important;
    height: auto !important;
}

.history-content iframe,
.affiliated-content iframe,
.committee-content iframe,
.strategic-content iframe,
.building-content iframe,
.executive-content iframe,
.blog-detail-content iframe,
.knowledge-detail-content iframe,
.history-content video,
.blog-detail-content video,
.knowledge-detail-content video {
    max-width: 100% !important;
}

.history-content table,
.affiliated-content table,
.committee-content table,
.strategic-content table,
.structure-content table,
.building-content table,
.executive-content table,
.blog-detail-content table,
.knowledge-detail-content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ลิงก์อีเมล/URL ยาวๆ ให้ตัดบรรทัดได้ ไม่ล้นกล่อง */
a[href^="mailto:"],
.contact a {
    overflow-wrap: anywhere;
    word-break: break-word;
}

/* โลโก้หน่วยงานที่เกี่ยวข้อง: ย่อตามช่องของ slider แทนการล็อก 125px */
.customer-logos .slide img {
    display: block;
    width: 100% !important;
    max-width: 125px;
    height: auto !important;
    aspect-ratio: 1 / 1;
    object-fit: contain;
    margin: 0 auto;
}

/* กล่อง Facebook ให้กว้างไม่เกินคอลัมน์ */
iframe[src*="facebook.com/plugins"] {
    max-width: 100%;
}

/* จอ 992–1199px (แท็บเล็ตแนวนอน / โน้ตบุ๊กเล็ก): เมนู 8 รายการเบียดจนคำตัดบรรทัดและโลโก้หด */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .navbar.navbar-light {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .navbar-light .navbar-brand {
        flex-shrink: 0;
        margin-right: 12px;
    }

    .navbar-light .navbar-brand img {
        max-width: 190px;
    }

    .navbar-light .navbar-nav .nav-link {
        margin-right: 12px;
        font-size: 14.5px;
        white-space: nowrap;
    }

    .navbar .dropdown-toggle::after {
        margin-left: 4px;
    }
}

/* แท็บเล็ตลงไป */
@media (max-width: 991.98px) {
    .navbar .navbar-collapse {
        max-height: calc(100vh - 90px);
        overflow-y: auto;
    }
}

/* มือถือ */
@media (max-width: 575.98px) {
    /* style.css ตั้ง margin 20px ซ้าย-ขวา ทำให้โลโก้เหลือเล็กมากบนจอแคบ */
    .customer-logos .slick-slide {
        margin: 0 8px;
    }

    /* ภาษาไทยไม่มีช่องว่างระหว่างคำ การจัดชิดขอบสองด้านทำให้ช่องว่างห่างมากบนจอแคบ */
    .blog .blog-item .blog-centent p,
    .blog .blog-item .blog-centent .span-text,
    .blog .blog-item .blog-centent .icon-text,
    .history-content [style*="justify"],
    .affiliated-content [style*="justify"],
    .committee-content [style*="justify"],
    .strategic-content [style*="justify"],
    .building-content [style*="justify"],
    .executive-content [style*="justify"],
    .blog-detail-content [style*="justify"],
    .knowledge-detail-content [style*="justify"] {
        text-align: left !important;
    }

    .container-fluid.py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .back-to-top {
        right: 16px;
        bottom: 16px;
    }
}