{"version":3,"file":"dynamic-slider/style-index.css","mappings":";;;AAAA;;;;;EAAA;AAMC;EACG;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACH;EACG;EACA;EACA;EACA;EACA;EACA;AAAJ;AAEI;EACI;EACA;AAAR;AAGI;EACI;EACA;EACA;EACA;EACA;EACA;AADR;AAII;EACI;EACA;EACA;EACA;AAFR;AAKI;EACI;EACA;EACA;KAAA;AAHR;AAMI;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAJR;AAMQ;EACI;AAJZ;AAOQ;;;EAGI;EACA;EACA;AALZ;AAQQ;EACI;EACA;EACA;EACA;EACA;EACA;AANZ;AASQ;EACI;AAPZ;AAUQ;EACI;EACA;EACA;EACA;EACA;AARZ;AAWQ;EACI;EACA;EACA;EACA;AATZ;AAYI;EACI;AAVR;AAYQ;EACI;EACA;EACA;EACA;AAVZ;AAaQ;EACI;EACA;EACA;EACA;EACA;AAXZ;AAcQ;EAGI;EACA;EACA;EACA;AAdZ;AAgBQ;EACI;AAdZ;AAgBQ;EACI;AAdZ;AAgBQ;EAEI;EACA;AAfZ;AAiBQ;EACI;AAfZ;AAiBQ;EAGI;EACA;EACA;EACA;EACA;AAjBZ;AAmBQ;EACI;EACA;EACA;AAjBZ;AAsBQ;;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;AApBZ;AAuBQ;EACI;EACA;EACA;EAAA;EACA;AArBZ;AAwBQ;EACI;EACA;EACA;EACA;EAAA;EACA;AAtBZ;AA0BY;EACI;AAxBhB;AA0BY;EACI;AAxBhB;AA0BY;EACI;AAxBhB;AA4BgB;;EAEI;AA1BpB;AAiCY;;EAEI;EACA;AA/BhB;AAiCY;EACI;AA/BhB;AAoCY;;EAEI;EACA;EACA;AAlChB;AAoCY;EACI;AAlChB;AAuCY;;EAEI;EACA;EACA;AArChB;AAuCY;EACI;AArChB;AAyCgB;;EAEI;AAvCpB;AA6CY;;EAEI;EACA;EACA;EACA;AA3ChB;AA6CY;EACI;AA3ChB;AA+CgB;;EAEI;AA7CpB;AAmDY;;EAEI;EACA;AAjDhB;AAmDY;EACI;AAjDhB;AAqDgB;EACI;AAnDpB;AAqDgB;EACI;AAnDpB;AAyDY;;EAEI;EACA;EACA;AAvDhB;AAyDY;EACI;AAvDhB;AA2DgB;EACI;AAzDpB;AA2DgB;EACI;AAzDpB,C","sources":["webpack://wpopus/./src/dynamic-slider/style.scss"],"sourcesContent":["/**\n * The following styles get applied both on the front of your site\n * and in the editor.\n *\n * Replace them with your own styles or remove the file completely.\n */\n .wp-block-wpopus-dynamic-slider {\n    --wpopus-image-dynamic-slider-image-height: 500px;\n    --wpopus-image-dynamic-slider-overlay-color: #00000066;\n    --wpopus-image-dynamic-slider-category-color: #ffffff;\n    --wpopus-image-dynamic-slider-category-font: \"inherit\";\n    --wpopus-image-dynamic-slider-category-font-size: 18px;\n    --wpopus-image-dynamic-slider-category-font-weight: 500;\n    --wpopus-image-dynamic-slider-title-color: #ffffff;\n    --wpopus-image-dynamic-slider-title-font: \"inherit\";\n    --wpopus-image-dynamic-slider-title-font-size: \"initial\";\n    --wpopus-image-dynamic-slider-title-font-weight: 500;\n    --wpopus-image-dynamic-slider-title-margin: 20px 0;\n    --wpopus-image-dynamic-slider-excerpt-color: #ffffff;\n    --wpopus-image-dynamic-slider-excerpt-font: \"inherit\";\n    --wpopus-image-dynamic-slider-excerpt-font-size: 18px;\n    --wpopus-image-dynamic-slider-excerpt-font-weight: 500;\n\n    --swiper-pagination-bottom: 20px;\n\t--swiper-navigation-sides-offset: 20px;\n    --wpopus-carousel-navigation-bg-color: #FFFFFF00;\n    --wpopus-carousel-navigation-height: 50px;\n    --wpopus-carousel-navigation-width: 50px;\n    --wpopus-carousel-navigation-padding: 1px 1px 1px 1px;\n    --wpopus-carousel-navigation-border: 0px solid #00000000;\n    --wpopus-carousel-navigation-border-radius: 0px;\n\n    swiper-container[centered-slides=\"true\"] swiper-slide.swiper-slide-active {\n        opacity: 1 !important;\n        transform: scaleY(1) !important;\n    }\n    \n    swiper-slide {\n        position: relative;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        height: auto;\n        min-height: 300px;\n    }\n    \n    swiper-slide .overlay {\n        position: absolute;\n        height: 100%;\n        width: 100%;\n        background-color: var(--wpopus-image-dynamic-slider-overlay-color);\n    }\n    \n    swiper-slide img {\n        width: 100%;\n        height: var(--wpopus-image-dynamic-slider-image-height);\n        object-fit: cover;\n    }\n    \n    swiper-slide .content-wrapper {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        padding: 25px;\n        max-width: 700px;\n        display: flex;\n        flex-direction: column;\n        justify-content: center;\n        align-items: center;\n        text-align: center;\n        box-sizing: border-box;\n        color: var(--wpopus-image-dynamic-slider-category-color);\n    \n        .cat-links {\n            color: var(--wpopus-image-dynamic-slider-category-color);\n        }\n    \n        .cat-links a,\n        h3 a,\n        p {\n            margin: 0;\n            letter-spacing: 1px;\n            color: #ffffff;\n        }\n    \n        .cat-links a {\n            text-decoration: none;\n            text-transform: uppercase;\n            color: var(--wpopus-image-dynamic-slider-category-color);\n            font-family: var(--wpopus-image-dynamic-slider-category-font);\n            font-size: var(--wpopus-image-dynamic-slider-category-font-size);\n            font-weight: var(--wpopus-image-dynamic-slider-category-font-weight);\n        }\n    \n        h3 {\n            margin: var(--wpopus-image-dynamic-slider-title-margin);\n        }\n    \n        h3 a {\n            text-decoration: none;\n            color: var(--wpopus-image-dynamic-slider-title-color);\n            font-family: var(--wpopus-image-dynamic-slider-title-font);\n            font-size: var(--wpopus-image-dynamic-slider-title-font-size);\n            font-weight: var(--wpopus-image-dynamic-slider-title-font-weight);\n        }\n    \n        p {\n            color: var(--wpopus-image-dynamic-slider-excerpt-color);\n            font-family: var(--wpopus-image-dynamic-slider-excerpt-font);\n            font-size: var(--wpopus-image-dynamic-slider-excerpt-font-size);\n            font-weight: var(--wpopus-image-dynamic-slider-excerpt-font-weight);\n        }\n    }\n    .wpopus-dynamic-slider-wrapper {\n        z-index: -1;\n    \n        &.content-left swiper-slide .content-wrapper {\n            left: 10%;\n            transform: translate(0, -50%);\n            align-items: flex-start;\n            text-align: left;\n        }\n    \n        &.content-right swiper-slide .content-wrapper {\n            left: auto;\n            right: 10%;\n            transform: translate(0, -50%);\n            align-items: flex-end;\n            text-align: right;\n        }\n    \n        &.top-image-bottom-content swiper-container swiper-slide,\n        &.left-content-right-image swiper-container swiper-slide,\n        &.left-image-right-content swiper-container swiper-slide {\n            display: flex;\n            flex-direction: row;\n            justify-content: flex-start;\n            align-items: center;\n        }\n        &.left-content-right-image swiper-container swiper-slide {\n            flex-direction: row-reverse;\n        }\n        &.top-image-bottom-content swiper-container swiper-slide {\n            flex-direction: column;\n        }\n        &.left-content-right-image swiper-container swiper-slide img,\n        &.left-image-right-content swiper-container swiper-slide img {\n            width: 50%;\n            z-index: 1;\n        }\n        &.top-image-bottom-content swiper-container swiper-slide img {\n            z-index: 1;\n        }\n        &.top-image-bottom-content swiper-container swiper-slide .content-wrapper,\n        &.left-content-right-image swiper-container swiper-slide .content-wrapper,\n        &.left-image-right-content swiper-container swiper-slide .content-wrapper {\n            width: 50%;\n            height: auto;\n            position: unset;\n            transform: unset;\n            z-index: 1;\n        }\n        &.top-image-bottom-content swiper-container swiper-slide .content-wrapper {\n            width: 90%;\n            max-width: 700px;\n            padding: 50px 25px;\n        }   \n    }\n    \n    .wpopus-dynamic-slider-wrapper {\n        ::part(button-prev),\n        ::part(button-next) {\n            box-sizing: border-box;\n            background-color: var(--wpopus-carousel-navigation-bg-color);\n            height: var(--wpopus-carousel-navigation-height);\n            width: var(--wpopus-carousel-navigation-width);\n            padding: var(--wpopus-carousel-navigation-padding);\n            border: var(--wpopus-carousel-navigation-border);\n            border-radius: var(--wpopus-carousel-navigation-border-radius);\n        }\n    \n        &.pagination-bottom-left ::part(pagination) {\n            left: 20px;\n            transform: none;\n            width: max-content;\n            padding: 0 10px;\n        }\n    \n        &.pagination-bottom-right ::part(pagination) {\n            right: 20px;\n            left: auto;\n            transform: none;\n            width: max-content;\n            padding: 0 10px;\n        }\n    \n        &.pagination-outside {\n            swiper-slide {\n                padding-bottom: 50px;\n            }\n            swiper-slide .overlay {\n                height: calc(100% - 50px);\n            }\n            swiper-slide .content-wrapper {\n                top: calc(50% - 25px);\n            }\n    \n            &.navigation-default {\n                ::part(button-prev),\n                ::part(button-next) {\n                    top: calc(50% - 25px);\n                }\n            }\n            \n        } \n    \n        &.navigation-top-left {\n            ::part(button-prev),\n            ::part(button-next) {\n                top: 50px;\n                left: 30px;\n            }\n            ::part(button-next) {\n                left: calc(40px + var(--wpopus-carousel-navigation-width));\n            }\n        }\n    \n        &.navigation-top-right {\n            ::part(button-prev),\n            ::part(button-next) {\n                top: 50px;\n                left: auto;\n                right: 30px;\n            }\n            ::part(button-prev) {\n                right: calc(40px + var(--wpopus-carousel-navigation-width));\n            }\n        }\n    \n        &.navigation-bottom-left {\n            ::part(button-prev),\n            ::part(button-next) {\n                bottom: 30px;\n                top: auto;\n                left: 30px;\n            }\n            ::part(button-next) {\n                left: calc(40px + var(--wpopus-carousel-navigation-width));\n            }\n            \n            &.pagination-outside {\n                ::part(button-prev),\n                ::part(button-next) {\n                    bottom: 80px;\n                }\n            }\n        }\n    \n        &.navigation-bottom-right {\n            ::part(button-prev),\n            ::part(button-next) {\n                bottom: 30px;\n                top: auto;\n                left: auto;\n                right: 30px;\n            }\n            ::part(button-prev) {\n                right: calc(40px + var(--wpopus-carousel-navigation-width));\n            }\n    \n            &.pagination-outside {\n                ::part(button-prev),\n                ::part(button-next) {\n                    bottom: 80px;\n                }\n            }\n        }\n    \n        &.navigation-center-left {\n            ::part(button-prev),\n            ::part(button-next) {\n                top: calc(50% - (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                left: 30px;\n            }\n            ::part(button-next) {\n                top: calc(50% + (var(--wpopus-carousel-navigation-width)/2 + 5px));\n            }\n    \n            &.pagination-outside {\n                ::part(button-prev) {\n                    top: calc((50% - 25px) - (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                }\n                ::part(button-next) {\n                    top: calc((50% - 25px) + (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                }\n            }\n        }\n    \n        &.navigation-center-right {\n            ::part(button-prev),\n            ::part(button-next) {\n                top: calc(50% - (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                left: auto;\n                right: 30px;\n            }\n            ::part(button-next) {\n                top: calc(50% + (var(--wpopus-carousel-navigation-width)/2 + 5px));\n            }\n    \n            &.pagination-outside {\n                ::part(button-prev) {\n                    top: calc((50% - 25px) - (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                }\n                ::part(button-next) {\n                    top: calc((50% - 25px) + (var(--wpopus-carousel-navigation-width)/2 + 5px));\n                }\n            }\n        }\n    \n    }\n}\n"],"names":[],"sourceRoot":""}