﻿/*.payment_popup {
    width: 100%;
    height: 100%;
    margin: auto;
    position: fixed;
    top: 0%;
    left: 0%;
    background-color: rgba(80, 80, 80, 0.6);
    z-index: 5;

}

.payment_popup-content {
    position: fixed;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    top: 5%;
    left: 5%;
    padding: 10px;
    background-color: rgba(0, 0, 0, 1);
    border: 2px solid black;
    box-sizing: border-box;
    overflow-y: auto;
    max-height: 90vh;

}


.payment_popup_Sumup_content {
    position: fixed;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    top: 5%;
    left: 5%;
    padding: 10px;
    background-color: rgba(0, 0, 0, 1);
    border: 2px solid black;
    box-sizing: border-box;
    overflow-y: auto;
    height: 90vh;
}

.payment_popup_innerContent {
    height: fit-content;
    display: flex;
    flex-grow: 1;

}





.TableNumber {
    width: 100%;
    text-align: center;
    margin-top: 30px;
    font-size: 2em;
    font-weight: bold;
}

.TableNumberSelect{
    width: 100%;

    text-align: center;
}


.FreitextTextArea{
    width: 100%;
    text-align: center;
    min-height: 2em;
}


.header_bargeld {
    width: 100%;


}

.header_bargeld_text {
    text-align: center;
    background-color: #d3c344;
    color: white;
    font-weight: bold;
    font-size: 3em;
    border-bottom: 2px solid white;

}

.header_paypal {
    width: 100%;

}

.header_paypal_text { 
    text-align: center;
    background-color: #0e9efe;
    color:white;
    font-weight: bold;
    font-size: 3em;
    border-bottom: 2px solid white;

}

.header_SumUp {
    width: 100%;
}

.header_SumUp_text {
    text-align: center;
    background-color: #a80000;
    color: white;
    font-weight: bold;
    font-size: 3em;
    border-bottom: 2px solid white;

}

.header_xButton {
    background-color: #4d4d4d;
    font-size: 2em;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 2px;
    padding-bottom: 2px;
    color: white;
    position: absolute;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    right: 0;
    top: 0;
}


.payment_popup_Sumup_innerContent {
    display: flex;
    margin-top: 20px;
    flex-grow: 1;
}

.payment_popup_Sumup_grid {
    width: 70%;
    padding: 10px;
    border: 1px solid darkgrey;
}





.payment_popup_Sumup_orderData {
    width: 30%;
    display: flex;
    flex-flow: column;
    border: 1px solid darkgrey;
}


.payment_popup_Sumup_RefreshPayments {
    width: 100%;
    padding: 5px;
}

.payment_popup_Sumup_RefreshPaymentsBtn {
    width: 100%;
    padding: 10px;
    font-size: 1.8em;
    background-color: #4d4d4d;
    color: white;
    border: 2px solid #4d4d4d;
}

.payment_popup_Sumup_RefreshPayments_LastUpdatedText{
    font-size: 1em;
    color: lightgray;
}

.payment_popup_Sumup_orderData_Text {
    flex-grow: 1;
}
.payment_popup_Sumup_orderData_OrderNumber {
    width: 100%;
    text-align: center;
    font-size: 3em;
    color: white;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
}

.payment_popup_Sumup_orderData_Betrag {
    margin-top: 20px;
    text-align: center;
    color: white;
    font-size: 2.5em;
}


.payment_popup_Sumup_orderData_Abschluss {
    width: 100%;
    padding: 5px;
    border-top: 2px solid white;
}
.payment_popup_Sumup_orderData_AbschlussBtn {
    width: 100%;
    padding: 10px;
    font-size: 1.8em;
    background-color: #4d4d4d;
    color: white;
    border: 2px solid #4d4d4d;
}


.payment_popup_paypal_content {
    position: fixed;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    top: 5%;
    left: 5%;
    padding: 10px;
    background-color: rgba(0, 0, 0, 1);
    border: 2px solid black;
    box-sizing: border-box;
    overflow-y: auto;
    height: 90vh;
}


.payment_popup_paypal_innerContent {
    height: fit-content;
    display: flex;
    flex-grow: 1;
}

.payment_popup_paypal_grid {
    width: 70%;
    padding: 10px;
    border: 1px solid darkgrey;
}

.payment_popup_paypal_orderdata {
    width: 30%;
    display: flex;
    flex-flow: column;
    border: 1px solid darkgrey;
}
.payment_popup_PayPal_ToggleQRCodeBtn_Shown {
    width: 100%;
    padding: 10px;
    font-size: 1.8em;
    background-color: #4ba000;
    color: white;
    border: 2px solid #4ba000;
    margin-top: 5px;
}

.payment_popup_PayPal_ToggleQRCodeBtn_Invis {
    width: 100%;
    padding: 10px;
    font-size: 1.8em;
    background-color: #e57e00;
    color: white;
    border: 2px solid #e57e00;
    margin-top: 5px;
}

.payment_popup_paypal_orderdataText {
    flex-grow: 1;
}

.payment_popup_PayPal_orderData_OrderNumber {
    width: 100%;
    text-align: center;
    font-size: 3em;
    color: white;
    border-top: 2px solid white;
    border-bottom: 2px solid white;
}

.payment_popup_PayPal_orderData_Betrag {
    margin-top: 20px;
    text-align: center;
    color: white;
    font-size: 2.5em;
}

.payment_popup_PayPal_orderData_Abschluss {
    width: 100%;
    padding: 5px;
    border-top: 2px solid white;
}

.payment_popup_PayPal_orderData_AbschlussBtn {
    width: 100%;
    padding: 10px;
    font-size: 1.8em;
    background-color: #4d4d4d;
    color: white;
    border: 2px solid #4d4d4d;
}



.Endpreis {
    text-align: center;
    font-weight: bold;
    font-size: 2em;
    margin-top: 20%;
}

.orderNumber {
    font-weight: bold;
    font-size: 2em;
    text-align: center;
    border-radius: 10px;
    border: 2px solid black;
    padding: 10px;
}




.betragTable{
    font-size: 2em;
    margin-top: 10px;
    width: 60%;
    margin-left: auto;
    margin-right: auto;
}


.rowRueckgeld{
    border-top: 2px solid black;
}

.tableValue {
    font-weight: bold;
    padding: 5px;
    text-align: left;
    float: right;
}


.tableValueSummeMinus {
    font-weight: bold;
    padding: 5px;
    text-align: left;
    float: right;
    color: darkred;
}

.tableValueSummePlus {
    font-weight: bold;
    color: darkgreen;
    padding: 5px;
    text-align: left;
    float: right;
}


.errorMessage{
    max-width: 300px;
    font-size: 10px;
    color: #890303;
}

.tableBezeichnung {
    font-weight: bold;
    padding: 5px;
    text-align: left;
}

.payPalStuff {
    margin-top: 10px;
    width: 60%;
    background-color: white;
    float: left;
    box-sizing: border-box;
    padding: 10px;
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}


.qrCodeImage {
    max-width: 50%;

    margin-left: 25%;
    margin-top: 20px;
    margin-bottom: 5px;
}


.orderData {
    width: 40%;
    float: right;
    box-sizing: border-box;
    padding: 10px;
    margin-top: 10px;
    background-color: #fffcd4;
    border: 2px solid black;
    
}


.buttonArea {
    width: 100%;
    display: block;
    background-color: rgb(128, 128, 128);
    padding: 5px;
    float: right;
    min-height: 50px;
    margin-top: 10px;

}

.payment_popup_Sumup_buttonArea {
    width: 100%;
    display: block;
    background-color: rgb(128, 128, 128);
    padding: 5px;
    float: right;
    min-height: 50px;
    margin-top: 10px;
}




.popupbuttons {
    font-size: 2em;
    float: right;
    color: white;
    background-color: #4d4d4d;
    border: 1px solid black;
    min-height: 30px;
}



.barheaderDisplay{
    width: 100%;
    display: flex;
    margin-bottom: 5px;
}


.barBetragEingabe {
    text-align: center;
    font-size: 3em;
    width: 65%;
    margin-right: 5%;
    background-color: white;
    border: 2px solid black;
}

.bargeldselection {
    margin-top: 10px;
    width: 60%;
    background-color: #fffcd4;
    border: 2px solid black;
    float: left;
    box-sizing: border-box;
    padding: 10px;
    justify-content: center;
    align-items: center;
}

.barheaderDisplay {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;

}

.barBetragEingabe {
    font-size: 3em;
    font-weight: bold;
    border-radius: 10px;
}

.barUndoButton {
    background-color: rgb(220, 220, 220);
    border: none;
    color: #000;
    font-size: 2em;
    border-radius: 10px;
    border: 2px solid black;
    padding: 10px;
    width: 30%;
}

.bargeldTable {
    width: 100%;
    margin-top: 30px;
    font-size: 2em;
    text-align: center;
}

.columnSeparator {

    
}

.tableContent {
    padding-top: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #ccc;
}

.betragButton {
    background-color: rgb(220, 220, 220);
    border: none;
    color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 2px solid black;
    cursor: pointer;
    width: 100%;
    border-radius: 10px;
}

.betragFreiText{
    width: 75%;
    resize: none;
    font-size: 2em;
    text-align: center;
    height: 2em;
}

.MoneyInputButton {
    background-color: rgb(220, 220, 220);
    border: none;
    color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
    border: 2px solid black;
    cursor: pointer;
    width: 20%;
    border-radius: 10px;
    float: right;
    font-size: 1.5em;
}

.FreiTextSection {
    text-align: center;
    margin-top: 30px;
    font-size: 2em;
    font-weight: bold;
}

.internOrder {
    margin-top: 10px;
    font-size: 1.2em;
    display: flex;
}

.internOrderCheckbox{
    width: 25px;
    height: 25px;

}

.internOrderLabel {
    align-items: center;
    margin-left: 5px;
}



.MoneyInput {
    margin-top: 10px;
}



.barTable {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px;
    border-collapse: collapse;
}

.barTableRow{
    width: 100%;
    display: flex;
}

.barTableColumn {
    font-size: 3em;
    width: 33.3%;
}


.barTableColumnZero {
    font-size: 3em;
    width: 66.7%;
    height: 30px;

}

.digitbutton {
    width: 100%;
    padding-top: 3vh;
    padding-bottom: 3vh;
}


.pos_comment_popup {
    width: 100%;
    height: 100%;
    margin: auto;
    position: fixed;
    top: 0%;
    left: 0%;
    background-color: rgba(80, 80, 80, 0.6);
    z-index: 5;
    overflow: auto;
}
.pos_popup-content {
    position: fixed;
    flex-direction: column;
    justify-content: space-between;
    width: 90%;
    height: fit-content;
    top: 5%;
    left: 5%;
    padding: 10px;
    background-color: rgba(180, 180, 180, 1);
    border: 2px solid black;
    box-sizing: border-box;
 
    overflow: auto;
}

.pos_popup_articleData{
    font-size: 3em;
    text-align: center;
    margin-top: 20px;

}

.pos_popup_articleData textarea {
    font-size: 1em;
    text-align: center;
    margin-top: 20px;
    width: 100%;
    min-height: 200px;

}







@media (max-height: 775px) {
    .payment_popup-content {
        width: 100%;
        top: 0%;
        left: 0%;
        height: 100%;
        max-height: 100%;
    }
}


.barTableColumn:hover {
    background-color: greenyellow;
}

.digitbutton:hover {
    background-color: greenyellow;
}

#toast-container {
    z-index: 999;
}


@media (max-width: 830px){


    .payment_popup-content{
        
    }

    .bargeldselection{
        width: 100%;
        float: left;

    }

    .orderData{
        width: 100%;
        float: left;
    }


    .payPalStuff{
        width: 100%;
    }

    .Endpreis{
        margin-top: 0%;
    }
}

*/



.payment_popup_Sumup_gridHeader {
    background-color: rgba(247,166,0, 0.2);
    background-color: rgba(60,60,60, 1);
    color: white;
}


.payment_popup_Sumup_gridRowFailed {
    background-color: rgb(212, 73, 6, 0.5);
}

.payment_popup_Sumup_gridRowPending {
    background-color: rgb(255, 246, 25, 0.5);
    font-weight: bold;
}

.payment_popup_Sumup_gridRowSuccess {
    background-color: rgb(12, 123, 6, 0.5);
    font-weight: bold;
}

.payment_popup_Sumup_gridRowReversed {
    font-weight: bold;
}