/* Mobile & Performance Optimization Stylesheet */
html, body {
  max-width: 100vw;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

/* Smooth mobile scrolling for lotto tables */
.result-board,
.table-responsive,
.table-lotto {
  -webkit-overflow-scrolling: touch;
}

/* Ensure lotto tables never break out of container on small screens */
.table-lotto {
  table-layout: fixed;
  width: 100% !important;
  max-width: 100% !important;
}

/* Mobile optimizations for small screens <= 480px */
@media (max-width: 480px) {
  /* Province result tables with 3-4 columns (Miền Nam, Miền Trung) */
  .table-4-provinces .txt-normal-prize,
  .table-4-provinces .txt-special-prize {
    font-size: 13px !important;
    letter-spacing: -0.3px;
    padding: 2px 1px !important;
  }
  
  .table-lotto td,
  .table-lotto th {
    padding: 4px 1px !important;
  }
  
  /* Numbers on single region table (Miền Bắc) */
  .txt-special-prize {
    font-size: 22px !important;
  }
  .txt-normal-prize {
    font-size: 16px !important;
  }
  
  /* Sidebar menu touch targets */
  #sidebar-menu {
    max-width: 85vw;
  }
  #sidebar-menu .nav-link {
    padding: 12px 16px;
    font-size: 15px;
  }
  
  /* Search & Dò vé số form controls touch friendly */
  .form-control, .form-select, .btn {
    min-height: 44px;
    font-size: 15px;
  }
  
  /* Keyword tag pills */
  .keyword-group {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }
  .keyword-group li {
    font-size: 11px;
    padding: 2px 6px;
    margin-right: 4px;
  }
}

/* Ultra small devices (iPhone SE, <= 360px) */
@media (max-width: 360px) {
  .table-4-provinces .txt-normal-prize,
  .table-4-provinces .txt-special-prize {
    font-size: 11.5px !important;
  }
  .table-4-provinces th {
    font-size: 11px !important;
  }
}
