/*
Theme Name: Mercury Child
Theme URI: https://mercurytheme.com/
Description: Child theme for Mercury theme
Author: MercuryTheme.com
Author URI: https://mercurytheme.com/
Template: mercury
Version: 3.9.10
*/
@import url("../mercury/style.css");

.custom-scroll {
    max-height: 600px; /* Đặt chiều cao tối đa phù hợp với khung hình */
    overflow-y: auto; /* Thêm thanh trượt dọc nếu nội dung dài */
    padding-right: 15px; /* Tùy chỉnh khoảng cách nếu cần */
}

.disclosure-box {
  width: 100%;
  box-sizing: border-box;
  margin: 28px 0;
  padding: 16px 18px;

  background-color: #fff9e6;        /* vàng nhạt */
  border: 2px dashed #f2a23a;       /* cam nét đứt */
  border-radius: 6px;

  font-size: 0.92rem;
  line-height: 1.65;
  color: #333;
}

.disclosure-box strong {
  display: block;
  margin-bottom: 6px;
  font-weight: 600;
  color: #8a5a00;                   /* cam nâu nhẹ */
}


/* ═══════════════════════════════════════════════════
   GAMEDOITHUONG.COM.CO — Mobile Responsive v2
   Dùng CLASS selector — không dùng attribute selector
   Paste vào: Appearance > Customize > Additional CSS
   Breakpoints: 900 | 768 | 600 | 480 | 360px
═══════════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; }
body { overflow-x: hidden; }
img, video, iframe { max-width: 100%; height: auto; }
a { word-break: break-word; }
 
/* ══ TABLET ≤ 900px ══ */
@media (max-width: 900px) {
  .gdt-grid2 { grid-template-columns: 1fr !important; gap: 10px !important; }
}
 
/* ══ MOBILE ≤ 768px ══ */
@media (max-width: 768px) {
  /* Hero */
  .gdt-hero { padding: 24px 14px 20px !important; }
  .gdt-hero h1 { font-size: 20px !important; line-height: 1.35 !important; }
  .gdt-hero > p:first-of-type { font-size: 13.5px !important; max-width: 100% !important; }
 
  /* Disclaimer */
  .gdt-disclaimer { display: block !important; padding: 8px 11px !important; }
  .gdt-disclaimer p { font-size: 11px !important; }
 
  /* H2 wrapper flex → block */
  .gdt-h2wrap { display: block !important; }
  /* H2 badge */
  .gdt-h2 {
    font-size: 15px !important;
    padding: 6px 12px !important;
    display: block !important;
    width: 100% !important;
    line-height: 1.45 !important;
  }
 
  /* Tags hero */
  .gdt-tags span { font-size: 11px !important; padding: 4px 10px !important; }
 
  /* Grids → 1 cột */
  .gdt-grid2 { grid-template-columns: 1fr !important; gap: 10px !important; }
 
  /* Table scroll */
  .gdt-table-wrap { overflow-x: auto !important; display: block !important; -webkit-overflow-scrolling: touch !important; }
  .gdt-table-wrap table { display: block !important; overflow-x: auto !important; min-width: 540px; }
  .gdt-table-wrap th, .gdt-table-wrap td { padding: 8px 10px !important; font-size: 12px !important; white-space: nowrap; }
 
  /* Game cards */
  .gdt-card { padding: 13px 12px !important; }
  .gdt-card h3 { font-size: 14px !important; }
  .gdt-card > p { font-size: 12px !important; text-align: left !important; }
  .gdt-card .badge-row span { font-size: 10.5px !important; padding: 2px 6px !important; }
 
  /* Xu hướng cards */
  .gdt-trend-card { padding: 12px 12px !important; }
  .gdt-trend-card p:first-child { font-size: 13px !important; }
  .gdt-trend-card p:last-child { font-size: 12px !important; text-align: left !important; }
 
  /* Cảnh báo lừa đảo */
  .gdt-fraud-item { padding: 8px 10px !important; }
  .gdt-fraud-item p { font-size: 12px !important; text-align: left !important; }
 
  /* Timeline */
  .gdt-step-num { width: 34px !important; height: 34px !important; font-size: 13px !important; flex-shrink: 0 !important; }
 
  /* FAQ */
  .gdt-faq-q { padding: 11px 12px !important; }
  .gdt-faq-q p { font-size: 13px !important; }
  .gdt-faq-a { padding: 11px 12px !important; }
  .gdt-faq-a p { font-size: 12px !important; text-align: left !important; }
 
  /* Về chúng tôi */
  .gdt-about { padding: 16px 13px !important; }
  .gdt-about h2 { font-size: 18px !important; }
 
  /* Paragraph chung */
  p { font-size: 13px !important; line-height: 1.70 !important; }
 
  /* text-align justify → left trên mobile */
  [style*="text-align: justify"] { text-align: left !important; }
 
  /* margin sections */
  [style*="margin-bottom: 32px"] { margin-bottom: 22px !important; }
  [style*="margin-bottom: 20px"] { margin-bottom: 14px !important; }
 
  /* Plugin casino cards */
  .aces-casino-item, .casino-item, .casino-card,
  [class*="casino-"], [class*="aces-"] {
    width: 100% !important; float: none !important; margin-bottom: 12px !important;
  }
  .casino-list, .aces-list { display: flex !important; flex-direction: column !important; gap: 12px !important; }
  .casino-item a[class*="button"], .casino-item a[class*="btn"],
  .casino-item .btn, [class*="casino-"] a[class*="btn"] {
    display: block !important; width: 100% !important; text-align: center !important;
    padding: 10px 12px !important; font-size: 13px !important; min-height: 44px !important;
  }
}
 
/* ══ MOBILE ≤ 600px ══ */
@media (max-width: 600px) {
  .container, .large-container { padding-left: 12px !important; padding-right: 12px !important; }
  .gdt-hero { padding: 20px 12px 16px !important; }
  .gdt-hero h1 { font-size: 18px !important; }
  .gdt-h2 { font-size: 14px !important; padding: 5px 10px !important; }
  p { font-size: 12.5px !important; }
  .gdt-tags span { font-size: 10.5px !important; padding: 3px 9px !important; }
  .gdt-card { padding: 11px 10px !important; }
  .gdt-faq-q p { font-size: 12.5px !important; }
  .gdt-faq-a p { font-size: 11.5px !important; }
}
 
/* ══ MOBILE NHỎ ≤ 480px ══ */
@media (max-width: 480px) {
  .gdt-hero { padding: 18px 11px 14px !important; }
  .gdt-hero h1 { font-size: 17px !important; line-height: 1.38 !important; }
  .gdt-h2 { font-size: 13px !important; }
  .gdt-about h2 { font-size: 16px !important; }
  .gdt-step-num { width: 30px !important; height: 30px !important; font-size: 12px !important; }
  p { font-size: 12px !important; line-height: 1.68 !important; }
  [style*="margin-bottom: 32px"] { margin-bottom: 18px !important; }
}
 
/* ══ MOBILE RẤT NHỎ ≤ 360px ══ */
@media (max-width: 360px) {
  .gdt-hero h1 { font-size: 16px !important; }
  .gdt-h2 { font-size: 12.5px !important; padding: 5px 8px !important; }
  .gdt-hero { padding: 16px 10px 12px !important; }
  .gdt-about { padding: 12px 10px !important; }
  p { font-size: 11.5px !important; }
  .container, .large-container { padding-left: 8px !important; padding-right: 8px !important; }
}