/* =========================================
   WUKONG LITE CASINO (SAFE MODE + MOBILE HQ)
   - no layout change
   - no radius change
   - visual only + quality boost
========================================= */

:root {
  --wk-gold-soft: rgba(244,213,141,0.18);
  --wk-gold-line: rgba(244,213,141,0.12);
  --wk-dark-shadow: rgba(0,0,0,0.35);
  --wk-green-neon: #00ff9d;
  --wk-green-dark: #008d17;
}

/* ===== GLOBAL RENDERING ===== */
html,
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-kerning: normal;
  font-feature-settings: "kern" 1, "liga" 1, "tnum" 1;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

*,
*::before,
*::after {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

/* ===== FONT & TEXT SHARPEN ===== */
body,
input,
button,
select,
textarea,
a,
p,
span,
div,
li,
label,
small,
strong,
h1, h2, h3, h4, h5, h6 {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.title,
.brand,
.logo-text,
.navbar,
.menu-title,
.game-name,
.navigation-item {
  text-rendering: geometricPrecision;
  letter-spacing: 0.2px;
}

/* ===== IMAGE & ICON SHARPEN ===== */
img,
svg,
i {
  image-rendering: -webkit-optimize-contrast;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

/* ===== CARD / WIDGET SUBTLE GOLD ACCENT ===== */
header,
footer,
.card,
.widget-content,
#widget-depo,
#widget-wd,
.game-favorite-box,
.list-game-box,
.modal-content {
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.05),
    0 0 0 2px var(--wk-gold-line),
    0 8px 20px var(--wk-dark-shadow);
  position: relative;
}

/* ===== TOP SUBTLE GOLD LINE ===== */
header::after,
.card::after,
.widget-content::after,
#widget-depo::after,
#widget-wd::after,
.game-favorite-box::after,
.list-game-box::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(244,213,141,0.35), transparent);
  pointer-events: none;
  z-index: 1;
}

/* ===== BUTTON ENHANCEMENT ===== */
.btn-login,
.btn-register,
.btn-info,
.btn-danger,
button,
.btn {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 4px 12px rgba(0,0,0,0.25);
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-font-smoothing: antialiased;
  backface-visibility: hidden;
}

.btn-login:hover,
.btn-register:hover,
.btn-info:hover,
.btn-danger:hover,
button:hover,
.btn:hover {
  filter: brightness(1.08);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    0 6px 16px rgba(0,0,0,0.32);
  transform: translateY(-1px);
}

/* ===== INPUT FIELD ===== */
input,
select,
textarea,
.form-control {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.45);
  transition: box-shadow 0.2s ease;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.45),
    0 0 0 2px rgba(0, 141, 23, 0.25);
}

/* ===== HOVER EFFECT ===== */
.card:hover,
.widget-content:hover,
#widget-depo:hover,
#widget-wd:hover,
.game-favorite-box:hover,
.list-game-box:hover {
  box-shadow:
    0 0 0 1px rgba(0, 141, 23, 0.15),
    0 12px 28px rgba(0,0,0,0.32);
}

/* ===== NUMBER / LOTTERY / RESULT TEXT ===== */
.number,
.result,
.lotto-number,
.prize {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.4px;
  text-rendering: geometricPrecision;
}

/* ===== SUBTLE SCANLINE (very light) ===== */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  background: repeating-linear-gradient(
    180deg,
    transparent 0px,
    transparent 2px,
    rgba(255,255,255,0.008) 3px,
    transparent 4px
  );
  opacity: 0.08;
  mix-blend-mode: screen;
}

/* ===== MOBILE OPTIMIZATION ===== */
@media (max-width: 767.98px) {
  html,
  body {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
  }

  body::after {
    opacity: 0.05;
  }

  .bottom-nav a,
  .footer-nav a,
  .mobile-menu a,
  .navbar a,
  .nav a {
    font-size: 13.2px;
    font-weight: 500;
    letter-spacing: 0.15px;
  }

  input,
  select,
  textarea,
  .form-control {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,0.04),
      inset 0 -1px 0 rgba(0,0,0,0.5);
  }

  .game-favorite-box,
  .list-game-box,
  .lottery-item {
    box-shadow:
      0 0 0 1px rgba(0, 141, 23, 0.12),
      0 6px 16px rgba(0,0,0,0.25);
  }

  img {
    image-rendering: -webkit-optimize-contrast;
  }
}