/* ================= NAVBAR ================= */

/* Khoảng cách giữa các item khi dùng flex-row */
.navbar-nav.flex-row > .nav-item {
    margin-right: 18px;
}

/* Logo */
.navbar-brand img {
    max-height: 42px;
    object-fit: contain;
}

/* Link navbar */
.nav-link {
    font-weight: 500;
    transition: .25s;
}

    .nav-link:hover {
        color: #0056b3 !important;
        transform: translateY(-1px);
    }

/* Dropdown */
.dropdown-menu {
    z-index: 1050;
    border-radius: 12px;
    padding: 8px 0;
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}

/* ================= MODAL ================= */

/* Khung modal */
.modal-content {
    border-radius: 18px;
    box-shadow: 0 4px 22px rgba(0,0,0,0.12);
}

/* Header & footer */
.modal-header,
.modal-footer {
    border: none !important;
}

/* Căn giữa tiêu đề */
.modal-header {
    justify-content: center !important;
    position: relative;
}

/* Nút đóng modal */
.btn-close {
    position: absolute;
    right: 1rem;
    top: 1rem;
}

/* Input chung */
.form-control {
    width: 100%;
    padding-left: 1rem;
    padding-right: 1rem;
    box-sizing: border-box;
}

    .form-control:focus {
        box-shadow: 0 0 0 .2rem rgba(0,123,255,.22);
    }

/* Form-floating giữ padding */
.form-floating input.form-control {
    padding-left: 1rem;
    padding-right: 1rem;
}

/* Nút submit */
button.btn {
    width: 100%;
    font-weight: 600;
    font-size: 1.08rem;
    padding: .6rem 0;
    border-radius: 10px;
}

/* Nút màu */
.btn-primary {
    background-color: #007bff;
    border: none;
}

.btn-success {
    background-color: #28a745;
    border: none;
}

/* Text chuyển modal */
.text-center small {
    display: block;
}

/* Text-primary */
.text-primary {
    font-weight: 600;
}

    .text-primary:hover {
        text-decoration: underline;
        color: #0056b3;
    }

/* ================= MARQUEE ================= */
.marquee {
    overflow: hidden;
    background-color: #ffc107;
    color: #212529;
    padding: 8px 0;
    font-size: 1.08rem;
    font-weight: 600;
    white-space: nowrap;
    position: relative;
}

    .marquee span {
        display: inline-block;
        padding-left: 100%;
        animation: marquee 14s linear infinite;
    }

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

/* ================= FOOTER ================= */

/* Tiêu đề footer */
footer h5 {
    font-weight: 700;
    margin-bottom: 12px !important;
}

/* Reset list */
footer ul {
    list-style: none;
    margin: 0 !important;
    padding-left: 0 !important;
}

    footer ul li {
        margin-bottom: 6px;
    }

/* Link footer */
footer a {
    color: #d0d0d0 !important;
    text-decoration: none;
}

    footer a:hover {
        color: #ffffff !important;
        text-decoration: underline;
    }

/* Khoảng cách giữa 3 cột */
footer .col-md-4 {
    padding-right: 20px;
}

/* Đường kẻ cuối */
footer .border-top {
    border-color: #666 !important;
}
/* ================= NAVBAR ================= */
/* Navbar đen override */
.navbar,
.navbar .nav-link,
.navbar .navbar-brand {
    background: linear-gradient(90deg, #000000, #333333) !important; /* gradient đen */
    color: #fff !important; /* chữ trắng */
}

    .navbar .nav-link:hover {
        color: #ffd700 !important; /* vàng khi hover */
    }

    .navbar .dropdown-menu {
        background-color: #000 !important; /* nền đen */
    }

        .navbar .dropdown-menu .dropdown-item {
            color: #fff !important; /* chữ trắng */
        }

            .navbar .dropdown-menu .dropdown-item:hover {
                background-color: #333 !important; /* đen nhạt khi hover */
                color: #ffd700 !important; /* chữ vàng khi hover */
            }