body {
    margin: 20px;
    font-family: Arial, sans-serif;
    background-color: #f8f9fa;
}

/* Header và navbar */
.header {
    padding: 10px;
    color: white;
    background: #003366;
}
nav a {
    margin-right: 15px;
    color: white;
    text-decoration: none;
}
nav a:hover {
    color: #ffcc00;
    text-decoration: underline;
}

/* Container nội dung */
.content-container {
    padding: 20px;
}

/* Phần tiêu đề */
h3 {
    margin-bottom: 10px;
    color: #003366;
}

/* Scroll bảng ngang */
.scrollable-table {
    overflow-x: auto;
    width: 100%;
}

/* Bảng cố định cột */
.table.freeze-table {
    font-family: "Segoe UI", Arial, sans-serif;
    font-size: 14px;
    white-space: nowrap;
    border-collapse: separate;
    border-spacing: 0;
    min-width: 1400px;
}

.table.freeze-table th,
.table.freeze-table td {
    white-space: nowrap;
    vertical-align: middle;
    border: 1px solid #dee2e6;
    padding: 8px 12px;
    background-color: #fff;
}

/* Header sticky khi cuộn dọc */
.table.freeze-table thead th {
    position: sticky;
    top: 0;
    background-color: #343a40;
    color: white;
    z-index: 10;
}

/* Cố định cột 1 - STT */
.table.freeze-table th.sticky-col,
.table.freeze-table td.sticky-col {
    position: sticky;
    left: 0;
    z-index: 3;
    background-color: #ffffff;
    min-width: 60px;
}

/* Cố định cột 2 - Mã Nhân Viên */
.table.freeze-table th.sticky-col-2,
.table.freeze-table td.sticky-col-2 {
    position: sticky;
    left: 60px;
    z-index: 3;
    background-color: #ffffff;
    min-width: 140px;
}

/* Cố định cột 3 - Họ Tên */
.table.freeze-table th.sticky-col-3,
.table.freeze-table td.sticky-col-3 {
    position: sticky;
    left: 200px;
    z-index: 3;
    background-color: #ffffff;
    min-width: 180px;
}

/* Định dạng textarea */
textarea {
    resize: vertical;
    min-height: 70px;
    width: 250px;
}

/* Select dropdown */
select.form-control {
    width: 200px;
}