/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.0.2
*/
:root {
    /* Definiowanie głównej palety marki */
    --brand-primary: #b9d989 !important; /* Zmień na właściwy hex z Key Visual */
    --brand-primary-hover: #9eb975 !important;
    --brand-text-on-primary: #ffffff;
}

/* Wymuszenie dziedziczenia w rdzennych przyciskach BeTheme i WooCommerce */
#Wrapper .button_theme,
#Wrapper .mfn-element-button,
#Wrapper .woocommerce a.button, 
#Wrapper .woocommerce button.button, 
#Wrapper .woocommerce input.button {
    background-color: var(--brand-primary) !important;
    color: var(--brand-text-on-primary) !important;
    border-color: var(--brand-primary) !important;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

#Wrapper .button_theme:hover,
#Wrapper .mfn-element-button:hover,
#Wrapper .woocommerce a.button:hover, 
#Wrapper .woocommerce button.button:hover, 
#Wrapper .woocommerce input.button:hover {
    background-color: var(--brand-primary-hover) !important;
    border-color: var(--brand-primary-hover) !important;
}


/* ==========================================================================
   TYPOGRAFIA H1-H6 | BeTheme Child Override (Montserrat / Open Sans)
   ========================================================================== */

/* 1. Nagłówki Wiodące (H1, H2) -> Montserrat */
h1, h2,
#Wrapper h1, #Wrapper h2,
.mfn-element-heading h1, .mfn-element-heading h2,
.mfn-element-heading .mfn-heading-title.h1, 
.mfn-element-heading .mfn-heading-title.h2 {
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 200;
    letter-spacing: -0.02em; /* Zacieśnienie kerningu dla ekspresyjnych nagłówków */
}

/* 2. Nagłówki Podrzędne i Funkcyjne (H3, H4, H5, H6) -> Open Sans */
h3, h4, h5, h6,
#Wrapper h3, #Wrapper h4, #Wrapper h5, #Wrapper h6,
.mfn-element-heading h3, .mfn-element-heading h4, 
.mfn-element-heading h5, .mfn-element-heading h6,
.mfn-element-heading .mfn-heading-title.h3, 
.mfn-element-heading .mfn-heading-title.h4,
.mfn-element-heading .mfn-heading-title.h5, 
.mfn-element-heading .mfn-heading-title.h6 {
    font-family: 'Open Sans', sans-serif !important;
    font-weight: 600;
}

/* 3. Dedykowana korekta dla widgetów nagłówkowych BeBuilder (Global Override) */
.mfn-heading-title {
    font-family: inherit !important;
}
.opsa-highlight-step {
    color: #13A538;
    font-weight: 800; /* Extra Bold */
}
/* ==========================================================================
   BeTheme: Promo Box - Globalny Link + Efekt Flash (Shine) + Color + Radius
   ========================================================================== */

/* 1. Nadrzędny kontener - czysta baza bez skalowania */
.global-clickable-card {
    position: relative !important;
}

/* 2. Reset wewnętrznych kontekstów BeTheme (krytyczne dla klikalności) */
.global-clickable-card .promo_box,
.global-clickable-card .promo_box_wrapper,
.global-clickable-card .desc_wrapper,
.global-clickable-card a.button {
    position: static !important;
    transform: none !important;
}

/* 3. Ukrycie struktury przycisku BeTheme */
.global-clickable-card a.button {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.global-clickable-card a.button * {
    display: none !important;
}

/* 4. "Stretched Link" - rozciągnięcie linku (niewidzialna maska klikalna) */
.global-clickable-card a.button::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    cursor: pointer;
    background: transparent; 
}

/* ==========================================================================
   EFEKTY WIZUALNE HOVER & BORDER RADIUS - ZAKTUALIZOWANE (FAST SHINE)
   ========================================================================== */

/* 5. Płynne przejście koloru dla nagłówków */
.global-clickable-card .desc_wrapper h1,
.global-clickable-card .desc_wrapper h2,
.global-clickable-card .desc_wrapper h3,
.global-clickable-card .desc_wrapper h4,
.global-clickable-card .desc_wrapper h5,
.global-clickable-card .desc_wrapper h6 {
    transition: color 0.3s ease-in-out;
}

/* Stan HOVER: Zmiana koloru tekstu na jasny zielony (np. Opsa) */
.global-clickable-card:hover .desc_wrapper h1,
.global-clickable-card:hover .desc_wrapper h2,
.global-clickable-card:hover .desc_wrapper h3,
.global-clickable-card:hover .desc_wrapper h4,
.global-clickable-card:hover .desc_wrapper h5,
.global-clickable-card:hover .desc_wrapper h6 {
    color: #A3CC59 !important; 
}

/* 6. Przygotowanie kontenera ze zdjęciem: Border Radius + WebKit Fix */
.global-clickable-card .photo_wrapper,
.global-clickable-card .image_wrapper {
    position: relative !important;
    overflow: hidden !important;
    border-radius: 6px !important;
    
    /* [WEBKIT BUG FIX] Wymusza poprawne renderowanie obcięcia przy animacjach gpu */
    -webkit-mask-image: -webkit-radial-gradient(white, black);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    transform: translateZ(0); 
}

/* Nałożenie radiusa profilaktycznie bezpośrednio na obrazek 
   + Dodanie płynnego przejścia dla filtra jasności */
.global-clickable-card .photo_wrapper img,
.global-clickable-card .image_wrapper img {
    border-radius: 6px !important;
    transition: filter 0.3s ease-in-out !important; 
}

/* 6.1 Stan HOVER: Rozjaśnienie zdjęcia o 20% */
.global-clickable-card:hover .photo_wrapper img,
.global-clickable-card:hover .image_wrapper img {
    filter: brightness(1.2) !important; 
}

/* 7. Warstwa światła (Shine) - domyślnie schowana po lewej stronie zdjęcia */
.global-clickable-card .photo_wrapper::after,
.global-clickable-card .image_wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: -150%;
    width: 50%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-25deg);
    z-index: 2; 
}

/* 8. Wyzwolenie animacji błysku w momencie najechania na cały kafelek 
   [MODYFIKACJA]: Czas skrócony do 0.55s (przyspieszenie o ~30%) */
.global-clickable-card:hover .photo_wrapper::after,
.global-clickable-card:hover .image_wrapper::after {
    animation: opsa-shine 0.55s ease-in-out;
}

/* 9. Definicja klatki kluczowej (Keyframes) dla przesunięcia światła */
@keyframes opsa-shine {
    0% {
        left: -150%;
    }
    100% {
        left: 200%;
    }
}
/* ==========================================================================
   BeTheme: Wymuszenie grubości 1px dla modułu Divider (Solid)
   ========================================================================== */

.mcb-item-type-divider hr,
.mcb-item-type-divider .hr_solid,
.mcb-item-type-divider .hr_color,
hr.hr_color {
    height: 1px !important;
    border: none !important; /* Brutalny reset natywnych obramowań przeglądarki */
    box-sizing: border-box !important;
}

/* Zabezpieczenie dla metody renderowania przez tło (background-color) */
.mcb-item-type-divider hr[style*="background"] {
    height: 1px !important;
}