/* Wspólny pasek nawigacyjny serwisu (lib/nav.php) — PLAN-album-b2c.md, Etapy 2b i 3a.
   Tu mieszka też WYBÓR JĘZYKA Z FLAGAMI (fc_lang_menu), wspólny dla paska i panelu — dlatego
   strony panelu też wczytują ten arkusz.
   ---------------------------------------------------------------------------------------
   OSOBNY ARKUSZ, a nie blok w site.css, bo pasek stoi na stronach o DWÓCH różnych arkuszach:
   publicznych (site.css) i logowania/rejestracji (account/account.css). Wpisanie tych reguł
   do obu skończyłoby się rozjechaniem wyglądu przy pierwszej zmianie — pasek ma wyglądać
   identycznie wszędzie, więc ma jedno źródło. Kosztem jest jedno dodatkowe, drobne żądanie.

   Kolory bierze ze zmiennych motywu (--fg, --accent, --muted, --line), które definiują OBA
   arkusze pod tymi samymi nazwami; dlatego ten plik nie ustala własnej palety.

   Przyklejony do góry, żeby wejście do usług i logowanie były w zasięgu na całej długości
   strony. Na telefonie pozycje usług i wybór języka chowają się pod przyciskiem menu — do
   2026-09-11 po prostu ZNIKAŁY, więc z telefonu nie dało się przejść do Albumu ani do
   dokumentów (zgłoszenie TM). Rozwijanie robi pole wyboru, nie skrypt: pasek stoi także
   na stronach, które żadnego skryptu nie wczytują. */

.fc-nav{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.95);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.fc-nav-in{max-width:960px;margin:0 auto;padding:9px 18px;display:flex;align-items:center;gap:14px}
.fc-nav-logo{display:block;flex:none}
.fc-nav-logo img{height:26px;display:block}
.fc-nav-links{display:flex;gap:18px;flex:1;flex-wrap:wrap}
.fc-nav-links a{color:var(--muted);text-decoration:none;font-size:14.5px;padding:5px 0;
  border-bottom:2px solid transparent;white-space:nowrap}
.fc-nav-links a:hover{color:var(--fg)}
.fc-nav-links a.on{color:var(--fg);font-weight:600;border-bottom-color:var(--accent)}
.fc-nav-login{background:var(--accent);color:#fff;text-decoration:none;font-weight:700;
  font-size:14.5px;padding:9px 16px;border-radius:8px;white-space:nowrap}

/* Strony logowania i rejestracji mają wyśrodkowaną, wąską kolumnę (.auth) i własny odstęp
   od góry. Pasek jest pełnej szerokości, więc odstęp trzeba mu odebrać, inaczej nad paskiem
   zostaje pusty pas. Reguła stoi tutaj, bo dotyczy współistnienia paska z tym układem. */
.fc-nav + .auth{padding-top:22px}

/* Przycisk menu: na szerokim ekranie go nie ma, bo wszystkie pozycje są widoczne.
   Pole wyboru zostaje w drzewie (nie `display:none`), żeby dało się do niego dojść
   klawiszem Tab; jest tylko odsunięte poza obraz. */
.fc-nav-tog{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.fc-nav-burger{display:none;flex-direction:column;justify-content:center;gap:4px;
  width:40px;height:36px;padding:8px 8px;border:1px solid var(--line);border-radius:9px;
  background:#fff;cursor:pointer;flex:none}
.fc-nav-burger span{display:block;height:2px;background:var(--fg);border-radius:2px}
.fc-nav-tog:focus-visible+.fc-nav-burger{outline:2px solid var(--accent);outline-offset:2px}

@media(max-width:820px){
  .fc-nav-in{flex-wrap:wrap;gap:10px;padding:8px 14px}
  .fc-nav-logo{order:1;margin-right:auto}
  .fc-nav-logo img{height:23px}
  .fc-nav-login{order:2;padding:8px 12px;font-size:13.5px}
  .fc-nav-burger{order:3;display:flex}

  /* Pozycje i język schodzą pod pasek, każde na całą szerokość — palcem trafia się
     w wiersz, nie w odnośnik wielkości słowa. */
  .fc-nav-links{order:4;flex-basis:100%;display:none;flex-direction:column;gap:0;
    padding:2px 0 6px}
  .fc-nav-links a{padding:12px 2px;font-size:15.5px;border-bottom:1px solid var(--line)}
  .fc-nav-links a:last-child{border-bottom:0}
  .fc-nav-links a.on{border-bottom-color:var(--line);color:var(--accent)}
  /* `.fc-nav-in` w selektorze celowo: ogólna reguła `.fc-lang{flex:none}` stoi niżej w pliku
     i przy tej samej szczegółowości zwężałaby wybór języka do szerokości napisu. */
  .fc-nav-in .fc-nav-lang{order:5;flex:1 1 100%;display:none;margin-bottom:8px}
  .fc-nav-in .fc-nav-lang>summary{justify-content:flex-start}
  .fc-nav-in .fc-nav-lang .fc-lang-list{position:static;box-shadow:none;margin-top:6px;min-width:0}

  .fc-nav-tog:checked~.fc-nav-links{display:flex}
  .fc-nav-in .fc-nav-tog:checked~.fc-nav-lang{display:block}
}

/* ── Wybór języka z flagami (fc_lang_menu w lib/nav.php) ─────────────────────────────────
   `<details>`, a nie `<select>`: systemowa lista nie pokaże obrazka w opcji, a emoji flag
   Windows nie rysuje (zamiast flagi widać „PL"). Rozwija się bez skryptu. */
.fc-lang{position:relative;flex:none}
.fc-lang>summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;
  border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:14px;
  background:#fff;color:var(--fg);white-space:nowrap;user-select:none}
.fc-lang>summary::-webkit-details-marker{display:none}
.fc-lang>summary::after{content:"";width:6px;height:6px;margin-left:2px;opacity:.55;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:translateY(-2px) rotate(45deg)}
.fc-lang[open]>summary::after{transform:translateY(1px) rotate(-135deg)}
.fc-lang>summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.fc-lang-list{position:absolute;right:0;top:calc(100% + 6px);z-index:70;display:grid;gap:1px;
  min-width:196px;max-height:70vh;overflow:auto;padding:6px;background:#fff;
  border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(20,24,31,.14)}
.fc-lang-list a{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:7px;
  color:var(--fg);text-decoration:none;font-size:14px;white-space:nowrap}
.fc-lang-list a:hover{background:rgba(20,24,31,.05)}
.fc-lang-list a.on{font-weight:700}
.fc-lang-list a.on::after{content:"";margin-left:auto;width:5px;height:9px;
  border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg)}

/* Flaga: stały rozmiar niezależnie od proporcji flagi (Grecja 3:2, Chorwacja 2:1) i cienka
   obwódka, bez której biało-czerwona flaga ginie na białym tle. */
.fc-flag{display:inline-block;width:20px;height:14px;flex:none;object-fit:cover;
  border-radius:2px;box-shadow:0 0 0 1px rgba(20,24,31,.16);vertical-align:-2px}