body {
    overflow-y: hidden;
}

#content-wrapper {
    /*width: calc(100% + 15px);*/
}

label {
    text-align: left;
}

.product-additional-info.js-product-additional-info, #shop-info-container {
    display: none;
}

/*#paper {*/
/*    position: fixed;*/
/*    top: 0;*/
/*    left: 300px;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    object-fit: cover;*/
/*    opacity: 0.3;*/
/*    z-index: -1;*/
/*}*/

#product-page {
    display: flex;
    overflow: hidden;
    height: calc(100vh - 50px);
    margin-top: -20px;
}

#product-images {
    display: flex;
}

#product-viewer {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    position: relative;
    z-index: 2;
    width: 600px;
    height: 100%;
    padding-top: 50px;
}

#product-form .radio-label {
    background-color: transparent;
    border: none;
}

#product-form .input-color:checked + span, #product-form .input-color:hover + span,
#product-form .input-radio:checked + span, #product-form .input-radio:hover + span {
    border: none;
}

#product-form .input-radio + span {
    padding-bottom: 8px;
}

#product-form .input-radio:checked + span  {
    border-bottom: 3px solid var(--color-blue);
    color: var(--color-blue);
}

#product-form .input-color + span:after {
    content: '';
    border-bottom: 3px solid transparent;
    display: block;
    width: 22px;
    position: absolute;
    bottom: 6px;
}

#product-form .input-color:checked + span:after {
    border-bottom: 3px solid var(--color-blue);
}

label .color:hover {
    border: none;
}

#product-form .input-radio:hover:not(:checked) + span, #product-form .input-color:hover:not(:checked) + span:after {
    border-bottom: 3px solid var(--color-dark-grey);
}

.product-price-and-controls {
    display: flex;
}

.wishlist-button-add.wishlist-button-product {
    display: none;
}

.product-prices.js-product-prices {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
    margin-top: 0;
    justify-content: space-between;
    padding-top: 2px;
}

.product-add-to-cart.js-product-add-to-cart {
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.product-prices .tax-shipping-delivery-label {
    margin-bottom: 10px;
}

.control-label {
    margin-bottom: 10px;
}

.current-price {
    color: var(--color-blue);
    font-size: 20px;
}

.product-availability, .product-quantity {
    align-items: center;
}

.product-customization .card {
    background-color: transparent;
    padding: 0;
}

label .color {
    width: 22px;
    height: 22px;
    border: none;
    box-shadow: 0 0 0 1px rgb(220, 225, 230) inset;
}

#featured-image {
    display: flex;
    cursor: pointer;
}

#featured-image img {
    max-height: calc(100vh - 370px);
}

#product-images {
    display: flex;
    margin: auto auto 30px auto;
    gap: 8px;
}

.product-image {
    width: 80px;
    height: 80px;
    border: 1px solid rgb(220, 225, 230);
    cursor: pointer;
    transition: 0.15s ease;
}

.product-image.selected {
    border-color: rgb(120, 130, 140);
}

.product-image:not(.selected):hover {
    border-color: rgb(120, 130, 140);
}

#product-name {
    color: rgb(80, 90, 100);
    font-weight: 300;
}

#product-price {
    font-weight: 600;
    font-size: 16px;
    color: rgb(50, 60, 70);
    margin-bottom: 20px;
}

#return-btn {
    background-color: white;
    border: 1px solid rgb(220, 225, 230);
    border-radius: 10px;
    height: 36px;
    padding: 0 15px;
    width: -moz-fit-content;
    width: fit-content;
    font-family: Poppins, 'sans-serif';
    font-weight: 400;
    color: rgb(50, 60, 70);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: 0.15s ease;
    position: relative;
    z-index: 2;
    align-self: self-start;
    margin: 30px 0 15px 30px;
}

#return-btn:hover {
    background-color: rgb(245, 247, 249);
}

#return-btn svg {
    width: 14px;
    height: 14px;
    fill: rgb(80, 90, 100);
}

#product-form {
    position: relative;
    z-index: 2;
    padding: 50px;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
}

#product-form label {
    color: rgb(50, 60, 70);
    display: block;
    font-size: 16px;
}

#product-form label.label-with-margin-top {
    margin-top: 30px;
}

#size-selection {
    display: flex;
    gap: 15px 6px;
    margin-top: 5px;
    flex-wrap: wrap;
}

#size-selection div {
    padding: 0 10px;
    font-size: 16px;
    font-weight: 600;
    color: rgb(50, 60, 70);
    position: relative;
    transition: 0.15s ease;
    cursor: pointer;
}

#size-selection div.selected {
    color: #3284c8;
}

#size-selection div::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: -5px;
    height: 3px;
    background-color: rgb(80, 90, 100);
    border-radius: 3px;
    width: 100%;
    opacity: 0;
    transition: 0.15s ease;
}

#size-selection div:not(.selected):hover::after {
    opacity: 1;
}

#size-selection div.selected::after {
    opacity: 1;
    background-color: #3284c8;
}

#color-selection {
    display: flex;
    gap: 25px 10px;
    margin-top: 8px;
    flex-wrap: wrap;
}

#color-selection div {
    width: 22px;
    height: 22px;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
}

#color-selection div.with-border {
    box-shadow: 0 0 0 1px rgb(220, 225, 230) inset;
}

#color-selection div::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    bottom: -11px;
    height: 3px;
    background-color: rgb(80, 90, 100);
    border-radius: 3px;
    width: 100%;
    opacity: 0;
    transition: 0.15s ease;
}

#color-selection div:not(.selected):hover::after {
    opacity: 1;
}

#color-selection div.selected::after {
    opacity: 1;
    background-color: #3284c8;
}

#files-part {
    margin-top: 45px;
    display: flex;
    gap: 100px;
}

.extensions {
    font-size: 12px;
    font-weight: 300;
    color: rgb(130, 140, 150);
    margin-top: 2px;
    line-height: 16px;
}

.btn-file-input, #add-to-cart-btn {
    background-color: #3284c8;
    display: flex;
    align-items: center;
    color: white;
    font-size: 12px;
    gap: 10px;
    margin-top: 12px;
    text-align: left;
}

.btn-file-input.with-file {
    background-color: var(--color-green);
}

#add-to-cart-btn {
    font-size: 14px;
}

.btn-file-input:hover, #add-to-cart-btn:hover {
    background-color: #3c94dd;
}

.btn-file-input.file-selected {
    background-color: #13a438;
}

.btn-file-input.file-selected:hover {
    background-color: #16b63e;
}

.btn-file-input svg, #add-to-cart-btn svg {
    width: 20px;
    height: 20px;
    fill: white;
    flex-shrink: 0;
}

#comment-input {
    width: 100%;
    height: 100px;
    resize: none;
    outline: none;
    border: 1px solid rgb(210, 215, 220);
    border-radius: 10px;
    background-color: transparent;
    position: relative;
    z-index: 2;
    margin-top: 6px;
    padding: 15px;
    box-sizing: border-box;
    color: rgb(50, 60, 70);
    font-family: Poppins, 'sans-serif';
    font-weight: 400;
    font-size: 14px;
    flex-shrink: 0;
}

#bottom-part {
    margin-top: auto;
    padding-top: 40px;
    display: flex;
    align-items: flex-end;
}

#bottom-part > div {
    display: flex;
    flex-direction: column;
    gap: 6px;
    height: 100%;
}

#bottom-part > div:nth-child(1) {
    margin-right: 60px;
}

#bottom-part > div:nth-child(2) {
    margin-right: 30px;
}

#quantity-input {
    border-radius: 10px;
    background-color: transparent;
    height: 37px;
    box-sizing: border-box;
    border: 1px solid rgb(210, 215, 220);
    padding-left: 15px;
    width: 70px;
    box-sizing: border-box;
    outline: none;
}

#total {
    color: #3c94dd;
    font-weight: 600;
    font-size: 22px;
}

#files {
    margin-top: 25px;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.file {
    position: relative;
    width: fit-content;
}

.delete-file-btn {
    position: absolute;
    top: -9px;
    right: -9px;
    background-color: rgb(50, 60, 70);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    padding: 0;
    border-radius: 50%;
    width: 18px;
    height: 18px;
    cursor: pointer;
    transition: 0.15s ease;
}

.delete-file-btn:hover {
    background-color: rgb(80, 90, 100);
}

.delete-file-btn svg {
    width: 12px;
    height: 12px;
    fill: white;
}

.file-image {
    background-color: white;
    padding: 8px;
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(109, 121, 133, 0.2);
}

.file-image img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.file-name {
    font-size: 11px;
    font-weight: 300;
    color: rgb(130, 140, 150);
    text-align: center;
    margin-top: 4px;
}

#product-viewer .tax-shipping-delivery-label {
    display: none;
}

#product-viewer .current-price {
    font-weight: 600;
    font-size: 16px;
    color: rgb(50, 60, 70);
    margin-bottom: 20px;
}

#quantity_wanted, .input-group-btn-vertical .btn {
    border: none;
}

.product-quantity #quantity_wanted {
    background-color: transparent;
    width: 50%;
    height: 100%
}

.qty {
    border: 1px solid;
    border-radius: 10px;
}

.qty .input-group.bootstrap-touchspin {
    display: flex;
    justify-content: space-between;
}

.bootstrap-touchspin .btn-touchspin {
    background-color: transparent;
    height: 18px;
}

.bootstrap-touchspin .btn-touchspin:hover {
    background-color: transparent;
}

.qty:hover .bootstrap-touchspin .btn-touchspin {
    color: var(--color-dark-grey);
}

.clearfix {
    width: 100%;
    height: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.product-customization-item.image {
    width: 30%;
}

.product-customization-item.text {
    width: 100%;
}

.product-customization .custom-file {
    width: fit-content;
    background: transparent;
    margin-top: 2rem;
}

.product-customization .file-input {
    margin-top: 0;
    top: 0;
}

.product-customization .file-input::file-selector-button:hover {
    cursor: pointer;
}

.product-customization .file-input:hover + button {
    background-color: #3c94dd;
}

.product-customization .custom-file button {
    position: initial;
}

.product-customization .product-message {
    height: 11vh;
}

.product-customization .product-message, .product-variants>.product-variants-item select {
    background-color: transparent;
    border-radius: 10px;
    border: 1px solid rgb(210, 215, 220);
}

.product-customization .product-message:focus, .form-control:focus {
    outline: none;
    background: transparent;
}

.product-quantity .add {
    margin-left: 10px;
}

#empty-product-comment {
    display: none !important;
}

.product-description {
    padding: 20px;
    margin-bottom: 20px;
}

.product-description label {
    font-weight: 500;
}

.product-description ul {
    background-color: transparent!important;
}

/* region modale ajout au panier */
#blockcart-modal {
    .modal-header {
        border-radius: 10px 10px 0 0;
    }

    .modal-body {
        border-radius: 0 0 10px 10px;
    }
}
/* endregion */

@media screen and (max-width: 1750px) {

    #product-page, #product-viewer {
        height: calc(100vh - 90px);
    }

    #featured-image img {
        max-height: calc(100vh - 380px);
    }

}

@media screen and (max-width: 1550px) {

    #files-part {
        flex-direction: column;
        gap: 30px;
    }

}

@media screen and (max-width: 1300px) {

    #files-part {
        flex-direction: column;
        gap: 30px;
    }

    #product-viewer {
        width: 550px;
    }

}

@media screen and (max-width: 1200px) {

    #product-viewer {
        width: 500px;
    }

}

@media screen and (max-width: 1150px) {

    #product-viewer {
        width: 470px;
    }

}

@media screen and (max-width: 1100px) {
    body {
         overflow-y: auto;
    }

    body::-webkit-scrollbar {
        display: none;
    }

    ul {
        display: flex;
        justify-content: center;
        margin-left: 10px;
    }

    #content-wrapper {
        width: 100%;
    }

    .clearfix {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        flex-direction: column;
        align-items: center;
    }

    .product-actions .control-label {
        display: flex;
        justify-content: center;
    }

    #paper {
        left: 0;
    }

    #blue-background-mobile {
        display: none;
    }

    #product-page {
        display: flex;
        flex-direction: column;
        overflow-x: hidden;
        overflow-y: auto;
        height: auto;
    }

    #product-page, #product-viewer {
        height: auto;
    }

    #product-viewer {
        width: auto;
    }

    #product-form label {
        text-align: center;
    }

    #featured-image img {
        max-height: 380px;
        max-width: calc(100vw - 40px);
        margin-bottom: 20px;
    }

    .product-image {
        width: 70px;
        height: 70px;
    }

    #size-selection, #color-selection {
        justify-content: center;
    }

    .extensions {
        text-align: center;
    }

    .file-input, #add-to-cart-btn {
        margin-left: auto;
        margin-right: auto;
    }

    #files {
        justify-content: center;
    }

    #bottom-part {
        flex-direction: column;
        align-items: center;
    }

    #bottom-part > div:nth-child(1) {
        margin-right: 0;
        margin-bottom: 30px;
        gap: 2px;
    }

    #bottom-part > div:nth-child(2) {
        margin-right: 0;
        margin-bottom: 2px;
    }

    #return-btn {
        border: none;
        position: absolute;
        top: 30px;
        left: 30px;
        width: 44px;
        height: 44px;
        padding: 0;
        margin: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    #return-btn span {
        display: none;
    }

    #return-btn svg {
        width: 22px;
        height: 22px;
    }

    #mobile-logo {
        display: block;
    }

    #_mobile_top_menu {
        margin: 0 -10px;
    }

    #header .header-top .menu {
        padding-left: 0;
    }

    .product-price-and-controls {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .product-prices.js-product-prices {
        align-items: center;
    }

    .header-top-right {
        display: none;
    }

    .product-customization-item.image {
        width: 50%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .product-add-to-cart.js-product-add-to-cart
    {
        margin-left: 0;
    }

    .product-quantity .qty {
        margin-right: 0;
        margin-bottom: 30px;
    }

    #menu-icon {
        right: 40px;
    }
}

@media screen and (max-width: 900px) {

    /*#mobile-logo {*/
    /*    width: 350px;*/
    /*}*/

}

@media screen and (max-width: 700px) {

    /*#mobile-logo {*/
    /*    width: 320px;*/
    /*}*/

}

@media screen and (max-width: 600px) {

    #comment-input {
        height: 120px;
    }

    /*#mobile-logo {*/
    /*    width: 300px;*/
    /*}*/

    #return-btn {
        top: 20px;
        left: 20px;
    }

    #product-form {
        padding: 30px 30px 50px 30px;
    }

    #menu-icon {
        right: 20px;
    }
}

@media screen and (max-width: 550px) {
    /*#mobile-logo {*/
    /*    width: 280px;*/
    /*}*/

}

@media screen and (max-width: 500px) {

    /*#mobile-logo {*/
    /*    width: 260px;*/
    /*}*/

}

@media screen and (max-width: 450px) {

    /*#mobile-logo {*/
    /*    margin-top: 20px;*/
    /*    width: 250px;*/
    /*}*/

    #return-btn {
        left: 10px;
    }

    #product-form {
        padding: 20px 20px 50px 20px;
    }

}

@media screen and (max-width: 420px) {
    /*#mobile-logo {*/
    /*    width: 230px;*/
    /*}*/
}

@media screen and (max-width: 400px) {
    /*#mobile-logo {*/
    /*    width: 220px;*/
    /*}*/
}

@media screen and (max-width: 380px) {
    /*#mobile-logo {*/
    /*    width: 210px;*/
    /*}*/
}