/* ================================================================
   FOREST PAGE THEME — พื้นหลังป่ากลางคืนชุดเดียวกับ popup
   สำคัญ: ไม่แตะ #loadingScreen เพื่อคงรูปและแอนิเมชันรีโหลดเดิม
   ================================================================ */
:root{
  --tnh-forest-photo:url('https://images.unsplash.com/photo-1448375240586-882707db888b?auto=format&fit=crop&w=1800&q=76');
  --tnh-forest-base:#030b0d;
}

html{
  min-height:100%;
  background:var(--tnh-forest-base);
}
body{
  min-height:100vh;
  min-height:100dvh;
  background:
    radial-gradient(circle at 88% 4%,rgba(31,122,105,.13),transparent 30%),
    radial-gradient(circle at 5% 72%,rgba(14,73,61,.10),transparent 28%),
    linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
  background-color:var(--tnh-forest-base)!important;
}

/* หน้าเข้าสู่ระบบใช้ป่าชุดเดียวกัน แต่หน้ารีโหลดข้อมูลไม่ถูกเลือกในกฎนี้ */
#loginPage{
  background:
    radial-gradient(circle at 50% 8%,rgba(34,139,116,.15),transparent 34%),
    linear-gradient(180deg,rgba(3,12,18,.77),rgba(2,10,15,.95)),
    var(--tnh-forest-photo) center/cover no-repeat!important;
}

/* 4 หน้าหลักใช้พื้นเดียวกับหน้ารีวิวและหน้าผังเบาะ */
#appShell{
  min-height:100vh;
  min-height:100dvh;
  background:#060b13!important;
  background-color:#060b13!important;
}
#appShell>.view-page,
#appShell>.view-page>.main{
  background:transparent!important;
}
#appShell>.hdr{
  background:#060b13!important;
  border-bottom:0!important;
  margin-bottom:0!important;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
#appShell>.bnav,
#appShell .bnav{
  background:linear-gradient(180deg,rgba(7,18,22,.92),rgba(2,9,13,.97))!important;
  border-color:rgba(105,170,151,.13)!important;
}

/* หน้าจอเต็มทั้งหมดใช้รูปป่าเดียวกัน — ไม่รวม loadingScreen */
#bookingPage2,
#successPage2,
#equipPage,
#equipReceiptPage,
#reviewPage,
#adminCenter,
#tripCalendarModal,
#vanLocationModal,
#monthTripsModal{
  background:
    radial-gradient(circle at 92% 2%,rgba(31,122,105,.12),transparent 30%),
    radial-gradient(circle at 0 78%,rgba(22,90,72,.08),transparent 27%),
    linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
  background-color:var(--tnh-forest-base)!important;
}

/* หน้ารวมทริปรายเดือนใช้พื้นหลังกลาง
   หมายเหตุ: ไม่แตะ #tripCalendarModal .calendar-bg-layer เพราะเป็นภาพฤดูกาลไทยรายเดือน */
#monthTripsModal .calendar-bg-layer{
  display:none!important;
}

/* แถบหัวและแถบคำสั่งเป็นกระจกทึบ อ่านง่ายบนภาพป่า */
#bookingPage2>.bk-hdr,
#equipPage>.bk-hdr,
#reviewPage>.bk-hdr,
#equipReceiptPage>.bk-hdr{
  background:rgba(4,14,18,.82)!important;
  border-color:rgba(105,170,151,.13)!important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
#bookingPage2 .sticky-bar,
#equipPage .sticky-bar,
#reviewPage .sticky-bar,
#successPage2 .succ-sticky-bar{
  background:rgba(3,12,16,.91)!important;
  border-color:rgba(105,170,151,.13)!important;
  backdrop-filter:blur(15px);
  -webkit-backdrop-filter:blur(15px);
}

/* Admin Center: ให้ภาพลอดเฉพาะพื้นหลัง ไม่รบกวนการ์ดและตาราง */
#adminCenter .admin-topbar,
#adminCenter .admin-nav{
  background:rgba(3,13,17,.84)!important;
  border-color:rgba(105,170,151,.12)!important;
}
#adminCenter .admin-body,
#adminCenter .admin-view{
  background:transparent!important;
}

/* หน้า admin.html แยกเดิม */
body>.app,
body>.admin-app,
body>.main-wrap{
  background:transparent!important;
}

/* แบบฟอร์มราชการคงกระดาษสีขาว แต่ฉากนอกเป็นป่าชุดเดียวกัน */
body.tnh-popup-paper-page{
  background:
    radial-gradient(circle at 88% 4%,rgba(31,122,105,.13),transparent 30%),
    linear-gradient(180deg,rgba(3,12,18,.78),rgba(2,10,15,.94)),
    var(--tnh-forest-photo) center top/cover no-repeat fixed!important;
}
body.tnh-popup-paper-page .sec{
  box-shadow:0 12px 32px rgba(0,0,0,.20);
}

@media(max-width:767px){
  body,#bookingPage2,#successPage2,#equipPage,#equipReceiptPage,#reviewPage,
  #adminCenter,#tripCalendarModal,#vanLocationModal,#monthTripsModal{
    background-position:center top!important;
    background-attachment:scroll!important;
  }

  /* ล็อกภาพพื้นหลัง 4 แท็บไว้กับหน้าจอเหมือนหน้ารีวิว/ผังเบาะ
     เนื้อหาเลื่อนได้โดยรูปไม่เลื่อน ไม่ยืดตามความยาวหน้า และไม่เบลอ */
  #appShell{
    position:relative;
    isolation:isolate;
    background:transparent!important;
  }
  #appShell::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    background:
      radial-gradient(circle at 92% 2%,rgba(31,122,105,.12),transparent 30%),
      radial-gradient(circle at 0 78%,rgba(22,90,72,.08),transparent 27%),
      linear-gradient(180deg,rgba(3,12,18,.86),rgba(2,10,15,.97)),
      var(--tnh-forest-photo) center/cover no-repeat;
    background-color:var(--tnh-forest-base);
    transform:translateZ(0);
  }
  #appShell>.hdr,
  #appShell>.view-page{
    position:relative;
    z-index:1;
  }

  /* เฟดตัวภาพเฮดจริงให้โปร่งใสลงสู่พื้นหลัง แทนการวางแถบดำทับรูป */
  #appShell>.hdr,
  #appShell .home-banner{
    background:transparent!important;
  }
  #appShell .home-banner>img{
    -webkit-mask-image:linear-gradient(180deg,
      #000 0%,
      #000 70%,
      rgba(0,0,0,.96) 76%,
      rgba(0,0,0,.78) 84%,
      rgba(0,0,0,.42) 93%,
      transparent 100%);
    mask-image:linear-gradient(180deg,
      #000 0%,
      #000 70%,
      rgba(0,0,0,.96) 76%,
      rgba(0,0,0,.78) 84%,
      rgba(0,0,0,.42) 93%,
      transparent 100%);
  }
  #appShell .home-banner-fade{
    display:none!important;
  }
}

@media print{
  body.tnh-popup-paper-page{
    background:#fff!important;
  }
}