/*
Theme Name: Flatsome Child
Description: DA88 - Nhà Cái Casino Trực Tuyến Uy Tín Hàng Đầu
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/* =============================================
   DA88 BRAND SYSTEM
   Navy Dark: #0a1628  |  Gold: #C9A84C  |  Blue: #1a5276
   Casino Premium - Sang trọng, đẳng cấp
   ============================================= */
:root {
  --da-gold:        #C9A84C;
  --da-gold-light:  #E0C97A;
  --da-gold-dark:   #9E8338;
  --da-navy:        #0a1628;
  --da-navy-2:      #0d1d33;
  --da-navy-3:      #122a4a;
  --da-blue:        #1a5276;
  --da-bg:          #f0f2f5;
  --da-white:       #ffffff;
  --da-text:        #1a1a2e;
  --da-text-muted:  #6b7b8d;
  --da-border:      #dde3ea;
  --da-radius:      10px;
  --da-shadow:      0 4px 24px rgba(10,22,40,0.12);
  --da-shadow-gold: 0 4px 20px rgba(201,168,76,0.25);
  --da-transition:  all 0.3s cubic-bezier(0.4,0,0.2,1);
  --da-font:        'Be Vietnam Pro', 'Inter', sans-serif;
}

@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@300;400;500;600;700;800;900&display=swap');

*, *::before, *::after { box-sizing: border-box; }

body, input, select, textarea {
  font-family: var(--da-font) !important;
  -webkit-font-smoothing: antialiased;
}
/* Dark text only for inner pages */
body:not(.page-id-462),
body:not(.page-id-462) input,
body:not(.page-id-462) button,
body:not(.page-id-462) select,
body:not(.page-id-462) textarea {
  color: var(--da-text) !important;
}

/* Force dark text on inner pages */
body:not(.page-id-462) .page-wrapper,
body:not(.page-id-462) .entry-content,
body:not(.page-id-462) .entry-content p,
body:not(.page-id-462) .entry-content li,
body:not(.page-id-462) .entry-content span,
body:not(.page-id-462) .col-inner,
body:not(.page-id-462) .col-inner p,
body:not(.page-id-462) .section,
body:not(.page-id-462) p,
body:not(.page-id-462) li {
  color: #1a1a2e !important;
}
body:not(.page-id-462) h1,
body:not(.page-id-462) h2,
body:not(.page-id-462) h3 {
  color: var(--da-navy) !important;
}
body:not(.page-id-462) .entry-content a {
  color: var(--da-blue) !important;
}

/* =============================================
   HEADER
   ============================================= */
#header, .header-wrapper, .header-main {
  background: var(--da-navy) !important;
}
#header {
  border-bottom: 2px solid var(--da-gold) !important;
  box-shadow: 0 2px 20px rgba(0,0,0,0.4) !important;
}
.is-sticky #header {
  background: rgba(10,22,40,0.97) !important;
  backdrop-filter: blur(10px);
}
.header-logo img {
  max-height: 55px !important; width: auto !important;
  filter: drop-shadow(0 2px 6px rgba(201,168,76,0.2));
}

/* Nav */
#main-nav > ul > li > a {
  color: #fff !important; font-weight: 700 !important;
  font-size: 14px !important; padding: 8px 14px !important;
  border-radius: var(--da-radius); transition: var(--da-transition);
}
#main-nav > ul > li > a:hover,
#main-nav > ul > li.current-menu-item > a {
  color: var(--da-gold) !important;
  background: rgba(201,168,76,0.1) !important;
}
.nav-dropdown, ul.nav-dropdown {
  background: var(--da-navy-2) !important;
  border-top: 2px solid var(--da-gold) !important;
  border-radius: 0 0 var(--da-radius) var(--da-radius) !important;
}
.nav-dropdown li a {
  color: #b0bec5 !important; font-size: 13px !important;
  padding: 10px 18px !important; transition: var(--da-transition);
}
.nav-dropdown li a:hover {
  color: var(--da-gold) !important;
  background: rgba(201,168,76,0.06) !important;
}

/* Mobile */
.header-mobile-bar, #mobile-menu-bar { background: var(--da-navy) !important; }
.mobile-sidebar-wrapper, #mobile-sidebar {
  background: var(--da-navy) !important;
  border-right: 2px solid var(--da-gold) !important;
}
.mobile-nav li a { color: #fff !important; border-bottom: 1px solid rgba(201,168,76,0.12) !important; }
.mobile-nav li a:hover { color: var(--da-gold) !important; }

/* =============================================
   BODY / PAGE BACKGROUND
   ============================================= */
body { background: var(--da-bg) !important; }
.page-wrapper { background: var(--da-bg) !important; }

/* =============================================
   TYPOGRAPHY
   ============================================= */
h1, h2, h3, h4 {
  font-family: var(--da-font) !important;
  font-weight: 800 !important; line-height: 1.3;
}
.entry-content { font-size: 15px; line-height: 1.75; }
.entry-content h2 {
  border-left: 4px solid var(--da-gold); padding-left: 14px;
  margin: 2rem 0 1rem;
}
.entry-content a { font-weight: 500; }
.entry-content a:hover { color: var(--da-gold-dark) !important; }

/* =============================================
   BUTTONS
   ============================================= */
.button.primary, a.button.primary, input[type="submit"] {
  background: linear-gradient(135deg, var(--da-gold) 0%, var(--da-gold-dark) 100%) !important;
  color: var(--da-navy) !important; border: none !important;
  font-weight: 800 !important; border-radius: 8px !important;
  box-shadow: var(--da-shadow-gold) !important;
}
.button.primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 30px rgba(201,168,76,0.4) !important;
}

/* =============================================
   CARDS / CONTENT
   ============================================= */
.entry-content table th {
  background: var(--da-navy) !important; color: var(--da-gold) !important;
  font-weight: 700; padding: 12px 16px;
}
.entry-content table td {
  padding: 11px 16px; border-bottom: 1px solid var(--da-border);
}

/* Blog posts */
.blog-item, .post-item {
  border-radius: 10px !important; overflow: hidden;
  box-shadow: var(--da-shadow) !important; transition: var(--da-transition) !important;
}
.blog-item:hover { transform: translateY(-4px) !important; }

/* Silo links */
.silo-nav-box {
  background: linear-gradient(135deg, var(--da-navy), var(--da-navy-2));
  border-radius: 12px; padding: 22px 24px; margin: 2rem 0;
  border: 1px solid rgba(201,168,76,0.2);
}
.silo-nav-box h3 { color: var(--da-gold) !important; font-size: 1rem !important; }
.silo-nav-box ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.silo-nav-box ul li a {
  display: inline-block; background: rgba(201,168,76,0.1);
  color: var(--da-gold-light) !important; border: 1px solid rgba(201,168,76,0.2);
  border-radius: 20px; padding: 5px 14px; font-size: 13px; text-decoration: none !important;
  transition: var(--da-transition);
}
.silo-nav-box ul li a:hover {
  background: var(--da-gold) !important; color: var(--da-navy) !important;
}

/* =============================================
   FOOTER
   ============================================= */
#footer, .footer-wrapper {
  background: var(--da-navy) !important;
  border-top: 2px solid var(--da-gold) !important;
  color: #8899aa !important;
}
#footer a { color: #8899aa !important; }
#footer a:hover { color: var(--da-gold) !important; }
#footer-bar, .footer-bottom {
  background: #061020 !important;
  border-top: 1px solid rgba(201,168,76,0.1) !important;
}
.da-footer-links { list-style: none; padding: 0; margin: 0; }
.da-footer-links li { margin-bottom: 8px; }
.da-footer-links li a {
  color: #8899aa !important; font-size: 13px; text-decoration: none;
  transition: color 0.2s; display: block;
}
.da-footer-links li a:hover { color: var(--da-gold) !important; padding-left: 4px; }

/* =============================================
   MOBILE CTA BAR
   ============================================= */
.mobile-cta-bar {
  position: fixed; bottom: 0; left: 0; right: 0;
  background: var(--da-navy); padding: 10px 14px; z-index: 9999;
  display: flex; gap: 10px; border-top: 2px solid var(--da-gold);
}
.mobile-cta-bar .btn-cta {
  flex: 1; text-align: center; padding: 12px;
  border-radius: 8px; font-weight: 800; font-size: 14px; text-decoration: none;
}
.mobile-cta-bar .btn-register {
  background: linear-gradient(135deg, var(--da-gold), var(--da-gold-dark));
  color: var(--da-navy) !important;
}
.mobile-cta-bar .btn-login {
  background: transparent; color: #fff !important; border: 2px solid var(--da-gold);
}

/* =============================================
   HOMEPAGE - Dark Casino Theme (page-id-462)
   ============================================= */
body.page-id-462 { background: var(--da-navy) !important; }
body.page-id-462 .page-wrapper { background: var(--da-navy) !important; }

/* Hero */
.da-hero-badge {
  display: inline-flex; align-items: center; gap: 10px;
  background: rgba(39,174,96,0.1); border: 1px solid rgba(39,174,96,0.3);
  border-radius: 50px; padding: 8px 20px; margin-bottom: 24px;
  font-size: 13px; color: #27ae60;
}
.da-pulse {
  width: 10px; height: 10px; background: #27ae60;
  border-radius: 50%; display: inline-block;
  animation: da-pulse 2s ease-in-out infinite;
}
@keyframes da-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(39,174,96,0.5); }
  50% { box-shadow: 0 0 0 8px rgba(39,174,96,0); }
}
.da-badge-text { font-weight: 700; color: #27ae60; }
.da-badge-time { font-size: 11px; color: #6b7b8d; }

.da-hero-title {
  font-size: 2.8rem !important; font-weight: 900 !important;
  color: var(--da-gold) !important; margin-bottom: 16px !important;
  line-height: 1.15 !important;
}
.da-hero-sub {
  font-size: 17px; color: #8899aa; max-width: 620px;
  margin: 0 auto 30px; line-height: 1.7;
}

/* CTA */
.da-cta-group { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-bottom: 40px; }
.da-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 16px 34px; border-radius: 10px; font-size: 16px;
  font-weight: 800; text-decoration: none !important; cursor: pointer;
  transition: var(--da-transition); border: none; font-family: var(--da-font);
}
.da-btn-primary {
  background: linear-gradient(135deg, var(--da-gold) 0%, var(--da-gold-dark) 100%);
  color: var(--da-navy) !important; box-shadow: var(--da-shadow-gold);
}
.da-btn-primary:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 35px rgba(201,168,76,0.45);
  color: var(--da-navy) !important;
}
.da-btn-outline {
  background: transparent; color: var(--da-gold) !important;
  border: 2px solid var(--da-gold);
}
.da-btn-outline:hover {
  background: var(--da-gold); color: var(--da-navy) !important;
  transform: translateY(-3px);
}
.da-btn-sm {
  padding: 10px 20px; font-size: 13px; border-radius: 8px;
  background: transparent; color: var(--da-gold) !important;
  border: 1px solid var(--da-gold); text-decoration: none !important;
}
.da-btn-sm:hover { background: var(--da-gold); color: var(--da-navy) !important; }

/* Trust Bar */
.da-trust-bar {
  display: flex; justify-content: center; gap: 50px; flex-wrap: wrap;
  padding: 28px 0; border-top: 1px solid rgba(255,255,255,0.06);
}
.da-trust-item { text-align: center; }
.da-trust-num {
  display: block; font-size: 1.4rem; font-weight: 900;
  color: var(--da-gold); line-height: 1;
}
.da-trust-label {
  display: block; font-size: 11px; color: #6b7b8d;
  margin-top: 4px; text-transform: uppercase; letter-spacing: 0.5px;
}

/* Section Titles */
.da-section-title {
  font-size: 1.8rem !important; font-weight: 900 !important;
  color: var(--da-gold) !important; margin-bottom: 8px !important;
}
.da-section-sub { font-size: 15px; color: #6b7b8d; margin-bottom: 30px; }

/* Lobby Cards */
.da-lobby-card {
  display: block; background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06); border-radius: 14px;
  padding: 28px 20px; text-align: center; text-decoration: none !important;
  transition: var(--da-transition); position: relative; overflow: hidden;
}
.da-lobby-card:hover {
  background: rgba(201,168,76,0.08); border-color: var(--da-gold);
  transform: translateY(-4px);
  box-shadow: 0 10px 30px rgba(201,168,76,0.15);
}
.da-lobby-icon { font-size: 2.8rem; margin-bottom: 12px; }
.da-lobby-card h3 {
  color: #fff !important; font-size: 1.1rem !important;
  margin-bottom: 8px !important; font-weight: 800 !important;
}
.da-lobby-card p { color: #6b7b8d !important; font-size: 13px; line-height: 1.5; margin: 0; }
.da-lobby-tag {
  position: absolute; top: 12px; right: 12px;
  background: #e74c3c; color: #fff !important; font-size: 10px;
  font-weight: 800; padding: 3px 8px; border-radius: 4px;
  text-transform: uppercase; letter-spacing: 0.5px;
}
.da-tag-new { background: #27ae60; }

/* Lobby CTA Button */
.da-lobby-cta {
  display: inline-block; margin-top: 16px;
  padding: 8px 22px; border-radius: 8px;
  border: 1px solid var(--da-gold); background: transparent;
  color: var(--da-gold) !important; font-size: 13px; font-weight: 700;
  transition: var(--da-transition); letter-spacing: 0.3px;
}
.da-lobby-card:hover .da-lobby-cta {
  background: var(--da-gold); color: var(--da-navy) !important;
  box-shadow: 0 4px 14px rgba(201,168,76,0.3);
}

/* Promo Cards */
.da-promo-card {
  background: rgba(255,255,255,0.04); border: 1px solid rgba(201,168,76,0.15);
  border-radius: 14px; padding: 28px; transition: var(--da-transition);
}
.da-promo-card:hover {
  border-color: var(--da-gold);
  box-shadow: 0 8px 30px rgba(201,168,76,0.12);
}
.da-promo-badge {
  display: inline-block; background: rgba(201,168,76,0.15);
  color: var(--da-gold) !important; font-size: 12px; font-weight: 800;
  padding: 4px 12px; border-radius: 6px; margin-bottom: 12px;
}
.da-promo-vip { background: rgba(231,76,60,0.15); color: #e74c3c !important; }
.da-promo-card h3 { color: #fff !important; font-size: 1.15rem !important; margin-bottom: 8px !important; }
.da-promo-card p { color: #8899aa !important; font-size: 14px; line-height: 1.6; }

/* Features */
.da-features { display: flex; flex-direction: column; gap: 20px; margin-top: 30px; }
.da-feature-item {
  display: flex; gap: 18px; align-items: flex-start;
  background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.05);
  border-radius: 12px; padding: 22px; transition: var(--da-transition);
}
.da-feature-item:hover { border-color: rgba(201,168,76,0.25); background: rgba(201,168,76,0.04); }
.da-feature-icon { font-size: 2rem; flex-shrink: 0; }
.da-feature-item h4 { color: #fff !important; font-size: 1rem !important; margin: 0 0 6px !important; }
.da-feature-item p { color: #8899aa !important; font-size: 13px; line-height: 1.6; margin: 0; }

/* FAQ */
.da-faq-list { max-width: 100%; }
.da-faq-item { margin-bottom: 8px; border-radius: 10px; overflow: hidden; border: 1px solid rgba(255,255,255,0.06); }
.da-faq-q {
  width: 100%; padding: 16px 20px; background: rgba(255,255,255,0.03);
  border: none; color: #FFFFFF !important; font-size: 15px; font-weight: 700;
  text-align: left; cursor: pointer; transition: all 0.3s;
  font-family: var(--da-font); display: flex; justify-content: space-between; align-items: center;
}
.da-faq-q::after { content: '+'; font-size: 1.4rem; color: var(--da-gold); transition: transform 0.3s; }
.da-faq-q:hover { background: rgba(201,168,76,0.06); }
.da-faq-item.open .da-faq-q { background: rgba(201,168,76,0.1); color: var(--da-gold) !important; }
.da-faq-item.open .da-faq-q::after { transform: rotate(45deg); }
.da-faq-a {
  max-height: 0; overflow: hidden; transition: max-height 0.5s ease, padding 0.3s;
  font-size: 14px; line-height: 1.7; color: #8899aa !important; padding: 0 20px;
}
.da-faq-item.open .da-faq-a { max-height: 500px; padding: 16px 20px; }
.da-faq-a code { background: rgba(201,168,76,0.12); color: var(--da-gold); padding: 2px 8px; border-radius: 4px; }
.da-faq-a a { color: var(--da-gold) !important; }

/* =============================================
   RESPONSIVE
   ============================================= */
@media only screen and (max-width: 768px) {
  .da-hero-title { font-size: 1.8rem !important; }
  .da-hero-sub { font-size: 15px; }
  .da-cta-group { flex-direction: column; padding: 0 20px; }
  .da-btn { width: 100%; justify-content: center; }
  .da-trust-bar { gap: 20px; }
  .da-section-title { font-size: 1.3rem !important; }
  .da-features { gap: 12px; }
  .da-feature-item { padding: 16px; }
  body { padding-bottom: 68px; }
  .silo-nav-box ul { flex-direction: column; }
}

@media only screen and (max-width: 480px) {
  .da-lobby-card { padding: 20px 16px; }
}

/* PERFORMANCE */
img { height: auto; max-width: 100%; }
img[loading="lazy"] { content-visibility: auto; }