body {
    min-height: 100vh;
    font-family: 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    margin: 0;
    padding: 0;
}
/* Navbar styles */
.navbar {
    padding: 1rem 1.5rem; 
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); 
}

/* Brand Styles */
.navbar-brand {
    font-size: 1.2rem; 
    font-weight: bold; 
}

/* Navbar Link Styles */
.navbar-nav .nav-link {
    color: #fff; 
    transition: color 0.3s ease; 
}

.navbar-nav .nav-link:hover {
    color: ora; 
}

/* Dropdown Menu Styles */
.dropdown-menu {
    background-color: #343a40; 
    border-radius: 0.5rem; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.dropdown-item {
    color: #fff; 
}

.dropdown-item:hover {
    background-color: white; 
    color: #ffc107; 
}

/* Cart Badge */
.cart-badge {
    font-size: 0.8rem; 
    padding: 0.2rem 0.5rem; 
}

/* Search Input Styles */
.form-control {
    border-radius: 0.5rem; 
    border: 1px solid #ced4da;
    transition: border-color 0.3s;
}

.form-control:focus {
    border-color: #ffc107;
    box-shadow: 0 0 5px rgba(255, 193, 7, 0.5); 
}

/* Search Button Styles */
.btn-success {
    border-radius: 0.5rem; 
    transition: background-color 0.3s;
}

.btn-success:hover {
    background-color: #218838; 
}

.rating-stars {
    color: rgb(245, 197, 75);
}

.product-item {
    max-width: 250px;
    margin: 0 auto 2rem;
    cursor: pointer;
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; 
    border-radius: 0.5rem; 
    overflow: hidden;
    border: 1px solid #e0e0e0; 
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); 
}
.product-item:hover {
    transform: translateY(-5px); 
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2); 
}

.product-img {
    transition: transform 0.3s ease; 
}
.card-title {
    font-size: 1.25rem; 
    font-weight: bold; 
    margin: 0.5rem 0; 
    color: black;
}
.card-sub-title {
    font-size: 0.9rem; 
    color: #6c757d; 
}
.footer-items h5 {
    color: white;
    font-size: 1rem;
}

.footer-items ul {
    list-style: none;
    padding: 0;
    font-size: 0.8rem;
}

.footer-items a {
    color: #ccc;
    text-decoration: none;
    transition: text-decoration 0.3s ease-in-out;
}

.footer-items a:hover {
    text-decoration: underline;
}

.breadcrumb {
    background-color: #eee;
}

.product-small img {
    max-width: 10rem;
    padding: 1rem;
}

.cart-item, .order {
    border: 1px solid grey;
}

.close i {
    font-size: 1.5rem;
    transition: color 0.3s ease-in-out;
}

.close i:hover {
    color: red;
}

.login-box {
    background-color: #eee;
    border-radius: 20px;
    padding: 2rem;
}

.success-icon {
    font-size: 10rem;
}

#carouselExampleDark img {
    max-height: 90vh;
}

.toast {
    top: -50px;
    transition: top 0.5s ease-in-out;
}

.toast.show {
    top: 0px;
}

a.logo {
    text-decoration: none;
    color: black;
}

.color-label {
    border-radius: 50%;
    margin: 5px;
    display: inline-block;
    position: relative;
}

.color-label i {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.btn-check:checked + .color-label i {
    opacity: 1;
}

.text-small {
    font-size: 0.8rem;
}

.accordion-body {
    font-size: 0.8rem;
    color: grey;
}

.accordion-button {
    padding: 5px;
    background-color: #ccc;
    transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.accordion-button:not(.collapsed) {
    background-color: black;
    color: white;
}

.breadcrumb-item a {
    text-decoration: none;
}

.cart-badge {
    position: relative;
    top: -15px;
    left: -10px;
}

.search-form input, .search-form button, .subscribe input, .subscribe button {
    border-radius: 0;
}

.nav-item:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

a.dropdown-item {
    color: white !important;
    text-decoration: none;
}

a.dropdown-item:hover {
    color: rgb(31, 26, 26) !important;
}

.carousel-caption {
    background-color: rgba(255, 255, 255, 0.4);
}

.card-text.price {
    color: rgb(255, 111, 0);
}

.like, .liked {
    position: relative;
    top: 1rem;
    left: 2rem;
    font-size: 2rem;
    color: grey;
    z-index: 10;
    transition: color 0.3s ease-in-out, opacity 0.3s ease-in-out;
}

.liked {
    opacity: 0;
    z-index: 11;
}

.like:hover {
    opacity: 0;
}

.liked:hover {
    color: red;
    opacity: 1;
}

.social-icons i {
    font-size: 1.5rem;
    width: 24px;
    height: 24px;
    margin-top: -0.8rem;
}

.social-icons button {
    border-radius: 50%;
    width: 2.5rem;
    height: 2.5rem;
}