/* Thiên Long Vấn Thiên - typography and color polish v5 */
:root{
  --tlh-bg: #e9ecef;
  --tlh-bg-2: #f3f4f6;

  --tlh-panel: #dfe3e8;
  --tlh-panel-2: #cfd6dd;

  --tlh-blue: #4aa8ff;
  --tlh-blue-2: #86cfff;
  --tlh-cyan: #dff6ff;

  --tlh-text: #1f2937;
  --tlh-muted: #5f6b7a;

  --tlh-line: rgba(80,100,120,.22);
  --tlh-line-strong: rgba(80,100,120,.38);
}
html,body,button,input,select,textarea{
  font-family:"Segoe UI Variable Text","Segoe UI",Tahoma,Arial,sans-serif!important;
  font-kerning:normal;
  font-variant-ligatures:common-ligatures;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body.x-subpage{
  font-size:15px!important;
  line-height:1.62!important;
  letter-spacing:0!important;
}
body.x-subpage .x-nav a{
  font-size:13px!important;
  font-weight:700!important;
  letter-spacing:.015em!important;
}
body.x-subpage .x-sub-content h1,
body.x-subpage .x-sub-content h2,
body.x-subpage .x-sub-content h3,
body.x-subpage .x-sub-content h4{
  font-family:"Segoe UI Variable Display","Segoe UI",Tahoma,Arial,sans-serif!important;
  font-weight:700!important;
  letter-spacing:0!important;
  line-height:1.25!important;
  text-transform:none!important;
}
body.x-subpage .x-sub-content p,
body.x-subpage .x-sub-content li,
body.x-subpage .x-sub-content td,
body.x-subpage .x-sub-content label{
  font-size:14px!important;
  line-height:1.65!important;
  font-weight:500!important;
}
body.x-subpage .x-sub-content strong,
body.x-subpage .x-sub-content b{
  font-weight:700!important;
}

/* Guide page: fully remove legacy orange/gold styling */
body.x-subpage .guide-page-v3{
  gap:20px!important;
}
body.x-subpage .guide-main-panel,
body.x-subpage .guide-sidebar-card{
  border-color:rgba(111,202,255,.28)!important;
  background:linear-gradient(180deg,rgba(8,32,68,.97),rgba(3,16,39,.99))!important;
  box-shadow:0 16px 42px rgba(0,4,18,.28)!important;
}
body.x-subpage .guide-main-panel::before,
body.x-subpage .guide-sidebar-card::before{
  border-color:rgba(111,202,255,.12)!important;
}
body.x-subpage .guide-main-panel::after,
body.x-subpage .guide-card-v3::before,
body.x-subpage .guide-detail-section::before{
  background:linear-gradient(180deg,#69d8ff,#168fe7,#0a5dac)!important;
}
body.x-subpage .guide-hero,
body.x-subpage .guide-intro-card,
body.x-subpage .guide-check-item,
body.x-subpage .guide-card-v3,
body.x-subpage .guide-extra-box,
body.x-subpage .guide-note-box,
body.x-subpage .guide-detail-section{
  border-color:rgba(111,202,255,.25)!important;
  background:linear-gradient(180deg,rgba(7,29,61,.88),rgba(3,15,37,.9))!important;
}
body.x-subpage .guide-kicker,
body.x-subpage .guide-section-title,
body.x-subpage .guide-hero h2,
body.x-subpage .guide-intro-card h3,
body.x-subpage .guide-card-v3 h3,
body.x-subpage .guide-extra-box h3,
body.x-subpage .guide-sidebar-card h3,
body.x-subpage .guide-note-box strong,
body.x-subpage .guide-detail-section h3,
body.x-subpage .guide-body h2,
body.x-subpage .guide-body h3,
body.x-subpage .guide-body h4{
  color:#eefaff!important;
  text-shadow:none!important;
}
body.x-subpage .guide-kicker{
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.08em!important;
}
body.x-subpage .guide-section-title{
  font-size:21px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-transform:none!important;
}
body.x-subpage .guide-hero h2{
  font-size:30px!important;
}
body.x-subpage .guide-intro-card h3,
body.x-subpage .guide-card-v3 h3,
body.x-subpage .guide-extra-box h3,
body.x-subpage .guide-detail-section h3{
  font-size:17px!important;
}
body.x-subpage .guide-hero p,
body.x-subpage .guide-intro-card p,
body.x-subpage .guide-check-item,
body.x-subpage .guide-card-v3,
body.x-subpage .guide-body,
body.x-subpage .guide-extra-box p,
body.x-subpage .guide-note-box p,
body.x-subpage .guide-sidebar-card,
body.x-subpage .guide-detail-section{
  color:#c5ddec!important;
}
body.x-subpage .guide-intro-card b,
body.x-subpage .guide-step-list b,
body.x-subpage .guide-check-item::before,
body.x-subpage .guide-detail-section .step-number,
body.x-subpage .guide-detail-section [class*="number"],
body.x-subpage .guide-detail-section [class*="step"]::before{
  border-color:rgba(150,225,255,.65)!important;
  background:linear-gradient(180deg,#59cfff,#168fe7 58%,#0b68bd)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(12,124,220,.22)!important;
}
body.x-subpage .guide-check-item::before,
body.x-subpage .guide-category-list a::before,
body.x-subpage .guide-quick-list a::before,
body.x-subpage .guide-extra-box li::before{
  color:#72d9ff!important;
  background:none!important;
  box-shadow:none!important;
}
body.x-subpage .guide-category-list a,
body.x-subpage .guide-quick-list a{
  color:#d9edf8!important;
  border-color:rgba(111,202,255,.24)!important;
  background:rgba(3,15,37,.75)!important;
  font-size:13.5px!important;
  font-weight:600!important;
  line-height:1.4!important;
}
body.x-subpage .guide-category-list a:hover,
body.x-subpage .guide-quick-list a:hover{
  color:#fff!important;
  border-color:rgba(111,202,255,.56)!important;
  background:rgba(15,103,190,.27)!important;
}
body.x-subpage .guide-body a,
body.x-subpage .guide-note-box a,
body.x-subpage .guide-extra-box a{
  color:#84dcff!important;
}
body.x-subpage .guide-body a:hover,
body.x-subpage .guide-note-box a:hover,
body.x-subpage .guide-extra-box a:hover{
  color:#dff8ff!important;
}
body.x-subpage .guide-body th{
  color:#e9f9ff!important;
  background:linear-gradient(180deg,#0d447f,#092f5e)!important;
}
body.x-subpage .guide-body td{
  color:#cfe6f2!important;
  border-color:rgba(111,202,255,.2)!important;
}
body.x-subpage .guide-orange-btn,
body.x-subpage .guide-blue-btn{
  border:1px solid rgba(151,224,255,.62)!important;
  background:linear-gradient(180deg,#55ccff 0%,#168fe7 56%,#0a67bb 100%)!important;
  color:#fff!important;
  box-shadow:0 9px 24px rgba(10,117,220,.24)!important;
  font-family:"Segoe UI Variable Text","Segoe UI",Tahoma,Arial,sans-serif!important;
  font-size:13px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-transform:none!important;
  border-radius:9px!important;
}
body.x-subpage .guide-orange-btn::after,
body.x-subpage .guide-blue-btn::after{
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.25),transparent)!important;
}
body.x-subpage .guide-note-box{
  border-left:3px solid #1598ee!important;
}

/* Neutralize legacy warm colors across all subpages */
body.x-subpage [style*="#fb8a2e"],
body.x-subpage [style*="#c43a21"],
body.x-subpage [style*="#841b13"]{
  color:inherit!important;
}
body.x-subpage .contact-orange-btn,
body.x-subpage .download-btn-orange,
body.x-subpage .ui-btn,
body.x-subpage .amount-radio input:checked+span,
body.x-subpage .status-dot,
body.x-subpage .number-badge{
  border-color:rgba(151,224,255,.62)!important;
  background:linear-gradient(180deg,#55ccff 0%,#168fe7 56%,#0a67bb 100%)!important;
  color:#fff!important;
  box-shadow:0 8px 22px rgba(10,117,220,.22)!important;
}
body.x-subpage :is(.contact-kicker,.download-hero-kicker,.topup-chip,.account-chip,.tag,.badge){
  color:#eaf9ff!important;
  border-color:rgba(111,202,255,.38)!important;
  background:rgba(14,104,190,.34)!important;
}
body.x-subpage :is(.contact-page-v3,.download-page-v2,.account-page,.topup-page) h2,
body.x-subpage :is(.contact-page-v3,.download-page-v2,.account-page,.topup-page) h3,
body.x-subpage :is(.contact-page-v3,.download-page-v2,.account-page,.topup-page) h4{
  color:#eefaff!important;
  font-weight:700!important;
  text-transform:uppercase!important;
}

/* Support button */
body.x-subpage .tltd-support-toggle{
  min-height:40px!important;
  padding:0 15px!important;
  font-size:12.5px!important;
  font-weight:700!important;
  letter-spacing:0!important;
  text-transform:uppercase!important;
}

@media(max-width:640px){
  body.x-subpage{font-size:14px!important}
  body.x-subpage .guide-section-title{font-size:19px!important}
  body.x-subpage .guide-hero h2{font-size:26px!important}
  body.x-subpage .guide-intro-card h3,
  body.x-subpage .guide-card-v3 h3,
  body.x-subpage .guide-extra-box h3,
  body.x-subpage .guide-detail-section h3{font-size:16px!important}
}
/* Sửa font tiêu đề trang con */
body.x-subpage .x-sub-hero h1 {
    font-family: "Segoe UI", Tahoma, Arial, sans-serif !important;
    font-size: 42px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    word-spacing: 0 !important;
    text-transform: none !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
}

@media (max-width: 600px) {
    body.x-subpage .x-sub-hero h1 {
        font-size: 30px !important;
    }
}
body.x-subpage .x-sub-hero h1 {
    text-transform: uppercase !important;
}
/* ==================================================
   GIAO DIỆN GOLD - TOÀN BỘ TRANG CON
   Không ảnh hưởng thanh menu phía trên và trang chủ
================================================== */

body.x-subpage {
    background: linear-gradient(
        180deg,
        #d99200 0%,
        #f4bd32 45%,
        #ffd866 100%
    ) !important;
    color: #111 !important;
}

/* Nền chính phía dưới thanh menu */
body.x-subpage .x-sub-main,
body.x-subpage .x-sub-hero,
body.x-subpage .x-sub-content,
body.x-subpage .page-content {
    background-color: transparent !important;
    color: #111 !important;
}

/* Các khung nội dung, biểu mẫu, bảng thông tin */
body.x-subpage .x-sub-main section,
body.x-subpage .x-sub-main article,
body.x-subpage .x-sub-main aside,
body.x-subpage .x-sub-main form,
body.x-subpage .x-sub-main fieldset,
body.x-subpage .x-sub-main [class*="card"],
body.x-subpage .x-sub-main [class*="panel"],
body.x-subpage .x-sub-main [class*="box"],
body.x-subpage .register-hero,
body.x-subpage .register-card {
    background: linear-gradient(
        145deg,
        rgba(255, 220, 105, 0.97),
        rgba(232, 166, 20, 0.97)
    ) !important;
    border-color: #6e4700 !important;
    color: #111 !important;
}

/* Toàn bộ chữ trong phần nội dung thành màu đen */
body.x-subpage .x-sub-main h1,
body.x-subpage .x-sub-main h2,
body.x-subpage .x-sub-main h3,
body.x-subpage .x-sub-main h4,
body.x-subpage .x-sub-main h5,
body.x-subpage .x-sub-main h6,
body.x-subpage .x-sub-main p,
body.x-subpage .x-sub-main span,
body.x-subpage .x-sub-main strong,
body.x-subpage .x-sub-main small,
body.x-subpage .x-sub-main label,
body.x-subpage .x-sub-main li,
body.x-subpage .x-sub-main td,
body.x-subpage .x-sub-main th,
body.x-subpage .x-sub-main a {
    color: #111 !important;
    text-shadow: none !important;
}

/* Ô nhập liệu */
body.x-subpage .x-sub-main input,
body.x-subpage .x-sub-main textarea,
body.x-subpage .x-sub-main select {
    background: #fff2bd !important;
    color: #111 !important;
    border-color: #795000 !important;
}

body.x-subpage .x-sub-main input::placeholder,
body.x-subpage .x-sub-main textarea::placeholder {
    color: #6c5725 !important;
    opacity: 1 !important;
}

/* Nút bấm nền gold, chữ đen */
body.x-subpage .x-sub-main button,
body.x-subpage .x-sub-main input[type="submit"],
body.x-subpage .x-sub-main .btn,
body.x-subpage .x-sub-main [class*="-btn"] {
    background: linear-gradient(
        180deg,
        #ffe074,
        #d99400
    ) !important;
    color: #111 !important;
    border-color: #704900 !important;
    text-shadow: none !important;
}

/* Đường viền và bảng */
body.x-subpage .x-sub-main table,
body.x-subpage .x-sub-main tr,
body.x-subpage .x-sub-main td,
body.x-subpage .x-sub-main th {
    border-color: #765000 !important;
}
/* NỀN TRẮNG NGÀ PHA VÀNG CHO PHẦN NGOÀI */
body.x-subpage,
body.x-subpage .x-sub-main {
    background: #fff2c7 !important;
}

/* BANNER PHÍA TRÊN SÁNG HƠN */
body.x-subpage .x-sub-hero,
body.x-subpage .x-sub-hero-bg {
    background:
        radial-gradient(
            circle at 28% 48%,
            rgba(255, 235, 166, 0.88) 0%,
            rgba(255, 244, 207, 0.78) 35%,
            rgba(238, 201, 104, 0.68) 70%,
            rgba(214, 164, 54, 0.62) 100%
        ) !important;
}

/* Nếu banner có lớp phủ tối thì làm nó sáng lại */
body.x-subpage .x-sub-hero::before,
body.x-subpage .x-sub-hero::after,
body.x-subpage .x-sub-hero-bg::before,
body.x-subpage .x-sub-hero-bg::after {
    background: rgba(255, 242, 198, 0.20) !important;
}
/* TOÀN BỘ CHỮ TRANG CON: NÂU PHA XANH */
body.x-subpage .x-sub-main,
body.x-subpage .x-sub-main * {
    color: #3b5048 !important;
    -webkit-text-fill-color: #3b5048 !important;
    text-shadow: uppercase !important;
}
