/* css/208-equip-forest.css — หน้าเช่าอุปกรณ์ โทนป่าเดียวกับทั้งเว็บ (มิ้นต์ #3ddc97 · ทอง #f5c84c) + อนิเมชันนุ่มๆ · คู่กับ js/208
   ไม่ยุ่งตอนเปิดธีมฮาโลวีน (html.tnh-halloween) */
html:not(.tnh-halloween) #equipPage .sx-ic{background:rgba(61,220,151,.12)!important;border:1px solid rgba(61,220,151,.28);color:#7ee7c3;box-shadow:none}
html:not(.tnh-halloween) #equipPage .sx-ic svg{stroke:#7ee7c3}
html:not(.tnh-halloween) #equipPage .sx-ic.sx-amber{background:rgba(245,200,76,.12)!important;border-color:rgba(245,200,76,.35)}
html:not(.tnh-halloween) #equipPage .sx-ic.sx-amber svg{stroke:#f5c84c}
html:not(.tnh-halloween) #equipPage .sx-n{background:transparent;border:1px solid rgba(245,200,76,.45);color:#f5c84c}

/* การ์ด/กล่อง = กระจกใสโทนดำ เห็นป่าด้านหลังจางๆ */
html:not(.tnh-halloween) #equipPage :is(.eq-choose-trip,.eq-item-card,.eq-summary-card,.eq-empty-trip){background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.015) 60%,rgba(0,0,0,.12))!important;border:1px solid rgba(255,255,255,.16)!important;box-shadow:0 8px 24px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.12)!important;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
html:not(.tnh-halloween) #equipPage .eq-choose-icon{background:rgba(61,220,151,.14)!important;color:#7ee7c3!important;border:1px solid rgba(61,220,151,.3)}
html:not(.tnh-halloween) #equipPage .eq-item-card{transition:border-color .3s,box-shadow .3s,transform .25s}
html:not(.tnh-halloween) #equipPage .eq-item-card.on{border-color:rgba(61,220,151,.55)!important;background:linear-gradient(160deg,rgba(61,220,151,.12),rgba(255,255,255,.02) 60%,rgba(0,0,0,.1))!important;box-shadow:0 0 0 1px rgba(61,220,151,.18),0 10px 26px rgba(0,0,0,.2),inset 0 1px 0 rgba(255,255,255,.12)!important}
html:not(.tnh-halloween) #equipPage .eq-item-img{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.12)}
html:not(.tnh-halloween) #equipPage .eq-item-badge{background:#3ddc97!important;color:#06140d!important}
html:not(.tnh-halloween) #equipPage .eq-step-btn.plus{background:linear-gradient(145deg,#4ae3a3,#1fae74)!important;color:#06140d!important}
html:not(.tnh-halloween) #equipPage .eq-step-btn.minus{background:rgba(255,255,255,.07)!important;color:#cfe0d8!important}
html:not(.tnh-halloween) #equipPage .eq-summary-row.total span:last-child{color:#f5c84c!important}
html:not(.tnh-halloween) #equipPage .eq-empty-trip button{background:linear-gradient(135deg,#4ae3a3,#1fae74)!important;color:#06140d!important;box-shadow:0 8px 20px rgba(61,220,151,.22)!important}
html:not(.tnh-halloween) #equipPage .sticky-bar{background:linear-gradient(180deg,rgba(7,17,13,0),rgba(7,17,13,.92) 35%)!important;border-top:0!important}
html:not(.tnh-halloween) #equipPage #eqConfirmBtn{position:relative;overflow:hidden;background:linear-gradient(135deg,#4ae3a3,#1fae74)!important;color:#06140d!important;box-shadow:0 10px 24px rgba(61,220,151,.25)!important;transition:transform .2s,opacity .3s,box-shadow .3s}
html:not(.tnh-halloween) #equipPage #eqConfirmBtn:disabled{background:rgba(255,255,255,.07)!important;backdrop-filter:blur(3px);color:#6f857b!important;box-shadow:none!important;border:1px solid rgba(255,255,255,.08)!important}
html:not(.tnh-halloween) #equipPage #eqConfirmBtn:not(:disabled)::after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.4) 50%,transparent 65%);transform:translateX(-120%);animation:eqmShine 3.2s 1s ease-in-out infinite}
@keyframes eqmShine{0%{transform:translateX(-120%)}45%,100%{transform:translateX(120%)}}
html:not(.tnh-halloween) #equipPage #eqConfirmBtn:not(:disabled):active{transform:scale(.97)}

/* ป็อปอัปเลือกทริป */
html:not(.tnh-halloween) .eq-picker-overlay{background:rgba(1,7,13,.70)!important;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
html:not(.tnh-halloween) .eq-picker-panel{background:linear-gradient(180deg,rgba(3,12,18,.84),rgba(2,10,15,.96)),url('/ximg.php?f=1448375240586-882707db888b-900.jpg') center/cover no-repeat!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 24px 60px rgba(0,0,0,.5)!important;animation:eqmPanel .45s cubic-bezier(.2,.9,.25,1) both}
html:not(.tnh-halloween) .eq-trip-pick{background:rgba(0,0,0,.3)!important;border:1px solid rgba(255,255,255,.08)!important;transition:border-color .25s,background .25s,transform .2s}
html:not(.tnh-halloween) .eq-trip-pick.on{background:rgba(61,220,151,.08)!important;border-color:rgba(61,220,151,.5)!important}
html:not(.tnh-halloween) .eq-trip-pick-check{color:#3ddc97}
.eq-picker-panel .eq-trip-pick{animation:eqmUp .5s cubic-bezier(.2,.8,.2,1) both}
.eq-picker-panel .eq-trip-pick:nth-child(2){animation-delay:.05s}.eq-picker-panel .eq-trip-pick:nth-child(3){animation-delay:.1s}.eq-picker-panel .eq-trip-pick:nth-child(4){animation-delay:.15s}.eq-picker-panel .eq-trip-pick:nth-child(n+5){animation-delay:.2s}
@keyframes eqmPanel{from{opacity:0;transform:translateY(24px) scale(.97)}}

/* หน้าชำระค่าเช่า */
html:not(.tnh-halloween) #equipPayModal{background:rgba(1,7,13,.70)!important;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
html:not(.tnh-halloween) #equipPayModal .eq-pay-box{background:linear-gradient(180deg,rgba(3,12,18,.84),rgba(2,10,15,.96)),url('/ximg.php?f=1448375240586-882707db888b-900.jpg') center/cover no-repeat!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 24px 60px rgba(0,0,0,.5)!important}
html:not(.tnh-halloween) #equipPayModal.show .eq-pay-box{animation:eqmPanel .45s cubic-bezier(.2,.9,.25,1) both}
html:not(.tnh-halloween) #equipPayModal .eq-pay-total strong{color:#f5c84c!important}
html:not(.tnh-halloween) #equipPayModal #eqPaySubmitBtn:not(:disabled){background:linear-gradient(135deg,#4ae3a3,#1fae74)!important;color:#06140d!important}

/* เข้าหน้า: หัวข้อ การ์ด ไล่ขึ้นทีละชิ้น */
#equipPage.eqm-go .bk-body>*{animation:eqmUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 70ms + 80ms)}
#equipPage.eqm-go #eqItemList .eq-item-card{animation:eqmUp .55s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--j,0) * 80ms + 300ms)}
#equipPage.eqm-go .sticky-bar{animation:eqmBar .5s .45s cubic-bezier(.2,.9,.25,1) both}
@keyframes eqmUp{from{opacity:0;transform:translateY(16px)}}
@keyframes eqmBar{from{opacity:0;transform:translateY(100%)}}
/* กดเพิ่ม/ลดจำนวน: ตัวเลขเด้ง การ์ดเรืองแสงแว้บ ป้าย ×n เด้ง */
.eq-step-val.eqm-bump{animation:eqmBump .35s cubic-bezier(.3,1.6,.5,1)}
@keyframes eqmBump{40%{transform:scale(1.45);color:#3ddc97}}
.eq-item-card.eqm-pulse{animation:eqmPulse .5s ease-out}
@keyframes eqmPulse{0%{box-shadow:0 0 0 0 rgba(61,220,151,.45)}100%{box-shadow:0 0 0 12px rgba(61,220,151,0)}}
.eq-item-badge.eqm-pop{animation:eqmPop .4s cubic-bezier(.3,1.6,.5,1)}
@keyframes eqmPop{from{transform:scale(.3);opacity:0}}
.eq-step-btn{transition:transform .15s}
.eq-step-btn:active{transform:scale(.88)}
#eqSummaryBox.eqm-in{animation:eqmUp .5s cubic-bezier(.2,.8,.2,1) both}
#eqSummaryRows .eq-summary-row{animation:eqmFade .35s ease-out both}
@keyframes eqmFade{from{opacity:0;transform:translateX(-6px)}}
@media (prefers-reduced-motion:reduce){#equipPage #eqConfirmBtn::after{animation:none!important}}
/* ทริปที่เลือก (กรอบฟ้า → มิ้นต์) */
html:not(.tnh-halloween) #equipPage .eq-trip-pick.on,html:not(.tnh-halloween) .eq-chosen-display{border-color:rgba(61,220,151,.5)!important;background:linear-gradient(160deg,rgba(61,220,151,.12),rgba(255,255,255,.02))!important;box-shadow:0 0 0 1px rgba(61,220,151,.18)!important}
html:not(.tnh-halloween) :is(#equipPage,.eq-picker-panel) .eq-trip-pick.on .eq-trip-pick-check{background:#3ddc97!important;color:#06140d!important;border-color:#3ddc97!important}
html:not(.tnh-halloween) :is(#equipPage,.eq-picker-panel) .eq-trip-pick.on .eq-trip-pick-check svg{stroke:#06140d!important}
/* ปุ่มส่งสลิปค่าเช่าตอนยังไม่แนบ (ฟ้า → กระจกเข้ม) */
html:not(.tnh-halloween) #equipPayModal #eqPaySubmitBtn:disabled{background:rgba(255,255,255,.06)!important;color:#6f857b!important;border:1px solid rgba(255,255,255,.08)!important;box-shadow:none!important}
html:not(.tnh-halloween) #equipPayModal .eq-pay-total{background:rgba(245,200,76,.06)!important;border-color:rgba(245,200,76,.25)!important}
/* ใบเสร็จค่าเช่า: ข้อความแดง/ปุ่มฟ้า → มิ้นต์ */
html:not(.tnh-halloween) #equipReceiptPage .succ-body>p{color:#9ff0c8!important}
html:not(.tnh-halloween) #equipReceiptPage .btn-home{background:linear-gradient(135deg,#4ae3a3,#1fae74)!important;color:#06140d!important;box-shadow:0 10px 24px rgba(61,220,151,.22)!important;border:0!important}
