/* ============================================================================================
   bs5-compat.css — xaydunghoanthien (14/10/2026, user chốt: bỏ Bootstrap 4, dùng Bootstrap 5.3.3).
   Giao diện + style.css của site cũ viết cho Bootstrap 4. File này trả lại ĐÚNG các mặc định Bootstrap 4
   mà Bootstrap 5 đã đổi, để giao diện không lệch. Nạp NGAY SAU bootstrap.min.css, TRƯỚC css của site.
   Mỗi mục ghi giá trị BS4 gốc. Đối chiếu bằng ảnh chụp trước/sau (Edge headless) ở 1920/1366/768/390px.
   ============================================================================================ */

/* 1. Lưới: gutter BS4 = 30px (cột padding 15px, row margin -15px, container padding 15px). BS5 = 1.5rem. */
.container, .container-fluid, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl,
.row { --bs-gutter-x: 30px; }

/* 2. Container: BS4 tối đa 1140px — BS5 thêm khổ xxl 1320px (≥1400px) làm trang rộng ra. */
@media (min-width: 1400px) {
    .container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { max-width: 1140px; }
}

/* 3. Bo góc: BS4 .25rem / sm .2rem / lg .3rem — BS5 .375rem / .25rem / .5rem. */
:root {
    --bs-border-radius: .25rem;
    --bs-border-radius-sm: .2rem;
    --bs-border-radius-lg: .3rem;
}

/* 4. Liên kết: BS4 không gạch chân (chỉ khi hover), màu #007bff / hover #0056b3 — BS5 gạch chân sẵn. */
a { color: #007bff; text-decoration: none; background-color: transparent; }
a:hover { color: #0056b3; text-decoration: underline; }
/* 4.0.0-beta: link KHÔNG href (vd nút mở menu mobile .netflix-nav-btn) kế thừa màu cha — BS5 chỉ áp cho link không class. */
a:not([href]):not([tabindex]), a:not([href]):not([tabindex]):hover, a:not([href]):not([tabindex]):focus { color: inherit; text-decoration: none; }
a:not([href]):not([tabindex]):focus { outline: 0; }
.btn-link { text-decoration: none; }
.btn-link:hover { text-decoration: underline; }

/* 5. Tiêu đề: BS4 cỡ cố định — BS5 co giãn theo màn hình (RFS) dưới 1200px. */
h1, .h1 { font-size: 2.5rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }
h5, .h5 { font-size: 1.25rem; }
h6, .h6 { font-size: 1rem; }
/* 4.0.0-beta: line-height 1.1 (BS5 1.2) — lệch dồn vài px ở mọi khối có tiêu đề. */
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { margin-bottom: .5rem; font-family: inherit; font-weight: 500; line-height: 1.1; color: inherit; }

/* 6. Danh sách: site cũ chạy Bootstrap 4.0.0-BETA — bản này KHÔNG đặt padding cho ul/ol nên reset "* { padding: 0 }"
      của style.css có hiệu lực (ul padding 0). BS5 thêm "ol, ul { padding-left: 2rem }" (cụ thể hơn "*") → menu,
      footer, danh sách lệch 32px. Trả về 0 như cũ. */
ol, ul { padding-left: 0; }
mark { padding: 0; }

/* 6b. Reboot 4.0.0-beta khác BS5. */
label { display: inline-block; margin-bottom: .5rem; }        /* BS5 bỏ margin-bottom của label */
small, .small { font-size: 80%; font-weight: 400; }          /* BS5 .875em */
th { text-align: left; }                                      /* BS5 inherit */
caption { color: #868e96; }
hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0,0,0,.1); color: gray; opacity: 1; }   /* màu mặc định trình duyệt như BS4-beta */

/* 6c. Cột: 4.0.0-beta đặt position:relative + min-height:1px cho mọi .col-* (BS5 bỏ) — phần tử absolute bên trong cột
       (overlay, nút trên ảnh) căn theo cột như cũ. */
.col, [class^="col-"], [class*=" col-"] { position: relative; min-height: 1px; }

/* 7. Ô nhập: .form-control của 4.0.0-beta (BS5: padding/line-height khác, bỏ mũi tên <select> bằng appearance:none,
      có vòng sáng khi focus). Trang phong thủy dùng <select class="form-control">. */
.form-control {
    display: block; width: 100%; padding: .5rem .75rem; font-size: 1rem; line-height: 1.25; color: #495057;
    background-color: #fff; background-image: none; background-clip: padding-box; border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-appearance: auto; -moz-appearance: auto; appearance: auto;
}
.form-control:focus { color: #495057; background-color: #fff; border-color: #80bdff; outline: 0; box-shadow: none; }
.form-control::placeholder { color: #868e96; opacity: 1; }
.form-control:disabled, .form-control[readonly] { background-color: #e9ecef; opacity: 1; }
select.form-control:not([size]):not([multiple]) { height: calc(2.25rem + 2px); }

/* 8. Nút: 4.0.0-beta padding .5rem .75rem, line-height 1.25 (BS5 .375rem .75rem / 1.5). */
.btn { --bs-btn-padding-y: .5rem; --bs-btn-padding-x: .75rem; --bs-btn-line-height: 1.25; --bs-btn-focus-box-shadow: none; }

/* 9. Class BS4 đã bỏ ở BS5. */
.form-group { margin-bottom: 1rem; }
.btn-block { display: block; width: 100%; }
