/**
 * FoodCoopShop - The open source software for your foodcoop
 *
 * Licensed under the GNU Affero General Public License version 3
 * For full copyright and license information, please see LICENSE
 * Redistributions of files must retain the above copyright notice.
 *
 * @since         FoodCoopShop 2.5.0
 * @license       https://opensource.org/licenses/AGPL-3.0
 * @author        Mario Rothauer <office@foodcoopshop.com>
 * @copyright     Copyright (c) Mario Rothauer, https://www.rothauer-it.com
 * @link          https://www.foodcoopshop.com
 */

body.self_services {
    margin: 0;
}
body.self_services #content,
.self-service,
.self-service .footer {
    width: 1234px;
}
body.self_services #content {
    margin-top: -46px;
}
.self-service {
    background-color: #fff;
    min-height: 500px;
    padding-right: 10px;
    position: relative;
    float: left;
}
.self-service .right-box {
    position: fixed;
    left: 865px;
    width: 368px;
    top: 0;
    overflow-y: auto;
    background-color: #fff;
}
.self-service .btn-order {
    margin-left: 5%;
    width: 90%;
    height: 60px;
    font-size: 20px;
}
.self-service .header h1 span {
    margin-right: 10px;
}
.self-service .header h2 {
    padding-top: 10px;
}
.self-service .bootstrap-select {
    width: 203px ! important;
}
.self-service .product-search-form-wrapper {
    top: 110px;
    left: 8px;
}
.self-service .product-search-form-wrapper .btn {
    padding: 6px 14px;
}
.self-service .product-search-form-wrapper .btn[type="submit"] {
    margin-left: 0;
    margin-right: 13px;
    height: 40px;
}
.self-service .product-search-form-wrapper input[name="keyword"] {
    width: 416px;
    font-size: 16px;
    height: 40px;
}
.self-service .product-search-form-wrapper .btn[type="button"] {
    height: 40px;
    font-size: 16px;
    width: 211px;
    margin-left: 30px;
}
.self-service .product-search-form-wrapper a.btn {
    height: 40px;
    padding: 8px 14px;
    margin-left: -1px;
    float: left;
}
.self-service .product-search-form-wrapper > .input {
    float: left;
}
.self-service #products {
    float: left;
    width: 100%;
    margin-left: 10px;
    margin-top: 10px;
    margin-bottom: 80px;
    padding-top: 50px;
    min-height: calc(100vh - 100px - 66px - 2px);
}
.self-service .pw {
    border-right: 1px solid #d6d4d4;
    width: 70%;
}
.self-service .pw div.c1 {
    width: 26%;
}
.self-service .pw div.c1 img {
    width: 150px;
}
.self-service .pw div.c2 {
    width: 45%;
}
.self-service .pw div.c3 {
    width: 26%;
}
.self-service #flashMessage {
    top: 46px;
    z-index: 1200;
    left: 315px;
    width: 396px;
}
.self-service #login-form form {
    padding-top: 20px;
    position: relative;
}
.self-service #login-form hr {
    clear: both;
    width: 100%;
    float: left;
    margin-top: 15px;
    margin-bottom: 25px;
}
.self-service #login-form #LoginForm button {
    margin-top: -20px;
}
.self-service #login-form h1 {
    padding-left: 0;
}
.self-service #login-form h2 {
   width: 100%;
   text-align: center;
   border-bottom: 1px solid #ccc;
   line-height: 0.1em;
   margin: 15px 0 25px;
   float: left;
   font-size: 18px;
}
.self-service #login-form h2 span {
    background: #fff;
    padding:0 10px;
}
.self-service #login-form i.fa-solid.fa-hand-point-up.fa-beat {
    font-size: 120px;
    font-weight: 200;
    padding: 20px 20px;
}
.self-service h7 {
    font-size: 16px;
    font-weight: 500;
}
.self-service .footer {
    background: #fff;
    position: fixed;
    bottom: 0;
    height: 66px;
    border-top: 1px solid #d6d4d4;
}
.self-service .footer i.ok {
    color: #fff;
}
.self-service .header {
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    height: 160px;
    width: 865px;
    z-index: 1000;
    padding-left: 10px;
}
.pw {
    border-top: none;
    padding-top: 10px;
}
.self-service .footer .left-wrapper {
    position: absolute;
    bottom: 17px;
    left: 10px;
}
.self-service .footer .right-wrapper {
    position: absolute;
    bottom: 6px;
    right: 10px;
}
.self-service .footer .right-wrapper .btn,
.self-service .footer .right-wrapper .logo-wrapper {
    float: left;
}
.self-service .footer .right-wrapper .btn {
    margin-top: 12px;
    margin-right: 5px;
}
.self-service .footer .right-wrapper img {
    height: 53px;
}
.no-pointer{
    pointer-events: none;
}
body.customers.login .self-service .footer {
    position: static;
    background: transparent;
    height: auto;
    border: none;
}
body.customers.login .self-service {
    margin-top: -100px ! important;
    min-height: 565px ! important;
}
body.customers.login .footer .left-wrapper,
body.customers.login .footer .right-wrapper .btn-add-deposit {
    display: none;
}
.self-service #cart {
    position: static;
    padding-bottom: 3px;
    border: 1px solid #ccc;
    border-top: none;
    border-right: none;
    width: 100%;
}
.self-service .cart span.product-name-wrapper {
    width: 270px;
}
.self-service .pw .pickup-day {
    display: none;
}
.self-service #SelfServiceForm {
    padding-top: 10px;
    padding-bottom: 80px;
    border-left: 1px solid #d6d4d4;
}
.self-service #SelfServiceForm p.payment-type {
    padding-left: 5px;
}
.self-service .product.error,
.self-service .error-message {
    background: #f3515c;
    color: #fff;
}
.self-service .product.error span,
.self-service .product.error a {
    color: #fff ! important;
}
.self-service ul.error-message {
    padding: 5px;
    float: left;
    line-height: 14px;
}
.self-service .error-message {
    font-size: 12px;
}
.self-service #cancellation-terms,
.self-service #general-terms-and-conditions {
    display: none;
}
.self-service input[type="radio"] {
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 3px;
}
.self-service #SelfServiceForm .radio label:first-child {
    margin-left: 17px;
    margin-right: 15px;
}
.self-service .radio label[for="carts-self-service-payment-type-1"],
.self-service .radio label[for="carts-self-service-payment-type-2"] {
    line-height: 20px;
    margin-right: 10px;
}
.self-service .right-box .input.checkbox,
.self-service .right-box .input.radio {
    width: 345px;
    margin-left: 5px;
}
.self-service .right-box input[type="checkbox"] {
    float: left;
    margin-right: 5px;
}
.self-service .right-box .input.checkbox label {
    line-height: 16px;
}
.self-service .right-box form div.error-message {
    margin-left: 0;
    width: auto;
    line-height: 16px;
}
.self-service .pw .unit-amount {
    display: none;
}
.self-service .pw .quantity-in-units-input-field-wrapper {
    float: left;
    margin-top: 5px;
    margin-left: -5px;
    padding: 0 5px;
    width: 100%;
}
.self-service .pw .quantity-in-units-input-field-wrapper.error {
    background: #f3515c;
    color: #fff;
}
.self-service .pw .quantity-in-units-input-field-wrapper input {
    width: 72px;
    text-align: right;
}
.self-service .pw .quantity-in-units-input-field-wrapper .calculator-input {
    width: 100%;
    margin-top: 5px;
}
.self-service .pw .amount-wrapper .fas {
    font-size: 30px;
    margin-top: -1px;
}
.self-service #add-payment-deposit-form {
    display: none;
}
body.self_services .btn-flash-message-continue {
    float: right ! important;
}
body.self_services #categoryid {
    width: 193px;
    height: 32px;
}
