/**
Theme Name: I-match
Author: I-match child theme
Author URI: https://i-match.nl
Description: I-match child theme 2024
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: i-match
Template: astra
*/
/* ===============================================
   STICKY CTA BUTTONS
   =============================================== */

/* Container aan de linkerzijde */
.sticky-cta {
    position: fixed !important;
    left: 0 !important;
    top: 55% !important;
    transform: translateY(-50%);
    display: flex !important;
    flex-direction: column !important;
    z-index: 99999 !important;
}

/* De schuine knoppen - SKEW OMGEKEEERD */
.sticky-cta a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 70px !important;
    height: 55px !important;
    text-decoration: none !important;
    transform: skew(-18deg, 0) !important; /* Terug naar de negatieve schuinte */
    margin-left: -10px !important; /* Iets minder marge zodat de punt goed valt */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.25) !important;
    transition: all 0.3s ease !important;
}

/* De iconen weer rechtzetten */
.sticky-cta .cta-icon {
    transform: skew(18deg, 0) !important; /* Positieve skew om de knop-skew op te heffen */
    width: 30px;
    text-align: center;
    display: inline-block;
    transition: transform 0.3s ease;
    color: #fff; /* Kleur voor offerte en email iconen */
}

/* SPECIFIEK: Het witte telefoontje */
.sticky-cta .white-icon {
    color: #ffffff !important;
}

/* Kleuren Gradients */
.sticky-cta .cta-offerte {
    background: linear-gradient(135deg, #c9c9ca 0%, #b5b5b6 100%) !important;
    border-radius: 0 5px 5px 0 !important;
}

.sticky-cta .cta-phone {
    background: linear-gradient(135deg, #6d6e71 0%, #5a5b5e 100%) !important;
    border-radius: 0 5px 5px 0 !important;
}

.sticky-cta .cta-email {
    background: linear-gradient(135deg, #597c72 0%, #4a6b61 100%) !important;
    border-radius: 0 5px 5px 0 !important;
}

/* Hover effect: iconen bewegen subtiel naar rechts */
.sticky-cta a:hover {
    padding-left: 8px !important;
}

.sticky-cta a:hover .cta-icon {
    transform: skew(18deg, 0) scale(1.1) translateX(3px) !important;
}

/* Mobiel */
@media (max-width: 768px) {
    .sticky-cta a {
        width: 55px !important;
        height: 50px !important;
        margin-left: -8px !important;
    }
    .sticky-cta .cta-icon {
        font-size: 20px !important;
    }
}




/* Reset de WPBakery Pageable container */
.tekst-carousel .vc_pageable-wrapper,
.tekst-carousel .vc_pageable-slide-wrapper {
    display: block !important;
    width: 100% !important;
    opacity: 1 !important;
    height: auto !important;
    transform: none !important;
}

/* Onze nieuwe slides */
.slick-blog-slide {
    padding: 15px;
    box-sizing: border-box;
}

/* Verberg de originele grid items die mogelijk blijven hangen */
.tekst-carousel .vc_grid-item {
    display: none !important;
}

/* Zorg dat de afbeeldingen netjes tonen */
.slick-blog-slide .vc_gitem-animated-block {
    width: 100% !important;
    position: relative !important;
}