/* ==========================================================================
   MISSION 66 -- W3-nav (R920 global chrome X-3/X-4/X-5, discovery S001-S003,
   profiles S007/S008). Top nav, role-space sidebar, mobile menu, overflow
   guards, catalog sections and card meta. Loaded after site.css.
   ========================================================================== */

/* ---------- Top nav (R920: logo · 3 links · עברית/EN · החשבון שלי) ---------- */
.pb-logo-mark {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; margin-inline-end: 8px;
    border-radius: 9px; background: var(--accent); color: var(--btn-contrast-text);
    font-size: 0.85rem; font-weight: 800; align-self: center;
}
.pb-topnav { gap: var(--space-5, 24px); align-items: center; }
.pb-topnav a { color: var(--text-secondary); font-weight: 600; font-size: 0.94rem; white-space: nowrap; }
.pb-topnav a:hover, .pb-topnav a.pb-nav-active { color: var(--text-primary); }

.pb-langswitch { display: inline-flex; align-items: center; gap: 4px; margin: 0; white-space: nowrap; }
.pb-langswitch button {
    background: none; border: none; padding: 4px 2px; cursor: pointer;
    font: inherit; font-size: 0.9rem; color: var(--text-secondary);
}
.pb-langswitch button.pb-langswitch-active { color: var(--text-primary); font-weight: 700; }
.pb-langswitch span { color: var(--text-secondary); }

.pb-account-btn { white-space: nowrap; }
.pb-account-trigger.pb-account-btn {
    border: 1px solid var(--pb-border); padding: 3px 12px 3px 4px; font-weight: 600; font-size: 0.9rem;
}
.pb-account-label { color: var(--text-primary); }

.pb-menu-bars, .pb-menu-bars::before, .pb-menu-bars::after {
    display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--text-primary); position: relative; content: "";
}
.pb-menu-bars::before { position: absolute; top: -6px; }
.pb-menu-bars::after { position: absolute; top: 6px; }

.pb-topmenu { border-top: 1px solid var(--pb-border); background: var(--pb-surface); }
.pb-topmenu nav { display: flex; flex-direction: column; padding-block: 8px; }
.pb-topmenu nav > a { padding: 12px 0; font-weight: 600; color: var(--text-primary); border-bottom: 1px solid var(--pb-border); }
.pb-topmenu nav > a.pb-nav-active { color: var(--pb-action-text); }
.pb-topmenu .pb-langswitch { padding: 12px 0; }

/* Wide = the full R920 top nav; narrow = logo + account + menu toggle. */
@media (max-width: 1199px) { .pb-nav-wide-only { display: none !important; } }
@media (min-width: 1200px) { .pb-nav-narrow-only { display: none !important; } }

/* ---------- Role-space sidebar (מרחב מדפיס / יוצר / ניהול) ---------- */
.pb-space-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 28px; align-items: start; }
.pb-space-content { min-width: 0; }
.pb-space-toggle { display: none; }
.pb-space-sidebar {
    position: sticky; top: calc(var(--nav-h, 64px) + 16px);
    border-inline-end: 1px solid var(--pb-border); padding-inline-end: 16px;
    display: flex; flex-direction: column; gap: 6px;
}
.pb-space-title { font-weight: 800; font-size: 1.05rem; margin-bottom: 8px; color: var(--text-primary); }
.pb-space-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pb-space-link, .pb-space-aux {
    display: block; padding: 11px 14px; border-radius: 10px;
    color: var(--text-primary); font-weight: 600; font-size: 0.93rem;
    border-inline-start: 3px solid transparent;
}
.pb-space-link:hover, .pb-space-aux:hover { background: var(--pb-surface-subtle); color: var(--text-primary); }
.pb-space-link-active {
    background: var(--pb-brand-soft);
    border-inline-start-color: transparent; border-inline-end: 3px solid var(--accent);
}
.pb-space-aux { font-size: 0.85rem; color: var(--text-secondary); margin-top: 6px; }
.pb-space-footer { margin-top: 24px; font-size: 0.8rem; color: var(--text-secondary); display: flex; flex-direction: column; gap: 2px; }

@media (max-width: 767px) {
    .pb-space-layout { display: block; }
    .pb-space-toggle { display: inline-flex; margin-bottom: 12px; max-width: 100%; }
    .pb-space-sidebar { display: none; position: static; border-inline-end: none; padding-inline-end: 0;
        border: 1px solid var(--pb-border); border-radius: 14px; padding: 12px; margin-bottom: 16px; background: var(--pb-surface); }
    .pb-space-layout.pb-space-open .pb-space-sidebar { display: flex; }
    .pb-space-footer { margin-top: 10px; }
}

/* ---------- Mobile overflow guards (R920 X-5: no horizontal scroll at 390px) ---------- */
.pb-main { min-width: 0; }
.pb-main img, .pb-main video, .pb-main iframe { max-width: 100%; }
@media (max-width: 767px) {
    .pb-header-row { gap: 10px; }
    .pb-header-end { gap: 8px; min-width: 0; }
    .pb-logo { font-size: 1.05rem; }
    .pb-main { overflow-wrap: anywhere; }
    /* inline flex rows of buttons (e.g. the creator dashboard action row) wrap instead of overflowing */
    .pb-main [style*="display:flex"]:not([style*="overflow"]):not([style*="nowrap"]),
    .pb-main [style*="display: flex"]:not([style*="overflow"]):not([style*="nowrap"]) { flex-wrap: wrap; }
    .pb-main table { display: block; max-width: 100%; overflow-x: auto; }
    .pb-main pre { max-width: 100%; overflow-x: auto; }
}

/* ---------- Discovery S001-S003 ---------- */
.pb-disc-head { margin-bottom: 18px; }
.pb-disc-head h1 { margin: 4px 0 6px; }
.pb-disc-crumb { font-size: 0.82rem; color: var(--text-secondary); }
.pb-disc-lead { color: var(--text-secondary); margin: 0; }
.pb-disc-hero {
    display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); border-radius: 16px; overflow: hidden;
    background: var(--pb-brand-soft); margin-bottom: 18px; min-height: 180px;
}
.pb-disc-hero-text { padding: 28px; display: flex; flex-direction: column; justify-content: center; }
.pb-disc-hero-text h2 { font-size: 1.7rem; margin: 0 0 10px; }
.pb-disc-hero-text p { margin: 0 0 6px; }
.pb-disc-hero-media { background: var(--pb-surface-subtle); display: flex; align-items: center; justify-content: center; min-height: 180px; }
.pb-disc-hero-media img { width: 100%; height: 100%; object-fit: cover; }
.pb-disc-section { background: var(--pb-surface); border: 1px solid var(--pb-border); border-radius: 16px; padding: 18px 20px; margin-bottom: 14px; }
.pb-disc-section > h2 { font-size: 1.1rem; margin: 0 0 12px; }
.pb-disc-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.pb-disc-field label, .pb-disc-field .pb-disc-label { display: block; font-weight: 700; font-size: 0.85rem; margin-bottom: 6px; }
.pb-disc-hint { font-size: 0.78rem; color: var(--text-secondary); margin-top: 4px; }
.pb-disc-route { display: flex; flex-wrap: wrap; gap: 8px; }
.pb-disc-route label {
    display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border: 1px solid var(--pb-border);
    border-radius: 999px; cursor: pointer; font-size: 0.9rem; font-weight: 600;
}
.pb-disc-route input:checked + span { color: var(--pb-action-text); }
.pb-disc-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.pb-disc-steps li { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.pb-disc-step-n {
    flex: 0 0 auto; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
    background: var(--pb-brand-soft); color: var(--pb-action-text); font-weight: 800;
}
.pb-disc-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 18px; }
.pb-disc-curated { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.pb-disc-curated a { display: block; background: var(--pb-brand-soft); border-radius: 12px; padding: 16px; color: var(--text-primary); }
.pb-disc-curated a strong { display: block; font-size: 1.02rem; margin-bottom: 4px; }
.pb-card-meta { font-size: 0.8rem; color: var(--text-secondary); margin-top: 3px; }
.pb-card-meta-price { font-size: 0.82rem; font-weight: 700; color: var(--text-primary); margin-top: 3px; }
.pb-card-meta-print { font-size: 0.8rem; color: var(--pb-action-text); margin-top: 3px; font-weight: 600; }

@media (max-width: 767px) {
    .pb-disc-hero { grid-template-columns: minmax(0, 1fr); }
    .pb-disc-hero-media { min-height: 140px; }
    .pb-disc-hero-text { padding: 18px; }
    .pb-disc-hero-text h2 { font-size: 1.35rem; }
    .pb-disc-fields { grid-template-columns: minmax(0, 1fr); }
    .pb-disc-steps { grid-template-columns: minmax(0, 1fr); }
    .pb-disc-actions .pb-btn { flex: 1 1 100%; justify-content: center; }
}

/* ---------- Profiles S007/S008 ---------- */
.pb-avatar-img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
.pb-profile-langs { font-size: 0.85rem; color: var(--text-secondary); }
.pb-profile-tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; margin-bottom: 14px; }
.pb-profile-tools input[type=text], .pb-profile-tools select { min-width: 0; max-width: 100%; }
.pb-equip-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.pb-equip-list li { border: 1px solid var(--pb-border); border-radius: 12px; padding: 12px; background: var(--pb-surface); }
.pb-equip-list .pb-equip-name { font-weight: 700; }

/* M82 C-02 -- the creator header overflowed at 320/390 (37/82 px) and pushed #pbTopMenuToggle off-screen:
   secondary header items move into the menu at narrow widths, and the header row may never exceed the viewport. */
.pb-header-row { min-width: 0; max-width: 100%; }
.pb-header-end { min-width: 0; }
#pbTopMenuToggle { flex-shrink: 0; }
@media (max-width: 599px) {
    .pb-hdr-secondary { display: none !important; }
    .pb-header-end { gap: 4px; }
}
@media (max-width: 359px) { .pb-logo-word { display: none; } }

/* V20 FIX-01 -- language switcher + account button move into the mobile menu at <=767 (no overflow at 320/390). */
@media (max-width: 767px) {
    .pb-hdr-mobile-hide { display: none !important; }
}
