/* Dark mode starts */
:root{
    --c1: #CE0000;
    --light-text: #fff;
    --dark-text: #000;
    --light-bg: #fff;
    --dark-bg: #000;
    --dark-bg2: #191919;
    --c4: #009045;
    --c5: #e7e7e7;
    --c6: #f5f7f9;
    --active-btn: var(--c1);
    --inactive-btn: transparent;
}
    body.dark-mode {
        background: var(--dark-bg);
        color: var(--dark-text);
    }
    body.dark-mode .card {
        background: #0e0e0e;
        color: var(--light-text);
        border: 1px solid #4a4a4a;
    }
    body.dark-mode .sidebar, body.dark-mode #pg-bg2 {
        background: #0e0e0e;
        color: var(--light-text);
    }
    body.dark-mode h2,
    body.dark-mode .subtitle, 
    body.dark-mode .card-body h5.product-title, body.dark-mode #takeawayBtn,body.dark-mode .hamburger span hr,body.dark-mode .menu-text, body.dark-mode .t1, 
    body.dark-mode .t2, body.dark-mode .pizza-description, body.dark-mode .quantity-section .quantity-btn {
        color: var(--light-text);
    }
    body.dark-mode .adrs-box {
        border: 2px solid #484848;
    }
    body.dark-mode .product-title, body.dark-mode #pg-bg2 .page-title {
        color: var(--light-text);
    }
    body.dark-mode .swiper-slide, body.dark-mode .adrs-box,
    body.dark-mode .vam-btn a::before, body.dark-mode .bs .add-button::before{
        background: #0000001a;
    }
    body.dark-mode .form-select {
        background-color: #2c2c2c;
        border: 1px solid #e3e3e32a;
        color: var(--light-text);
        background-image: url(../img/landing-page/download-dark.svg);
    }
    body.dark-mode .menu-icon, body.dark-mode #deliveryBtn, body.dark-mode .cart-icon{
        filter: brightness(0) saturate(100%) invert(11%) sepia(100%) saturate(7485%) hue-rotate(0deg) brightness(118%) contrast(115%);

    }
    body.dark-mode .menu-link:hover{
        background: none;
    }
    body.dark-mode header{
        border: none;
    }
    body.dark-mode #product-section{
        background-image: none;
    }
    body.dark-mode .menu li a {
    color: #fff;
    text-shadow: none;
    }
    body.dark-mode .search-input, body.dark-mode #locationPopup .form-control, body.dark-mode #locationPopup .input-group-text img, 
    body.dark-mode #locationPopup .input-group-text
    body.dark-mode .pizza-row    {
        background-color: var(--dark-bg);
    }
    body.dark-mode .modal-content, body.dark-mode #bogo-page {
        background-color: var(--dark-bg2);
        background-image: none !important;
    }
    body.dark-mode .pizza-line li.active {
        color: var(--light-text);
    }
    body.dark-mode .cart-section {
        background-color: var(--dark-bg2);
        border: 1px solid #232222;
        border-radius: 5px;
    }
    body.dark-mode .empty-cart{
        background-color: var(--dark-bg);
    }
    body.dark-mode .cart-section h4{
        color: #fff;
    }
    body.dark-mode .cart-items-box{
        background: var(--dark-bg);
    }
    body.dark-mode .suggestions-title, body.dark-mode .cart-items-box .item-name,
     body.dark-mode .cart-items-box .item-price, body.dark-mode .cart-items-box .quantity,
     body.dark-mode .add-more, body.dark-mode, body.dark-mode, body.dark-mode{
        color: var(--light-text);
    }
    body.dark-mode .food-card .card-body{
        background-color: var(--dark-bg);
    }
    body.dark-mode .coupon-btn a, body.dark-mode .points-btn,body.dark-mode .pricing-box, .dark-mode .total-section{
        background-color: var(--dark-bg);
        color: var(--light-text);
    }
    body.dark-mode .pricing-box .price-row, body.dark-mode .total-label, body.dark-mode #checkout-page .item-name,
    body.dark-mode #checkout-page .item-price, body.dark-mode #checkout-page .total-label, 
    body.dark-mode #checkout-page .total-label, body.dark-mode #checkout-page .total-value,
    body.dark-mode #checkout-page .summary-header h2, body.dark-mode .add-more-btn{
        color: var(--light-text);
    }
    body.dark-mode #checkout-page .summary-header img{
        background-color: var(--light-bg);
        pad: 1px;
        border-radius: 5px;
    }
    body.dark-mode .points-btn:hover{
        background-color: var(--dark-bg);
    }
    body.dark-mode #login-form, body.dark-mode #otp-page .container, body.dark-mode .dropdown-button:hover,
    body.dark-mode .menu-top, body.dark-mode .menu-bottom{
        background-color: var(--dark-bg2);
    }
    body.dark-mode .menu-top, body.dark-mode .menu-bottom{
        background-image: none;
    }
    
    body.dark-mode .dropdown-content{
        border: none;
    }
    body.dark-mode #login-form .input-wrapper, body.dark-mode #pgtModal .pgt-option{
        background-color: var(--dark-bg);
    }
    body.dark-mode .otp-input, body.dark-mode .bogo-btn, body.dark-mode .bogo-btn-disabled{
        background-color: var(--dark-bg);
        color: var(--light-text);
    }
    body.dark-mode .pro-odr-box .header, body.dark-mode .pro-odr-box .tabs, body.dark-mode .points, body.dark-mode #checkout-page,
    body.dark-mode #feedbackFormPage2 .form-input, body.dark-mode #feedbackFormPage2 .form-select, 
    body.dark-mode #feedbackFormPage2 .form-textarea, body.dark-mode #feedbackFormPage2 .radio-item,
    body.dark-mode #feedbackFormPage2 .rating-question
    {
        background-color: var(--dark-bg2);
        color: var(--light-text);
    }
     
    body.dark-mode #feedbackFormPage2 .file-upload-section
    {
        background: var(--dark-bg2);
        color: var(--light-text);
    }
    body.dark-mode #pro-odr, body.dark-mode .coupon-card, body.dark-mode .ta-card{
        background-color: #2f2f2f;
        background-image: none;
    }
    body.dark-mode #checkout-page .card, body.dark-mode #checkout-page .order-summary{
        background-color: var(--dark-bg);
        background-image: none;
    }
    body.dark-mode .tab.active, body.dark-mode .order-id, body.dark-mode .order-price, body.dark-mode .info-item span, 
    body.dark-mode #checkout-page .card-title, body.dark-mode #checkout-page .info-text, 
    body.dark-mode #checkout-page .instructions-section h3, body.dark-mode #checkout-page .payment-text, 
    body.dark-mode #checkout-page .change-btn, body.dark-mode #checkout-page .payment-amount,  
    body.dark-mode #checkout-page .final-total-label, body.dark-mode #checkout-page .final-total-amount, 
    body.dark-mode #feedbackForm .form-section-title, body.dark-mode #feedbackForm .radio-item label, 
    body.dark-mode #feedbackFormPage2 .form-label, body.dark-mode #feedbackFormPage2 .radio-item label,
    body.dark-mode #feedbackFormPage2 .rating-question-text, body.dark-mode .user-dropdown .btn, body.dark-mode .udm .dropdown-item,
    body.dark-mode .coupon-details h3, body.dark-mode .coupon-details p, body.dark-mode .coupon-details .minimum-order span,
    body.dark-mode .addon-section .section-title, body.dark-mode .total-section .total-price, body.dark-mode .osts-cont h3,
    body.dark-mode .order-meta, body.dark-mode .order-meta span, body.dark-mode .receipt-container .item-name,
    body.dark-mode .receipt-container .item-price,
    body.dark-mode .summary-section .summary-label, body.dark-mode .summary-section .summary-value, body.dark-mode .total-row,
    body.dark-mode .tab-buttons button a
    {
        color: var(--light-text);
    }
    body.dark-mode .tab:hover{
        color: #ccc5c5;
    }
    body.dark-mode .pro-odr-box .content, body.dark-mode .accordion-header, 
    body.dark-mode #checkout-page .instructions-input{
        background-color: var(--dark-bg);
        color: #fcfcfc;
    }
    body.dark-mode #checkout-page .checkbox-label, body.dark-mode #blog-items .card-title, 
    body.dark-mode .feedback-card .card-description, body.dark-mode #feedbackForm .select-container select,
    body.dark-mode #feedbackForm .btn-secondary, body.dark-mode .form-subtitle, body.dark-mode #feedbackFormPage2 .file-upload-text,
    body.dark-mode .vd-btn:hover{
        color: #fcfcfc;
    }
    body.dark-mode #checkout-page .instructions-input{
        border: 2px solid #454545;
    }
    body.dark-mode #checkout-page .checkbox-container:hover, body.dark-mode .chk-btn-sec, body.dark-mode .feedback-card, 
    body.dark-mode .form-card, body.dark-mode .coupon-input-section, body.dark-mode .coupon-section h2, body.dark-mode .udm.show,
    body.dark-mode .instructions-cart-section, body.dark-mode .addon-section, body.dark-mode .points-card, 
    body.dark-mode #rewardModal .form-control, body.dark-mode .osts-cont, body.dark-mode .receipt-container,body.dark-mode .qc-exc,
    body.dark-mode .quantity-section .quantity-btn
    {
        background-color: var(--dark-bg); 
    }
    body.dark-mode #checkout-page .terms, body.dark-mode #checkout-page .terms a{
        color: #c9c9ca;
    }
    body.dark-mode #scsModal .modal-body .card, body.dark-mode #pg-bg2, body.dark-mode #feedbackForm .radio-item,
    body.dark-mode #feedbackForm .select-container select, body.dark-mode #feedbackForm .btn-secondary, 
    body.dark-mode .coupon-input-section .input-field, body.dark-mode .pizza-modal .form-control{
        background-color: var(--dark-bg2);
    }
    body.dark-mode .menu .container .swiper-button-next, body.dark-mode .menu .container .swiper-button-prev, 
    body.dark-mode #product-section{
        background: var(--dark-bg2);
    }
    body.dark-mode #blog-items, body.dark-mode #osts-page {
        background-image: none;
        background-color: var(--dark-bg2);
    }
    body.dark-mode .udm .dropdown-item:hover{
    background-color: #e7e7e7;
    color: #000;
}
    body.dark-mode .coupon-icon img{
        background-color: #fff;
        border-radius: 50%;
    }
    body.dark-mode .minimum-order img, body.dark-mode .bogo-btn img, body.dark-mode .bogo-btn-disabled img{
        filter: invert(1);
    }
    body.dark-mode .pizza-modal .form-check-input, body.dark-mode .quantity-section .quantity-btn{
        border: 1px solid #fff;
    }
     body.dark-mode .add-more-icon {
        border: 2px solid #fff;
    }
/* Dark mode ends */