@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+Thai:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@keyframes spin {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(360deg);
  }
}

body {
	font-family: "Noto Serif Thai", Tahoma, sans-serif;
	background: #29323c;
    background: radial-gradient(circle at 10% 20%, rgb(90, 92, 106) 0%, rgb(32, 45, 58) 81.3%);
    min-height: 100vh;
    color: white;
}

.font-en, input{
    font-family: "Poppins", sans-serif;
}

.swal2-top-center-popup {
  margin-top: 0px !important;     
  top: 10px !important;        
}
.swal2-input{
   color:rgb(0, 0, 0); 
   font-size: 2rem; /* ใหญ่ชัดเจน */
   background-color: rgb(255, 255, 255) /* พื้นหลังดำเท่ ๆ */
}

.huge-input {
    letter-spacing: 0.3rem;  /* ปรับระยะห่างระหว่างตัวเลข */
    font-weight: bold;
    font-size: 2rem;
  }
  .huge-input {
  font-size: 2rem; /* ใหญ่ชัดเจน */
  letter-spacing: 0.2rem; /* เพิ่มช่องไฟเบอร์ */
  color:rgb(255, 236, 150); 
  background-color: #000; /* พื้นหลังดำเท่ ๆ */
  border: 1px solid rgb(95, 95, 95); /* ขอบสีฟ้า */
  border-radius: 8px;
  padding: 1rem;
  transition: all 0.3s ease-in-out;
  text-shadow: 0 0 2px rgb(251, 255, 3), 0 0 2px rgb(251, 255, 3);
}

.huge-input:focus {
  outline: none;
  box-shadow: 0 0 5px rgb(0, 255, 106), 0 0 5px rgb(0, 255, 106);
  border-color: rgb(0, 255, 106);
  color:rgb(255, 236, 150); 
  text-shadow: 0 0 2px rgb(251, 255, 3), 0 0 2px rgb(251, 255, 3);
}

.huge-input::placeholder {
  font-size: 1.2rem; /* ใหญ่ชัดเจน */
  letter-spacing: 0.05rem; /* เพิ่มช่องไฟเบอร์ */
  color: rgb(87, 87, 87);
  text-shadow: 0 0 5px rgb(65, 65, 65);
}

.point_elm{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.custom-coin-icon {
  width: auto;
  height: auto;
  margin-bottom: 20px;
  background: none !important;  /* 💥 ลบพื้นหลังวงกลม */
  border: none !important;      /* 💥 ลบเส้นขอบ */
  box-shadow: none !important;  /* 💥 ลบเงาวงกลม (ถ้ามี) */
}
.coin {
    width: 60px;
    height: 60px;
    background: radial-gradient(circle at center, gold 40%, orange 70%);
    border-radius: 50%;
    border: 4px solid #fff27d;
    box-shadow: 0 0 15px gold;
    animation: spin 4s linear infinite;
    transform-style: preserve-3d;
    position: relative;
    font-family: 'Arial Black', sans-serif;
    font-size: 14px;
    color: #feffbd;
    text-align: center;
    line-height: 3.7em;
    font-weight: bold;
    text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
  }
.coinleaf {
  animation: spin 2s linear infinite;
  transform-style: preserve-3d;
  position: relative;
  font-family: 'Arial Black', sans-serif;
  font-size: 2em;
  color: #b6d132;
  text-align: center;
  line-height: 1em;
  font-weight: bold;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
}
 .otp-input {
    width: 46px;
    font-size: 24px;
    text-align: center;
    margin: 0 5px;
  }


@media (min-width: 1200px){
   
}
@media (min-width: 992px){
    
}
@media (min-width: 768px){
   
}
@media (min-width: 576px){
 
}