/*
Theme Name:   Hello Elementor Child
Theme URI:    https://elementor.com/hello-theme/
Description:  Hello Elementor Child Theme - wdrożenie poprawek z audytu UX/UI/CRO.
Author:       Ekspert Gemini
Author URI:   https://gemini.google.com
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
*/

/* --- AUDYT CSS FIXES --- */

/* 
 * Poprawka kontrastu: Zwiększa czytelność tekstów na ciemnych tłach.
 * Może wymagać dostosowania selektora do konkretnej sekcji.
 */
.elementor-section.elementor-section-boxed > .elementor-container {
    color: #fff;
}

/* 
 * Poprawka czytelności nawigacji bocznej na stronach produktów.
 * Przykładowy selektor, dostosuj w razie potrzeby.
 */
.woocommerce-page .widget-area .widget a,
.product-sidebar-nav a {
    color: #333 !important;
    font-weight: 600;
}

/* 
 * Wymuszenie wskaźnika kursora na elementach, które wyglądają jak przyciski.
 */
.elementor-button, .elementor-cta, [class*="elementor-button-"] {
    cursor: pointer !important;
}

/* 
 * Poprawka responsywności tabeli cennika na urządzeniach mobilnych.
 */
@media (max-width: 767px) {
    .elementor-widget-price-table .elementor-price-table,
    .elementor-widget-table-of-contents .elementor-table-of-contents {
        display: block;
        overflow-x: auto;
        width: 100%;
    }
}

/*
 * --- TASK 1: LIQUID TYPOGRAPHY & SPACING ---
 */

:root {
    /* Fluid Font Sizes */
    --fs-h1: clamp(2.5rem, 6vw + 1rem, 5rem);
    --fs-h2: clamp(2rem, 5vw + 1rem, 4rem);
    --fs-h3: clamp(1.75rem, 4vw + 1rem, 3rem);
    --fs-h4: clamp(1.5rem, 3vw + 1rem, 2.5rem);
    --fs-body: clamp(1rem, 0.5vw + 0.9rem, 1.15rem);
    --fs-small: clamp(0.875rem, 0.25vw + 0.8rem, 1rem);

    /* Fluid Spacing */
    --spacing-section-vertical: clamp(40px, 8vw, 120px);
    --spacing-section-horizontal: clamp(20px, 4vw, 60px);
}

/* Applying Fluid Typography */
.elementor-widget-heading h1.elementor-heading-title { font-size: var(--fs-h1); }
.elementor-widget-heading h2.elementor-heading-title { font-size: var(--fs-h2); }
.elementor-widget-heading h3.elementor-heading-title { font-size: var(--fs-h3); }
.elementor-widget-heading h4.elementor-heading-title { font-size: var(--fs-h4); }

.elementor-widget-text-editor,
.elementor-widget-text-editor p,
body {
    font-size: var(--fs-body);
}

/* Applying Fluid Spacing to Elementor Sections */
.elementor-section.elementor-section-boxed > .elementor-container {
    padding-left: var(--spacing-section-horizontal);
    padding-right: var(--spacing-section-horizontal);
}
.elementor-section {
    padding-top: var(--spacing-section-vertical);
    padding-bottom: var(--spacing-section-vertical);
}

/* Override Elementor's fixed paddings */
.elementor-section.elementor-top-section {
    padding-top: var(--spacing-section-vertical) !important;
    padding-bottom: var(--spacing-section-vertical) !important;
}

/*
 * =================================================================================
 * PHASE 2 HOT-FIXES
 * =================================================================================
 */

/* 2. CSS: Cookie Banner Fix */
#cookie-law-info-bar, 
.cookie-notice-container,
div[id*="cookie-banner"],
div[class*="cookie-banner"] {
    bottom: 10px !important;
    left: 10px !important;
    right: auto !important;
    top: auto !important;
    max-width: 320px !important;
    transform: scale(0.95);
    transform-origin: bottom left;
    z-index: 1000 !important;
}

/* 2. CSS: Tabela Cennika RWD Fix */
@media (max-width: 768px) {
    .elementor-widget-price-list .elementor-price-list,
    .elementor-widget-price-table table,
    body table.html-table /* More generic table */ {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    .elementor-widget-price-table table th,
    .elementor-widget-price-table table td {
      white-space: normal;
    }
}

/* 2. CSS: Kontrast Buttonów */
.elementor-button[style*="background-color: #ffd600"],
.elementor-button[style*="background-color: yellow"] {
    color: #000000 !important;
}

/**
 * =================================================================================
 * 4. CONVERSION: Mobile Sticky Bar
 * =================================================================================
 */
.mobile-sticky-bar {
    display: none; /* Ukryty domyślnie */
}

@media (max-width: 767px) {
    .mobile-sticky-bar {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 60px;
        background-color: #1a1a1a;
        z-index: 10000;
        border-top: 1px solid #333;
        box-shadow: 0 -2px 10px rgba(0,0,0,0.2);
    }
    
    .mobile-sticky-bar .sticky-bar-button {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50%;
        height: 100%;
        font-size: 16px;
        font-weight: bold;
        text-decoration: none;
        color: #ffffff;
        transition: background-color 0.3s ease;
    }
    
    .mobile-sticky-bar .call-button {
        background-color: #333;
    }
    
    .mobile-sticky-bar .order-button {
        background-color: #ffd600; /* Kolor z przycisków na stronie */
        color: #000000;
    }
    
    .mobile-sticky-bar .sticky-bar-button:hover,
    .mobile-sticky-bar .sticky-bar-button:focus {
        background-color: #444;
    }
    
    .mobile-sticky-bar .order-button:hover,
    .mobile-sticky-bar .order-button:focus {
        background-color: #ffed4a;
    }
    
    /* Dodajmy trochę miejsca na dole strony, aby pasek nie zasłaniał treści stopki */
    body {
        padding-bottom: 60px;
    }
}

/**
 * =================================================================================
 * RWD & MOBILE FIXES
 * =================================================================================
 */

@media only screen and (max-width: 767px) {
    /* 1. Reset Paddingów */
    .elementor-section,
    .elementor-column.elementor-col-100,
    .elementor-column > .elementor-element-populated {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    .elementor-top-section {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }

    /* 2. Typografia Mobilna */
    h1, .elementor-heading-title.elementor-size-xxl {
        font-size: 32px !important;
        line-height: 1.2em !important;
        word-wrap: break-word;
    }
    h2, .elementor-heading-title.elementor-size-xl {
        font-size: 26px !important;
        line-height: 1.3em !important;
        word-wrap: break-word;
    }
    body, p {
        word-wrap: break-word;
    }

    /* 3. Re-Order Kolumn (dla sekcji oznaczonych specjalną klasą) */
    .elementor-section.reverse-columns-on-mobile > .elementor-container {
        display: flex;
        flex-direction: column-reverse;
    }
    
    /* 4. Menu Mobilne (Hamburger) */
    .elementor-menu-toggle {
        min-width: 44px !important;
        min-height: 44px !important;
        background-color: rgba(255, 255, 255, 0.1) !important; /* Lepsza widoczność na ciemnym tle */
        border-radius: 5px;
    }
    .elementor-menu-toggle i {
        color: #ffffff !important; /* Wymuś białą ikonę */
    }

    /* 5. Bezpiecznik Tabel i Szerokości */
    img, iframe, video {
        max-width: 100% !important;
        height: auto !important;
    }
    table.elementor-table {
        width: 100% !important;
    }
}

/*
 * =================================================================================
 * PHASE 6: ALIGNMENT & POLISH
 * =================================================================================
 */

/* 2. VERTICAL ALIGNMENT (Global Flex Fix) */
/* Stosujemy ten fix tylko do kolumn wewnątrz sekcji, które nie mają określonego wyrównania pionowego przez Elementor. */
/* To zapobiega nadpisaniu zamierzonego wyrównania do góry/dołu/rozciągnięcia. */
.elementor-section-wrap .elementor-section:not(.elementor-section-items-top):not(.elementor-section-items-bottom):not(.elementor-section-items-stretch) > .elementor-container > .elementor-row > .elementor-column > .elementor-element-populated {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* 3. SPACING CONSISTENCY */
h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
    margin-block-end: 0.7em; /* Zastępuje margin-bottom dla lepszego wsparcia języków */
}

/* Wymuszenie minimalnego odstępu między sekcjami, jeśli go nie ma */
.elementor-section:not([style*="padding"]) {
    padding-block: 40px;
}

@media only screen and (max-width: 767px) {
    /* 1. MOBILE ALIGNMENT */
    .elementor-widget-heading .elementor-heading-title,
    .elementor-widget-text-editor {
        text-align: center;
    }

    .elementor-widget-button .elementor-widget-container {
        text-align: center;
    }
    
    .elementor-widget-button .elementor-button {
        margin-left: auto;
        margin-right: auto;
    }
    
    .elementor-widget-icon-box .elementor-icon-box-wrapper,
    .elementor-widget-icon .elementor-icon {
        text-align: center;
    }
    .elementor-widget-icon-box .elementor-icon {
        display: inline-block;
    }
    
    /* 3. SPACING CONSISTENCY (Mobile) */
    .elementor-section:not([style*="padding"]) {
        padding-block: 20px;
    }
}

.kozakweb-floating-login-button {
    display: none !important;
}
