/* =======================================================
   SOI CẦU CHUẨN 247 - CLEAN SCOPED HOMEPAGE CSS
   Hoàn toàn độc lập, không ghi đè layout toàn cục của theme
   ======================================================= */

.soicau-home-main-wrapper {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    font-size: 14px;
    color: #333;
}

/* Scoped Grid */
.soicau-home-main-wrapper .row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -5px !important;
    margin-right: -5px !important;
    width: auto !important;
    max-width: 100% !important;
}
.soicau-home-main-wrapper [class*="col-"] {
    padding-left: 5px !important;
    padding-right: 5px !important;
    box-sizing: border-box !important;
}
.soicau-home-main-wrapper .col-12 { flex: 0 0 100% !important; max-width: 100% !important; }
.soicau-home-main-wrapper .col-6 { flex: 0 0 50% !important; max-width: 50% !important; }
.soicau-home-main-wrapper .col-3 { flex: 0 0 25% !important; max-width: 25% !important; }
@media (min-width: 768px) {
    .soicau-home-main-wrapper .col-md-6 { flex: 0 0 50% !important; max-width: 50% !important; }
}
@media (min-width: 992px) {
    .soicau-home-main-wrapper .col-lg-6 { flex: 0 0 50% !important; max-width: 50% !important; }
    .soicau-home-main-wrapper .col-lg-4 { flex: 0 0 33.3333% !important; max-width: 33.3333% !important; }
    .soicau-home-main-wrapper .col-lg-8 { flex: 0 0 66.6667% !important; max-width: 66.6667% !important; }
}

/* Colors & Backgrounds */
.bg-red1 { background-color: #d32f2f !important; }
.bg-red2 { background-color: #C62828 !important; }
.bg-blue1 { background-color: #004593 !important; }
.bg-blue2 { background-color: #0d6efd !important; }
.bg-orange { background-color: #fd7e14 !important; }
.bg-black5 { background-color: #f8f9fa !important; }
.text-red, .text-red1 { color: #C62828 !important; }
.text-white { color: #ffffff !important; }

/* Typography */
.font-13 { font-size: 13px !important; }
.font-14 { font-size: 14px !important; }
.font-15 { font-size: 15px !important; }
.font-16 { font-size: 16px !important; }
.font-18 { font-size: 18px !important; }
.font-20 { font-size: 20px !important; }
.font-24 { font-size: 24px !important; }
.font-28 { font-size: 28px !important; }
.font-weight-bold { font-weight: 700 !important; }
.text-uppercase { text-transform: uppercase !important; }
.text-center { text-align: center !important; }

/* Spacing */
.soicau-home-main-wrapper .my-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }
.soicau-home-main-wrapper .my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.soicau-home-main-wrapper .mb-0 { margin-bottom: 0 !important; }
.soicau-home-main-wrapper .mb-2 { margin-bottom: 0.5rem !important; }
.soicau-home-main-wrapper .mb-3 { margin-bottom: 1rem !important; }
.soicau-home-main-wrapper .p-2 { padding: 0.5rem !important; }
.soicau-home-main-wrapper .py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.soicau-home-main-wrapper .px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
.soicau-home-main-wrapper .pb-1 { padding-bottom: 0.25rem !important; }
.soicau-home-main-wrapper .h-35px { height: 35px !important; }
.soicau-home-main-wrapper .h-42px { height: 42px !important; }

/* Borders & Rounded */
.border { border: 1px solid #dee2e6 !important; }
.border-top { border-top: 1px solid #dee2e6 !important; }
.border-bottom { border-bottom: 1px solid #dee2e6 !important; }
.rounded { border-radius: 4px !important; }
.rounded-top { border-top-left-radius: 4px !important; border-top-right-radius: 4px !important; }
.border-radius-4 { border-radius: 4px !important; }

/* Flex utilities */
.d-flex { display: flex !important; }
.d-block { display: block !important; }
.d-none { display: none !important; }
.flex-column { flex-direction: column !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center { justify-content: center !important; }
.align-items-center { align-items: center !important; }
@media (min-width: 992px) {
    .d-lg-block { display: block !important; }
    .d-lg-none { display: none !important; }
}

/* Result Tabs */
.nav-menu-result-home {
    display: flex !important;
    list-style: none !important;
    margin: 0 0 15px 0 !important;
    padding: 0 !important;
    border-radius: 4px !important;
    overflow: hidden !important;
}
.nav-menu-result-home .nav-item {
    flex: 1 1 0 !important;
    margin: 0 !important;
}
.nav-menu-result-home .nav-link {
    display: block !important;
    padding: 10px 15px !important;
    color: #ffffff !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    background: #004593 !important;
    transition: background 0.2s !important;
}
.nav-menu-result-home .nav-link.active,
.nav-menu-result-home .nav-link:hover {
    background: #C62828 !important;
}

/* Tables & Boxes */
.table-flex-border {
    border: 1px solid #dee2e6;
    overflow-x: auto;
}
.table-flex {
    width: 100% !important;
    border-collapse: collapse !important;
    margin: 0 !important;
}
.table-flex td, .table-flex th {
    border: 1px solid #dee2e6 !important;
    padding: 6px 10px !important;
    text-align: center !important;
}
.breadcrumb-table {
    background: #f8f9fa;
    padding: 6px 12px;
    border-bottom: 1px solid #dee2e6;
}
.breadcrumb-table-title {
    margin: 0;
    font-size: 13px;
    color: #666;
}
.breadcrumb-table-title a {
    color: #004593;
    text-decoration: none;
}
.aside-title-red {
    background: #C62828;
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 8px 12px;
    margin: 0;
    border-radius: 4px 4px 0 0;
}
.box-item-rbk {
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    margin-bottom: 12px;
    overflow: hidden;
}

/* Lô tô 2 số đầu đuôi */
.table-loto {
    width: 100%;
    border-collapse: collapse;
}
.table-loto th, .table-loto td {
    border: 1px solid #dee2e6;
    padding: 4px 8px;
    text-align: center;
}
.table-loto th {
    background: #f1f3f5;
    font-weight: 700;
}

/* Buttons */
.btn-danger {
    background: #C62828 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 6px 14px !important;
    border-radius: 4px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    display: inline-block !important;
}
.btn-danger:hover {
    background: #b00217 !important;
}
