/**
 * sign-in.css — หน้าเข้าสู่ระบบ (/sign-in) เฉพาะส่วนที่ต่างจากหน้าสมาชิกแบบการ์ดอื่น
 *
 * การ์ด แท็บเลือกวิธี ช่องกรอก ปุ่ม อยู่ใน account-form.css (.auth-page) ชุดเดียวกับ /sign-up · /forgot
 * ไฟล์นี้: เส้น "หรือ" + ปุ่ม Google/Facebook (ดีไซน์ใหม่ เซสชัน 43)
 */

.sign-in-page {

    .container {

        .auth-card {

            .auth-form {

                /* เส้นคั่น "หรือ" — ข้อความกลาง เส้นจางสองข้าง */
                .auth-divider {
                    display: flex;
                    align-items: center;
                    gap: 12px;
                    color: var(--auth-faint);
                    font-size: 13px;

                    &::before,
                    &::after {
                        content: "";
                        flex: 1 1 auto;
                        height: 1px;
                        background-color: var(--auth-line);
                    }
                }

                .social-buttons {
                    display: flex;
                    flex-direction: column;
                    gap: 10px;

                    .social-button {
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        gap: 10px;
                        width: 100%;
                        min-height: 48px;
                        padding: 10px 16px;
                        border: 1px solid var(--auth-border);
                        border-radius: var(--auth-radius);
                        background-color: #ffffff;
                        color: var(--auth-text);
                        font-size: 15px;
                        font-weight: 600;
                        cursor: pointer;
                        transition: background-color 0.15s, border-color 0.15s;

                        img {
                            width: 20px;
                            height: 20px;
                        }

                        &:hover {
                            background-color: #f9fafb;
                            border-color: var(--auth-faint);
                        }
                    }
                }
            }
        }
    }
}