.sum-order-details p span{float:right;font-weight:bold;}
.sum-order-details p::after{content:"";display:block;clear:both;}
.sum-order-details .price-order{margin-top:20px;}
.sum-order-details .price-order span{color:var(--color-custom-bleu-dark);font-size: 18px;}
.order-details{display: flex;flex-wrap: wrap;margin-top: 30px;}
.order-details h4{font-size: 18px;font-weight: 600;}
#orderModal {display:none;position: fixed;top: 15%;left: 50%;transform: translate(-50%, 0%);z-index: 99999999;background-color: #fff;width: 95%;max-width: 1320px;padding: 20px;border-radius: 8px;box-shadow: 0 4px 15px rgba(0,0,0,0.3);}
#orderModal .modal-content{max-height: 95vh;overflow: auto;padding-bottom: 100px;}
#orderModal .close-btn{position: absolute;right: 0px;font-size: 20px;background: var(--color-custom-bleu-dark);width: 20px;height: 20px;color: #fff;text-align: center;border-radius: 180pc;line-height: 20px;overflow: hidden;cursor:pointer;}
#orderModal h3{display: block;margin-top: 10px;margin-bottom: 15px;font-weight: 400;font-size: 20px;color:var(--color-custom-bleu-dark)}
#orderModal h3 span{font-weight:bold;}
#fullcart-order .cart-responsive-table{width:100%;float:unset;}
#fullcart-order .cart-responsive-table .cart-quantity-name{padding-top: 0px;}
#fullcart-order .img-cart img{max-width:65px;}
#fullcart-order .cart-responsive-table .cart-in-quick-cart-in{position:unset!important;transform:unset!important;left:unset!important;top:unset!important;height: 65px;display: block;margin-left: auto;margin-right: auto;}
.order-details p{padding:0px;margin:0px;font-size:15px;}
.orders-table{width: 100%;text-align: center;margin-top:30px;}
.orders-table thead{background-color:var(--color-custom-bleu-dark);color:#fff;}
.orders-table thead tr th{padding:10px;font-weight: 400;}
.orders-table .order-row{background: #fff;border-bottom: 1px solid #000;}
.orders-table .order-row td{padding:10px;color:var(--black-transparent-5);}
.orders-table .view-btn{border: 0px;background: unset;}
.filters-container{margin-top: 20px;}
.filters-container input{border: 1px solid rgba(0, 0, 0, 0.3);padding: 5px;border-radius: 10px;background: #fff;width: 100%;}
.filters-container button{background: var(--color-custom-bleu-dark);border-radius: 25px;color: #fff;border: 0px;padding: 5px;width: 150px;margin-top: 28px;}
.filters-container label{display: block;text-align: left;font-size:15px;margin-bottom:5px;}
.filters-container form{display: flex;flex-wrap: wrap;width:100%;max-width: 1080px;}
.main-details-order{color: var(--black-transparent-5);}
#pagination-order{display: block;width: 100%;max-width:420px;margin-left: auto;margin-right: auto;margin-top: 30px;text-align:center;}
#pageIndicator{color: var(--black-transparent-5);padding:10px;}
#pagination-order button{background: var(--color-custom-bleu-dark);border-radius: 25px;color: #fff;border: 0px;padding: 5px;width: 150px;}
#customerclient {position: relative;padding-left: 35px;padding-right: 35px;/*background-image: url(/images/banners/background-d.jpg);background-attachment: fixed;background-size: cover;background-position: center center;background-repeat: no-repeat;*/background-color: var(--color-custom-bleu-dark);min-height: 70vh;}
#massage-checkout {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 9999999999999;background: #fff;color: red;display: none;width: 100%;max-width: 500px;padding: 20px;min-height: 450px;cursor: pointer;border-radius: 20px;box-shadow: 4px 3px 7px rgba(0, 0, 0, 0.3);padding-top: 50px;}
#login-form {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);max-width: 100%;width: 500px;display: block;margin-left: auto;margin-right: auto;border: 4px solid rgba(255, 255, 255, 0.5);background: rgba(255, 255, 255, 0.4);box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);backdrop-filter: blur(5px);-webkit-backdrop-filter: blur(5px);border-radius: 20px;padding-top:10px;padding-bottom:10px;}
#login-form h1 {font-size: 30px;text-align: center;font-weight: 500;color: var(--color-custom-bleu-dark);}
#login-form label {display: block;text-align: center;font-size: 16px;font-weight: 200;margin-top: 30px;font-weight: bold;}
#login-form #email,#login-form #pass,#login-form #otp-pass {display: block;width: 320px;margin-left: auto;margin-right: auto;border: 0px;background: rgba(255, 255, 255, 0.2);padding: 10px;border-radius: 10px;margin-top: 5px;padding-left: 45px;}
#login-form input::placeholder {opacity: 0.3;}
/*#login-form #otp-pass{display:none;}*/
#label-showpass-customer{margin-top:10px!important;}
#confirm-login,#confirm-one-time-password{display: block;width: 320px;margin-left: auto;margin-right: auto;border: 0px;background: rgba(0, 0, 0, 0.1);padding: 10px;border-radius: 10px;margin-top: 15px;font-weight: bold;font-size: 17px!important;}
#massage-customer{position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);z-index: 9999999999999;background: #fff;color: red;display: none;width: 100%;max-width: 500px;padding: 20px;min-height: 450px;cursor: pointer;border-radius: 20px;box-shadow: 4px 3px 7px rgba(0, 0, 0, 0.3);padding-top: 50px;}
#massage-customer.error-active {display: block;}
#massage-customer::before {content: "x";display: block;position: absolute;left: 15px;top: 15px;background: #000;width: 20px;height: 20px;text-align: center;color: #fff;line-height: 17px;font-size: 14px;font-weight: bold;border-radius: 360px;}
#customerClientLoginIn {position:relative;}
.tab-container {/*border-bottom: 2px solid #ccc;margin-bottom: 20px;*/}
.tab-button {padding: 10px 20px;border: none;background: var(--background-body-grey);cursor: pointer;font-size: 16px;}
.tab-button.active {background-color: var(--color-custom-bleu-dark);color: white;}
.tab-button.logout:hover {background-color: #dc3545;color: white;}
#customerClientLoginIn .tab-content {position:unset;display: none;padding: 20px;}
/*#details,#orders{background:#fff;}*/
#details label {display: block;text-align: left;margin-top: 10px;cursor: pointer;}
#details input:not([type="radio"]):not([type="checkbox"]){width: 100%;border: 1px solid rgba(0, 0, 0, 0.3);padding: 5px;border-radius: 10px;background: #fff;}
#details .row-2,#details .row-1 {padding: 5px;}
#details select {width: 100%;border: 1px solid rgba(0, 0, 0, 0.3);padding: 5px;border-radius: 10px;background: #fff;}
#details h1,#orders h1 {font-size: 25px;color: var(--color-custom-bleu-dark);text-align: left;font-weight: 500;text-align: center;margin-bottom: 35px;width: 100%;}
#details h1::after,#orders h1::after{content:"";display:block;width:150px;height:4px;background-color: var(--black-transparent-4);margin-left:auto;margin-right:auto;margin-top:20px;}
#details h2 {font-size: 18px !important;text-align: left !important;color: var(--color-custom-bleu-dark);font-weight: 400 !important;position: relative;}
.customer-details,.customer-address,.customer-tax,#customer-order-in{background-color: var(--background-body-grey) !important;padding: 20px;margin: 10px;margin-bottom: 30px;border-radius: 20px;}
.updateDataCustomer{background: var(--color-custom-bleu-dark);width: 100%;max-width:320px;display: block;margin-left: auto;margin-right: auto;border-radius: 25px;color: #fff;border: 0px;padding: 10px;}
.updateDataCustomer.top-button{margin-bottom: 40px;}
.updateDataCustomer.bottom-button{margin-bottom: 15px;}
.deleteAddress{background: var(--color-custom-bleu-dark);width: 100%;max-width:320px;display: block;margin-left: auto;margin-right: auto;margin-top:20px;margin-bottom:20px;border-radius: 25px;color: #fff;border: 0px;padding: 10px;}
#details fieldset p{padding: 5px;font-size: 15px;}


@media screen and (max-width: 900px) {
#detailsCustomerForm .row-2{flex-basis: calc(100%);max-width: 100%;}
.filters-container button {width: 100%;margin-top: 10px;}
#pagination-order button {display: block;margin-left:auto;margin-right:auto;}
#prevBtn{margin-bottom:10px;}
#nextBtn{margin-top:10px;}
.orders-table thead {display: none;}
.orders-table, .orders-table tbody, .orders-table tr, .orders-table td {display: block;width: 100%;}
.orders-table tr {margin-bottom: 20px;border: 1px solid var(--black-transparent-2);background: #fff;overflow: hidden;}
.orders-table td {text-align: right;padding: 12px 15px;padding-left: 45%;position: relative;border-bottom: 1px solid var(--black-transparent-2);;min-height: 40px;display: flex;align-items: center;justify-content: flex-end;}
.orders-table td::before {content: attr(data-label);position: absolute;left: 15px;top: 50%;transform: translateY(-50%);width: 40%;text-align: left;font-weight: 700;color: #555;font-size: 13px;}  
}