body {
    font-family: 'Josefin Sans', sans-serif;
}

.navbar-brand {
    color: #8B4513;
}

.navbar-brand:hover {
    color: #5e2a0a;
}

.menu-link {
    color: #333;
    transition: color 0.3s;
}

.menu-link:hover {
    color: #8B4513;
}

.product-image-main img {
    transition: transform 0.4s ease;
}

.product-image-main img:hover {
    transform: scale(1.03);
}

.thumbnail-img {
    cursor: pointer;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.thumbnail-img:hover {
    opacity: 0.75;
    transform: scale(1.05);
}

.text-danger {
    color: #C0392B !important;
}



.btn-outline-danger {
    border-color: #C0392B;
    color: #C0392B;
}

.btn-outline-danger:hover {
    background-color: #C0392B;
    color: white;
}

.bg-light {
    background-color: #f9f9f9 !important;
}

.list-unstyled li i {
    color: #8B4513;
}

.product-card {
    border: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.1);
}

.btn-group .btn-outline-primary {
    border: 2px solid #8B4513;
    /* Viền nâu */
    color: #8B4513;
    /* Chữ màu nâu */
    background-color: transparent;
    transition: background-color 0.3s ease, color 0.3s ease;
    border-radius: 0.375rem;
    /* Bo nhẹ góc (mặc định Bootstrap) */
}

.btn-group .btn-outline-primary:hover,
.btn-group .btn-check:checked+.btn-outline-primary {
    background-color: #8B4513;
    /* Nền nâu khi hover hoặc khi chọn */
    color: #fff;
    /* Chữ trắng */
    border-color: #8B4513;
}

.btn-group .btn-check {
    position: absolute;
    /* Ẩn input radio */
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}