﻿.carousel-item {
    height: 100vh; /* Đảm bảo mỗi slide chiếm đầy chiều cao màn hình */
}

.carousel-background {
    width: 100%;
    height: 100%; /* Chiếm toàn bộ chiều cao của slide */
    background-size: cover; /* Đảm bảo hình ảnh phủ toàn bộ */
    background-position: center; /* Căn giữa hình ảnh */
    background-repeat: no-repeat; /* Không lặp lại hình ảnh */
    cursor: pointer;
}

.navbar {
    position: absolute !important;
    top: 2rem;
    left: 0;
    right: 0;
    z-index: 10; /* Đảm bảo navbar luôn nằm trên */
    background-color: transparent;
}

.nav-link {
    color: white !important;
    font-weight: 300 !important;
}

.custom-navbar {
    display: flex !important;
    justify-content: center;
    width: 100%;
    flex-direction: row !important;
}

    .custom-navbar .nav-item {
        padding: 8px;
    }


body {
    font-family: system-ui !important;
    line-height: inherit !important;
}

/* CSS để dropdown mở khi hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

/* Đảm bảo dropdown không bị ẩn khi di chuột qua */
.nav-item.dropdown .dropdown-menu {
    display: none;
    position: absolute;
    z-index: 1000;
    background-color: transparent !important;
    border: none !important; /* Loại bỏ border */
    color: white !important;
}

/* Optional: Đặt độ trễ khi hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
    animation: fadeIn 0.3s;
}

/* Optional: Thêm hiệu ứng fade-in */
@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

/* Loại bỏ border và background mặc định */
.dropdown-menu .dropdown-item {
    background-color: transparent !important; /* Loại bỏ background */
    border: none !important; /* Loại bỏ border */
    color: white !important;
    font-weight: 300 !important;
}

    /* Loại bỏ hover effect, không thay đổi background và border */
    .dropdown-menu .dropdown-item:hover {
        background-color: transparent !important; /* Loại bỏ background khi hover */
        color: white !important;
        font-weight: 400 !important;
    }

/* Đảm bảo dropdown không bị ẩn khi hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

.nav-item.dropdown .dropdown-menu {
    display: none;
    position: absolute;
    z-index: 1000;
}

.right-nav {
    text-align:right
}
/* Phần footer nằm trên banner */
.footer {
    position: absolute; /* Đặt footer ở vị trí tuyệt đối so với banner */
    bottom: 2rem; /* Khoảng cách từ dưới cùng của màn hình */
    left: 0;
    width: 100%;
    color: #fff;
    text-align: center;
    z-index: 999; /* Đảm bảo footer nằm trên cùng */
}

/* Social links */
.social-links {
    margin-top: -3rem;
}

    .social-links a {
        color: #fff;
        margin: 0 10px;
        text-decoration: none;
        font-weight: 300
    }

        .social-links a:hover {
            font-weight: 400
        }

/* Logo */
.logo img {
    max-width: 180px!important;
}
