/* =======================================================
    STYLE GŁÓWNEGO MENU I NAWIGACJI
   ======================================================= */
.header {
    position: fixed; /* Zmienione z absolute na fixed */
    width: 100%;
    z-index: 1000;
    padding: 20px 0;
    top: 0;
    left: 0; /* Dodane dla pewności */
    transition: transform 0.3s ease-in-out;
    background: transparent; /* Dodane dla lepszej widoczności */
}

/* UKRYWANIE HEADER PRZY SCROLL */
.header.header-hidden {
    transform: translateY(-100%);
    pointer-events: none;
}

.header:not(.header-hidden) {
    pointer-events: auto;
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    background-color: #ffffff;
    border-radius: 50px;
    padding: 15px 40px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.nav-logo {
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    text-decoration: none;
}

.nav-menu {
    display: flex;
    align-items: center;
    gap: 30px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.nav-link {
    font-size: 1rem;
    font-weight: 500;
    color: #555;
    transition: color 0.3s ease;
    text-decoration: none;
    position: relative;
}

.nav-link:hover {
    color: #1F8D4F;
}

.nav-link .fa-chevron-down {
    font-size: 0.7rem;
    margin-left: 5px;
}

.social-media {
    display: flex;
    gap: 20px;
}

.social-media a {
    font-size: 1.2rem;
    color: #555;
    transition: color 0.3s ease;
    text-decoration: none;
}

.social-media a:hover {
    color: #1F8D4F;
}

/* --- Dropdown Menu Desktop --- */
.dropdown {
    position: relative;
}

.dropdown::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 20px;
    background: transparent;
    z-index: 999;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background-color: #ffffff;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    border-radius: 15px;
    padding: 15px 0 10px;
    list-style: none;
    width: 200px;
    display: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    margin-top: 10px;
    margin: 0;
    transition-delay: 0.3s;
}

.dropdown:hover .dropdown-menu,
.dropdown-menu:hover {
    display: block;
    opacity: 1;
    visibility: visible;
    transition-delay: 0s;
}

.dropdown-menu li a {
    display: block;
    padding: 10px 20px;
    color: #555;
    font-size: 0.95rem;
    transition: background-color 0.3s ease, color 0.3s ease;
    text-decoration: none;
}

.dropdown-menu li a:hover {
    background-color: #f0f0f0;
    color: #1F8D4F;
}

/* --- Ukryte elementy mobilne na desktopie --- */
.hamburger,
.mobile-sidebar,
.mobile-overlay {
    display: none;
}

/* =======================================================
    MOBILNE MENU
   ======================================================= */
@media (max-width: 768px) {
    /* NADPISANIE PADDING DLA MOBILE */
    .header {
        padding: 10px 10px 20px 10px;
    }

    /* Ukryj desktopowe menu */
    .nav-menu,
    .social-media {
        display: none;
    }

    /* Hamburger */
    .hamburger {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 28px;
        height: 18px;
        background: transparent;
        border: none;
        cursor: pointer;
        z-index: 1002;
        padding: 0;
    }

    .hamburger span {
        display: block;
        height: 3px !important;
        width: 100%;
        background-color: #333;
        border-radius: 2px;
        transition: all 0.3s ease;
        transform-origin: center;
        margin: 0 !important;
        flex-shrink: 0;
    }

    .hamburger.active span:nth-child(1) { 
        transform: rotate(45deg) translate(5px, 5px); 
        width: 100% !important;
    }
    .hamburger.active span:nth-child(2) { 
        opacity: 0; 
        width: 100% !important;
    }
    .hamburger.active span:nth-child(3) { 
        transform: rotate(-45deg) translate(6px, -6px); 
        width: 100% !important;
    }

    /* Overlay */
    .mobile-overlay {
        display: block;
        position: fixed;
        top: 0; 
        left: 0;
        width: 100vw; 
        height: 100vh;
        background: rgba(0,0,0,0.5);
        z-index: 1001;
        opacity: 0; 
        visibility: hidden;
        transition: all 0.3s ease;
    }

    .mobile-overlay.active { 
        opacity: 1; 
        visibility: visible; 
    }

    /* Sidebar */
    .mobile-sidebar {
        position: fixed;
        top: 0; 
        right: -280px;
        width: 280px; 
        height: 100vh;
        background: #fff;
        box-shadow: -2px 0 10px rgba(0,0,0,0.1);
        transition: right 0.3s ease;
        z-index: 1002;
        display: flex; 
        flex-direction: column;
    }

    .mobile-sidebar.active { 
        right: 0; 
    }

    .mobile-sidebar-header {
        display: flex; 
        justify-content: space-between; 
        align-items: center;
        padding: 20px; 
        border-bottom: 1px solid #eee;
    }

    .mobile-logo { 
        font-size: 1.2rem; 
        font-weight: 600; 
        color: #333; 
    }

    .close-sidebar { 
        background: none; 
        border: none; 
        font-size: 1.5rem; 
        cursor: pointer; 
        color: #333;
    }

    /* Mobile Menu */
    .mobile-menu { 
        list-style: none; 
        margin: 0; 
        padding: 0; 
        flex-grow: 1; 
    }

    .mobile-nav-item { 
        border-bottom: 1px solid #f0f0f0; 
        position: relative;
        margin: 0;
        padding: 0;
    }

    .mobile-nav-link {
        display: block;
        padding: 15px 20px;
        color: #333; 
        font-weight: 500; 
        text-decoration: none;
        transition: background 0.3s, color 0.3s;
        margin: 0;
        border: none;
    }

    /* DROPDOWN WRAPPER - NOWA STRUKTURA */
    .mobile-dropdown-wrapper {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .mobile-dropdown-wrapper .mobile-nav-link {
        flex: 1;
        border-bottom: none;
        margin: 0;
    }

    .mobile-dropdown-trigger { 
        background: none; 
        border: none; 
        padding: 15px 20px; 
        cursor: pointer; 
        color: #333;
        flex-shrink: 0;
        margin: 0;
    }

    .dropdown-arrow { 
        transition: transform 0.3s; 
    }

    .mobile-nav-item.active .dropdown-arrow { 
        transform: rotate(180deg); 
    }

    /* DROPDOWN OTWARTE DOMYŚLNIE GDY AKTYWNE */
    .mobile-nav-item.dropdown-active .dropdown-arrow { 
        transform: rotate(180deg); 
    }

    .mobile-dropdown-menu {
        max-height: 0; 
        overflow: hidden;
        background: #ffffff;
        transition: max-height 0.4s ease;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .mobile-nav-item.active .mobile-dropdown-menu,
    .mobile-nav-item.dropdown-active .mobile-dropdown-menu { 
        max-height: 500px; 
    }

    .mobile-dropdown-menu .mobile-nav-item {
        border-bottom: 1px solid #e9ecef;
        background: #ffffff;
        margin: 0;
        padding: 0;
    }

    .mobile-dropdown-menu .mobile-nav-link { 
        padding-left: 35px; 
        background: #ffffff;
        margin: 0;
    }

    /* Social media mobilne */
    .mobile-social-media {
        display: flex; 
        justify-content: center; 
        gap: 20px;
        border-top: 1px solid #eee;
        padding: 15px;
    }

    .mobile-social-media a { 
        font-size: 1.3rem; 
        color: #555; 
        text-decoration: none;
    }

    /* =======================================================
        AKTYWNY LINK - POPRAWIONA WERSJA BEZ PODWÓJNEJ KRESKI
       ======================================================= */
    
    /* NAPRAW PODWÓJNĄ KRESKĘ - USUŃ WSZYSTKIE POPRZEDNIE PSEUDO-ELEMENTY */
    .mobile-menu > .mobile-nav-item.active-page::after,
    .mobile-menu > .mobile-nav-item.active-page::before,
    .mobile-menu > .mobile-nav-item.active-page > .mobile-nav-link::after,
    .mobile-menu > .mobile-nav-item.active-page > .mobile-dropdown-wrapper::after {
        content: none !important;
        display: none !important;
    }

    /* STYLE DLA ZWYKŁYCH LINKÓW (bez dropdown) - active-page */
    .mobile-menu > .mobile-nav-item.active-page > .mobile-nav-link {
        color: #1F8D4F !important; 
        font-weight: 600 !important;
        background: rgba(31,141,79,0.05) !important;
        position: relative;
    }

    .mobile-menu > .mobile-nav-item.active-page > .mobile-nav-link::before {
        content: '' !important;
        display: block !important;
        position: absolute;
        left: 0; 
        top: 0;  
        bottom: 0;  
        width: 4px; 
        background: #1F8D4F; 
        z-index: 2;
    }

    /* STYLE DLA LINKÓW Z DROPDOWN (oferta) - active-page */
    .mobile-menu > .mobile-nav-item.active-page > .mobile-dropdown-wrapper {
        background: rgba(31,141,79,0.05) !important;
        position: relative;
    }

    .mobile-menu > .mobile-nav-item.active-page > .mobile-dropdown-wrapper::before {
        content: '' !important;
        display: block !important;
        position: absolute;
        left: 0; 
        top: 0;  
        bottom: 0;  
        width: 4px; 
        background: #1F8D4F; 
        z-index: 2;
    }

    .mobile-menu > .mobile-nav-item.active-page > .mobile-dropdown-wrapper > .mobile-nav-link {
        color: #1F8D4F !important; 
        font-weight: 600 !important;
        background: none !important;
    }

    .mobile-menu > .mobile-nav-item.active-page > .mobile-dropdown-wrapper > .mobile-dropdown-trigger {
        color: #1F8D4F !important;
    }

    /* STYLE DLA DROPDOWN POZIOMU - active-subpage */
    .mobile-dropdown-menu .mobile-nav-item.active-subpage > .mobile-nav-link {
        color: #1F8D4F !important; 
        font-weight: 600 !important;
        background: rgba(31,141,79,0.1) !important;
        position: relative;
    }

    .mobile-dropdown-menu .mobile-nav-item.active-subpage > .mobile-nav-link::before {
        content: '' !important;
        display: block !important;
        position: absolute;
        left: 0; 
        top: 0;  
        bottom: 0;  
        width: 4px; 
        background: #1F8D4F; 
        z-index: 2;
    }

    /* HOVER EFFECTS */
    .mobile-dropdown-menu .mobile-nav-item .mobile-nav-link:hover {
        background: rgba(31,141,79,0.05) !important;
        color: #1F8D4F !important;
    }
}

/* =======================================================
    MOBILNE MENU - DODATKOWE STYLE DLA AUTO-OTWIERANIA
   ======================================================= */
@media (max-width: 768px) {
    /* DROPDOWN OTWARTE DOMYŚLNIE GDY AKTYWNE */
    .mobile-nav-item.dropdown-active .dropdown-arrow { 
        transform: rotate(180deg); 
    }

    .mobile-nav-item.dropdown-active .mobile-dropdown-menu { 
        max-height: 500px; 
    }

    /* STYLE DLA AKTYWNEGO DROPDOWN (gdy jesteśmy na podstronie oferty) */
    .mobile-nav-item.dropdown-active > .mobile-dropdown-wrapper {
        background: rgba(31,141,79,0.05) !important;
    }

    .mobile-nav-item.dropdown-active > .mobile-dropdown-wrapper::before {
        content: '' !important;
        display: block !important;
        position: absolute;
        left: 0; 
        top: 0;  
        bottom: 0;  
        width: 4px; 
        background: #1F8D4F; 
        z-index: 2;
    }
}

/* =======================================================
    OSTATECZNY FIX DLA DROPDOWN
   ======================================================= */
@media (max-width: 768px) {
    
    /* RESETUJ WSZYSTKIE DROPDOWN ITEMS */
    .mobile-dropdown-menu .mobile-nav-item,
    .mobile-dropdown-menu li,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(1),
    .mobile-dropdown-menu .mobile-nav-item:nth-child(2), 
    .mobile-dropdown-menu .mobile-nav-item:nth-child(3),
    .mobile-dropdown-menu .mobile-nav-item:nth-child(4),
    .mobile-dropdown-menu .mobile-nav-item:nth-child(odd),
    .mobile-dropdown-menu .mobile-nav-item:nth-child(even),
    .mobile-dropdown-menu .mobile-nav-item:first-child,
    .mobile-dropdown-menu .mobile-nav-item:last-child {
        background: #ffffff !important;
        border-bottom: 1px solid #e9ecef !important;
        border-top: none !important;
        border-left: none !important;
        border-right: none !important;
        margin: 0 !important;
        padding: 0 !important;
        position: relative !important;
    }

    /* DODAJ GÓRNĄ KRESKĘ DO PIERWSZEGO ELEMENTU DROPDOWN */
    .mobile-dropdown-menu .mobile-nav-item:first-child {
        border-top: 1px solid #e9ecef !important;
    }

    /* RESETUJ WSZYSTKIE LINKI W DROPDOWN */
    .mobile-dropdown-menu .mobile-nav-item .mobile-nav-link,
    .mobile-dropdown-menu li .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(1) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(2) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(3) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(4) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(odd) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(even) .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:first-child .mobile-nav-link,
    .mobile-dropdown-menu .mobile-nav-item:last-child .mobile-nav-link {
        color: #333 !important;
        font-weight: 400 !important;
        background: #ffffff !important;
        padding: 12px 20px 12px 35px !important;
        border: none !important;
        margin: 0 !important;
        text-decoration: none !important;
        display: block !important;
        font-size: 0.9rem !important;
        line-height: normal !important;
        box-shadow: none !important;
        border-radius: 0 !important;
        position: relative !important;
    }

    /* USUŃ WSZYSTKIE PSEUDO-ELEMENTY Z DROPDOWN ITEMS */
    .mobile-dropdown-menu .mobile-nav-item::before,
    .mobile-dropdown-menu .mobile-nav-item::after,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(odd)::before,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(odd)::after,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(even)::before,
    .mobile-dropdown-menu .mobile-nav-item:nth-child(even)::after,
    .mobile-dropdown-menu .mobile-nav-item:first-child::before,
    .mobile-dropdown-menu .mobile-nav-item:first-child::after,
    .mobile-dropdown-menu .mobile-nav-item:last-child::before,
    .mobile-dropdown-menu .mobile-nav-item:last-child::after {
        display: none !important;
        content: none !important;
        background: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    /* ZACHOWAJ STYLE TYLKO DLA AKTYWNEGO LINKU */
    .mobile-dropdown-menu .mobile-nav-item.active-subpage {
        background: rgba(31,141,79,0.05) !important;
    }

    .mobile-dropdown-menu .mobile-nav-item.active-subpage .mobile-nav-link {
        color: #1F8D4F !important;
        font-weight: 600 !important;
        background: rgba(31,141,79,0.1) !important;
    }

    .mobile-dropdown-menu .mobile-nav-item.active-subpage::before {
        content: '' !important;
        display: block !important;
        position: absolute;
        left: 0;
        top: 0;
        bottom: 0;
        width: 4px;
        background: #1F8D4F;
        z-index: 2;
    }

    /* HOVER JEDNAKOWY DLA WSZYSTKICH */
    .mobile-dropdown-menu .mobile-nav-item:hover {
        background: rgba(31,141,79,0.02) !important;
    }

    .mobile-dropdown-menu .mobile-nav-item .mobile-nav-link:hover {
        background: rgba(31,141,79,0.05) !important;
        color: #1F8D4F !important;
    }

    /* DODATKOWE ZABEZPIECZENIE - USUŃ WSZYSTKIE ZEWNĘTRZNE STYLE */
    .mobile-dropdown-menu * {
        box-sizing: border-box !important;
    }
}