/* Custom card styling */
  .custom-card {
    height: 250px; /* Set a fixed height for all cards */
    background: #4d1117; /* Yellow to red gradient */
    color: white; /* White text for better visibility */
}
.bg-pos-primary {
    background: #ffffff !important;
    color:#000000 !important; 
}

.custom-card .card-body {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Vertically center content */
    align-items: center; /* Center horizontally */
}

.custom-card .card-title {
    font-size: 1.25rem;
    font-weight: bold;
}

.custom-card .btn {
    margin-top: 10px; /* Space between text and button */
}
.price  {
    display: none;
}

body {
    background-color: #f4f4f4;
    font-family: 'Open Sans', sans-serif;
}

.custom-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 180px; /* Ensure uniform height */
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease-in-out;
}

.custom-card:hover {
    box-shadow: 0 8px 20px rgba(201, 26, 26, 0.699);
    transform: translateY(-5px);
}

.custom-card i {
    color: #3f51b5;
    margin-bottom: 15px;
}

.custom-card h5 {
    font-weight: 600;
    color: #333;
}

.custom-card .btn {
    background: #3f51b5;
    color: white;
    border-radius: 20px;
    transition: background 0.3s ease;
}

.custom-card .btn:hover {
    background: #303f9f;
}

@media (min-width: 769px) {
    #cart {
        position: fixed;
        right: 20px;
        top: 100px;
        max-height: 80vh;
        overflow-y: auto;
        background: white;
        padding: 15px;
        border: 1px solid #ddd;
        border-radius: 8px;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
    }

    #products {
        margin-right: 320px; /* Create space for the fixed cart */
    }
}
#order_date_display {
    font-size: 24px; /* Larger font size */
    padding: 12px; /* More padding for better visibility */
    width: 100%; /* Make it full width */
    max-width: 400px; /* Adjust maximum width */
}