.page.receipt > .header {
    top: 44px !important;
}

.panelReceipt ul.receipt { padding: 0; list-style-type: none; font-family: var(--font-stack-mono); font-size: 0.75em; }
.panelReceipt ul.receipt li { position: relative; padding: 10px 0; border-bottom: 1px solid #eee; cursor: pointer; }
.panelReceipt ul.receipt li.selected { background: var(--colors-blue); color: #fff; }
.panelReceipt ul.receipt li.selected::after { position: absolute; top: 5px; right: -1px; width: 0; height: 0; display: block; content: ' '; border: 12px solid; border-color: rgba(0,0,0,0) #fff rgba(0,0,0,0) rgba(0,0,0,0); }
.panelReceipt ul.receipt li .count { position: absolute; left: 30px; width: 40px; }
.panelReceipt ul.receipt li .description { margin: 0 190px 0 30px; display: inline-block; }
.panelReceipt ul.receipt li .hasCount .description { margin: 0 190px 0 70px; }
.panelReceipt ul.receipt li .price { position: absolute; right: 110px; width: 80px; text-align: right; }
.panelReceipt ul.receipt li .totalPrice { position: absolute; right: 30px; width: 80px; text-align: right; }
.panelReceipt ul.receipt li .pending { color: #aaa; }
.panelReceipt ul.receipt li .pending .description::after { content: ''; position: absolute; margin-left: 6px; display: inline-block; width: 16px; height: 16px; background-image: url(${_ROOT}images/loader-small@2x.gif); background-size: contain; background-repeat: no-repeat; }
.panelReceipt ul.receipt li.selected .pending { color: #fff; }
.panelReceipt ul.receipt li.selected .pending .description::after { mix-blend-mode: multiply; }
.panelReceipt ul.receipt li .failed { color: #aaa; }
.panelReceipt ul.receipt li .failed .description { text-decoration: line-through; }
.panelReceipt ul.receipt li .failed .totalPrice { text-decoration: line-through; }
.panelReceipt div.total { font-family: var(--font-stack-mono); font-size: 0.75em; padding: 10px 30px; position: relative; cursor: default; }
.panelReceipt div.total .description { margin: 0 80px 0 0; }
.panelReceipt div.total .totalPrice { position: absolute; right: 30px; width: 80px; text-align: right; }
.panelReceipt .widget.toolbar { margin-top: 50px; }


.receiptButtons div {
    display: flex;
    flex-direction: column;
}

.receiptButtons .widget.button {
    margin-bottom: 4px;
    margin-left: -8px;
    margin-right: 0;
}
.receiptButtons .widget.button button {
    width: 40px !important;
    height: 40px !important;
}
.receiptButtons .widget.button button:hover {
    border-radius: 6px; 
    position: relative;
}
.receiptButtons .widget.button button[data-icon]::before {
    font-size: 28px;
}
.receiptButtons .widget.button button:hover::after {
    content: '+';
    position: absolute;
    margin-left: -44px;
    font-family: SalonIcon, SalonWidgets;
    font-size: 12px;
}
.receiptButtons .widget.button button:disabled::after {
    content: '';
}

.receiptButtons .widget.separator hr {
    width: 82px;
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

body .widget.paymentbuttons { margin-bottom: 1px; }
body .widget.button.morePaymentMethods button[data-icon]::before { font-size: 12px; color: #888; }


.panelReceipt .employeeWrapper { margin: 0 30px 12px 30px; border: 1px solid #e5e5e5; border-radius: 6px; padding: 8px 0 0 16px; background: #f6f6f6; }
.panelReceipt .employeeWrapper .widget.dropdown { margin-bottom: 7px; }