/* Platform 88.5.3 — Header cleanup: actions, nav alignment, spacing polish */

:root {
    --fe8853-action-size: 2.5rem;
    --fe8853-action-gap: 0.375rem;
}

/* Balanced three-column row — nav must not collide with actions */
.fe885-header__row {
    overflow: hidden;
    column-gap: 0.625rem;
}

.fe885-header__nav {
    overflow: hidden;
    min-width: 0;
    max-width: 100%;
    width: 100%;
}

.fe885-header__actions {
    display: inline-flex;
    align-items: center;
    gap: var(--fe8853-action-gap);
    flex-shrink: 0;
    justify-self: end;
    min-width: max-content;
    position: relative;
    z-index: 6;
    background: var(--fe885-bg);
    padding-left: 0.5rem;
}

/* Unified action control sizing */
.fe885-header__icon-btn,
.fe885-header__action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--fe8853-action-size);
    height: var(--fe8853-action-size);
    min-width: var(--fe8853-action-size);
    min-height: var(--fe8853-action-size);
    padding: 0;
    border: none;
    border-radius: 0.5rem;
    background: transparent;
    color: var(--fe885-muted);
    cursor: pointer;
    text-decoration: none;
    transition: color 0.15s ease, background 0.15s ease;
    box-sizing: border-box;
    line-height: 1;
}

.fe885-header__icon-btn:hover,
.fe885-header__icon-btn:focus-visible,
.fe885-header__action-btn:hover,
.fe885-header__action-btn:focus-visible {
    color: var(--fe885-primary);
    background: var(--fe885-primary-soft);
    outline: none;
}

.fe885-header__icon-btn i,
.fe885-header__action-btn i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1rem;
    height: 1rem;
    font-size: 0.95rem;
    line-height: 1;
}

/* Search — larger hit area, centered icon */
.fe885-header__action-btn--search {
    width: 2.75rem;
    height: 2.75rem;
    min-width: 2.75rem;
    min-height: 2.75rem;
}

/* About text action — same visual weight as icon buttons */
.fe885-header__action-btn--about {
    width: auto;
    min-width: var(--fe8853-action-size);
    padding: 0 0.7rem;
    font-size: 0.8125rem;
    font-weight: 600;
    white-space: nowrap;
    gap: 0.35rem;
}

.fe885-header__action-btn--about.is-active {
    color: var(--fe885-primary);
    background: var(--fe885-primary-soft);
}

/* Primary nav — icon, label, chevron alignment */
.fe885-nav__link,
.fe885-nav__trigger {
    align-items: center;
    vertical-align: middle;
}

.fe885-nav__chev {
    margin-left: 0;
    flex-shrink: 0;
}

.fe885-nav__trigger .fe885-nav__chev {
    margin-left: 0.1rem;
}

/* Profile / avatar */
.fe885-user__trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    height: var(--fe8853-action-size);
    min-height: var(--fe8853-action-size);
    padding: 0.15rem 0.4rem 0.15rem 0.15rem;
    box-sizing: border-box;
}

.fe885-user__trigger .fe885-nav__chev {
    margin-left: 0;
    width: 0.7rem;
    height: 0.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    line-height: 1;
}

.fe885-user__avatar {
    flex-shrink: 0;
}

.fe885-header__login {
    height: var(--fe8853-action-size);
    min-height: var(--fe8853-action-size);
    display: inline-flex;
    align-items: center;
}

/* Laptop — prevent Developers overlapping Search */
@media (min-width: 1024px) and (max-width: 1366px) {
    :root {
        --fe8853-nav-reserve: 16rem;
    }

    .fe885-nav__link,
    .fe885-nav__trigger {
        padding-left: 0.35rem;
        padding-right: 0.35rem;
        gap: 0.3rem;
        font-size: 0.75rem;
    }

    .fe885-nav__icon {
        width: 0.9rem;
        height: 0.9rem;
        font-size: 0.75rem;
    }

    .fe885-header__action-btn--about {
        padding: 0 0.5rem;
        font-size: 0.75rem;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    :root {
        --fe8853-nav-reserve: 15.5rem;
    }
}

@media (min-width: 1920px) {
    :root {
        --fe8853-nav-reserve: 18rem;
    }
}