/* 🌟 Màu nền tổng thể */
body {
    background-color: #e0e0e0; /* Xám nhạt */
    color: #333;
}

/* 📌 Container chính */
.container1 {
    background: white;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
}

/* 📘 Bảng sách */
.custom-table {
    width: 100%;
    border-collapse: collapse;
    background: white;
    border-radius: 8px;
    overflow: hidden;
    border: 2px solid #002147; /* Viền xanh đậm */
}

    .custom-table th,
    .custom-table td {
        border: 1px solid #002147;
        padding: 10px;
        text-align: center;
    }

    .custom-table th {
        background-color: #002147; /* Màu xanh đậm */
        color: white;
    }

/* 🔹 Card View */
.card {
    border-radius: 12px;
    background: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border: 2px solid #002147;
}

/* 🟦 Tabs Điều Hướng */
.nav-tabs {
    border-bottom: 2px solid #002147;
}

    .nav-tabs .nav-link {
        color: #002147 !important; /* Chữ màu xanh đậm */
        background-color: white; /* Nền trắng */
        border: 1px solid #002147;
        border-radius: 8px 8px 0 0;
        transition: all 0.3s ease-in-out;
    }

        .nav-tabs .nav-link.active {
            background-color: #002147; /* Nền xanh đậm */
            color: white !important; /* Chữ trắng */
            border-radius: 8px 8px 0 0;
        }

        .nav-tabs .nav-link:hover {
            background-color: #004080; /* Xanh đậm hơn khi hover */
            color: white !important;
        }

/* 🔘 Nút màu xanh đậm từ ảnh */
.btn-custom-primary {
    background-color: #002147; /* Màu xanh đậm */
    color: white;
    border: none;
}

    .btn-custom-primary:hover {
        background-color: #003366; /* Xanh đậm hơn khi hover */
    }

/* 🔘 Nút màu vàng */
.btn-custom-warning {
    background-color: #ffcc00;
    color: #002147;
    border: none;
}

    .btn-custom-warning:hover {
        background-color: #e6b800;
    }

/* 🔘 Nút màu đỏ */
.btn-custom-danger {
    background-color: #cc0000;
    color: white;
    border: none;
}

    .btn-custom-danger:hover {
        background-color: #990000;
    }

/* 🔘 Nút màu xanh biển */
.btn-custom-info {
    background-color: #17a2b8;
    color: white;
    border: none;
}

    .btn-custom-info:hover {
        background-color: #138496;
    }

/* 📌 Viền cho phần "Thống kê sách trong thư viện" */
.col-main {
    border: 2px solid #002147; /* Viền xanh đậm */
    border-radius: 8px;
    padding: 15px;
    background: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Hiệu ứng đổ bóng nhẹ */
}
/* 📌 Viền cho phần "Học phần được đề xuất" */
.col-temp {
    border: 2px solid #002147; /* Viền xanh đậm */
    border-radius: 8px;
    padding: 15px;
    background: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Hiệu ứng đổ bóng nhẹ */
}

.card-header {
    background-color: white; /* Màu nền mặc định */
    color: #002147; /* Màu chữ xanh đậm */
    transition: all 0.3s ease-in-out; /* Hiệu ứng mượt */
}
.highlight {
    background-color: yellow;
}

.min-height-600 {
    min-height: 600px;
}

.search-box {
    border: 2px solid #002147;
    border-radius: 5px;
}