/* ============================================================
   HEADER NAV — Give pill CTA, 44px controls, dropdown spacing
   Loads after design-system.css on every public page.
   Owner: website brief A (2026-09-24 review: N1, N2, A4).
   ============================================================ */

/* ---------- Give pill (desktop nav, right end) ---------- */
.primary-nav .nav-give {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    min-height: 44px;
    margin-left: 0.5rem;
    padding: 0.55rem 1.15rem;
    border-radius: var(--radius-full, 999px);
    background: var(--color-magenta, #eb008b);
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
    letter-spacing: 0.02em;
    text-decoration: none;
    box-shadow: 0 6px 18px -8px rgba(235, 0, 139, 0.65);
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.primary-nav .nav-give:hover,
.primary-nav .nav-give:focus-visible {
    background: #d2007c;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 10px 22px -8px rgba(235, 0, 139, 0.75);
}
.primary-nav .nav-give:focus-visible {
    outline: 2px solid var(--color-magenta, #eb008b);
    outline-offset: 3px;
}
/* The base nav paints an underline bar under active links; a pill wants none. */
.primary-nav .nav-give.is-active::after { display: none; }
.primary-nav .nav-give svg { flex: none; }

/* ---------- Give pill in the mobile menu quick actions ---------- */
@media (max-width: 960px) {
    .mobile-nav-action--give {
        background: var(--color-magenta, #eb008b);
        color: #fff;
        font-weight: 700;
        box-shadow: 0 8px 24px -10px rgba(235, 0, 139, 0.8);
    }
    .mobile-nav-action--give:hover,
    .mobile-nav-action--give:focus-visible {
        background: #d2007c;
    }
    .mobile-nav-action--give svg { opacity: 1; }
    body.redesign .mobile-nav-action--give { border-color: transparent; }
}

/* ---------- 44px targets (A4) ---------- */
.theme-toggle {
    min-width: 44px;
    min-height: 44px;
    padding: 0.5rem;
}
.user-menu-trigger { min-height: 44px; }
.user-dropdown .dropdown-item {
    min-height: 44px;
    padding-top: 0.6rem;
    padding-bottom: 0.6rem;
}
.primary-nav .nav-dropdown-menu a {
    min-height: 44px;
    display: flex;
    align-items: center;
}
.primary-nav > a:not(.nav-give),
.primary-nav .nav-dropdown-trigger {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
}

/* ---------- Fit: nine items + pill between 961 and ~1180px ---------- */
.primary-nav > a,
.primary-nav .nav-dropdown-trigger { white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1180px) {
    .primary-nav { gap: 0.4rem; }
    .primary-nav > a,
    .primary-nav .nav-dropdown-trigger { font-size: 0.84rem; }
    .primary-nav .nav-give { margin-left: 0.25rem; padding: 0.5rem 0.9rem; }
    .user-nav { margin-left: 0.75rem; }
}