/* HUAYHENG FIX397 — CUSTOMER-ONLY readable typography + iPhone/Android layout
   Visual/accessibility overrides. Does not change transactions, APIs, wallet, OTP,
   lottery rules, START, customer data, or any financial workflow.
   Loaded LAST in every customer frontend Yii2 AssetBundle.
*/
:root { --hh397-ink:#0b2d60; --hh397-copy:#143b68; --hh397-muted:#365b80; --hh397-line:#a7d2ee; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
body.hh-customer-body {
  font-family:-apple-system,BlinkMacSystemFont,"Noto Sans Thai","Thonburi","Tahoma","Leelawadee UI",sans-serif !important;
  font-size:15px; line-height:1.5; color:var(--hh397-copy) !important;
  overflow-wrap:break-word;
}
body.hh-customer-body h1,body.hh-customer-body h2,body.hh-customer-body h3,
body.hh-customer-body h4,body.hh-customer-body h5,body.hh-customer-body h6 {
  color:var(--hh397-ink) !important; font-weight:800 !important; line-height:1.35;
}
body.hh-customer-body .text-muted,body.hh-customer-body .text-secondary,
body.hh-customer-body .text-secondary2,body.hh-customer-body .form-text,
body.hh-customer-body .help-text,body.hh-customer-body .help-block,
body.hh-customer-body .card-subtitle {
  color:var(--hh397-muted) !important;
}
body.hh-customer-body .form-control,body.hh-customer-body select,
body.hh-customer-body textarea,body.hh-customer-body input[type="text"],
body.hh-customer-body input[type="number"],body.hh-customer-body input[type="tel"],
body.hh-customer-body input[type="password"],body.hh-customer-body input[type="email"] {
  font-family:inherit; font-size:max(16px,1rem) !important;
  line-height:1.35; color:#113660 !important;
  -webkit-text-fill-color:currentColor;
}
body.hh-customer-body input::placeholder,body.hh-customer-body textarea::placeholder {
  color:#56738f !important; opacity:1;
}
body.hh-customer-body label,body.hh-customer-body .form-label,
body.hh-customer-body .control-label { font-size:14px; font-weight:650; color:#173e69 !important; }
body.hh-customer-body .btn,body.hh-customer-body button,
body.hh-customer-body .dropdown-item,body.hh-customer-body .nav-link {
  font-family:inherit; font-weight:700;
}
body.hh-customer-body .btn:focus-visible,body.hh-customer-body button:focus-visible,
body.hh-customer-body a:focus-visible,body.hh-customer-body input:focus-visible,
body.hh-customer-body select:focus-visible,body.hh-customer-body textarea:focus-visible {
  outline:3px solid #0c76dd !important; outline-offset:2px;
}
/* First image: keep the blue/white palette but fix pale captions and dates. */
body.hh-customer-body .hh370-result-head strong { font-size:clamp(17px,4.3vw,21px) !important;color:#072e69!important;line-height:1.33!important; }
body.hh-customer-body .hh370-result-head small { font-size:12px!important;line-height:1.45!important;color:#32567e!important;font-weight:650!important; }
body.hh-customer-body .hh370-result-head>a { font-size:12px!important;color:#064eaa!important;font-weight:800!important; }
body.hh-customer-body .hh370-round-card { padding:10px 7px 12px!important; }
body.hh-customer-body .hh370-round-top { min-height:35px!important; }
body.hh-customer-body .hh370-round-top span { color:#133f76!important;font-size:11px!important;font-weight:800!important;white-space:normal!important;line-height:1.25!important; }
body.hh-customer-body .hh370-round-top em { font-size:11px!important;padding:3px 7px!important; }
body.hh-customer-body .hh370-round-card>small {font-size:12px!important;color:#244e78!important;font-weight:700!important;line-height:1.3!important;margin:7px 0 4px!important;}
body.hh-customer-body .hh370-main-number {color:#073b8b!important;font-size:clamp(20px,5vw,31px)!important;font-weight:850!important;letter-spacing:0!important;font-variant-numeric:tabular-nums;}
body.hh-customer-body .hh370-lao-card .hh370-main-number {font-size:clamp(23px,6vw,37px)!important;}
body.hh-customer-body .hh370-thai-mini small {font-size:10.5px!important;color:#345b80!important;line-height:1.25!important;font-weight:650!important;}
body.hh-customer-body .hh370-thai-mini b {font-size:11.5px!important;color:#0b3471!important;font-weight:800!important;}
body.hh-customer-body .hh370-empty {font-size:13px!important;color:#31567e!important;}
/* Home quick menu: old style shrank subtitle to 7px on small phones. */
body.hh-customer-body .hh316-quick-menu .menu-grid {
  min-height:127px!important;padding:12px 4px!important;
  overflow:visible!important;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
}
body.hh-customer-body .hh316-quick-menu .menu-grid>span:not(.hh340-money-icon),
body.hh-customer-body .hh340-quick-menu .hh340-money-card>span:not(.hh340-money-icon) {
  font-size:13px!important;font-weight:850!important;line-height:1.4!important;
  white-space:normal!important;overflow-wrap:anywhere;word-break:normal;
}
body.hh-customer-body .hh340-quick-menu .menu-grid>small {
  display:block!important;font-size:11.5px!important;font-weight:700!important;
  color:#365d85!important;line-height:1.35!important;
  white-space:normal!important;overflow-wrap:anywhere;
  margin-top:5px!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-money-card {
  min-height:127px!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-money-card>small {
  font-size:11.5px!important;line-height:1.35!important;
  color:#fff!important;text-shadow:0 1px 2px rgba(2,30,78,.28)!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-deposit-card {
  background:linear-gradient(140deg,#008fa6 0%,#027bb4 100%)!important;
}
body.hh-customer-body .hh340-quick-menu .hh340-withdraw-card {
  background:linear-gradient(140deg,#125dce 0%,#123aaf 100%)!important;
}
body.hh-customer-body .hh316-title small { font-size:12px!important;font-weight:650!important;color:#36597d!important;line-height:1.4!important; }
body.hh-customer-body .hh316-title h3 { font-size:clamp(18px,4.8vw,23px)!important; }
body.hh-customer-body .hh316-title>a { font-size:13px!important; }
body.hh-customer-body .hh316-lottery-card strong {font-size:14px!important;line-height:1.35!important;}
body.hh-customer-body .hh316-lottery-card small {font-size:12px!important;color:#385d82!important;line-height:1.35!important;}
body.hh-customer-body .hh317-lottery-copy strong {font-size:14px!important;}
body.hh-customer-body .hh321-lottery-copy small {font-size:12px!important;line-height:1.35!important;}
body.hh-customer-body .hh316-welcome small,body.hh-customer-body .hh316-last-transaction,
body.hh-customer-body .hh316-page-head small {font-size:12px!important;color:#36597d!important;}
/* Tickets, wallet and betting: readable detail/status while retaining compact numeric inputs. */
body.hh-customer-body .hh337-poy-page small,
body.hh-customer-body .hh337-detail-page small,
body.hh-customer-body .hh-wallet-page .hhw-helper,
body.hh-customer-body .hh-wallet-page .hhw-choice-bank,
body.hh-customer-body .hh390-number-chip small,
body.hh-customer-body .hh390-number-chip em {
  font-size:12px!important;color:#365c82!important;line-height:1.4!important;
}
body.hh-customer-body .hh337-ticket h3,
body.hh-customer-body .hh337-detail-title h2,
body.hh-customer-body .hh-wallet-page .hhw-title,
body.hh-customer-body .hh-wallet-page .hhw-card-title {color:#0b326b!important;}
body.hh-customer-body .hh337-detail-row small {font-size:11px!important;}
body.hh-customer-body .hh337-detail-result {font-size:12px!important;}
body.hh-customer-body .hh390-view-detail,body.hh-customer-body .hh390-more-chip {font-size:12px!important;}
/* Header and permanent bottom menu. Do not scale font icons themselves. */
body.hh-customer-body .heng-bottom-nav__item {font-size:11.5px!important;font-weight:750!important;color:#183f75!important;line-height:1.25!important;}
body.hh-customer-body .heng-bottom-nav__item.active {color:#0758bd!important;}
body.hh-customer-body .heng-bottom-nav__item i {color:#154b93!important;}
body.hh-customer-body .hh-credit-badge,body.hh-customer-body .hh317-credit-rank {font-variant-numeric:tabular-nums;}
/* Login / signup and guest pages must not revert to faint 9px text. */
body.hh-customer-body .hh315-benefit small,
body.hh-customer-body .hh315-quick-links small {
  font-size:12px!important;color:#365c82!important;line-height:1.4!important;
}
body.hh-customer-body .hh315-benefit strong,
body.hh-customer-body .hh315-quick-links strong {font-size:14px!important;line-height:1.35!important;}
body.hh-customer-body .hh315-login-footer {font-size:12px!important;color:#35597d!important;}
/* Safari/Android-friendly tap area and notch: no global width change of forms. */
body.hh-customer-body .heng-bottom-nav {
  height:auto!important;min-height:78px!important;
  padding-bottom:calc(7px + env(safe-area-inset-bottom,0px))!important;
}
body.hh-customer-body .heng-bottom-nav__item {min-height:50px;}
body.hh-customer-body .hh316-quick-menu a.menu-grid {touch-action:manipulation;}
body.hh-customer-body .modal-content,body.hh-customer-body .dropdown-menu,
body.hh-customer-body .card {max-width:100%;}
@media (max-width:767px) {
 body.hh-customer-body .hh370-result-grid {gap:7px!important;}
 body.hh-customer-body .hh370-result-head{gap:7px!important;flex-wrap:wrap;}
 body.hh-customer-body .hh370-result-head>div {flex:1 1 50%!important;}
 body.hh-customer-body .hh370-round-card{padding:10px 5px!important;}
 body.hh-customer-body .hh370-round-top span{font-size:10.5px!important;}
 body.hh-customer-body .hh370-round-card>small{font-size:11.5px!important;}
 body.hh-customer-body .hh316-quick-menu .row>[class*="col-"]{margin-bottom:10px!important;}
 body.hh-customer-body .hh316-quick-menu .menu-grid{min-height:124px!important;}
 body.hh-customer-body .hh340-quick-menu .hh340-money-card{min-height:124px!important;}
 body.hh-customer-body .hh316-quick-menu .menu-grid>span:not(.hh340-money-icon),
 body.hh-customer-body .hh340-quick-menu .hh340-money-card>span:not(.hh340-money-icon){font-size:12.5px!important;}
 body.hh-customer-body .hh340-quick-menu .menu-grid>small,
 body.hh-customer-body .hh340-quick-menu .hh340-money-card>small{font-size:11px!important;}
 body.hh-customer-body .hh315-benefit,body.hh-customer-body .hh315-quick-links a {min-height:123px;}
}
@media (max-width:375px) {
 body.hh-customer-body .hh370-lottery-result-block {padding:9px!important;}
 body.hh-customer-body .hh370-result-grid {gap:5px!important;}
 body.hh-customer-body .hh370-round-card {padding:9px 4px!important;}
 body.hh-customer-body .hh370-round-top span {font-size:10px!important;letter-spacing:-.15px;}
 body.hh-customer-body .hh370-round-card>small {font-size:11px!important;}
 body.hh-customer-body .hh370-main-number{font-size:19px!important;}
 body.hh-customer-body .hh370-lao-card .hh370-main-number{font-size:23px!important;}
 body.hh-customer-body .hh316-quick-menu .menu-grid{min-height:126px!important;padding:10px 3px!important;}
 body.hh-customer-body .hh340-quick-menu .hh340-money-card{min-height:126px!important;}
 body.hh-customer-body .hh316-quick-menu .menu-grid>span:not(.hh340-money-icon),
 body.hh-customer-body .hh340-quick-menu .hh340-money-card>span:not(.hh340-money-icon){font-size:12px!important;}
 body.hh-customer-body .hh340-quick-menu .menu-grid>small,
 body.hh-customer-body .hh340-quick-menu .hh340-money-card>small{font-size:10.5px!important;}
 body.hh-customer-body .heng-bottom-nav__item{font-size:10.5px!important;}
 body.hh-customer-body .hh315-quick-links strong,body.hh-customer-body .hh315-benefit strong{font-size:12.5px!important;}
}
@media (min-width:768px) {
 body.hh-customer-body .hh316-quick-menu .menu-grid{min-height:135px!important;}
 body.hh-customer-body .hh340-quick-menu .hh340-money-card{min-height:135px!important;}
 body.hh-customer-body .hh370-result-head small{font-size:13px!important;}
}
@media (prefers-reduced-motion:reduce){
 body.hh-customer-body .menu-grid,body.hh-customer-body .heng-bottom-nav__item{transition-duration:.01ms!important;}
}
