.index_scroller_code {
    width: auto; 
    height: 590px; 
    overflow-y: auto;  
    background-color: transparent;
    scrollbar-width: none;
}
.menu_bg
{
    background-image: none;
}
.menu_bg1
{
    background-color: rgb(255, 255, 255);
    background-image: none;
}
.sit1
{
    display: flex;
    flex-wrap: wrap;
}
form button
{
    width: 50%;
    background-color: transparent;
    border: none;
}
.table1 img
{
    width: 100%;
    border-radius:20px;
}

.orderPage
{
    display: flex;
}
.items
{
    border: solid;
    width: 70%;
    height: 500px; 
    overflow-y: auto; 
    padding: 10px;
    margin: 10px; 
    background-color: transparent; 
    border-radius: 10px;
}
.listoforder
{
    border: solid;
    width: 40%;
    height: 500px; 
    overflow-y: auto; 
    padding: 10px;
    margin: 10px; 
    background-color: transparent; 
    border-radius: 10px;

}
.order_page
{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.order_page form button
{
    width: 150px;
    border-radius: 15px;
}.addusandpd {
    border: solid;
    width: 30%;
    height: 400px; 
    overflow-y: auto; 
    padding: 10px;
    background-color: transparent; 
    border-radius: 10px;
}
@media (max-width: 768px) { /* Mobile styles */
    .category-container {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: center; /* Centers items horizontally */
        justify-content: center; /* Centers items vertically */
        text-align: center; /* Ensures text inside items is centered */
        width: 100%; /* Ensures it takes full width */
    }
}
.addusandpd1 {
    width: 400px;
    height: 600px; 
    overflow-y: scroll; /* Allow scrolling */
    background-color: transparent; 
    border: none;

    /* Hide scrollbar */
    scrollbar-width: none; /* Firefox */
    display: flex;  /* Ensures proper alignment */
    flex-direction: column; /* Stack items properly */
    align-items: flex-start; /* Align items to the left */
}

.addusandpd1::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
}
.scroll-container {
    width: 100%; /* Container takes full width */
    overflow-x: auto; /* Enable horizontal scrolling */
    white-space: nowrap; /* Prevent items from wrapping to the next line */
    border: none; /* Optional border for visibility */
}
.scroll-item {
    display: inline-block; /* Keep items in a row */
    width: 200px; /* Width of each item */
    height: 90px; /* Height of each item */
    margin-right: 10px; /* Space between items */
    line-height: 80px; /* Vertically center text */
    color: white; /* Text color */
}
.scroll-container {
    display: flex;
    overflow-x: auto;
    scroll-behavior: smooth; /* enables smooth scrolling */
}
.scroll-item {
    flex: 0 0 auto;
}

.product-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* centers cards horizontally */
    align-items: flex-start;
    gap: 25px; /* spacing between cards */
    margin-top: 40px;
}

.card {
    width: 18rem;
    background-color: #f9f9f9;
    border-radius: 15px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    overflow: hidden;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    text-align: center;
}

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

.card img {
    width: 100%;
    height: 180px;
    object-fit: cover;
}

.card-body {
    padding: 15px;
}

.card-title {
    font-size: 18px;
    font-weight: bold;
    color: #333;
}

.card-text {
    font-size: 15px;
    color: #555;
}

.price-line {
    text-decoration: line-through;
    text-decoration-color: red;
    text-decoration-thickness: 2px;
}

h4 {
    text-align: center;
    color: white;
}