﻿#cartOffcanvas {
    color: black;
}

.ViewCartTitle {
    background-color: #8b1822;
    color:  #fff;
}

.toggle-switch .active {
    background-color: #fff;
    color: #000;
}

.EditItemQtnBtn, .DltItemBtn, #EmptyCart {
    border: none;
    padding: 4px;
    margin-left: 4px;
    background:#fff;
}

.ItemQtn {
    width: 26px;
    height: 28px;
    vertical-align: middle;
    border: none;
    outline: none;
    text-align: center;
}
.ViewCartTip label {
    font-size:15px !important;
}
#AddItem {
    color: #fff;
    background-color: #8b1822;
    padding: 7px;
    width: auto;
    border-radius: 7px;
    display: none;
    border: 1px solid #8b1822;
}
    #AddItem:hover {
        color: #000;
        border: 1px solid #8b1822;
        background: #fff;
    }

    #tipContainer {
        display: flex;
    }

    #tipInput {
        position: relative;
        float: left;
    }

    .accordion-button:not(.collapsed) {
        color: #3c090e;
    }

    #tipApply {
        padding: 5px;
        background: black;
        color: #fff;
        cursor: pointer;
    }

.CheckOutBtn {
    padding: 7px;
    background-color: #8b1822;
    color: #fff;
    border: 2px solid #8b1822;
    width: 100%;
}

    .CheckOutBtn:hover {
        background-color: #fff;
        color: #000;
        transition: 0.3s ease-in-out;
    }

    .DcrItemQtnBtn, .IcrItemQtnBtn {
        border: none;
    }

    .button-group label {
        padding: 9px;
        background-color: rgba(221, 210, 210, 0.521);
        border-radius: 10%;
        cursor: pointer;
        color: black;
        display: flex;
        justify-content: center;
        font-weight: 400;
        font-size: clamp(16px, 3vw, 18px);
    }

.button-group input[type="radio"]:checked + label {
    background-color: #8b1822;
    color: #fff;
}

    .button-group input[type="radio"] {
        display: none;
    }

    .button-group {
        display: flex;
        gap: 5px;
    }

    input[type=radio] {
        appearance: none;
        width: 16px;
        height: 16px;
        vertical-align: middle;
        border: 1px solid #000000;
        border-radius: 50%;
        background-clip: content-box;
        padding: 2px;
    }

    .DcrItemQtnBtn, .IcrItemQtnBtn, .EdtItemBtn {
        width: 17px;
        outline: none;
        border: none;
        padding: 0px;
        background: transparent;
        margin: 0px 4px;
    }

    #offcanvasCartContent.loading::after, #orderTypeModal.loading::after, #toppingsArea.loading::after, #ViewCartContainer.loading::after {
        content: "";
        width: 32px;
        height: 32px;
        border: 3px solid #ccc;
        border-top-color: #3c090e;
        border-radius: 50%;
        animation: spin1 0.8s linear infinite;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    @keyframes spin1 {
        to {
            transform: translate(-50%, -50%) rotate(360deg);
        }
    }

    .editlink, .removelink {
        text-decoration: underline;
    }

    .accordion-button:not(.collapsed) {
        color: #0c63e4;
        background-color: #fac48659;
        box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .125);
    }

    .accordion-button:not(.collapsed) {
        color: #000;
    }