input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .BST6Payment-select { width: 100px; height: 49.82px; border-radius: 8.3px; background-color: #eef3f3; font-size: 14px; font-weight: 600; line-height: 25px; letter-spacing: 0em; text-align: center; border: none; font-family: "Poppins", sans-serif; } .BST6Payment-Button-pay { width: 10rem; height: 49.82px; border-radius: 6px; background-color: var(--SELECTED_COLOR); font-weight: 600; letter-spacing: 0em; font-size: 19px; text-align: center; border: none; cursor: pointer; font-family: "Poppins", sans-serif; } .BST6Payment-Button-pay-disabled { width: 10rem; height: 49.82px; border-radius: 6px; background-color: var(--SELECTED_COLOR); font-weight: 600; letter-spacing: 0em; font-size: 19px; text-align: center; border: none; cursor: pointer; font-family: "Poppins", sans-serif; pointer-events: none; opacity: 0.5; } .c-btn { display: flex; align-items: center; justify-content: center; } .BST6Payment-Button-CANCEL { width: 50px; height: 50px; border-radius: 8.3px; background-color: #c6303e; border: none; font-size: 14px; font-weight: 600; color: #fff; cursor: pointer; font-family: "Poppins", sans-serif; } .BST6Payment-Button-RECIEVED { width: 100px; height: 38.16px; border-radius: 8.3px; border: 0.83px solid #8e8e8e; font-size: 12px; font-family: "Poppins", sans-serif; text-align: center; } .BST6Payment-Button-RECIEVED1 { width: 100px; height: 38.16px; border-radius: 8.3px; border: 0.83px solid #ff4d4f; font-size: 12px; font-family: "Poppins", sans-serif; text-align: center; } .BST6Payment-Button-RECIEVED1:focus-visible { outline: 1px solid #ff4d4f; } .BST6Payment-Button-BALANCE { width: 100px; height: 38.16px; border-radius: 8.3px; border: 0.83px solid #8e8e8e; font-size: 12px; font-family: "Poppins", sans-serif; text-align: center; } .BST6Payment-Structure { background-color: #fff; display: flex; flex-direction: column; gap: 0.5rem; align-items: center; justify-content: space-between; } .BST6Payment-div1 { padding-top: 8px; display: flex; flex-direction: row; align-items: center; gap: 0.4rem; } .BST6Payment-div2 { display: flex; flex-direction: row; gap: 2rem; align-items: center; } .BST6Payment-Paydiv { display: flex; justify-content: space-evenly; } .Payicon-Align { font-size: 18px; display: flex; align-items: center; } .pay-opt { width: 80px; height: 40px; font-size: 14px; text-transform: uppercase; border-radius: 6px; font-weight: 600; cursor: pointer; } .BST6Payment-Button-Hold { font-size: 25px; cursor: pointer; } .pop-sum-btn { display: none; } .Table6-payment-mode { display: flex; justify-content: space-between; column-gap: 0.2rem; } .splitpaymantBTNCombo { background-color: var(--DEFAULT_SELECTED_COLOR); font-size: 14px; font-weight: 500; height: 40px; width: 100px; border-radius: 7.2px; color: #fff; padding: 3px; display: flex; gap: 0.2rem; align-items: center; font-family: "Poppins"; justify-content: center; cursor: pointer; text-transform: capitalize; svg { width: 20px; height: 20px; } @media (max-width: 992px) { font-size: 11px; height: 35px; width: 105px; svg { width: 17px; height: 17px; } } @media (max-width: 768px) { font-size: 13px; height: 40px; width: 130px; } @media (max-width: 500px) { font-size: 12px; height: 40px; width: 80px; } } .Btn-payment-mode { background-color: var(--SELECTED_COLOR); font-size: 13px !important; font-weight: 500;border: none; height: 40px; outline: none; flex-grow: 1; flex: 1; width: max-content !important; border-radius: 7.2px; color: #fff; padding: 3px; display: flex; gap: 0.2rem; align-items: center; font-family: "Poppins"; justify-content: center; cursor: pointer; border: none; text-transform: capitalize; @media (max-width: 992px) { font-size: 11px; height: 35px; width: 105px; } @media (max-width: 768px) { font-size: 13px; height: 40px; width: 130px; } @media (max-width: 500px) { font-size: 12px; height: 40px; width: 80px; } } .Btn-payment-mode-sel { background-color: var(--DEFAULT_SELECTED_COLOR); font-size: 13px !important; font-weight: 500; outline: none;border: none; height: 40px; width: max-content !important; flex: 1; flex-grow: 1; border-radius: 7.2px; color: #fff; padding: 3px; display: flex; gap: 0.2rem; align-items: center; font-family: "Poppins"; justify-content: center; cursor: pointer; text-transform: capitalize; border: none; @media (max-width: 992px) { font-size: 11px; height: 35px; width: 105px; } @media (max-width: 768px) { font-size: 13px; height: 40px; width: 130px; } @media (max-width: 500px) { font-size: 12px; height: 40px; width: 80px; } } .upioptbtn { width: 20px; height: 20px; cursor: pointer; background-color: #bebebe; color: #000000; border: none; border-radius: 6px; } .paymenticon { width: 20px; height: 20px; cursor: pointer; // background-color: #bebebe; // color: #000000; border: none; border-radius: 6px; } .BST6Payment-flex { display: flex; gap: 0.5rem; flex-direction: row; color: var(--DEFAULT_SELECTED_COLOR); } .BST6Payment-others { display: flex; align-items: center; gap: 0.5rem; color: var(--DEFAULT_SELECTED_COLOR); } .BST6Payment-buttons { display: flex; flex-direction: row; gap: 1rem; } .table6-billtable { display: none; } @media (max-width: 280px) { .table6-billtable { display: block !important; } .BST6Payment-select { width: 55px !important; } .BST6Payment-div2 { flex-direction: column-reverse; gap: 0.5rem !important; } .BST6Payment-buttons { display: flex; flex-direction: row; gap: 0.5rem; } .BST6Payment-others { display: flex; flex-direction: row; gap: 0.4rem; } .BST6Payment-div1 { gap: 1rem; } .pop-sum-btn { display: flex; } .pay-opt { width: 40px !important; font-size: 11px !important; } .BST6Payment-Button-pay { width: 125px !important; height: 40px; font-size: 17px; } .Table6-payment-mode { padding: 0rem 0.8rem; column-gap: 0.5rem; } } @media all and (max-width: 499px) { .table6-billtable { display: block !important; } .BST6Payment-div1 { display: flex; flex-direction: row; } .BST6Payment-select { width: 70px !important; height: 20px; font-size: 9px; font-weight: 400; line-height: 15px; } .BST6Payment-Structure { width: 100vw; position: fixed; bottom: 0; left: 0; } .pay-opt { width: 80px; font-size: 11px !important; } .BST6Payment-Button-pay { // width: max-content; width: 155px; height: 40px; font-size: 19px; } .BST6Payment-Button-CANCEL { width: 35px; height: 35px; border-radius: 2px; } .BST6Payment-Button-CANCEL-txt { font-size: 0px; } .BST6Payment-Button-RECIEVED { width: 56px; height: 30px; font-size: 12px; } .BST6Payment-Button-BALANCE { width: 56px; height: 30px; font-size: 12px; } .Payicon-Align { font-size: 12px; } .pop-sum-btn { display: flex; } .Table6-payment-mode { column-gap: 0.5rem !important; align-items: center; } } @media screen and (max-width: 768px) { .pop-sum-btn { display: flex; } .table6-billtable { display: block !important; } .BST6Payment-Structure { width: 100vw; row-gap: 0.5rem; position: fixed; bottom: 10px; } .Table6-payment-mode { column-gap: 0.5rem !important; } .BigScreenSummary { display: none !important; } } .Order { background-color: var(--SELECTED_COLOR); } .ChairClrRed { color: red; } .ChairClrGreen { color: var(--SELECTED_COLOR); }