// Site
//
// Site wrapper

body.jupiterx-has-border {
    padding: 0;
    margin: 0;
}

.jupiterx-site-body-border {
    border-width: @body-border-width;
    border-style: solid;
    border-color: transparent;

    @media @md-down {
        border-width: @body-border-width-tablet;
    }

    @media @sm-down {
        border-width: @body-border-width-mobile;
    }

    &:after {
        content: '';
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-width: @body-border-width;
        border-style: solid;
        border-color: @body-border-color;
        z-index: 99999;
        pointer-events: none;
        touch-action: none;

        @media @md-down {
            border-width: @body-border-width-tablet;
        }

        @media @sm-down {
            border-width: @body-border-width-mobile;
        }

        .admin-bar & {
            top: 32px;

            @media @md-down {
                top: 46px;
            }

            @media @sm-down {
                top: 0;
            }
        }
    }

    // Fixed
    .jupiterx-header-fixed & .jupiterx-header {
        top: @body-border-width;
        right: @body-border-width;
        left: @body-border-width;

        @media @md-down {
            top: @body-border-width-tablet;
            right: @body-border-width-tablet;
            left: @body-border-width-tablet;
        }

        @media @sm-down {
            top: @body-border-width-mobile;
            right: @body-border-width-mobile;
            left: @body-border-width-mobile;
        }

        .admin-bar& {
            top: ~"calc(@{body-border-width} + 32px)";

            @media @md-down {
                top: ~"calc(@{body-border-width-tablet} + 46px)";
            }

            @media @sm-down {
                top: ~"calc(@{body-border-width-mobile} + 46px)";
            }
        }

        .jupiterx-header-bottom& {
            top: auto;
            right: @body-border-width;
            bottom: @body-border-width;
            left: @body-border-width;

            @media @md-up {
                .admin-bar& {
                    top: auto;
                }
            }

            @media @md-down {
                top: auto;
                right: @body-border-width-tablet;
                bottom: @body-border-width-tablet;
                left: @body-border-width-tablet;
            }

            @media @md-down and @sm-up {
                .jupiterx-header-tablet-behavior-off& {
                    top: auto;
                    bottom: auto;
                }

                .admin-bar& {
                    top: auto;
                }
            }

            @media @sm-down {
                top: auto;
                right: @body-border-width-mobile;
                bottom: @body-border-width-mobile;
                left: @body-border-width-mobile;
            }

            @media @sm-down {
                .jupiterx-header-mobile-behavior-off& {
                    top: auto;
                    bottom: auto;
                }

                .admin-bar& {
                    top: auto;
                }
            }
        }
    }

    // Sticky
    .jupiterx-header-stick & .jupiterx-header {
        top: @body-border-width;
        right: @body-border-width;
        left: @body-border-width;

        @media @md-down {
            top: @body-border-width-tablet;
            right: @body-border-width-tablet;
            left: @body-border-width-tablet;
        }

        @media @sm-down {
            top: @body-border-width-mobile;
            right: @body-border-width-mobile;
            left: @body-border-width-mobile;
        }

        .admin-bar& {
            top: ~"calc(@{body-border-width} + 32px)";

            @media @md-down {
                top: ~"calc(@{body-border-width-tablet} + 46px)";
            }

            @media @sm-down {
                top: ~"calc(@{body-border-width-mobile} + 46px)";
            }
        }
    }

    // Overlapped.
    @media @md-up {
        .jupiterx-header-overlapped & .jupiterx-header {
            top: @body-border-width;
            right: @body-border-width;
            left: @body-border-width;
            width: auto;

            .admin-bar& {
                top: ~"calc(@{body-border-width} + 32px)";
            }
        }
    }

    @media @md-down and @sm-up {
        .jupiterx-header-overlapped-tablet & .jupiterx-header {
            width: auto;
            .jupiter-body-border-default-tablet('body-border-width-tablet');
            .jupiter-body-border-tablet('body-border-width-tablet');
        }
    }

    @media @sm-down {
        .jupiterx-header-overlapped-mobile & .jupiterx-header {
            width: auto;
            .jupiter-body-border-default-mobile('body-border-width-mobile');
            .jupiter-body-border-mobile('body-border-width-mobile');
        }
    }

    .jupiterx-footer-fixed {
        right: @body-border-width;
        bottom: @body-border-width;
        left: @body-border-width;

        @media @md-down {
            right: @body-border-width-tablet;
            bottom: @body-border-width-tablet;
            left: @body-border-width-tablet;
        }

        @media @sm-down {
            right: @body-border-width-mobile;
            bottom: @body-border-width-mobile;
            left: @body-border-width-mobile;
        }
    }

    .jupiterx-corner-buttons,
    .jupiterx-corner-buttons.jupiterx-scrolled {
        right: @body-border-width;
        bottom: @body-border-width;

        @media @md-down {
            right: @body-border-width-tablet;
            bottom: @body-border-width-tablet;
        }

        @media @sm-down {
            right: @body-border-width-mobile;
            bottom: @body-border-width-mobile;
        }
    }

    // Contain fixed elements
    & ~ .elementor-lightbox,
    .elementor-lightbox,
    .raven-search-form .raven-search-form-lightbox,
    .elementor-search-form--skin-full_screen .elementor-search-form__container,
    .raven-nav-menu-full-screen {
        top: @body-border-width;
        right: @body-border-width;
        left: @body-border-width;
        bottom: @body-border-width;
        width: auto;
        height: auto;

        @media @md-down {
            top: @body-border-width-tablet;
            right: @body-border-width-tablet;
            left: @body-border-width-tablet;
            bottom: @body-border-width-tablet;
        }

        @media @sm-down {
            top: @body-border-width-mobile;
            right: @body-border-width-mobile;
            left: @body-border-width-mobile;
            bottom: @body-border-width-mobile;
        }

        .admin-bar & {
            top: ~"calc(@{body-border-width} + 32px)";

            @media @md-down {
                top: ~"calc(@{body-border-width-tablet} + 46px)";
            }

            @media @sm-down {
                top: ~"calc(@{body-border-width-mobile} + 46px)";
            }
        }
    }

    .raven-nav-menu-side {
        top: @body-border-width;
        bottom: @body-border-width;
        height: auto;

        @media @md-down {
            top: @body-border-width-tablet;
            bottom: @body-border-width-tablet;
        }

        @media @sm-down {
            top: @body-border-width-mobile;
            bottom: @body-border-width-mobile;
        }

        .admin-bar & {
            top: ~"calc(@{body-border-width} + 32px)";

            @media @md-down {
                top: ~"calc(@{body-border-width-tablet} + 46px)";
            }

            @media @sm-down {
                top: ~"calc(@{body-border-width-mobile} + 46px)";
            }
        }
    }

    .jupiterx-cart-quick-view-overlay & .jupiterx-cart-quick-view {
        top: @body-border-width;
        bottom: @body-border-width;
        height: auto;

        @media @md-down {
            top: @body-border-width-tablet;
            bottom: @body-border-width-tablet;
        }

        @media @sm-down {
            top: @body-border-width-mobile;
            bottom: @body-border-width-mobile;
        }

        .admin-bar& {
            top: ~"calc(@{body-border-width} + 32px)";

            @media @md-down {
                top: ~"calc(@{body-border-width-tablet} + 46px)";
            }

            @media @sm-down {
                top: ~"calc(@{body-border-width-mobile} + 46px)";
            }
        }
    }

    .jupiterx-cart-quick-view-overlay & .jupiterx-cart-quick-view[data-position="left"],
    .raven-nav-menu-side.raven-side-menu-left {
        left: @body-border-width;

        @media @md-down {
            left: @body-border-width-tablet;
        }

        @media @sm-down {
            left: @body-border-width-mobile;
        }
    }

    .jupiterx-cart-quick-view-overlay & .jupiterx-cart-quick-view[data-position="right"],
    .raven-nav-menu-side.raven-side-menu-right {
        right: @body-border-width;

        @media @md-down {
            right: @body-border-width-tablet;
        }

        @media @sm-down {
            right: @body-border-width-mobile;
        }
    }
}

.jupiterx-site-main-border {
    .jupiterx-main {
        border-width: 0 @body-border-width 0 @body-border-width;
        border-style: solid;
        border-color: @body-border-color;

        @media @md-down {
            border-width: 0 @body-border-width-tablet 0 @body-border-width-tablet;
        }

        @media @sm-down {
            border-width: 0 @body-border-width-mobile 0 @body-border-width-mobile;
        }
    }
}

.jupiterx-site-container {
    margin-left: auto;
    margin-right: auto;
    max-width: @site-boxed-container-max-width;
    box-shadow: @site-container-box-shadow;
    .jupiterx-border('site-container-border');
}

.jupiterx-site {
    @media @md-down and @sm-up {
        .jupiterx-header-tablet-behavior-off & {
            padding-top: 0 !important;
            padding-bottom: 0 !important;
        }
    }

    @media @sm-down {
        .jupiterx-header-mobile-behavior-off & {
            padding-top: 0 !important;
            padding-bottom: 0 !important;
        }
    }
}