/* bg_override.css — ฉากหลังแบบไล่เฉดโทนกลางคืน (น้ำเงินเข้ม + แสงอุ่นจางๆ ด้านล่าง) สร้างเองทั้งหมด
   ไม่ใช้ภาพถ่าย จึงไม่มีปัญหาลิขสิทธิ์ · โหลดต่อจาก style.css เพื่อแทนที่รูปเดิม
   ปรับโทนได้ที่ตัวแปรชุดนี้ (สว่างขึ้น/มืดลง) */
:root {
  --bgx-top:    #061630;   /* บนสุด น้ำเงินเกือบดำ */
  --bgx-mid:    #0b3170;   /* กลาง น้ำเงินเข้ม */
  --bgx-low:    #1a56a8;   /* ล่าง น้ำเงินสว่างขึ้น */
  --bgx-glow1:  rgba(255,140,70,.30);   /* แสงอุ่นสีส้ม (คล้ายแสงไฟเมือง) */
  --bgx-glow2:  rgba(230,60,110,.22);   /* แสงอุ่นสีชมพูแดง */
  --bgx-teal:   rgba(40,190,170,.18);   /* แสงเขียวอมฟ้า */
}

.bg-banner, .bg-banner-1, .bg-login, .bg-register, .bg-dashboard {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
}

/* หน้าในระบบสมาชิก ทุกหน้าที่ใช้ bg-dashboard (ไม่มีลายคลื่น เพราะหน้ายาว) — อยู่กับที่เมื่อเลื่อน */
.bg-dashboard {
  background-image:
    radial-gradient(ellipse at 15% 100%, var(--bgx-glow1), transparent 50%),
    radial-gradient(ellipse at 88% 100%, var(--bgx-glow2), transparent 48%),
    radial-gradient(ellipse at 70% 0%, var(--bgx-teal), transparent 45%),
    linear-gradient(180deg, var(--bgx-top) 0%, var(--bgx-mid) 50%, var(--bgx-low) 100%) !important;
  background-attachment: fixed !important;
}

/* หน้าแรก / Login / Register / กล่องใส่รหัส — โทนเดียวกัน มีลายคลื่นจางๆ ด้านล่าง */
.bg-banner, .bg-banner-1, .bg-login, .bg-register {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='0.06' d='M0,224L60,208C120,192,240,160,360,165.3C480,171,600,213,720,218.7C840,224,960,192,1080,170.7C1200,149,1320,139,1380,133.3L1440,128L1440,320L0,320Z'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='0.04' d='M0,96L80,112C160,128,320,160,480,176C640,192,800,192,960,170.7C1120,149,1280,107,1360,85.3L1440,64L1440,320L0,320Z'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 15% 100%, var(--bgx-glow1), transparent 50%),
    radial-gradient(ellipse at 88% 100%, var(--bgx-glow2), transparent 48%),
    radial-gradient(ellipse at 70% 0%, var(--bgx-teal), transparent 45%),
    linear-gradient(180deg, var(--bgx-top) 0%, var(--bgx-mid) 55%, var(--bgx-low) 100%) !important;
  background-size: 100% 45%, 100% 55%, auto, auto, auto, auto !important;
  background-position: bottom, bottom, center, center, center, center !important;
}
/* สไลด์ที่ 2 ของหน้าแรก ให้ต่างจากสไลด์แรกเล็กน้อย (เขียวอมฟ้าขึ้น) */
.bg-banner-1 {
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 320' preserveAspectRatio='none'%3E%3Cpath fill='%23ffffff' fill-opacity='0.06' d='M0,160L80,176C160,192,320,224,480,213.3C640,203,800,149,960,133.3C1120,117,1280,139,1360,149.3L1440,160L1440,320L0,320Z'/%3E%3C/svg%3E"),
    radial-gradient(ellipse at 80% 100%, var(--bgx-glow1), transparent 50%),
    radial-gradient(ellipse at 10% 100%, var(--bgx-teal), transparent 50%),
    radial-gradient(ellipse at 30% 0%, rgba(60,130,230,.25), transparent 45%),
    linear-gradient(180deg, #05263a 0%, #0a4a72 55%, #136a96 100%) !important;
  background-size: 100% 50%, auto, auto, auto, auto !important;
  background-position: bottom, center, center, center, center !important;
}

/* กล่อง "ใส่รหัสเพื่อเข้าเว็บ" (SweetAlert) */
html body .swal2-container.swal2-container,
html body .swal2-container.swal2-backdrop-show,
html body .swal2-container.swal2-noanimation {
  background:
    radial-gradient(ellipse at 15% 100%, var(--bgx-glow1), transparent 50%),
    radial-gradient(ellipse at 88% 100%, var(--bgx-glow2), transparent 48%),
    linear-gradient(180deg, var(--bgx-top) 0%, var(--bgx-mid) 55%, var(--bgx-low) 100%) !important;
}

/* ===== จอใหญ่: ขยายการ์ด/ปุ่ม/กล่องรหัสให้ใหญ่ขึ้น (จอเล็ก/มือถือไม่เปลี่ยน) =====
   ปรับขนาดได้ที่ตัวเลข zoom (1.25 = ใหญ่ขึ้น 25%) */
@media (min-width: 1200px) {
  .bg-login .card, .bg-register .card { zoom: 1.25; }
  .banner-content { zoom: 1.2; }
  html body .swal2-popup:has(.swal2-input[type="password"]) { zoom: 1.25; }
}
@media (min-width: 1600px) {
  .bg-login .card, .bg-register .card { zoom: 1.5; }
  .banner-content { zoom: 1.45; }
  html body .swal2-popup:has(.swal2-input[type="password"]) { zoom: 1.5; }
}

/* กรอบกว้างขึ้นตามที่ขยาย (zoom ทำให้เนื้อหาใหญ่ขึ้น แต่กรอบเดิมกว้างเท่าเดิม จึงแคบ) */
@media (min-width: 1200px) {
  .bg-login .flex-form > div    { max-width: 525px !important; }   /* เดิม 420 x 1.25 */
  .bg-register .flex-form > div { max-width: 850px !important; }   /* เดิม 680 x 1.25 */
}
@media (min-width: 1600px) {
  .bg-login .flex-form > div    { max-width: 630px !important; }   /* เดิม 420 x 1.5 */
  .bg-register .flex-form > div { max-width: 1020px !important; }  /* เดิม 680 x 1.5 */
}
