/* หน้าติดต่อเรา
   ย้ายมาจาก <style> ที่เคยฝังอยู่ใน resources/views/th/page/contact.blade.php */

/* หน้า "ติดต่อเรา" - สไตล์โมเดิร์น
           Scoped to .contact-modern; palette #062452 / #0a4091 / #17396c / #f5f8fc */
        .contact-page.contact-modern {
            background: #f5f8fc;
            padding: 56px 0 72px;
        }

        /* ---- การ์ดข้อมูลติดต่อ ---- */
        .contact-page.contact-modern .contact-page__left {
            background: #ffffff;
            border: 1px solid rgba(23, 57, 108, .10);
            border-radius: 18px;
            box-shadow: 0 14px 34px -24px rgba(6, 36, 82, .40);
            max-width: 100%;
            height: 100%;
            padding: 28px 26px 22px;
        }

        .contact-page.contact-modern .contact-page__left .sec-title {
            margin-bottom: 18px;
            padding-bottom: 14px;
            position: relative;
        }

        .contact-page.contact-modern .contact-page__left .sec-title__title {
            color: #17396c;
            font-family: 'promptsemibold';
            font-size: 26px;
            line-height: 1.4;
        }

        /* ---- รายการข้อมูล + ไอคอนวงกลม ---- */
        .contact-page.contact-modern .contact_address,
        .contact-page.contact-modern .contact_social {
            font-size: 16px;
            margin: 0;
            padding: 0;
        }

        .contact-page.contact-modern .contact_address li,
        .contact-page.contact-modern .contact_social li {
            align-items: flex-start;
            color: #4a5a72;
            display: flex;
            line-height: 1.75;
            margin: 0;
            padding-bottom: 14px;
        }

        .contact-page.contact-modern .contact_address li > i,
        .contact-page.contact-modern .contact_social li > i {
            align-items: center;
            background: #f1f5f9;
            border-radius: 50%;
            color: #0a4091;
            display: flex;
            flex: 0 0 34px;
            font-size: 14px !important;
            height: 34px;
            justify-content: center;
            margin-right: 12px;
            margin-top: 2px;
            padding-top: 0;
            width: 34px;
        }

        .contact-page.contact-modern .contact_address li span,
        .contact-page.contact-modern .contact_social li span {
            flex: 1;
        }

        .contact-page.contact-modern .contact_social li a {
            color: #17396c;
            transition: color .3s ease;
        }

        .contact-page.contact-modern .contact_social li a:hover {
            color: #0a4091;
        }

        /* ---- เวลาทำการ ---- */
        .contact-page.contact-modern .contact-hours {
            border-top: 1px solid rgba(23, 57, 108, .10);
            margin-top: 6px;
            padding-top: 16px;
        }

        .contact-page.contact-modern .contact-hours__label {
            color: #6b7c96;
            display: block;
            font-family: 'promptregular';
            font-size: 13px;
            letter-spacing: .4px;
            margin-bottom: 8px;
        }

        /* ---- การ์ดฟอร์ม ---- */
        .contact-page.contact-modern .contact-page__right {
            background: #ffffff;
            border: 1px solid rgba(23, 57, 108, .10);
            border-radius: 18px;
            box-shadow: 0 14px 34px -24px rgba(6, 36, 82, .40);
            padding: 28px 26px 20px;
            height: 100%;
        }

        .contact-page.contact-modern .comment-form__input-box input[type="text"],
        .contact-page.contact-modern .comment-form__input-box input[type="email"] {
            background: #ffffff;
            border: 1px solid rgba(23, 57, 108, .16);
            border-radius: 12px;
            color: #17396c;
            font-size: 16px;
            height: 54px;
            margin-bottom: 16px;
            padding: 0 18px;
            transition: border-color .25s ease, box-shadow .25s ease;
        }

        .contact-page.contact-modern .comment-form__input-box textarea {
            background: #ffffff;
            border: 1px solid rgba(23, 57, 108, .16);
            border-radius: 12px;
            color: #17396c;
            font-size: 16px;
            height: 170px;
            margin-bottom: 16px;
            padding: 14px 18px;
            transition: border-color .25s ease, box-shadow .25s ease;
        }

        .contact-page.contact-modern .comment-form__input-box input:focus,
        .contact-page.contact-modern .comment-form__input-box textarea:focus {
            border-color: #0a4091;
            box-shadow: 0 0 0 3px rgba(10, 64, 145, .12);
        }

        .contact-page.contact-modern .comment-form__input-box input::placeholder,
        .contact-page.contact-modern .comment-form__input-box textarea::placeholder {
            color: #9aa8bd;
        }

        /* ---- Cloudflare Turnstile (รหัสยืนยัน) ---- */
        .contact-page.contact-modern .contact-turnstile {
            margin-bottom: 16px;
            min-height: 65px;
        }

        .contact-page.contact-modern .contact-turnstile iframe {
            max-width: 100%;
        }

        /* ---- ปุ่มส่ง ---- */
        .contact-page.contact-modern .comment-form__btn {
            font-family: 'promptregular';
            margin-top: 4px;
            padding: 13px 40px;
        }

        /* ---- แผนที่ ---- */
        .contact-page-google-map.contact-map-modern .contact-page-google-map__one {
            display: block;
            height: 460px;
        }

        @media (max-width: 991px) {
            .contact-page.contact-modern .contact-page__right {
                margin-top: 24px;
            }
        }

        @media (max-width: 767px) {
            .contact-page.contact-modern {
                padding: 36px 0 52px;
            }

            .contact-page.contact-modern .contact-page__left,
            .contact-page.contact-modern .contact-page__right {
                padding: 22px 18px 18px;
            }

            .contact-page.contact-modern .contact-page__left .sec-title__title {
                font-size: 22px;
            }

            .contact-page-google-map.contact-map-modern .contact-page-google-map__one {
                height: 340px;
            }
        }
