.modal-container[data-v-1e9c91ad] {
    background-color: #000000e6;
    border-radius: 12px;
    inset: 0;
    margin: 0;
    position: fixed;
    transition: opacity .5s
}

.modal-content-container[data-v-1e9c91ad] {
    bottom: 0;
    height: 100%;
    overflow: auto;
    padding-top: 12px;
    position: absolute;
    top: 0;
    width: 100%
}

.login-option-box-item { user-select: none; transition: transform .06s ease; }
.login-option-box-item:active { transform: scale(.98); }
/* เธ—เธณเนƒเธซเน‰เน„เธญเธ„เธญเธ™เธ•เธฒเน€เธงเธฅเธฒเธเธ”/เน‚เธŸเธเธฑเธช เธ”เธนเน€เธ›เน‡เธ™เธ›เธธเนˆเธก */
.login-form .relative.flex.ml-auto img,
.login-form .relative.flex.flex-end.ml-auto img {
  outline: none;
  transition: transform .06s ease;
}
.login-form .relative.flex.ml-auto img:active,
.login-form .relative.flex.flex-end.ml-auto img:active {
  transform: scale(.95);
}
.login-form .relative.flex.ml-auto img:focus-visible,
.login-form .relative.flex.flex-end.ml-auto img:focus-visible {
  box-shadow: 0 0 0 2px rgba(236,202,119,.6);
  border-radius: 6px;
}
/* เธเธฅเนˆเธญเธ‡เธ เธฒเธฉเธฒ (เธ—เธตเนˆเธกเธตเธ„เธฅเธฒเธชเธŠเธธเธ”เธ™เธตเน‰เธญเธขเธนเนˆเนเธฅเน‰เธง) เธ‹เนˆเธญเธ™เน€เธ›เน‡เธ™เธ„เนˆเธฒเน€เธฃเธดเนˆเธกเธ•เน‰เธ™ */
.absolute.right-3.top-12.float-right.mr-2.my-5.z-10 { display: none; }
/* เน€เธงเธฅเธฒเน€เธ›เธดเธ”เนƒเธซเน‰เนเธ„เนˆเน€เธ•เธดเธกเธ„เธฅเธฒเธช .show */
.absolute.right-3.top-12.float-right.mr-2.my-5.z-10.show { display: block; }

/* เธเธฅเนˆเธญเธ‡เธ เธฒเธฉเธฒ (เธ—เธตเนˆเธกเธตเธ„เธฅเธฒเธชเธŠเธธเธ”เธ™เธตเน‰เธญเธขเธนเนˆเนเธฅเน‰เธง) เธ‹เนˆเธญเธ™เน€เธ›เน‡เธ™เธ„เนˆเธฒเน€เธฃเธดเนˆเธกเธ•เน‰เธ™ */
.absolute.right-0.top-10.float-right.z-10 { display: none; }
/* เน€เธงเธฅเธฒเน€เธ›เธดเธ”เนƒเธซเน‰เนเธ„เนˆเน€เธ•เธดเธกเธ„เธฅเธฒเธช .show */
.absolute.right-0.top-10.float-right.z-10.show { display: block; }


/* เธ—เธณเนƒเธซเน‰เธฃเธนเธ›เธ˜เธ‡เธ”เธนเน€เธ›เน‡เธ™เธ›เธธเนˆเธก (เธกเธตเธญเธขเธนเนˆเนเธฅเน‰เธงเธเน‡เน„เธกเนˆเน€เธ›เน‡เธ™เน„เธฃ) */
img[alt="logo"].cursor-pointer { cursor: pointer; }
/* เธ•เน‰เธญเธ‡ escape [] เนƒเธ™ CSS เธ”เน‰เธงเธขเน€เธซเธกเธทเธญเธ™เธเธฑเธ™ */
/* เน€เธฃเธดเนˆเธกเธ•เน‰เธ™เธ‹เนˆเธญเธ™ */
.toggleinputshow { display: none; }
/* เธกเธตเธ„เนˆเธฒเนƒเธ™เธŠเนˆเธญเธ‡ -> เน‚เธŠเธงเนŒ */
.toggleinputshow.is-on { display: block; }
.phonecodebox{
    display: none;
}
.fi-kh.fis {
    background-image: url(assets/1760337585578/kh.CAffWc0R.svg);
}
.countryselectbox{display:none;}


/* เธชเน„เธฅเธ”เนŒเธ—เธตเนˆเนเธชเธ”เธ‡/เธ‹เนˆเธญเธ™ */
.popupimage { display: none; }
.popupimage.is-active { display: block; }

/* เนเธญเธ™เธดเน€เธกเธŠเธฑเธ™ */
@keyframes slideOutLeft   { from{transform:translateX(0);opacity:1} to{transform:translateX(-40px);opacity:0} }
@keyframes slideInRight   { from{transform:translateX(40px);opacity:0} to{transform:translateX(0);opacity:1} }
@keyframes slideOutRight  { from{transform:translateX(0);opacity:1} to{transform:translateX(40px);opacity:0} }
@keyframes slideInLeft    { from{transform:translateX(-40px);opacity:0} to{transform:translateX(0);opacity:1} }

.anim-out-left  { animation: slideOutLeft  .25s ease forwards; }
.anim-in-right  { animation: slideInRight  .25s ease forwards; }
.anim-out-right { animation: slideOutRight .25s ease forwards; }
.anim-in-left   { animation: slideInLeft   .25s ease forwards; }


/* เน€เธฃเธดเนˆเธกเธ‹เนˆเธญเธ™ bottom sheet เธ—เธฑเน‰เธ‡เธเน‰เธญเธ™ */
.walletbottomfixed { display: none; }
.walletbottomfixed.show { display: block; }

/* overlay เธˆเธฒเธ‡เน€เธ‚เน‰เธฒ-เธญเธญเธ */
.bottom-modal-selector-overlay{
  position: fixed; inset: 0;
  background: #000;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}
.bottom-modal-selector-overlay.show{
  opacity: .6;
  pointer-events: auto;
}

/* content เน€เธฅเธทเนˆเธญเธ™เธ‚เธถเน‰เธ™เธ™เธธเนˆเธก เน† */
.bottom-modal-selector-content{
  transform: translateY(16px);
  opacity: 0;
  transition: transform .18s ease, opacity .18s ease;
}
.bottom-modal-selector-content.show{
  transform: translateY(0);
  opacity: 1;
}

.side-nav-container{
    display: none;
}
.side-nav-container.show{
    display: block !important;
}

/* เธ‹เนˆเธญเธ™ popup เน€เธฃเธดเนˆเธกเธ•เน‰เธ™ */
.contactpopupbox{
  display:none;
}
.custom-popup-mask.show { display: block; }

 /* เธ‹เนˆเธญเธ™เน€เธกเธ™เธนเธ•เธญเธ™เน€เธฃเธดเนˆเธก */
  .historybdw { display: none; }
  .historybdw.show { display: block; }

  /* เธ‹เนˆเธญเธ™เธ”เน‰เธงเธขเธ„เธฅเธฒเธช (เธเธฑเธ™เธเธฃเธ“เธตเนƒเธŠเน‰เธซเธฅเธฒเธขเธ—เธตเนˆ) */
  .insideaccordingalert.is-hidden { display: none; }

  /* เธซเธกเธธเธ™เธฅเธนเธเธจเธฃเธ™เธธเนˆเธก เน† */
  .arrow-rotate { transition: transform .2s ease; }
  .arrow-rotate.rotate { transform: rotate(180deg); }


/* keyframes เธˆเธฒเธเธเนˆเธญเธ™เธซเธ™เน‰เธฒเนƒเธŠเน‰เธ•เนˆเธญเน„เธ”เน‰ */
@keyframes slideOutLeft  { from {transform: translateX(0);   opacity:1;} to {transform: translateX(-6%); opacity:0;} }
@keyframes slideInRight  { from {transform: translateX(6%);  opacity:0;} to {transform: translateX(0);   opacity:1;} }
@keyframes slideOutRight { from {transform: translateX(0);   opacity:1;} to {transform: translateX(6%);  opacity:0;} }
@keyframes slideInLeft   { from {transform: translateX(-6%); opacity:0;} to {transform: translateX(0);   opacity:1;} }

.slide-anim { will-change: transform, opacity; }
.slide-out-left  { animation: slideOutLeft  .28s ease both; }
.slide-in-right  { animation: slideInRight  .28s ease both; }
.slide-out-right { animation: slideOutRight .28s ease both; }
.slide-in-left   { animation: slideInLeft   .28s ease both; }

.is-animating { pointer-events: none; }

/* เธเธฃเธญเธšเน€เธงเธ—เธตเธ—เธตเนˆเน€เธฃเธฒเธˆเธฐเธชเธฃเน‰เธฒเธ‡เธ”เน‰เธงเธข JS */
.rank-frame{
  position: relative;
  overflow: hidden;
}
/* เนƒเธซเน‰เนเธ•เนˆเธฅเธฐเธšเธฅเน‡เธญเธเธ–เธนเธเธ‹เน‰เธญเธ™เน€เธ›เน‡เธ™เน€เธฅเน€เธขเธญเธฃเนŒเนƒเธ™เธเธฃเธญเธš */
.rank-layer{
  position: absolute;
  inset: 0;
  width: 100%;
  backface-visibility: hidden;
  transform: translateZ(0);
  z-index: 0;
}
.rank-layer.is-next{ z-index: 1; }

/* เน€เธ„เธฒเธฃเธžเธœเธนเน‰เนƒเธŠเน‰เธ—เธตเนˆเธฅเธ” motion */
@media (prefers-reduced-motion: reduce){
  .slide-out-left,.slide-in-right,.slide-out-right,.slide-in-left{ animation-duration:1ms; }
}

/* เน€เธงเธ—เธตเธซเธฅเธฑเธเธ‚เธญเธ‡เธ„เธฒเธฃเธนเน€เธ‹เธฅ */
.boxsliderank{
  position: relative;
  display: grid;          /* เนƒเธซเน‰เธฅเธนเธเธ—เธธเธเธชเน„เธฅเธ”เนŒเธ‹เน‰เธญเธ™เธ—เธฑเธšเธเธฑเธ™เนƒเธ™เน€เธ‹เธฅเธฅเนŒเน€เธ”เธตเธขเธง */
  grid-template-columns: 100%;
  grid-template-rows: 1fr;
  overflow: hidden;       /* เธเธฑเธ™เธฅเน‰เธ™เธ‚เธญเธšเน€เธงเธฅเธฒเน€เธฅเธทเนˆเธญเธ™ */
  isolation: isolate;     /* เธเธฑเธ™เธŠเธฑเน‰เธ™เธ‹เน‰เธญเธ™เธˆเธฒเธเธ เธฒเธขเธ™เธญเธ */
  align-content: start;   /* เธเธฑเธ™เธขเธทเธ”เธ”เธถเธ‡เธฅเธ‡เธฅเนˆเธฒเธ‡ */
}

/* เนƒเธซเน‰เนเธ•เนˆเธฅเธฐเธซเธ™เน‰เธฒเธชเน„เธฅเธ”เนŒเธงเธฒเธ‡เธ—เธฑเธšเธเธฑเธ™ (เธญเธขเธนเนˆเธŠเนˆเธญเธ‡เน€เธ”เธตเธขเธงเธเธฑเธ™) */
.boxsliderank > .mx-4.mt-4{
  grid-area: 1 / 1;       /* เธ‹เน‰เธญเธ™เธ—เธฑเธšเธเธฑเธ™เธšเธ™เน€เธ‹เธฅเธฅเนŒเน€เธ”เธตเธขเธง */
  width: 100%;
  will-change: transform, opacity;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* เธ–เน‰เธฒเนƒเธŠเน‰เธ„เธฅเธฒเธช .is-active เธเธฑเธšเธชเน„เธฅเธ”เนŒเธ›เธฑเธˆเธˆเธธเธšเธฑเธ™ เธˆเธฐเธฅเธทเนˆเธ™เธชเธธเธ” */
.boxsliderank > .mx-4.mt-4:not(.is-active){
  opacity: 0;
  pointer-events: none;   /* เธเธฑเธ™เธ„เธฅเธดเธเธชเน„เธฅเธ”เนŒเธ—เธตเนˆเน„เธกเนˆเนเธชเธ”เธ‡ */
}

/* เธ›เน‰เธญเธ‡เธเธฑเธ™เธ เธฒเธž โ€œเธขเธธเธš/เน€เธ”เน‰เธ‡โ€ เน€เธžเธฃเธฒเธฐ baseline space เธ‚เธญเธ‡ img */
.boxsliderank img{
  display: block;         /* เธ•เธฑเธ”เธŠเนˆเธญเธ‡เธงเนˆเธฒเธ‡เนƒเธ•เน‰เธฃเธนเธ› */
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

/* เธ–เน‰เธฒเธชเน„เธฅเธ”เนŒเธกเธตเธ„เธงเธฒเธกเธชเธนเธ‡เนƒเธเธฅเน‰เน€เธ„เธตเธขเธ‡เธเธฑเธ™ เนเธ™เธฐเธ™เธณเธ•เธฑเน‰เธ‡ min-height เธเธฑเธ™เธขเธธเธš */
@media (min-width: 0){
  .boxsliderank{
    /* เธ›เธฃเธฑเธšเธ•เธฒเธกเธ”เธตเน„เธ‹เธ™เนŒเธ„เธธเธ“ เธซเธฒเธเธชเนˆเธงเธ™เธซเธฑเธงเธชเน„เธฅเธ”เนŒเธชเธนเธ‡ ~165px:
       เนƒเธชเนˆ min-height เธเธฑเธ™เน€เธŸเธฃเธกเธขเธธเธšเธŠเธฑเนˆเธงเธ„เธฃเธฒเธงเธ•เธญเธ™เธชเธฅเธฑเธš */
    min-height: 165px;
  }
}

/* เธ—เธณเนƒเธซเน‰ keyframe เธ—เธตเนˆเนƒเธชเนˆเธเธฑเธš .slide-anim เธ™เธดเนˆเธ‡ เน„เธกเนˆเธชเธฑเนˆเธ™ */
.boxsliderank .slide-anim{
  backface-visibility: hidden;
  transform: translateZ(0);
}


.custom-popup-mask.checkin {
    display: none;
}
.boxearn {
    display: none;
}


  /* เธ•เธณเนเธซเธ™เนˆเธ‡เธฃเธงเธกเธ‚เธญเธ‡ toast เธ”เน‰เธฒเธ™เธšเธ™เธˆเธญ */
  #toast-root {
    position: fixed;
    top: 16px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999;
    pointer-events: none; /* เนƒเธซเน‰เธ„เธฅเธดเธเธ—เธฐเธฅเธธ เน€เธงเน‰เธ™เธ›เธธเนˆเธก close เธ‚เธญเธ‡ toast เน€เธญเธ‡ */
  }

  .Vue-Toastification__toast {
    pointer-events: auto; /* เนƒเธซเน‰เธ„เธฅเธดเธเธ›เธธเนˆเธกเธ›เธดเธ”เน„เธ”เน‰ */
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 260px;
    max-width: 92vw;
    padding: 10px 14px;
    border-radius: 8px;
    color: #fff;
    background: #2f855a; /* success */
    margin-top: 10px;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
    opacity: 0;
    transform: translateY(-20px);
    animation: toast-in .28s ease-out forwards;
  }

  .Vue-Toastification__toast--success { background: #2f855a; } /* เน€เธ‚เธตเธขเธง */

  .Vue-Toastification__icon {
    width: 18px; height: 18px; flex: 0 0 18px;
  }

  .Vue-Toastification__toast-body {
    font-size: 14px; line-height: 1.3;
  }

  .Vue-Toastification__close-button {
    margin-left: 6px;
    font-size: 18px;
    line-height: 1;
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
  }

  .Vue-Toastification__progress-bar {
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: rgba(255,255,255,.85);
    transform-origin: left center;
    animation-fill-mode: forwards;
  }

  @keyframes toast-in {
    from { opacity: 0; transform: translateY(-20px); }
    to   { opacity: 1; transform: translateY(0); }
  }

  @keyframes toast-out {
    from { opacity: 1; transform: translateY(0); }
    to   { opacity: 0; transform: translateY(-15px); }
  }

  /* เนเธ–เธงเธซเธฅเธฒเธขเธญเธฑเธ™เธ‹เน‰เธญเธ™เธˆเธฐเน„เธซเธฅเธฅเธ‡ */
  #toast-root .Vue-Toastification__toast { position: relative; }


  .flex.flex-col.justify-center.cursor-pointer.creditBalanceContainer .flex.justify-end.mt-1 {
    display: none;
}

.flex.flex-col.justify-center.cursor-pointer.creditBalanceContainer .absolute.pt-0.bottom-0.right-0.w-full {
    display: none;
}

.ucoin-progress-container.cursor-pointer.items-center.justify-end.gap-1 {
    display: none;
}
.flex.flex-col.justify-center.cursor-pointer.creditBalanceContainer span.text-white.text-xxxs {
    font-size:14px;
}

/* ===== Modal base ===== */
  .modal-container{
    display: none; 
  }
  .modal-container.is-open{ display:flex; }

  .modal-overlay{
    position:absolute; inset:0; background: rgba(0,0,0,.55);
    animation: fadeIn .2s ease-out forwards;
  }


  @keyframes slideIn {
    to { transform: translateY(0); opacity: 1; }
  }
  @keyframes fadeIn {
    from{ opacity: 0 } to { opacity: 1 }
  }
  @keyframes slideOut {
    to { transform: translateY(-8px); opacity: 0; }
  }

    /* เธ‹เนˆเธญเธ™เธเธฅเนˆเธญเธ‡เน€เธฃเธดเนˆเธกเธ•เน‰เธ™ */
  .boxrank02 { display: none; }

  /* เนเธญเธ™เธดเน€เธกเธŠเธฑเธ™เน‚เธŠเธงเนŒ */
  .showing {
    animation: slideDown .18s ease-out;
  }
  @keyframes slideDown {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
  }




    /* ===== Overlay ===== */
  .overlaybankselect{
    position: fixed; inset: 0;
    background: rgba(0,0,0,.55);
    opacity: 0; visibility: hidden;
    transition: opacity .18s ease;
    z-index: 2200;
  }
  .overlaybankselect.is-open{
    opacity: 1; visibility: visible;
  }

  /* ===== Bottom sheet ===== */
  .bankselect{
    z-index: 2201;
    transform: translateY(100%);
    opacity: 0; visibility: hidden;
    transition: transform .22s ease-out, opacity .18s ease-out, visibility 0s linear .22s;
  }
  .bankselect.is-open{
    transform: translateY(0);
    opacity: 1; visibility: visible;
    transition: transform .22s ease-out, opacity .18s ease-out;
  }

  /* เธฅเน‡เธญเธเธชเธเธญเธฃเนŒเธฅเน€เธกเธทเนˆเธญเนเธœเธ‡เน€เธ›เธดเธ” */
  body.modal-open{
    overflow: hidden;
    touch-action: none;
  }
  .depositsuccess {
}


  .depositstart .hidden{ display:none !important; }

  /* เธ—เนˆเธฒเน€เธฅเน‡เธ เน† เธ•เธญเธ™เน‚เธŠเธงเนŒ */
  .slide-in{ animation:slideIn .18s ease-out both; }
  @keyframes slideIn{
    from{ opacity:0; transform: translateY(6px); }
    to{ opacity:1; transform: translateY(0); }
  }

  /* เธ›เนŠเธญเธ›เธญเธฑเธ›เธชเธณเน€เธฃเน‡เธˆ: เธ‹เนˆเธญเธ™เน„เธงเน‰เธเนˆเธญเธ™ */
  .depositsuccess.hidden .overlay{ display:none; }
  .depositsuccess.hidden{ display:none; }
  .depositsuccess .overlay{
    position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:999;
  }
  /* เธ‹เนˆเธญเธ™เธ›เธธเนˆเธกเธฅเนˆเธฒเธ‡เน„เธงเน‰เธเนˆเธญเธ™ */
  .qrcodestep02bottom { display: none; }
  /* เน€เธœเธทเนˆเธญเธญเธขเธฒเธเนƒเธŠเน‰เธ„เธฅเธฒเธชเนเธ—เธ™ inline style */
  .qrcodestep02bottom.is-visible { display: flex; }
  .depositsuccess.slide-in {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.boxalertred{
  display: none;
}
.deposit-amount-container2.flex.flex-col.justify-center.items-center {
    margin-top: 40px;
}