/*
Theme Name: Slipstop Child
Theme URI: https://slipstopshoes.nl/
Description: Custom child theme for Slipstopshoes.nl.
Author: M2-D2
Author URI: https://m2-d2.nl/
Template: hello-elementor
Version: 1.0.0
Text Domain: slipstop-child
*/


/* ==========================================================================
   SLIPSTOP CHILD THEME
   ========================================================================== */

   .home-lifestyle-carousel.elementor-element .swiper .swiper-pagination-bullets.swiper-pagination-horizontal {
        bottom: -25px;
   }

   .benefits-text {
        max-width: 1000px !important;
    }

    .benefit-title {
        font-size: 17px !important;
        line-height: 1.35em !important;
        font-weight: 700 !important;
    }

    .home-testimonials-carousel .elementor-main-swiper.swiper.swiper-initialized.swiper-horizontal.swiper-pointer-events.swiper-backface-hidden {
        padding-bottom: 0 !important;
    }

/* ==========================================================================
   01. GLOBAL
   ========================================================================== */


/* ==========================================================================
   02. HEADER
   ========================================================================== */
   /* USP Mobile - Media Carousel */ 
   
   .elementor-element.elementor-pagination-position-outside .swiper, .elementor-lightbox.elementor-pagination-position-outside .swiper {
        padding-bottom:0;
    }

/* ==========================================================================
   03. NAVIGATION & MEGA MENU
   ========================================================================== */


/* ==========================================================================
   04. PRODUCT CARDS
   ========================================================================== */

   .product-card-images {
        position: relative;
        overflow: hidden;
    }
    
    .product-card-images .product-card-hover {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity 0.3s ease;
    }

    .product-card-images:hover .product-card-hover {
        opacity: 1;
    }

    .product-card-hover img {
        width: 100%;
        height: 350px;
        object-fit: cover;
    }

    .product-card-price p {
        margin-block-end: 0 !important;
    }

    .product-card-images, .product-card-hover {
        aspect-ratio: 1 / 1;
    }

    .product-card-hover {
        overflow: hidden;
    }


/* ==========================================================================
   05. SHOP & PRODUCT ARCHIVES
   ========================================================================== */


/* ==========================================================================
   06. SINGLE PRODUCT
   ========================================================================== */

   .woocommerce div.product form.cart .variations tr,
    .woocommerce div.product form.cart .variations th,
    .woocommerce div.product form.cart .variations td {
        background-color: transparent !important;
    }

    .variable-item.button-variable-item {
        background-color: transparent !important;
        border: solid 1px #263A48;
        border-radius: 999px !important;
        padding: 20px 28px !important;
        font-family: 'Poppins', Helvitica, Arial, sans-serif;
        font-size: 14px !important;
        line-height: 1.2 !important;
        margin: 10px !important;
    }

    .variable-item.button-variable-item:hover,
    .variable-item.button-variable-item:focus, .variable-item.button-variable-item:active {
        background-color: #263A48 !important;
        border: solid 1px #263A48 !important;
        color: #ffffff !important;
    }

    .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product p.price,
    .woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product span.price{
        color: #263A48 !important;
    }

/* ==========================================================================
   07. CART & CHECKOUT
   ========================================================================== */

   .product-name a {
        font-weight: 400;
        font-size: 14px;
    }

    .dhlpwc-parcelshop-option-change {
        background: transparent !important;
        border: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        text-decoration: underline !important;
        color: #222 !important;
    }

    .dhlpwc-shipping-method-parcelshop-option span.dhlpwc-parcelshop-option-message {
        width: 90% !important;
    }

    .dhlpwc-shipping-method-parcelshop-option {
        display: flex;
        margin-top: 6px !important;
    }

    .elementor-widget-woocommerce-cart .e-cart__container {
        grid-column-gap: var(--sections-margin,32px) !important;
        grid-row-gap: var(--sections-margin,32px) !important;
    }

    .woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
        margin-top: 20px;
    }

/* ==========================================================================
   08. MY ACCOUNT PAGE
   ========================================================================== */

    .button.wc-forward {
        color: #fff !important;
        background-color: var( --e-global-color-secondary ) !important;
        font-size: 14px !important;
        border-radius: 999px !important;
        border: solid 1px var( --e-global-color-secondary ) !important;
        padding: 14px 28px !important;
        margin-left: 20px !important;
    }

    .button.wc-forward:hover {
        background-color: var( --e-global-color-primary ) !important;
        border: solid 1px var( --e-global-color-primary ) !important;
        color: #fff !important;
    }

/* ==========================================================================
   09. FOOTER
   ========================================================================== */

    /* Newsletter sign up form */

    .mailchimp-signup-form .elementor-button.elementor-size-sm {
        position: absolute;
        bottom: 12px;
        left: 265px;
    }

/* ==========================================================================
   09. LEGAL PAGES
   ========================================================================== */

    #cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary,
    .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary {
        background-color: #fff;
        padding: 14px 0;
    }

    #cmplz-cookies-overview .cmplz-dropdown summary div h3, #cmplz-document .cmplz-dropdown summary div h3,
    .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary div h3 {
        font-size: 16px;
        line-height: 1.5;
    }

    #cmplz-cookies-overview .cmplz-dropdown summary div::after, #cmplz-document .cmplz-dropdown summary div::after,
    .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown summary div::after {
        height: 10px;
        width: 10px;
    }

    #cmplz-cookies-overview .cmplz-dropdown, #cmplz-document .cmplz-dropdown,
    .editor-styles-wrapper .cmplz-unlinked-mode .cmplz-dropdown {
        background-color: #fff;
        padding: 0 20px;
    }

    #cmplz-document h3,
    .editor-styles-wrapper .cmplz-unlinked-mode h3 {
        font-size: 16px;
    }

    #cmplz-document .cmplz-dropdown p {
        padding: 0;
    }

    #cmplz-datarequest-form {
        gap: 10px;
        display: flex;
        flex-direction: column;
    }

    #cmplz-datarequest-submit {
        background-color: var( --e-global-color-secondary);
        padding: 14px 28px !important;
        font-size: 14px;
        width: 200px;
    }

    #cmplz-datarequest-form label {
        line-height: 1.5;
        margin-bottom: 11px;
    }

/* ==========================================================================
   10. POST ARCHIVEs & SINGLE POSTS
   ========================================================================== */

    .blg-card-featured-image img {
        aspect-ratio: 4 / 3;
    }

   .blog-cart-button {
    margin-top: auto;
   }

   /* ==========================================================================
   11. MOBILE OFF-CANVAS POPUP MENU
   ========================================================================== */

   .popmenu-img-card.elementor-widget-image-box .elementor-image-box-wrapper {
        display: flex;
    }

    .popmenu-img-card{
        border-radius: 6px;
        width: 100%;
    }

    .e-n-tab-title:hover, .e-n-tab-title:active, .e-n-tab-title:focus {
        border-radius: 0 !important;
    }

/* ==========================================================================
   12. RESPONSIVE OVERRIDES
   ========================================================================== */

   @media only screen and (max-width:767px) {
    .product-card-hover img {
        height: 180px !important;
    }
   }