body {
  cursor: url(../cursor/point.cur), auto !important;
}

/* Hover cursor for links/buttons */
.btn:hover,
a:hover {
  cursor: url(../cursor/link.cur), auto !important;
}

/* Keep weight consistent */
*:not(i) { font-weight: 400 !important; }

/* Scrollbar */
::-webkit-scrollbar{
  width: .6rem; height: .6rem;
}
::-webkit-scrollbar-thumb{
  background: #caf148;            /* Lime Green (เดิม orange) */
  border-radius: 1rem;
}
::-webkit-scrollbar-thumb:hover{
  background: #b0d439;            /* Deep Lime (เดิม deep orange) */
}
::-webkit-scrollbar-track{
  background: #13131a;
  box-shadow: inset 0 0 0 0 transparent;
}

/* Particle layer */
#particles-js {
  position: absolute; width: 100%;
  height: calc(100vh - 10px) !important;
  box-sizing: border-box; top: 0 !important;
  background-image: url('');
  background-repeat: repeat; background-size: cover;
  background-position: 50% 50%;
  z-index: 2; pointer-events: none;
}

/* Nav links */
.nav-link:hover {
  color: #eaff96 !important; /* Soft Lime (เดิม soft orange) */
  text-shadow: 0 0 3px rgba(202,241,72,.7), 0 0 8px rgba(176,212,57,.6);
}
.nav-link.active {
  background-color: rgba(255,255,255,0.06) !important;
  box-shadow: 0 0 15px rgba(202,241,72,.35), 0 0 5px rgba(176,212,57,.35);
}

/* Sidebar */
.sidebar  { min-height: max-content !important; overflow-y: hidden !important; }
.sidebar .nav-item:hover {
  background-color: rgba(255,255,255,0.06) !important; border-radius: 10px;
}

/* Background helpers */
.full-background {
  position: fixed; background-position: center;
  background-repeat: no-repeat; background-size: cover;
  min-height: 100%; min-width: 1024px; width: 100%; height: auto;
}
.section-payment { display: none; }
.custom-bg {
  background-position: center; background-repeat: no-repeat;
  background-size: cover !important; background-attachment: fixed;
}
.main-bg {
  background-image: url(../images/bg-green.jpg); /* ใช้รูปเดิมของคุณ */
  background-position: top right; background-repeat: no-repeat;
  background-attachment: fixed; background-size: cover;
}

/* Text accents */
label, .text-custom, .nav-link {
  color: #caf148 !important; /* Main Lime */
  text-shadow: 0 0 3px rgba(202,241,72,.6), 0 0 6px rgba(176,212,57,.5);
}

/* Page blocks */
.main-page {
  background-position: top; background-repeat: no-repeat;
  background-size: auto auto; position: relative;
}
.main-content {
  padding-top: 5rem; padding-bottom: 7rem;
  background-color: rgba(18,18,24,0.85) !important; /* dark card */
  border-radius: 1.5rem;
}

/* Fixed audio control */
.audio-control { position: fixed; z-index: 9999; bottom: 0; }

.acc-detail { padding: 3px 0; }
.img-center { display: block; margin: 0 auto; }
.content-center {
  align-items: center; display: flex; flex-direction: column; justify-content: center;
}

/* Preloader */
#preloader {
  position: fixed; inset: 0; z-index: 9999; overflow: hidden; background: #0b0b0f;
}
#preloader:before {
  content: ""; position: fixed;
  top: calc(50% - 30px); left: calc(50% - 30px);
  border: 6px solid #2a2a36;              /* dark ring */
  border-top: 6px solid #caf148;          /* Lime accent */
  border-radius: 50%; width: 60px; height: 60px;
  animation: animate-preloader 1s linear infinite;
}
@keyframes animate-preloader {
  0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); }
}

/* Sky layers */
.sky_wave, .bottom_sky {
  width: 100%; overflow: hidden; position: absolute; z-index: 1; left: 0;
}
.sky_wave { height: 300px; top: 440px; }
.bottom_sky { height: 250px; bottom: 0; }

@keyframes cloud_one{0%{left:0}100%{left:-200%}}
@keyframes cloud_two{0%{left:0}100%{left:-200%}}
@keyframes cloud_three{0%{left:0}100%{left:-200%}}

/* Logo floating */
.logo {
  display: flex; justify-content: center; align-items: center; height: 35rem;
}
.logo img {
  width: 65%; height: auto; animation: logo 3s infinite linear;
  filter: drop-shadow(0 0 18px rgba(202,241,72,.25)); /* Lime Glow */
}
@keyframes logo {
  0%{transform:scale(1)} 20%{transform:scale(1.05)} 30%{transform:scale(.90)}
  45%{transform:scale(1.05)} 60%{transform:scale(1)}
}

/* Bottom banner/page */
.bottom-content {
  background-position: bottom center; background-attachment: fixed;
  background-repeat: no-repeat; background-size: cover; position: relative; min-height: 100vh;
}
.bottom-content .container { position: relative; z-index: 2; }

/* Navbar panel */
.dropdown-menu { border-radius: 0 0 5px 5px !important; }
.bg-navbar {
  border-right: 2px solid #caf148; /* Main Lime */
  background-image: url(../images/login-bg.jpg);
  background-repeat: no-repeat; background-size: cover;
}

/* Boxes */
.bg-box, .bg-custom {
  background-color: rgba(18,18,24,0.89);
  box-shadow: 0 0 15px rgba(202,241,72,.25), 0 0 5px rgba(176,212,57,.25);
}
.bg-custom {
  border: 3px solid #caf148; border-radius: 10px;
}
.bg-box {
  background-image: url(../images/bg-box-top.png), url(../images/bg-box-bottom.png);
  background-position: center top, center bottom;
  background-size: 100% auto, 100% auto; background-repeat: no-repeat, no-repeat;
  color: #e5e7eb; padding: 50px 0;
  box-shadow: 0 0 15px rgba(202,241,72,.35) !important;
  border-radius: 15px;
}

/* Forms */
.form-control-custom {
  background-color: #383838 !important; border: 0 !important;
  border-radius: 10px; height: 50px; font-size: 14px;
  box-shadow: inset 3px 3px 5px rgba(0,0,0,.7);
}
.form-control-custom, .form-control-custom::placeholder { color: #9aa2b1 !important; }

/* Footer */
.main-footer { text-align: center; height: 60px; }
.main-footer span:nth-child(2) { display: block; }

/* Item box */
.item-box {
  background: url(../images/bg-items.png) no-repeat 50% 50%/100% 100%;
  width: 100%; min-height: 90px; padding: 15px;
}

/* Flip card */
.scene { width: 100%; min-height: 450px; perspective: 600px; background: transparent; }
.iscard { width: 100%; height: 100%; transition: transform 1s; transform-style: preserve-3d; cursor: pointer; position: relative; }
.iscard.is-flipped { transform: rotateY(180deg); }
.card__face {
  position: absolute; width: 100%; height: 100%;
  backface-visibility: hidden; border-radius: 10px; padding: 10px;
  background-position: center center; background-repeat: no-repeat; background-size: 100% 100%;
}
.card__face--front,
.card__face--back {
  background-color: rgba(18,18,24,0.9);
  box-shadow: 0 0 15px rgba(202,241,72,.25), 0 0 5px rgba(176,212,57,.25);
}
.card__face--back {
  background-image: url(../images/bg-box-top.png), url(../images/bg-box-bottom.png);
  background-position: center top, center bottom; background-size: 100% auto, 100% auto; background-repeat: no-repeat, no-repeat;
  transform: rotateY(180deg);
}

/* Fusing slots */
.fusing-container { min-height: max-content; }
.fusing-item-slot {
  width: 80px !important; height: 80px !important; position: relative;
  background: url(../images/bg-items.png) no-repeat 50% 50%/100% 100%;
  padding: 17px 15px 15px 15px !important;
}
.fusing-item-slot > .icon-item.active { filter: grayscale(0); }
.fusing-item-slot > .icon-item {
  width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center;
  background-size: cover; filter: grayscale(1);
  background-image: url(../images/items/6928.png); opacity: .3; border-radius: 5px;
}
.fusing-item-slot > span {
  position: absolute; bottom: -15px; right: 0; left: 0; margin: 0 5px;
  padding: 1px 7px !important; font-size: 10px; border-radius: 5px !important;
  background-color: #2f3a12; /* Dark Olive (เดิม Dark Brown) */
  text-align: center; color: #eaff96; /* Soft Lime */
}

/* Sidebar scroll hidden */
.main-sidebar { overflow-y: scroll !important; }
.main-sidebar::-webkit-scrollbar, .sidebar::-webkit-scrollbar { display: none !important; }

/* Pyramid items */
#pyramid ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 auto; overflow: hidden; }
#pyramid li {
  list-style: none; margin: 0 .3rem .5rem 0; border-radius: 5px; display: inline-block;
  background: url(/assets/images/bg-items.png) center/100% 100% no-repeat;
  width: 70px; height: 70px;
}
#pyramid li img { padding-top: 5px; width: 60%; height: auto; }
#pyramid li > .items-focus { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; }
#pyramid li > .items-focus.active { background-image: url(/assets/images/flare.png); }

/* Wheel */
.wheel-arrow { position: absolute; z-index: 2; display: block; margin-top: .7em; }

/* Recycle lists */
.recycle-items-list, .items-selected {
  box-shadow: inset 1px 0 17px rgba(0,0,0,.75);
  background-color: #494949; width: 100%; height: 200px; padding: 10px 5px 5px;
}
.recycle-items-list img { width: 35px; margin-bottom: 10px; }
.recycle-items-list img:hover, .items-selected img:hover { cursor: pointer; transform: scale(1.1); }
.recycle-items-list img:not(:first-child), .recycle-items-list img:not(:last-child),
.items-selected img:not(:first-child), .items-selected img:not(:last-child) { margin: 0 5px; }

/* Floating character */
.alice_box {
  display: block; position: fixed; width: 150px; height: 211px; bottom: 1.5em; right: 0; z-index: 5;
  animation: top_wing 2s infinite linear;
}
@keyframes top_wing { 0%{transform: translate(0,5px)} 50%{transform: translate(0,-10px)} 100%{transform: translate(0,5px)} }

/* Main button */
.btn-main {
  position: relative; overflow: hidden; color: #eaff96 !important; /* Soft Lime */
  text-shadow: 0 0 3px rgba(202,241,72,.6), 0 0 6px rgba(176,212,57,.5);
  border: 1px solid #caf148; background-color: #0b0b0f; transition: .35s;
}
.btn-main:hover {
  color: #0b0b0f !important;
  background: linear-gradient(90deg, #caf148, #b0d439); /* Lime Gradients */
  box-shadow: 0 8px 24px rgba(202,241,72,.3);
}

/* Media */
@media only screen and (min-width: 900px) {
  .item-box { min-height: 70px; padding: 10px; }
  a[data-widget="pushmenu"] { display: none; }
  .main-bg { background-position: top left; }
  .main-footer { text-align: left; }
  .main-footer span:nth-child(2) { display: inline; float: right; }

  .rotate-90 { transform: rotate(90deg); }

  .prop { background-position: top center; background-repeat: no-repeat; position: absolute; background-size: 100% auto; }
}