/* =========================================
   1. Import Fonts (Anuphan ตามที่มึงขอ)
   ========================================= */
@import url('https://fonts.googleapis.com/css2?family=Anuphan:wght@300;400;500;600;700&display=swap');

/* =========================================
   2. Base Styles (พื้นฐาน)
   ========================================= */
html {
    scroll-behavior: smooth; /* เลื่อนหน้าเว็บแบบนุ่มๆ ไม่กระชาก */
}

body {
    font-family: 'Anuphan', sans-serif;
    /* ทำให้ตัวหนังสือคมกริบ ไม่แตก (สำคัญมากในจอ Retina) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden; /* กันเว็บเลื่อนซ้ายขวาโดยไม่ตั้งใจ */
}

/* =========================================
   3. Glassmorphism (กระจกวิเศษ)
   ========================================= */
.glass {
    /* พื้นหลังขาวโปร่งแสง */
    background: rgba(255, 255, 255, 0.75);
    
    /* ความเบลอ (เพิ่มจาก 10 เป็น 12 ให้ดูนวลขึ้น) */
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    
    /* 🔥 ทีเด็ด: ต้องมีขอบขาวจางๆ เพื่อตัดขอบให้ดูมีมิติ */
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    
    /* 🔥 ทีเด็ด 2: เงาฟุ้งๆ ด้านล่าง ให้มันดูลอยออกมา */
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.05);
}

/* =========================================
   4. Custom Scrollbar (เลิกใช้แท่งเทาๆ เดิมๆ)
   ========================================= */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #f3f4f6; /* สีพื้นหลังรางเลื่อน */
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1; /* สีตัวเลื่อน */
    border-radius: 10px; /* มนๆ */
    border: 2px solid #f3f4f6; /* ขอบขาวตัด ให้ดูไม่อึดอัด */
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8; /* สีตอนเอาเมาส์ชี้ */
}

/* =========================================
   5. Selection (เวลาลูกค้าลากคลุมข้อความ)
   ========================================= */
::selection {
    background: #2563EB; /* สีธีม (Blue) */
    color: #ffffff;
}