/* ============================================================
   PYTHON COACH — Shared Nav & Footer Components
   Component A: .pc-nav  (primary nav, sticky)
   Component B: #ln-footer (shared footer)
   Depends on v2-base.css design tokens (or equivalent inline
   variable definitions) being loaded first.
   ============================================================ */

/* ── Component A: Primary Nav ────────────────────────────── */
.pc-nav {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--topbar-h);
    padding: 0 24px;
    padding-top: env(safe-area-inset-top, 0px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--bg);
    border-bottom: 2px solid var(--border);
    z-index: 200;
}

.pc-nav__logo {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 17px;
    font-weight: 900;
    color: var(--text);
    letter-spacing: -0.01em;
    text-decoration: none;
}

.pc-nav__logo:hover { text-decoration: none; }

/* Text portion of logo — targeted by mobile rules on app-shell pages */
.pc-nav__logo-text { display: inline; }

.pc-nav__links {
    display: flex;
    align-items: center;
    gap: 20px;
}

.pc-nav__links a {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
}

.pc-nav__links a:hover { color: var(--text); }

/* Plain text secondary link — sits between links and the CTA button */
.pc-nav__login {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--text-secondary);
    text-decoration: none;
    white-space: nowrap;
}

.pc-nav__login:hover { color: var(--text); }

.pc-nav__cta {
    display: inline-flex;
    align-items: center;
    padding: 8px 18px;
    font-family: var(--font);
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--text);
    background: transparent;
    border: 2px solid var(--primary);
    border-radius: var(--radius-sm);
    text-decoration: none;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}

.pc-nav__cta:hover {
    color: var(--primary);
    background: var(--surface);
}

/* ── Component B: Footer ─────────────────────────────────── */
#ln-footer {
    border-top: 2px solid var(--border);
    padding: 24px;
    text-align: center;
    font-size: 0.8125rem;
    color: var(--text-muted);
}

#ln-footer a {
    color: var(--text-secondary);
    text-decoration: underline;
    text-underline-offset: 2px;
}

#ln-footer a:hover { color: var(--primary); }

@media (min-width: 1024px) {
    #ln-footer { padding: 28px 48px; }
}