body {
            font-family: "Times New Roman", Times, serif;
			display: flex;
            flex-direction: column; /* Các phần tử xếp chồng theo cột */
            min-height: 100vh; /* Chiều cao tối thiểu 100% của viewport */
            margin: 0;
            //font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            //background: url(../images/bg_full.png) no-repeat center top #3563c1 !important;
            //background: url(../images/bg.jpg) no-repeat center center  #3563c1 !important;
			background-color:#3563c1 !important;
            padding-top: 25px; /* Thêm padding-top */
			font-size: 1.2em;
			
        }

        .header-section {
            padding: 0px;
            width: 100%; /* Đảm bảo header chiếm toàn bộ chiều rộng */
        }
        .header-top {
            display: flex;
            align-items: center;
            padding-bottom: 10px; /* Khoảng cách giữa hàng trên và menu */
            /* Thêm justify-content để căn giữa tổng thể nội dung */
            justify-content: center;
        }
        .header-logo {
            min-width: 200px; /* Kích thước tối đa cho logo */
            height: auto;
            display: block;
            margin-right: 20px; /* Khoảng cách với tiêu đề */
        }


@media (max-width: 767.98px) { /* Cho màn hình nhỏ hơn md */
            .header-logo {
                min-width: 80px;
                margin: 0 auto 10px auto; /* Căn giữa logo trên mobile */
            }
            .header-top .col-md-3,
            .header-top .col-md-9 {
                text-align: center !important; /* Căn giữa nội dung trên mobile */
            }
            .header-title {
                font-size: 1.5rem; /* Giảm kích thước trên mobile */
            }
            /* Trên mobile, có thể muốn logo và tiêu đề nằm trên 2 hàng */
            .header-top {
                flex-direction: column;
            }
            .header-logo {
                margin-right: 0;
            }
			.header-banner {
				max-width: 800px;
			}
			
			.footer-section .row {
                flex-direction: column; /* Xếp logo và chữ thành 2 hàng trên mobile */
            }
            .footer-logo-col {
                margin-bottom: 10px; /* Khoảng cách giữa logo và chữ trên mobile */
            }
			
			.navbar-toggler {
                border-color: rgba(255, 255, 255, 0.7); /* Viền nút trắng nhạt */
            }
			
			.navbar-nav-account {
            margin-left: auto; 
            margin-right: 15px; 
			}
        }
/* End Mobile */



		.header-banner {
			width: 100%; min-height: 100px;
			/* background: url(banner.png) no-repeat center top !important;
            margin-bottom: 10px;*/
        }
        .header-title {
            color: #ffffff; /* Đổi màu chữ tiêu đề thành trắng để dễ nhìn trên nền tối */
            font-weight: 700;
            /*font-size: 1.5rem;*/
            margin-bottom: 0;
            /* Căn giữa tiêu đề trong không gian của nó, sẽ được kết hợp với căn giữa tổng thể */
            text-align: center;
            text-shadow: 1px 1px 3px rgba(0,0,0,0.3); /* Thêm đổ bóng chữ để nổi bật */
        }

        /* Thanh menu - Tùy chọn 1: Menu màu trắng, chữ xanh đậm */
        .navbar {
            
            background-color: rgba(0, 0, 0, 0.2);
			border-radius: 5px; /* Bo tròn nhẹ góc dưới */
            box-shadow: 0 2px 5px rgba(0,0,0,0.08); /* Đổ bóng nhẹ */
        }
        .navbar-nav .nav-link {
            color: #fff; /* Màu chữ xanh đậm cho các mục menu */
            font-weight: 500;
            padding: 10px 18px;
            transition: background-color 0.2s ease, color 0.2s ease;
        }
        .navbar-nav .nav-link:hover {
            background-color: #e9ecef; /* Nền xám nhạt khi hover */
            color: #007bff; /* Màu xanh sáng khi hover */
        }
        .navbar-nav .nav-link.active {
            color: #007bff; /* Màu xanh sáng cho mục active */
            background-color: #e9ecef; /* Nền xám nhạt cho mục active */
            font-weight: 600;
        }
        .navbar-toggler {
            border-color: rgba(0,0,0,.1); /* Màu viền nút toggler */
        }
		
        .navbar-toggler-icon {
                /* Thay đổi màu stroke của SVG icon thành màu trắng */
                background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
            }

        /* Phần nội dung chính để căn giữa form đăng nhập */
        .main-content {
			
            flex-grow: 1; /* Cho phép nội dung chính chiếm hết không gian còn lại */
            display: flex;
            justify-content: center; /* Căn giữa theo chiều ngang */
            align-items: center; /* Căn giữa theo chiều dọc */
            padding: 0px 5px; /* Thêm padding ngang để tránh dính lề trên mobile */
        }
		.body-container {
            background-color: #f8f9fa; /* Màu xám nhạt */
			padding: 5px;
			min-height:50px;
        }

        .contact-container {
            background-color: #f8f9fa; /* Màu xám nhạt */
			padding: 20px;
        }
		
		 .login-container {
            background-color: rgba(225, 225, 225, 0.5);
            padding: 40px;
            border-radius: 10px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
            max-width: 450px;
            width: 100%; /* Đảm bảo chiều rộng linh hoạt */
            text-align: center;
            border-top: 5px solid #007bff;
        }
		
		
        .login-container h2 {
            margin-bottom: 30px;
            color: #333;
            font-weight: 600;
        }
        .login-container .form-label {
            text-align: left;
            width: 100%;
            font-weight: 500;
            color: #555;
        }
        .login-container .form-control {
            border-radius: 5px;
            padding: 12px 15px;
            border: 1px solid #ced4da;
        }
        .login-container .btn-primary {
            width: 100%;
            padding: 12px;
            border-radius: 5px;
            font-size: 1.1rem;
            margin-top: 20px;
            background-color: #007bff;
            border-color: #007bff;
            transition: background-color 0.2s ease, border-color 0.2s ease;
        }
        .login-container .btn-primary:hover {
            background-color: #0056b3;
            border-color: #0056b3;
        }
        .login-container .forgot-password {
            display: block;
            margin-top: 15px;
            color: #007bff;
            text-decoration: none;
            font-size: 0.95rem;
        }
        .login-container .forgot-password:hover {
            text-decoration: underline;
        }

        /* === Cập nhật CSS cho footer-section === */
        .footer-section {
            margin-top: auto;
            /* padding: 20px 0; Giữ padding trên dưới, loại bỏ padding ngang ở đây */
            font-size: 0.85rem;
            color: #ffffff;
            background-color: rgba(0, 0, 0, 0.2);
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            width: 100%;
        }

        .footer-logo-col {
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .footer-logo {
            max-width: 80px; /* Kích thước tối đa cho logo footer */
            height: auto;
            display: block;
        }

        .footer-text-col {
            text-align: center; /* Căn giữa chữ trong cột */
        }

/* Styling cho Bảng danh sách */
.phanhang{white-space:pre-wrap; word-wrap:break-word}

        .f-header {
            background-color: #3563c1;
            color: white;padding: 10px;border-radius: 3px;
            text-align: center;font-size: 1.25rem;
        }
        .table-section {
            background-color: #ffffff;
            padding: 5px;
            border-radius: 10px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
            max-width: 1400px;
            width: 100%;
            border-top: 1px solid #007bff;
        }
        .table-section h2 {
            color: #007bff;
            margin-bottom: 30px;
            font-weight: 600;
            text-align: center;
        }
        .table-responsive {
            margin-bottom: 20px;
        }
        .table {
            width: 100%;
            margin-bottom: 1rem;
            color: #212529;
            border-collapse: collapse;
        }
        .table th,
        .table td {
            padding: 0.75rem;
            vertical-align: top;
            border-top: 1px solid #dee2e6;
            text-align: center; 
        }
        .table thead th {
            vertical-align: bottom;
            border-bottom: 2px solid #dee2e6;
            background-color: #e9ecef; 
            color: #495057;
            font-weight: 600;
        }
        .table tbody tr:hover {
            background-color: #f2f2f2; 
        }
        .table .btn-sm {
            padding: 0.25rem 0.5rem;
            font-size: 0.875rem;
            line-height: 1.5;
            border-radius: 0.2rem;
        }
        .table .btn-info {
            background-color: #17a2b8;
            border-color: #17a2b8;
        }
        .table .btn-info:hover {
            background-color: #138496;
            border-color: #117a8b;
        }
        /* Đảm bảo các cột số không quá rộng */
        .table th:nth-child(1), .table td:nth-child(1), /* STT */
        .table th:nth-child(2), .table td:nth-child(2), /* Số giấy phép */
        .table th:nth-child(4), .table td:nth-child(4), /* Số IMO */
        .table th:nth-child(5), .table td:nth-child(5) { /* Hô hiệu */
            white-space: nowrap; /* Ngăn không cho xuống dòng */
        }
        .table th:last-child, .table td:last-child {
            width: 80px; /* Cố định chiều rộng cột "Xem" */
        }
/* Styling cho Trang Tin Tức */
        .news-section {
            /*background-color: #ffffff;
            padding: 30px;border-top: 5px solid #007bff;
            border-radius: 10px;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);*/
            max-width: 1200px;
            width: 100%;
            
        }
        .news-section h2 {
            color: #007bff;
            margin-bottom: 30px;
            font-weight: 600;
            text-align: center;
        }
        .news-item {
            display: flex;
            margin-bottom: 30px;
            border: 1px solid #e0e0e0;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 2px 8px rgba(0,0,0,0.05);
            transition: transform 0.2s ease, box-shadow 0.2s ease;
            background-color: #f8f9fa; /* Nền nhẹ cho mỗi bài tin */
        }
        .news-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 6px 15px rgba(0,0,0,0.1);
        }
        .news-item-img {
            flex: 0 0 250px; /* Cố định chiều rộng ảnh */
            /*height: 180px; /* Cố định chiều cao ảnh */
            overflow: hidden;
        }
        .news-item-img img {
            width: 100%;
            height: 100%;
            object-fit: cover; /* Đảm bảo ảnh cover toàn bộ khu vực */
        }
        .news-item-content {
            flex: 1;
            padding: 20px;
        }
        .news-item-content h3 {
            font-size: 1.5rem;
            margin-bottom: 10px;
        }
        .news-item-content h3 a {
            color: #007bff;
            text-decoration: none;
            transition: color 0.2s ease;
        }
        .news-item-content h3 a:hover {
            color: #0056b3;
        }
        .news-item-meta {
            font-size: 0.9rem;
            color: #6c757d;
            margin-bottom: 10px;
        }
        .news-item-meta .bi {
            margin-right: 5px;
        }
        .news-item-summary {
            font-size: 1rem;
            line-height: 1.6;
            color: #343a40;
        }
        .read-more-btn {
            margin-top: 15px;
            display: inline-block;
            font-size: 0.9rem;
            padding: 8px 15px;
            border-radius: 5px;
        }

        /* Responsive cho tin tức */
        @media (max-width: 991.98px) {
            .news-item {
                flex-direction: column; /* Xếp ảnh và nội dung theo cột trên màn hình nhỏ hơn */
            }
            .news-item-img {
                flex: none;
                width: 100%;
                height: 200px; /* Tăng chiều cao ảnh trên mobile */
            }
            .news-item-content {
                padding: 15px;
            }
            .news-item-content h3 {
                font-size: 1.3rem;
            }
            .news-item-summary {
                font-size: 0.95rem;
            }
        }

.form_none{display: none; /* Ban đầu ẩn form */  }

/*tIN NHẮN*/

        .message-container {
            display: flex;
            height: calc(100vh - 76px); /* Chiều cao màn hình trừ đi navbar và padding */
            border: 1px solid #dee2e6;
            border-radius: .5rem;
            overflow: hidden;
            background-color: #fff;
            box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
        }
        .message-sidebar {
            flex: 0 0 300px; /* Chiều rộng cố định cho sidebar */
            border-right: 1px solid #dee2e6;
            padding: 15px;
            overflow-y: auto; /* Cuộn nếu nội dung quá dài */
            background-color: #f4f7f6;
        }
        .message-list .list-group-item {
            cursor: pointer;
            border: none;
            border-bottom: 1px solid #f0f0f0;
            padding: 12px 15px;
            transition: background-color 0.2s ease;
        }
        .message-list .list-group-item:hover {
            background-color: #e9ecef;
        }
        .message-list .list-group-item.active {
            background-color: #0d6efd;
            color: white;
        }
        .message-list .list-group-item.active .text-muted,
        .message-list .list-group-item.active .fw-bold {
            color: white !important;
        }
        .message-detail {
            flex-grow: 1; /* Chiếm hết không gian còn lại */
            padding: 20px;
            overflow-y: auto; /* Cuộn nếu nội dung quá dài */
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
        }
        .message-detail h4 {
            margin-bottom: 10px;
            color: #343a40;
        }
        .message-detail .message-sender {
            font-size: 1rem;
            color: #6c757d;
            margin-bottom: 5px;
        }
        .message-detail .message-date {
            font-size: 0.85rem;
            color: #6c757d;
            margin-bottom: 20px;
            border-bottom: 1px solid #eee;
            padding-bottom: 10px;
        }
        .message-detail p {
            line-height: 1.6;
            color: #495057;
        }
        .message-placeholder {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100%;
            color: #adb5bd;
            font-size: 1.2rem;
            text-align: center;
        }

        /* Responsive adjustments */
        @media (max-width: 768px) {
            .message-container {
                flex-direction: column;
                height: auto;
            }
            .message-sidebar {
                flex: none;
                width: 100%;
                border-right: none;
                border-bottom: 1px solid #dee2e6;
                height: 300px; /* Chiều cao cố định cho sidebar trên mobile */
            }
            .message-detail {
                flex: none;
                width: 100%;
                height: auto;
            }
        }
/*Giao diện diễn đàn*/
.forum-header {
            background-color: #e9ecef;
            padding: 20px;
            border-radius: .5rem;
            margin-bottom: 20px;
            text-align: center;
        }
        .topic-list .list-group-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 15px 20px;
            margin-bottom: 10px;
            border-radius: .5rem;
            box-shadow: 0 .125rem .25rem rgba(0,0,0,.075);
            transition: transform 0.2s ease-in-out;
        }
        .topic-list .list-group-item:hover {
            transform: translateY(-3px);
            background-color: #f0f0f0;
        }
        .topic-info {
            flex-grow: 1;
        }
        .topic-meta {
            text-align: right;
            min-width: 150px; /* Đảm bảo đủ không gian cho meta info */
        }
        .topic-meta small {
            display: block;
            color: #6c757d;
        }
        .topic-meta .badge {
            font-size: 0.85em;
            margin-left: 5px;
        }

/* Style cho PDF Viewer trong Modal */
        #pdfViewer {
            width: 100%;
            height: 80vh; /* Chiều cao cố định cho PDF viewer */
            border: none;
        }
        .modal-xl { /* Kích thước modal lớn hơn cho PDF */
            --bs-modal-width: 90vw;
        }
		
		.custom-modal-title-wrapper {
            display: flex;
            justify-content: space-between;
            align-items: center;
            width: 100%;
        }
        .custom-modal-title-left {
            flex-grow: 1; /* Cho phép phần này chiếm hết không gian còn lại */
            text-align: left;
            padding-right: 15px; /* Khoảng cách với phần bên phải */
        }
        .custom-modal-title-right {
            flex-shrink: 0; /* Không cho phép phần này co lại */
            text-align: right;
        }
        /* Tùy chỉnh màu nền cho modal header để dễ nhìn */
        .modal-header {
            background-color: #e9ecef; /* Màu xám nhạt */
            border-bottom: 1px solid #dee2e6;
        }

/*Style user*/
		.profile-card {
            box-shadow: 0 4px 8px rgba(0,0,0,0.1);
            border-radius: 10px;
            overflow: hidden;
            background-color: #fff;
        }
        .profile-header {
            background-color: #3563c1;
            color: white;
            padding: 20px;
            text-align: center;
        }
        .profile-header img {
            width: 100px;
            height: 100px;
            border-radius: 50%;
            border: 3px solid #fff;
            object-fit: cover;
            margin-bottom: 10px;
        }
        .profile-body {
            padding: 30px;
        }
        .profile-info label {
            font-weight: 600;
            color: #495057;
        }
        .profile-info p {
            margin-bottom: 10px;
        }

/*Select multi*/
.input-group-text {
            min-width: 40px; /* Đảm bảo độ rộng tối thiểu cho icon */
            justify-content: center; /* Căn giữa icon */
        }
        /* Điều chỉnh để Select2 hiển thị tốt với Bootstrap Input Group */
        .input-group .select2-container {
            flex-grow: 1;
            width: 1%; /* Quan trọng để flex-grow hoạt động đúng */
        }
        .input-group .select2-container .select2-selection--multiple {
            height: auto !important; /* Đảm bảo chiều cao tự động theo nội dung */
            min-height: calc(1.5em + .75rem + 2px); /* Chiều cao tối thiểu giống input Bootstrap */
            padding: .375rem .75rem; /* Padding giống input Bootstrap */
            border-radius: .25rem; /* Bo tròn góc */
            border: 1px solid #ced4da; /* Màu viền */
        }
        .input-group .select2-container .select2-selection__choice {
            background-color: #198754; /* Màu nền của tag chọn */
            color: white; /* Màu chữ của tag chọn */
            border: 1px solid #0a58ca;
            border-radius: .25rem;
            padding: .2em .6em;
            margin-top: .3em;
            margin-right: .3em;
        }
        .input-group .select2-container .select2-selection__choice__remove {
            color: white;
            float: none; /* Bỏ float mặc định của Select2 */
            margin-left: .5em;
            font-size: 1.1em;
            font-weight: bold;
        }
        .input-group .select2-container .select2-selection__choice__remove:hover {
            color: #ccc;
        }
        .input-group .select2-container--default .select2-selection--multiple .select2-selection__arrow {
            height: calc(1.5em + .75rem + 2px); /* Kích thước mũi tên */
        }
        .select2-container--default .select2-search--inline .select2-search__field {
            margin-top: .3em; /* Căn chỉnh vị trí trường nhập tìm kiếm */
        }
		

/* Căn giữa thanh phân trang */
.pagination {
    justify-content: center;
    margin-top: 0px;
    list-style: none; /* Bỏ dấu đầu dòng mặc định */
    padding: 0; /* Đảm bảo không có padding thừa */
}

/* Định dạng chung cho mỗi mục li (nút) trong phân trang */
/* Do bạn không có class 'page-item' trên li, chúng ta sẽ nhắm mục tiêu trực tiếp */
.pagination > li {
    /* Khoảng cách giữa các nút sẽ được quản lý bởi margin của a */
}

/* Định dạng cho các liên kết (nút bấm) chung */
.pagination > li > a {
    display: block; /* Quan trọng để padding và border hoạt động đúng */
    padding: 8px 16px; /* Kích thước nút */
    color: #007bff; /* Màu chữ mặc định */
    background-color: #ffffff; /* Nền trắng */
    border: 1px solid #cce5ff; /* Viền màu xanh nhạt, hài hòa */
    transition: all 0.3s ease-in-out; /* Hiệu ứng chuyển động mượt mà */
    font-weight: 500;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05); /* Bóng đổ nhẹ */
    text-decoration: none; /* Bỏ gạch chân */
    min-width: 42px; /* Đảm bảo chiều rộng tối thiểu cho nút */
    text-align: center; /* Căn giữa chữ số */
    /* Loại bỏ bo tròn mặc định để tùy chỉnh cho từng nút riêng */
    border-radius: 0;
}

/* Bo tròn riêng cho nút đầu tiên (nút "«" hoặc số 1) */
.pagination > li:first-child > a {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

/* Bo tròn riêng cho nút cuối cùng (nút "»" hoặc số cuối cùng) */
.pagination > li:last-child > a {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

/* Điều chỉnh border cho các nút ở giữa để tạo hiệu ứng "kết nối" */
.pagination > li:not(:first-child) > a {
    margin-left: -1px; /* Dịch sang trái 1px để viền khớp nối */
    /* Hoặc bạn có thể dùng border-left: none; cho nút giữa nếu muốn loại bỏ viền giữa */
}


/* Hiệu ứng khi di chuột qua (hover) các nút */
.pagination > li > a:hover {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
    box-shadow: 0 4px 10px rgba(0, 123, 255, 0.3);
    transform: translateY(-2px); /* Nhấc nhẹ nút lên */
    z-index: 2; /* Đảm bảo nút hover nằm trên các nút khác */
    position: relative; /* Quan trọng cho z-index hoạt động */
}

/* Định dạng cho trang hiện tại (active) */
.pagination > li.active > a {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
    font-weight: bold;
    pointer-events: none; /* Vô hiệu hóa click */
    box-shadow: 0 3px 8px rgba(0, 123, 255, 0.4);
    transform: translateY(0);
    z-index: 1; /* Đảm bảo nút active nằm trên lớp base */
}

/* Đảm bảo trang active không có hiệu ứng hover */
.pagination > li.active > a:hover {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
    cursor: default;
}

/* Định dạng cho các nút bị vô hiệu hóa (disabled) */
.pagination > li.disabled > a {
    color: #a0a0a0;
    background-color: #f2f2f2;
    border-color: #e0e0e0;
    pointer-events: none;
    opacity: 0.8;
    cursor: not-allowed;
    box-shadow: none;
    transform: translateY(0);
}

/* Bổ sung update */
.button-container {
					display: flex; /* Makes the container a flex container */
					justify-content: space-between; /* Puts maximum space between items (buttons) */
					align-items: center; /* Vertically aligns items in the center (optional, but good practice) */
					width: 100%; /* Ensures the container takes full width to allow spacing */
				}
.form-group-inline {
    display: flex; /* Makes the container a flex container */
    align-items: center; /* Vertically aligns items in the center */
    gap: 10px; /* Adds space between the label and the input */
}

.form-group-inline .form-label {
    flex-shrink: 0; /* Prevents the label from shrinking if space is limited */
}

.form-group-inline .form-control {
    flex-grow: 1; /* Allows the input to grow and take up available space */
}