/* =================================================
   HEADER – AURORASHOP SIGNATURE
   (zmienne wspólne w base/variables.css)
================================================= */

/* --- TOP BAR --- */
.site-top-bar {
    background-color: var(--aurora-topbar-bg, var(--aurora-navy));
    color: #ffffff;
    font-family: var(--aurora-font-main);
    font-size: 13px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.top-bar-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.top-bar-item { margin-right: 20px; }
.top-bar-item i { color: var(--aurora-accent); margin-right: 5px; }
.top-bar-item a { color: #ffffff; text-decoration: none; transition: opacity .3s; }
.top-bar-item a:hover { opacity: .8; }

.top-bar-center .promo-text {
    letter-spacing: .5px;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 500;
}

.top-bar-socials a {
    color: #ffffff;
    margin-left: 15px;
    font-size: 14px;
    transition: color .3s;
}
.top-bar-socials a:hover { color: var(--aurora-accent); }

/* --- SITE HEADER --- */
.site-header {
    position: sticky;
    top: 0;
    z-index: var(--aurora-z-header);
    background: var(--aurora-header-bg, #ffffff);
    border-bottom: 1px solid rgba(0, 0, 0, .05);
    transition: var(--aurora-transition);
}

.site-header-inner {
    display: flex;
    align-items: center;
    height: 80px;
    padding: 0 24px;
    max-width: 1440px;
    margin: 0 auto;
}

/* --- LOGO --- */
.site-logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    z-index: 1001;
    transition: var(--aurora-transition);
}

.site-logo .custom-logo-link {
    display: block;
    line-height: 0;
    transition: var(--aurora-transition);
}

.site-logo img.custom-logo {
    /* Szerokość ustawiana z Customizera (Nagłówek -> Logo) przez wstrzyknięty
       <style id="aurora-header-logo-size"> w wp_head — tu tylko bazowe zachowanie. */
    height: auto;
    width: auto;
    object-fit: contain;
    transition: all .5s cubic-bezier(.2, 1, .3, 1);
}

.site-header.is-sticky .custom-logo { transform: scale(.88); }

.site-logo .custom-logo-link:hover img.custom-logo {
    transform: scale(1.05);
    filter: brightness(1.05);
}

.logo-text {
    font-family: var(--aurora-font-heading);
    font-weight: 800;
    font-size: 1.5rem;
    color: var(--aurora-dark);
    text-decoration: none;
    letter-spacing: -1px;
    line-height: 1;
    display: inline-block;
    transition: var(--aurora-transition);
}

.logo-text span { color: var(--aurora-indigo); transition: var(--aurora-transition); }
.logo-text:hover { color: var(--aurora-indigo); }
.logo-text:hover span { color: var(--aurora-dark); }
.site-header.is-sticky .logo-text { font-size: 1.3rem; }

@media (max-width: 768px) {
    .logo-text { font-size: 1.3rem; }

    /* Logo prawdziwie wycentrowane między hamburgerem a ikonami akcji
       (siatka 3-kolumnowa: hamburger | logo | akcje) — czytelniejszy układ
       niż logo "przyklejone" tuż przy hamburgerze, niewyśrodkowane. */
    .site-header-inner {
        height: 68px;
        display: grid;
        grid-template-columns: auto 1fr auto;
    }
    .menu-toggle { margin-right: 0; }
    .site-logo { justify-content: center; }

    /* Ulubione ma już swoje miejsce w dolnym menu mobilnym (mobile-bottom-nav),
       więc w nagłówku na mobile chowamy je, by nie duplikować funkcji
       i nie przeładowywać paska akcji ikonami. */
    .header-actions .aurora-wishlist-link { display: none; }
    .header-actions { gap: 4px; }
}

/* --- HAMBURGER --- */
.menu-toggle {
    display: block;
    background: transparent;
    border: none;
    padding: 10px;
    cursor: pointer;
    z-index: 2100;
    margin-right: 15px;
}

@media (min-width: 1100px) { .menu-toggle { display: none; } }

.hamburger-box { width: 24px; height: 18px; display: inline-block; position: relative; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 100%;
    height: 2px;
    background-color: var(--aurora-dark);
    position: absolute;
    transition: var(--aurora-transition);
}
.hamburger-inner { top: 50%; transform: translateY(-50%); }
.hamburger-inner::before { content: ""; top: -8px; left: 0; }
.hamburger-inner::after { content: ""; bottom: -8px; left: 0; }

body.menu-open .hamburger-inner { background-color: transparent; }
body.menu-open .hamburger-inner::before { transform: translateY(8px) rotate(45deg); }
body.menu-open .hamburger-inner::after { transform: translateY(-8px) rotate(-45deg); }

/* --- DESKTOP NAVIGATION + DROPDOWN --- */
.main-navigation-desktop { display: none; margin-left: 60px; }

.main-menu-list, .sub-menu, .main-menu-list li {
    list-style: none !important;
}

@media (min-width: 1100px) {
    .main-navigation-desktop { display: block; }

    .main-menu-list {
        display: flex;
        gap: 35px;
        margin: 0;
        padding: 0;
    }

    .main-menu-list a {
        text-decoration: none;
        color: var(--aurora-dark);
        font-family: var(--aurora-font-main);
        font-weight: 500;
        font-size: .95rem;
        transition: var(--aurora-transition);
        position: relative;
    }

    .main-menu-list a:hover { color: var(--aurora-indigo); }

    .main-menu-list .menu-item-has-children { position: relative; }

    .main-menu-list .menu-item-has-children > a {
        display: inline-flex !important;
        align-items: center !important;
        gap: 8px;
        white-space: nowrap;
    }

    .main-menu-list .menu-item-has-children > a::after {
        content: '';
        width: 5px;
        height: 5px;
        border-right: 1.5px solid currentColor;
        border-bottom: 1.5px solid currentColor;
        transform: rotate(45deg);
        transition: transform .3s ease;
        opacity: .7;
        margin-top: -3px;
        display: inline-block;
    }

    .main-menu-list .menu-item-has-children:hover > a::after {
        transform: rotate(-135deg);
        margin-top: 3px;
        color: var(--aurora-indigo);
    }

    .main-menu-list .sub-menu {
        position: absolute;
        top: 100%;
        left: 0;
        min-width: 220px;
        background: #ffffff;
        margin: 0;
        padding: 15px 0;
        border-radius: 10px;
        box-shadow: var(--aurora-shadow-lg);
        border: 1px solid rgba(0, 0, 0, .05);
        opacity: 0;
        visibility: hidden;
        transform: translateY(10px);
        transition: var(--aurora-transition);
        z-index: 1200;
    }

    .main-menu-list .menu-item-has-children:hover > .sub-menu {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .main-menu-list .sub-menu li { width: 100%; margin: 0; padding: 0; }

    .main-menu-list .sub-menu a {
        display: block !important;
        padding: 10px 20px !important;
        font-size: 14px !important;
        color: var(--aurora-dark) !important;
        font-weight: 500;
    }

    .main-menu-list .sub-menu a:hover {
        background-color: var(--aurora-bg-light);
        color: var(--aurora-indigo) !important;
        padding-left: 25px !important;
    }

    .main-menu-list .sub-menu a::after { display: none !important; }
}

/* --- HEADER ACTIONS --- */
.header-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
}

.action-btn {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: var(--aurora-transition);
    color: var(--aurora-dark);
    text-decoration: none;
    position: relative;
    background: transparent;
    border: none;
    cursor: pointer;
}

.action-btn:hover {
    background: var(--aurora-bg-light);
    color: var(--aurora-indigo);
    transform: translateY(-2px);
}

.action-btn i { font-size: 1.15rem; }

.badge-count {
    position: absolute;
    top: -4px;
    right: -4px;
    background: var(--aurora-gradient);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    min-width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #fff;
    box-shadow: 0 4px 10px rgba(99, 102, 241, .3);
}

.aurora-account-trigger { position: relative; }

.user-status-dot {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 10px;
    height: 10px;
    background: var(--aurora-green);
    border: 2px solid #fff;
    border-radius: 50%;
}

/* --- ACCOUNT DROPDOWN --- */
.aurora-account-wrapper { position: relative; }

.aurora-account-dropdown {
    position: absolute;
    top: 100%;
    right: 0;
    width: 280px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: var(--aurora-shadow-lg);
    padding: 20px;
    margin-top: 15px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: var(--aurora-transition-smooth);
    z-index: 1001;
}

@media (min-width: 1100px) {
    .aurora-account-wrapper:hover .aurora-account-dropdown {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }
}

.dropdown-header { margin-bottom: 15px; }
.dropdown-welcome { font-size: .95rem; color: var(--aurora-dark); }

.dropdown-links { list-style: none; padding: 0; margin: 0; }

.dropdown-links li a {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    color: var(--aurora-dark);
    text-decoration: none;
    font-size: .95rem;
    transition: color .2s;
}

.dropdown-links li a i { width: 16px; color: var(--aurora-accent); font-size: 1rem; }
.dropdown-links li a:hover { color: var(--aurora-indigo); }

.logout-link { border-top: 1px solid #f1f5f9; margin-top: 10px; }

.guest-msg { font-size: .85rem; color: var(--aurora-slate); margin-bottom: 15px; line-height: 1.4; }

.aurora-btn-dropdown {
    display: block;
    background: var(--aurora-accent);
    color: #fff;
    text-align: center;
    padding: 12px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 700;
    font-size: .9rem;
}

.register-hint { font-size: .8rem; margin-top: 12px; text-align: center; color: var(--aurora-slate-light); }
.register-hint a { color: var(--aurora-dark); font-weight: 700; text-decoration: none; }

/* --- SEARCH OVERLAY --- */
.search-bar-overlay {
    position: fixed;
    inset: 0;
    z-index: 3000;
    background: var(--aurora-glass);
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: var(--aurora-transition);
}

.search-bar-overlay.is-active { opacity: 1; visibility: visible; }

.search-field-large {
    width: 100%;
    border: none;
    background: transparent;
    font-family: var(--aurora-font-heading);
    font-size: 3rem;
    font-weight: 800;
    color: var(--aurora-dark);
    outline: none;
    text-align: center;
}

.search-field-large::placeholder { color: #cbd5e1; }

.close-search-overlay {
    position: absolute;
    top: 40px;
    right: 40px;
    background: none;
    border: none;
    font-size: 2.5rem;
    cursor: pointer;
    color: var(--aurora-dark);
    transition: var(--aurora-transition);
}

.close-search-overlay:hover {
    transform: rotate(90deg) scale(1.1);
    color: var(--aurora-indigo);
}

body.search-open,
body.menu-open {
    overflow: hidden;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
    .hide-tablet { display: none; }
}

@media (max-width: 768px) {
    .hide-mobile { display: none; }
    .top-bar-inner { justify-content: center; }
    .top-bar-right { display: none; }
    .top-bar-item { margin-right: 0; }
}