/* HUAYHENG v399 | Customer Color Pop Theme
   UI-only colorful pass for customer-facing pages.
   Keeps readability improvements from v397/v398 and adds brighter, more vivid visuals.
*/
:root{
  --hh399-blue:#0b7dff;
  --hh399-blue-deep:#0a49c9;
  --hh399-cyan:#19d9ff;
  --hh399-sky:#eaf7ff;
  --hh399-ink:#0b2f67;
  --hh399-pink:#ff7fca;
  --hh399-gold:#ffcb52;
  --hh399-orange:#ff9f2f;
  --hh399-violet:#8576ff;
  --hh399-border:#a7d7ff;
}
body.hh-customer-body{
  background:
    radial-gradient(circle at top right, rgba(255,203,82,.20), transparent 22%),
    radial-gradient(circle at top left, rgba(255,127,202,.16), transparent 18%),
    linear-gradient(180deg,#f6fcff 0%,#ebf8ff 38%,#e5f3ff 100%)!important;
  color:var(--hh399-ink)!important;
}
body.hh-customer-body .card,
body.hh-customer-body .modal-content,
body.hh-customer-body .dropdown-menu,
body.hh-customer-body .hh337-ticket,
body.hh-customer-body .hh337-detail-card,
body.hh-customer-body .hh323-api-card,
body.hh-customer-body .hh348-y-card,
body.hh-customer-body .hh348-round,
body.hh-customer-body .hh370-round-card,
body.hh-customer-body .hh316-lottery-card,
body.hh-customer-body .hh-wallet-page .hhw-card,
body.hh-customer-body .hh-wheel-panel,
body.hh-customer-body .hh-siemsee-result,
body.hh-customer-body .hh-siemsee-history{
  border-color:#bfe2ff!important;
  box-shadow:0 8px 22px rgba(36,108,184,.11)!important;
}
body.hh-customer-body .hh316-title h3,
body.hh-customer-body .hh316-page-head h1,
body.hh-customer-body .hh337-detail-title h2,
body.hh-customer-body .hh-wheel-panel h2,
body.hh-customer-body .hh-siemsee-history h2,
body.hh-customer-body .hh-siemsee-result-head h2{color:#0a3d8e!important}

/* Header / top summary */
body.hh-customer-body .hh370-result-head,
body.hh-customer-body .hh316-page-head,
body.hh-customer-body .hh316-welcome{
  background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(228,245,255,.92))!important;
  border:1px solid #cfe8ff!important;
  border-radius:22px!important;
  box-shadow:0 8px 18px rgba(41,119,198,.09)!important;
  padding:12px 14px!important;
}
body.hh-customer-body .hh370-round-card{
  background:linear-gradient(180deg,#ffffff 0%,#f2fbff 100%)!important;
  border:2px solid #bde2ff!important;
  border-radius:18px!important;
}
body.hh-customer-body .hh370-round-top em{
  background:linear-gradient(180deg,#ff68c0,#ff2f83)!important;
  color:#fff!important;
  border:none!important;
  box-shadow:0 3px 10px rgba(255,78,143,.28)!important;
}
body.hh-customer-body .hh370-main-number{
  color:#0a4fd2!important;
  text-shadow:0 1px 0 #fff,0 8px 18px rgba(11,125,255,.12)!important;
}

/* Quick menu and money cards */
body.hh-customer-body .hh316-quick-menu .menu-grid,
body.hh-customer-body .hh340-quick-menu .menu-grid,
body.hh-customer-body .hh340-quick-menu .hh340-money-card{
  position:relative;
  overflow:hidden!important;
  border:2px solid #bee3ff!important;
  border-radius:20px!important;
  box-shadow:0 10px 24px rgba(27,115,196,.14)!important;
}
body.hh-customer-body .hh316-quick-menu .menu-grid::before,
body.hh-customer-body .hh340-quick-menu .menu-grid::before,
body.hh-customer-body .hh340-quick-menu .hh340-money-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.45),transparent 42%);
}
body.hh-customer-body .hh316-quick-menu .menu-grid{
  background:linear-gradient(180deg,#ffffff 0%,#eef8ff 100%)!important;
}
body.hh-customer-body .hh316-quick-menu .row>[class*='col-']:nth-child(4n+1) .menu-grid{
  background:linear-gradient(180deg,#ffffff 0%,#eaf6ff 100%)!important;
}
body.hh-customer-body .hh316-quick-menu .row>[class*='col-']:nth-child(4n+2) .menu-grid{
  background:linear-gradient(180deg,#f5feff 0%,#d9f5ff 100%)!important;
}
body.hh-customer-body .hh316-quick-menu .row>[class*='col-']:nth-child(4n+3) .menu-grid{
  background:linear-gradient(180deg,#f7fbff 0%,#e6edff 100%)!important;
}
body.hh-customer-body .hh316-quick-menu .row>[class*='col-']:nth-child(4n+4) .menu-grid{
  background:linear-gradient(180deg,#fffdfa 0%,#fff0d8 100%)!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-deposit-card{
  background:linear-gradient(180deg,#5ef0ff 0%,#12c9f7 38%,#0f7ae9 100%)!important;
  border-color:#9cf3ff!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-withdraw-card{
  background:linear-gradient(180deg,#5aa8ff 0%,#2476ff 45%,#1746d8 100%)!important;
  border-color:#abcfff!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-money-card>span:not(.hh340-money-icon),
body.hh-customer-body .hh340-quick-menu .hh340-money-card>small{
  text-shadow:0 1px 2px rgba(0,54,112,.35)!important;
}
body.hh-customer-body .hh316-quick-menu .menu-grid>span:not(.hh340-money-icon){color:#0c4da4!important}
body.hh-customer-body .hh316-quick-menu .menu-grid>small{color:#45698f!important}
body.hh-customer-body .hh316-quick-menu .menu-grid i,
body.hh-customer-body .hh316-quick-menu .menu-grid .fa,
body.hh-customer-body .hh316-quick-menu .menu-grid svg,
body.hh-customer-body .hh340-money-icon{filter:drop-shadow(0 3px 8px rgba(11,125,255,.16))!important}

/* Buttons / pills */
body.hh-customer-body .btn-primary,
body.hh-customer-body .hh375-date-form button,
body.hh-customer-body .hh375-tabs a.active,
body.hh-customer-body .hh390-view-detail,
body.hh-customer-body .hh390-more-chip,
body.hh-customer-body .hh372-payout-link,
body.hh-customer-body .hh372-api-payout,
body.hh-customer-body .hh323-payout,
body.hh-customer-body .hh-siemsee-play,
body.hh-customer-body .hh-wheel-spin{
  background:linear-gradient(180deg,#2fe2ff 0%,#0f90ff 40%,#0b57e0 100%)!important;
  border-color:#b2efff!important;
  color:#fff!important;
  box-shadow:0 6px 0 rgba(7,82,167,.85),0 12px 20px rgba(13,103,193,.22)!important;
}
body.hh-customer-body .btn-warning,
body.hh-customer-body .btn-danger,
body.hh-customer-body .hh337-refund-btn,
body.hh-customer-body .hh337-cancel-btn{
  background:linear-gradient(180deg,#ffb45e 0%,#ff8a34 48%,#ff5b2a 100%)!important;
  border-color:#ffd0a0!important;
  color:#fff!important;
}
body.hh-customer-body .btn-success,
body.hh-customer-body .hh373-save-btn,
body.hh-customer-body .hh-wallet-page .hhw-confirm,
body.hh-customer-body .hh-wheel-claim{
  background:linear-gradient(180deg,#4ef3c6 0%,#13d9a3 40%,#00ab84 100%)!important;
  border-color:#aef6e4!important;
  color:#fff!important;
}

/* Chips / tags */
body.hh-customer-body .badge,
body.hh-customer-body .label,
body.hh-customer-body .hh348-badge,
body.hh-customer-body .hh323-api-body>.hh323-state,
body.hh-customer-body .hh323-core-cover>.hh323-state{
  border-radius:999px!important;
}
body.hh-customer-body .badge-info,
body.hh-customer-body .label-info{background:linear-gradient(180deg,#59ddff,#179dff)!important}
body.hh-customer-body .badge-success,
body.hh-customer-body .label-success{background:linear-gradient(180deg,#5de7b0,#0fb777)!important}
body.hh-customer-body .badge-warning,
body.hh-customer-body .label-warning{background:linear-gradient(180deg,#ffd769,#ffad32)!important;color:#744200!important}
body.hh-customer-body .badge-danger,
body.hh-customer-body .label-danger{background:linear-gradient(180deg,#ff94bc,#ff548b)!important}

/* Bottom nav */
body.hh-customer-body .heng-bottom-nav{
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(236,247,255,.98))!important;
  border-top:1px solid #cfe8ff!important;
  box-shadow:0 -10px 30px rgba(17,96,176,.10)!important;
}
body.hh-customer-body .heng-bottom-nav__item{color:#2b5d95!important}
body.hh-customer-body .heng-bottom-nav__item.active{
  color:#0859d8!important;
}
body.hh-customer-body .heng-bottom-nav__item.active .icon,
body.hh-customer-body .heng-bottom-nav__item.active i,
body.hh-customer-body .heng-bottom-nav__item.active svg{
  color:#0a61ef!important;
  filter:drop-shadow(0 3px 8px rgba(10,97,239,.24));
}

/* Tables / list rows */
body.hh-customer-body .table>thead>tr>th,
body.hh-customer-body .hh375-y-table th{
  background:linear-gradient(180deg,#f4fbff,#e4f3ff)!important;
  color:#0d478f!important;
}
body.hh-customer-body .table>tbody>tr:nth-child(odd),
body.hh-customer-body .hh375-y-table tr:nth-child(odd){background:rgba(245,251,255,.66)!important}

/* Wheel and Siemsee pages extra pop */
.hh-wheel-page{
  background:
    radial-gradient(circle at top right, rgba(255,208,98,.20), transparent 20%),
    radial-gradient(circle at top left, rgba(255,153,204,.15), transparent 18%),
    linear-gradient(180deg,#ecfbff 0%,#f8fdff 42%,#eef7ff 100%)!important;
  border:2px solid #d7ebff!important;
  box-shadow:0 10px 28px rgba(31,104,178,.14)!important;
}
.hh-wheel-head,
.hh-siemsee-heading{
  background:linear-gradient(160deg,#fffef9 0%,#effbff 55%,#dff3ff 100%)!important;
  box-shadow:0 8px 18px rgba(34,114,193,.12)!important;
}
.hh-wheel-scene{
  border-color:#ffe3a2!important;
  background:radial-gradient(circle at 50% 36%,#fff8d8 0%,#dff7ff 40%,#86c8ff 100%)!important;
}
.hh-siemsee-action-area,
.hh-siemsee-result,
.hh-siemsee-history{
  box-shadow:0 10px 24px rgba(29,101,177,.14)!important;
}

/* Login / register cards */
body.hh-customer-body .hh315-login-card,
body.hh-customer-body .login-box,
body.hh-customer-body .register-box,
body.hh-customer-body .hh315-login-panel{
  background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(241,249,255,.96))!important;
  border:1px solid #d0e8ff!important;
  box-shadow:0 14px 30px rgba(30,108,182,.16)!important;
}

@media (max-width:480px){
  body.hh-customer-body .hh316-quick-menu .menu-grid,
  body.hh-customer-body .hh340-quick-menu .hh340-money-card{box-shadow:0 7px 18px rgba(27,115,196,.12)!important}
}
@media(prefers-reduced-motion:reduce){
  body.hh-customer-body .hh316-quick-menu .menu-grid,
  body.hh-customer-body .hh340-quick-menu .hh340-money-card,
  body.hh-customer-body .btn{transition:none!important}
}
