.hpfc-header-anchor { position: relative !important; }

.hpfc-wrap {
    position: absolute;
    top: calc(50% + var(--hpfc-y, 0px));
    right: var(--hpfc-right, 24px);
    transform: translateY(-50%);
    z-index: 50;
    line-height: 1;
    display: flex;
    align-items: center;
    gap: var(--hpfc-icon-gap, 5px);
    white-space: nowrap;
}

.hpfc-cart,
.hpfc-account {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: calc(var(--hpfc-size, 30px) + 14px);
    height: calc(var(--hpfc-size, 30px) + 14px);
    text-decoration: none !important;
    transition: transform .18s ease, opacity .18s ease;
    box-sizing: border-box;
}

.hpfc-cart:hover,
.hpfc-account:hover { transform: scale(1.08); }

.hpfc-icon {
    width: var(--hpfc-size, 30px);
    height: var(--hpfc-size, 30px);
    display: block;
}

.hpfc-icon svg { width: 100%; height: 100%; display: block; overflow: visible; }
.hpfc-icon path,
.hpfc-icon circle {
    fill: none;
    stroke: var(--hpfc-color, #39F20D);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.hpfc-count {
    position: absolute;
    top: -2px;
    right: -3px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--hpfc-badge-bg, #fff);
    color: var(--hpfc-badge-color, #111);
    font: 700 11px/1 Arial, sans-serif;
    box-sizing: border-box;
    box-shadow: 0 1px 5px rgba(0,0,0,.25);
}

.hpfc-cart.hpfc-empty-hidden { display: none; }

/* Only used if no usable header can be detected. */
.hpfc-wrap.hpfc-fallback {
    position: absolute;
    top: 160px;
    right: var(--hpfc-right, 24px);
    transform: none;
}


/* v1.4 — true mobile header anchoring.
   The icon group becomes a real sibling immediately before the hamburger button. */
@media (max-width: 782px) {
    .hpfc-wrap.hpfc-mobile-inline {
        position: relative !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        bottom: auto !important;
        transform: none !important;
        display: inline-flex !important;
        width: auto !important;
        height: auto !important;
        margin: 0 var(--hpfc-mobile-menu-gap, 8px) 0 0 !important;
        padding: 0 !important;
        z-index: 60;
        vertical-align: middle;
        flex: 0 0 auto;
    }

    .hpfc-wrap.hpfc-mobile-inline .hpfc-cart,
    .hpfc-wrap.hpfc-mobile-inline .hpfc-account {
        flex: 0 0 auto;
    }
}


/* v1.5 — Event Management Pro exact mobile header integration */
@media (max-width: 782px) {
    /* The actual theme structure is:
       .innermenubox > [our icons] + .toggle-nav.mobile-menu */
    #sticky-menu .innermenubox:has(.hpfc-theme-mobile-inline) {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
    }

    .hpfc-wrap.hpfc-theme-mobile-inline {
        position: relative !important;
        inset: auto !important;
        top: auto !important;
        right: auto !important;
        left: auto !important;
        bottom: auto !important;
        transform: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        height: auto !important;
        margin: 0 var(--hpfc-mobile-menu-gap, 8px) 0 0 !important;
        padding: 0 !important;
        z-index: 99 !important;
        flex: 0 0 auto !important;
        white-space: nowrap !important;
    }

    #sticky-menu .innermenubox:has(.hpfc-theme-mobile-inline) .toggle-nav.mobile-menu {
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #sticky-menu .innermenubox:has(.hpfc-theme-mobile-inline) #open_nav {
        position: relative !important;
        float: none !important;
        margin: 0 !important;
    }
}
