/* Mobile responsive - giống rongbachkim.net */

/* Cho phép scroll ngang toàn trang */
html, body {
    min-width: 320px;
}

/* ===== HEADER + NAV MOBILE (giống rongbachkim.net) ===== */
/* Hiện mobile header/nav, ẩn desktop khi màn hình <= 768px */
@media (max-width: 768px) {
    .rbk-desktop-header {
        display: none !important;
    }
    .rbk-mobile-header {
        display: block !important;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 2;
    }
}

/* Ẩn mobile, hiện desktop khi > 768px */
@media (min-width: 769px) {
    .rbk-mobile-header {
        display: none !important;
    }
}

/* Wapnav + navholder - style giống rongbachkim.net */
.wapnav:link, .wapnav:visited, .wapnav:hover, .wapnav:active {
    font-weight: bold;
    font-size: 13px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    color: #F4F4F4;
    background: #3c75ca;
    margin: 2px;
    padding: 8px 10px;
    display: inline-block;
    text-decoration: none;
}
.wapnav:hover, .wapnav:active {
    background: #4895e1;
    color: white;
}
.wapnav_on:link, .wapnav_on:visited, .wapnav_on:hover, .wapnav_on:active {
    background: #F59650;
    color: white;
}
.navholder {
    background: #F2F2F2;
    padding: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: flex-start;
    align-items: center;
}

/* QUAN TRỌNG: Giữ nguyên cấu trúc table KQXS - không chuyển thành block */
.kqtable {
    display: table !important;
}
.kqtable > tbody {
    display: table-row-group !important;
}
.kqtable > tbody > tr {
    display: table-row !important;
}
.kqtable > tbody > tr > td {
    display: table-cell !important;
    vertical-align: top !important;
}
.ketqua {
    display: inline-block !important;
}
.ketqua thead, .ketqua tbody {
    display: table-header-group !important;
}
.ketqua tbody {
    display: table-row-group !important;
}
.ketqua tr {
    display: table-row !important;
}
.ketqua td, .ketqua th {
    display: table-cell !important;
}
.dau, .dit {
    display: inline-block !important;
}
.dau tr, .dit tr {
    display: table-row !important;
}
.dau td, .dau th, .dit td, .dit th {
    display: table-cell !important;
}

/* Menu: luôn scroll ngang */
.menuwrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}
.menuwrap > div {
    min-width: 1001px !important;
}

/* Bảng kết quả: scroll ngang khi cần */
#tttt {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* 2 cột layout: chuyển 1 cột trên màn hình nhỏ */
@media (max-width: 1024px) {
    .header-inner {
        max-width: 100% !important;
        padding: 0 8px !important;
        box-sizing: border-box !important;
    }
    
    .contentwrapper {
        flex-direction: column !important;
        padding: 10px 8px !important;
    }
    .contentleft {
        max-width: 100% !important;
        width: 100% !important;
    }
    .contentright {
        width: 100% !important;
        padding-left: 0 !important;
        margin-top: 15px !important;
    }
}

/* Tablet và mobile: scale font nhỏ hơn một chút */
@media (max-width: 768px) {
    .ketqua th {
        min-width: 200px !important;
    }
    .ketqua * {
        font-size: 12px !important;
        padding: 5px 4px !important;
    }
    .ketqua .kq_0 {
        font-size: 18px !important;
    }
    .ketqua .leftcol {
        font-size: 11px !important;
    }
    
    .dau *, .dit * {
        font-size: 12px !important;
        padding: 4px 3px !important;
    }
    
    #tknhanh .tbl1 {
        margin: 3px !important;
    }
    .tbl1 td {
        padding: 2px 4px !important;
        font-size: 11px !important;
    }
    
    .caudep {
        font-size: 13px !important;
        padding: 4px 5px !important;
        margin: 2px !important;
    }
    
    .contentbox {
        margin: 5px 3px !important;
    }
    .contentbox_header div {
        font-size: 12px !important;
    }
    .contentbox_body {
        padding: 6px !important;
    }
}

/* Mobile nhỏ */
@media (max-width: 480px) {
    .header-inner {
        height: auto !important;
        min-height: 60px !important;
        padding: 5px !important;
    }
    .header-inner img {
        max-height: 35px !important;
    }
    
    #clock {
        display: none !important;
    }
    #loginbox {
        font-size: 11px !important;
    }
    
    .ketqua th {
        min-width: 160px !important;
    }
    .ketqua * {
        font-size: 11px !important;
        padding: 4px 3px !important;
    }
    .ketqua .kq_0 {
        font-size: 16px !important;
    }
    
    .dau *, .dit * {
        font-size: 11px !important;
        padding: 3px 2px !important;
    }
    
    .tbl1 td {
        padding: 1px 3px !important;
        font-size: 10px !important;
    }
    
    .ganbar-s {
        width: 28px !important;
        height: 80px !important;
        font-size: 12px !important;
    }
    .ganbar-s2 {
        width: 28px !important;
    }
    .gandiv, .gandiv2 {
        width: 28px !important;
        font-size: 10px !important;
    }
    .tongnum {
        font-size: 11px !important;
    }
    
    .caudep {
        font-size: 12px !important;
        padding: 3px 4px !important;
        margin: 1px !important;
    }
}

/* Spacer height cho header */
@media (max-width: 1024px) {
    .mainwrapper > div:first-child {
        height: 110px !important;
    }
}
/* Mobile: header mới (navholder) cao hơn */
@media (max-width: 768px) {
    .mainwrapper > div:first-child {
        height: 140px !important;
    }
    body.rbk-pcmode .mainwrapper > div:first-child {
        height: 114px !important;
    }
}
@media (max-width: 480px) {
    .mainwrapper > div:first-child {
        height: 150px !important;
    }
    .wapnav {
        font-size: 12px !important;
        padding: 6px 8px !important;
    }
}

/* Touch friendly */
@media (hover: none) and (pointer: coarse) {
    .nav a {
        min-height: 37px;
        display: flex;
        align-items: center;
    }
    input, select, textarea {
        min-height: 40px !important;
        font-size: 16px !important;
    }
}