#header_menu {
    order: 1;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    width: 100%;
    
    /* Mobile navbar - zawsze widoczny, tylko na mobile */
    & #mobile_navbar {
        display: flex;
        width: 100%;
        
        & > ul {
            display: flex;
            align-items: center;
            justify-content: space-between; /* Hamburger po lewej, profil po prawej */
            list-style-type: none;
            margin: 0;
            padding: 0;
            width: 100%;
            
            /* Hamburger item */
            & > li.hamburger-item {
                display: flex;
                flex: 0 0 auto; /* Nie rozciągaj */
                width: auto;
                
                & > a#topMenu_btn {
                    display: flex;
                    flex-direction: column;
                    justify-content: center; /* Wyśrodkuj w pionie */
                    align-items: center; /* Wyśrodkuj w poziomie */
                    gap: 4px; /* Odstępy między kreskami */
                    width: 40px;
                    height: 36px;
                    padding: 0;
                    cursor: pointer;
                    color: #0B6C9C;
                    text-decoration: none;
                    box-sizing: border-box;
                    
                    & > span {
                        display: block;
                        width: 23px;
                        height: 3px;
                        background-color: currentColor;
                        border-radius: 2px;
                        transform: translateY(-2px) translateX(10px);
                    }
                }
            }
            
            /* Profil po prawej */
            & > li.right {
                display: flex;
                flex: 0 0 auto; /* Nie rozciągaj */
                width: auto;
                margin-left: auto;
                position: relative; /* Dla pozycjonowania dropdown */
                
                & .btn-group {
                    position: relative;
                    height: 36px;
                    display: flex;
                    align-items: center;
                }
                
                & .btn-group > a {
                    display: flex;
                    align-items: center;
                    color: #0B6C9C;
                    text-decoration: none;
                    cursor: pointer;
                    height: 32px;
                    line-height: 32px;
                    padding: 2px 10px 0 10px;
                    white-space: nowrap; /* Zapobiegaj łamaniu */
                    position: relative; /* Dla pozycjonowania dropdown */
                    
                    /* Ikony standardowe */
                    & > i.mdi::before {
                        font-size: 16px !important;
                    }
                }
                
                /* Dropdown - pozycjonowanie przez @floating-ui */
                & .nuDropdown {
                    /* Pozycja będzie ustawiana przez JavaScript */
                    min-width: 200px;
                    max-width: calc(100vw - 20px);
                }
            }
        }
    }

    /* Desktop navbar (hamburger menu) - domyślnie ukryty */
    & > nav#desktop_navbar {
        display: none;
        position: fixed;
        width: 100%;
        border-top: 1px solid #F3F3F3;
        left: 0;

        & > ul {
            z-index: 9999;
            list-style-type: none;

            & > li {
                text-align: left;

                & > a {
                    display: block;
                    text-decoration: none;
                    color: #eaf3f7;
                    line-height: 32px;
                    padding: 2px 10px 0 10px;
                    font-size: 14px;

                    & :hover {
                    }
                }

                & .nuDropdown {
                    /* margin-top: 73px !important; */
                }
                
                /* Mobile - profil użytkownika widoczny w menu hamburger */
                &.right {
                    display: block;
                }
            }
        }
    }
}


@media (min-width: 992px) {
    #header_menu {
        order: 3;
    }
}

#header_menu > nav#desktop_navbar > ul > li:last-child {
    border-right: 0;
}

@media (min-width: 992px) {
    #header_menu > nav#desktop_navbar {
        display: none;
        position: relative;
        margin-left: -250px;
        width: 300px;
        border-top: 1px solid #F3F3F3;
        left: 0;
    }

    #header_menu > nav#desktop_navbar > ul > li > a {
        display: block;
    }
}

@media (min-width: 1200px) {
    #header_menu {
        width: auto;
        flex: 1;
    }
    
    /* Ukryj mobile navbar na desktop */
    #header_menu #mobile_navbar {
        display: none;
    }

    /* Desktop navbar widoczny */
    #header_menu > nav#desktop_navbar {
        display: block;
        margin-left: 0;
        width: auto;
        border: 0;
    }

    #header_menu > nav#desktop_navbar > ul {
        z-index: 9999;
        list-style-type: none;
        display: flex;
        align-items: center;
    }

    #header_menu > nav#desktop_navbar > ul > li {
        width: auto;
        flex-basis: auto;
        flex-grow: 0;
        flex-shrink: 0;
        height: 36px;
    }

    #header_menu > nav#desktop_navbar > ul > li > a {
        border: 0;
        line-height: 32px;
        padding: 2px 10px 0 10px;
        display: block;
        min-height: 32px;
    }

    /* Style dla elementów z samą ikoną */
    #header_menu > nav#desktop_navbar > ul > li > a:empty,
    #header_menu > nav#desktop_navbar > ul > li > a:has(> i:only-child),
    #header_menu > nav#desktop_navbar > ul > li > a.icon-only {
        padding: 2px 8px 0 8px;
        text-align: center;
        width: 32px;
        box-sizing: border-box;
    }

    #header_menu > nav#desktop_navbar > ul > li > a.icon-only > i {
        margin: 0 !important;
    }

    #header_menu > nav#desktop_navbar > ul > li > a > i.mdi::before {
        font-size: 16px !important;
    }

    /* Style dla inputów w menu */
    #header_menu > nav#desktop_navbar > ul > li.input {
        height: 36px;
        display: flex;
        align-items: center;
    }

    #header_menu > nav#desktop_navbar > ul > li.input input {
        height: 28px;
        line-height: 28px;
        padding: 0 8px;
        border: 1px solid #ddd;
        border-radius: 4px;
        box-sizing: border-box;
    }

    /* Style dla elementów z dropdown */
    #header_menu > nav#desktop_navbar > ul > li .btn-group {
        height: 36px;
        display: flex;
        align-items: center;
    }

    #header_menu > nav#desktop_navbar > ul > li .btn-group > a {
        height: 32px;
        line-height: 32px;
        padding: 2px 10px 0 10px;
    }

    /* Elementy menu po prawej stronie */
    #header_menu > nav#desktop_navbar > ul > li.right {
        margin-left: auto;
    }
}

/*
#topCart {
	img {
		max-height: 80px !important;
	}
	table {
		thead tr th {
			font-weight: bold;
			font-size: 12px;
			padding: 3px;
			border-bottom: 1px solid #0F8DCB;
		}

		tbody {
			font-size: 12px;
		}

		tr.discount {
			border-bottom: 1px solid #00F408;
			.price {
				font-weight: bold;
				text-align: right;
			}
		}

	}
}*/

/* ==============================================================
   Profile avatar w menu
   ============================================================== */
.profile-avatar {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 4px;
    object-fit: cover;
    vertical-align: middle;
}

/* Profile emoji w menu */
.profile-emoji {
    font-size: 16px;
    line-height: 1;
    margin-right: 4px;
    display: inline-block;
    vertical-align: middle;
}

/* Header dropdown w profilu */
.nuDropdown_header {
    background: #f8f9fa !important;
    cursor: default !important;
    padding: 10px 15px !important;
    border-bottom: 1px solid #e5e5e5 !important;
}

.nuDropdown_header:hover {
    background: #f8f9fa !important;
}

/* Mobile - profil w menu hamburger (desktop_navbar) */
@media (max-width: 1199px) {
    #header_menu > nav#desktop_navbar > ul > li.right {
        display: block;
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    #header_menu > nav#desktop_navbar > ul > li.right > .btn-group {
        width: 100%;
    }
    
    #header_menu > nav#desktop_navbar > ul > li.right > .btn-group > a {
        width: 100%;
        justify-content: flex-start;
    }
    
    /* Ukryj chevron w mobile */
    #header_menu > nav#desktop_navbar > ul > li.right > .btn-group > a > i.mdi-chevron-down {
        display: none;
    }
}

/* Desktop - zwiększ margin dla ikony account w profilu */
@media (min-width: 1200px) {
    #header_menu > nav#desktop_navbar > ul > li.right > .btn-group > a > i.mdi-account-circle {
        margin-right: 4px;
    }
}