html, body {
  min-height: 100%;
}

body {
  background:
    radial-gradient(circle at 15% 20%, rgba(255, 40, 160, 0.18), transparent 40%),
    radial-gradient(circle at 85% 80%, rgba(80, 200, 255, 0.18), transparent 45%),
    url("https://after-dark-stories.com/wp-content/uploads/2026/01/anh-nen.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  color: #ffffff;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background-image: url("https://after-dark-stories.com/wp-content/uploads/2026/01/anh-nen-1.png");
  opacity: 0.25;
  pointer-events: none;
  z-index: 0;
}
#page, 
.site, 
.site-content,
.elementor {
  position: relative;
  z-index: 1;
}
.inventory-item {
  background: #1a0033;
  border: 2px solid #ff2cff;
  box-shadow:
    0 0 10px #ff2cff,
    inset 0 0 10px #00f0ff;
  transition: 0.25s;
}

.inventory-item:hover {
  transform: scale(1.05);
  box-shadow:
    0 0 20px #00f0ff,
    0 0 40px #ff2cff;
}
img {
  max-width: 100%;
  height: auto;
}
html, body {
  overflow-x: hidden;
}
@media (max-width: 768px) {
  .elementor-section {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  .elementor-column {
    width: 100% !important;
  }
}
/* ============================= */
/* AFTER DARK STORIES NEON FORM */
/* ============================= */

/* LABEL */
.wpforms-container .wpforms-field-label{
color:#ffffff !important;
font-weight:500;
letter-spacing:0.5px;
}

/* INPUT TEXT / EMAIL / PASSWORD */
.wpforms-container input[type="text"],
.wpforms-container input[type="email"],
.wpforms-container input[type="password"],
.wpforms-container textarea{

background:rgba(0,0,0,0.55) !important;
border:1px solid #ff2cff !important;
border-radius:10px !important;
padding:12px !important;
color:#ffffff !important;

transition:0.3s;
}

/* PLACEHOLDER */
.wpforms-container input::placeholder{
color:#bbbbbb !important;
}

/* INPUT GLOW FOCUS */
.wpforms-container input[type="text"]:focus,
.wpforms-container input[type="email"]:focus,
.wpforms-container input[type="password"]:focus,
.wpforms-container textarea:focus{

border-color:#ff66ff !important;
box-shadow:
0 0 10px #ff2cff,
0 0 20px #ff2cff,
inset 0 0 6px #ff2cff;

outline:none !important;
}

/* ============================= */
/* CHECKBOX NEON */
/* ============================= */

.wpforms-container input[type="checkbox"]{

appearance:none;
width:18px;
height:18px;

border:2px solid #ff2cff;
border-radius:4px;

background:transparent;
cursor:pointer;

transition:0.25s;
}

/* CHECKED */

.wpforms-container input[type="checkbox"]:checked{

background:#ff2cff;

box-shadow:
0 0 6px #ff2cff,
0 0 12px #ff2cff;

}

/* CHECKBOX TEXT */

.wpforms-container .wpforms-field-checkbox label{
color:#ffffff !important;
margin-left:6px;
cursor:pointer;
}

/* CĂN HÀNG */

.wpforms-container .wpforms-field-checkbox ul li{
display:flex;
align-items:center;
gap:8px;
}

/* ============================= */
/* BUTTON NEON */
/* ============================= */

.wpforms-container button{

background:linear-gradient(90deg,#ff2cff,#7a00ff) !important;

border:none !important;

color:#ffffff !important;

padding:12px 28px;

border-radius:12px;

font-weight:bold;

cursor:pointer;

transition:0.3s;

}

/* BUTTON HOVER */

.wpforms-container button:hover{

box-shadow:
0 0 12px #ff2cff,
0 0 30px #7a00ff;

transform:translateY(-1px);

}

/* ============================= */
/* OTP 6 Ô NHẬP */
/* ============================= */

/* áp dụng cho field OTP nếu bạn đặt class otp-code */

.otp-code input{

text-align:center;

font-size:22px;

letter-spacing:12px;

padding-left:16px !important;

}

/* ============================= */
/* FORM BOX GLASS EFFECT */
/* ============================= */

.wpforms-container{

background:rgba(0,0,0,0.35);

padding:35px;

border-radius:20px;

backdrop-filter:blur(10px);

border:1px solid rgba(255,255,255,0.08);

box-shadow:
0 0 20px rgba(255,44,255,0.25);

}
/* FORM NỀN TRONG SUỐT */
.wpforms-container {

background: transparent !important;

border: none;

box-shadow: none;

padding: 0;

}
.wpforms-container input{
background: rgba(0,0,0,0.45) !important;
}
/* Trang đăng ký luôn nằm giữa màn hình */
body.page-id-56 .site-main,
body.page-id-56 .entry-content,
body.page-id-56 .elementor-section-wrap {
  min-height: 100vh;
}

/* Nếu trang đăng ký làm bằng Elementor */
body.page-id-56 .elementor {
  min-height: 100vh;
}

body.page-id-56 .elementor-top-section:first-child {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Cột/khung chứa form */
body.page-id-56 .elementor-top-section:first-child .elementor-container {
  width: 100%;
  justify-content: center;
}

body.page-id-56 .elementor-top-section:first-child .elementor-column {
  display: flex;
  justify-content: center;
}

body.page-id-56 .elementor-widget-shortcode,
body.page-id-56 .um,
body.page-id-56 .um-register {
  width: 100%;
  max-width: 760px;
  margin: 0 auto !important;
}

/* Khung form đẹp hơn */
body.page-id-56 .um {
  background: rgba(8, 0, 28, 0.72);
  border: 1px solid rgba(255, 0, 200, 0.45);
  border-radius: 18px;
  padding: 28px;
  box-shadow: 0 0 26px rgba(255, 0, 200, 0.22);
  backdrop-filter: blur(6px);
}

/* Mobile */
@media (max-width: 767px) {
  body.page-id-56 .elementor-top-section:first-child {
    padding: 20px 14px;
    align-items: center;
  }

  body.page-id-56 .um {
    max-width: 100%;
    padding: 18px;
    border-radius: 14px;
  }
}/* Hiện rõ chữ người dùng nhập trong form đăng nhập / đăng ký */
#ads-login-id,
#ads-login-password,
#ads-register-first-name,
#ads-register-last-name,
#ads-register-username,
#ads-register-email,
#ads-register-password,
#ads-register-confirm-password {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ff5fd2 !important;
  opacity: 1 !important;
  text-shadow: none !important;
  background: rgba(10, 10, 25, 0.92) !important;
  border: 1px solid rgba(255,255,255,0.18) !important;
}

/* Khi focus vẫn phải hiện chữ rõ */
#ads-login-id:focus,
#ads-login-password:focus,
#ads-register-first-name:focus,
#ads-register-last-name:focus,
#ads-register-username:focus,
#ads-register-email:focus,
#ads-register-password:focus,
#ads-register-confirm-password:focus {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ff5fd2 !important;
  background: rgba(12, 12, 30, 0.98) !important;
  outline: none !important;
  box-shadow: 0 0 0 1px rgba(255,95,210,0.5), 0 0 14px rgba(255,95,210,0.25) !important;
}

/* Placeholder khác màu với chữ nhập */
#ads-login-id::placeholder,
#ads-login-password::placeholder,
#ads-register-first-name::placeholder,
#ads-register-last-name::placeholder,
#ads-register-username::placeholder,
#ads-register-email::placeholder,
#ads-register-password::placeholder,
#ads-register-confirm-password::placeholder {
  color: rgba(255,255,255,0.55) !important;
  -webkit-text-fill-color: rgba(255,255,255,0.55) !important;
  opacity: 1 !important;
}

/* Nếu theme đè lên input trong form */
.ads-auth-wrap input,
.ads-auth-form input,
.ads-login-form input,
.ads-register-form input {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  caret-color: #ff5fd2 !important;
  opacity: 1 !important;
}

/* Trường hợp password bị chấm nhưng vẫn phải thấy đúng trạng thái */
input[type="password"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
/* Trang tài khoản / cài đặt: làm ô input hợp phong cách neon và dễ đọc */
#ads-user-account-details .ads-nuh-input,
#ads-user-account-details .ads-nuh-select,
#ads-user-settings .ads-nuh-input,
#ads-user-settings .ads-nuh-select,
.ads-nuh-panel .ads-nuh-input,
.ads-nuh-panel .ads-nuh-select,
.ads-nuh-panel input,
.ads-nuh-panel select,
.ads-nuh-panel textarea {
  background: linear-gradient(180deg, rgba(18, 16, 52, 0.96), rgba(12, 10, 36, 0.96)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(255, 95, 210, 0.35) !important;
  box-shadow: inset 0 0 10px rgba(106, 227, 255, 0.08), 0 0 8px rgba(255, 79, 216, 0.08) !important;
}

/* Khi focus */
#ads-user-account-details .ads-nuh-input:focus,
#ads-user-account-details .ads-nuh-select:focus,
#ads-user-settings .ads-nuh-input:focus,
#ads-user-settings .ads-nuh-select:focus,
.ads-nuh-panel input:focus,
.ads-nuh-panel select:focus,
.ads-nuh-panel textarea:focus {
  background: linear-gradient(180deg, rgba(24, 20, 70, 0.98), rgba(14, 12, 42, 0.98)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(106, 227, 255, 0.55) !important;
  box-shadow: 0 0 0 1px rgba(106, 227, 255, 0.35), 0 0 14px rgba(255, 79, 216, 0.18) !important;
  outline: none !important;
}

/* Placeholder nhạt hơn chữ thật */
#ads-user-account-details .ads-nuh-input::placeholder,
#ads-user-settings .ads-nuh-input::placeholder,
.ads-nuh-panel input::placeholder,
.ads-nuh-panel textarea::placeholder {
  color: rgba(255, 195, 235, 0.58) !important;
  -webkit-text-fill-color: rgba(255, 195, 235, 0.58) !important;
  opacity: 1 !important;
}

/* Chữ đã có dữ liệu phải rõ */
#ads-user-account-details input[value],
#ads-user-settings input[value],
.ads-nuh-panel input[value] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* Dropdown quốc gia */
#ads-user-account-details select,
#ads-user-settings select,
.ads-nuh-panel select {
  appearance: none;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
/* Bước tiếp theo: đổi khối cài đặt tài khoản sang label trên - input dưới */
#ads-user-settings .ads-nuh-panel:first-child{
  max-width: 520px !important;
  width: 100% !important;
  padding: 24px 24px 28px !important;
}

#ads-user-settings .ads-nuh-form-row{
  display: block !important;
  margin-bottom: 18px !important;
}

#ads-user-settings .ads-nuh-form-row label,
#ads-user-settings .ads-nuh-form-row .ads-nuh-label{
  display: block !important;
  width: 100% !important;
  margin: 0 0 8px 0 !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  line-height: 1.45 !important;
}

#ads-user-settings .ads-nuh-input,
#ads-user-settings .ads-nuh-select,
#ads-user-settings input,
#ads-user-settings select,
#ads-user-settings textarea{
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 46px !important;
  padding: 11px 14px !important;
  font-size: 15px !important;
  border-radius: 10px !important;
  box-sizing: border-box !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  background: linear-gradient(180deg, rgba(26,20,70,.97), rgba(12,10,38,.97)) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(255,95,210,.35) !important;
  box-shadow: inset 0 0 10px rgba(106,227,255,.06), 0 0 8px rgba(255,79,216,.08) !important;
}

#ads-user-settings textarea{
  min-height: 100px !important;
  height: auto !important;
  white-space: normal !important;
  resize: vertical !important;
}

#ads-user-settings .ads-nuh-panel:first-child .ads-nuh-btn,
#ads-user-settings .ads-nuh-panel:first-child button,
#ads-user-settings .ads-nuh-panel:first-child input[type="submit"]{
  margin-top: 6px !important;
}

/* Cho cột trái rộng hơn trên desktop */
@media (min-width: 1100px){
  #ads-user-settings .ads-nuh-grid-2{
    grid-template-columns: minmax(420px, 520px) minmax(0, 1fr) !important;
    gap: 20px !important;
  }
}

/* Tablet/mobile */
@media (max-width: 1099px){
  #ads-user-settings .ads-nuh-grid-2{
    grid-template-columns: 1fr !important;
  }

  #ads-user-settings .ads-nuh-panel:first-child{
    max-width: 100% !important;
  }
}/* Mở lại cuộn toàn trang */
html, body {
  height: auto !important;
  min-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

/* Nếu có class khóa cuộn từ popup */
body.ads-modal-open,
body.ads-popup-open,
body.no-scroll,
body.modal-open,
body.overflow-hidden {
  overflow-y: auto !important;
}

/* Trang cài đặt người dùng phải tự cao theo nội dung */
#ads-user-settings,
#ads-user-settings .ads-nuh-wrap,
#ads-user-settings .ads-nuh-grid-2,
#ads-user-settings .ads-nuh-panel {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Không để cột/grid khóa chiều cao */
#ads-user-settings .ads-nuh-grid-2 {
  align-items: start !important;
}

/* Nút lưu ở cuối phải có khoảng trống để nhìn thấy */
#ads-user-settings .ads-nuh-panel:last-child,
#ads-user-settings form,
#ads-user-settings .ads-nuh-form {
  padding-bottom: 80px !important;
}

/* Nếu có khung con đang chặn cuộn */
#ads-user-settings .ads-nuh-content,
#ads-user-settings .ads-nuh-main,
#ads-user-settings .ads-nuh-body {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}