/* Pisaczek / NivaVera — Języki E1: przełącznik, pasek propozycji, strona „Język i format” (wg makiety 24.09).
 * Marker: PNP_PISACZEK_I18N_CSS_V1 */
:root {
  --i18n-bg: #f4f5f8; --i18n-card: #fff; --i18n-line: #e1e5ef; --i18n-ink: #1b1a2e; --i18n-muted: #747b88; --i18n-soft: #eef0f6;
  --i18n-navy: #171433; --i18n-gold: #d9b45a; --i18n-gold-ink: #7a5d12; --i18n-gold-soft: #fbf3dc;
  --i18n-ok: #2e8b57; --i18n-ok-soft: #e6f4ec; --i18n-bad: #c2414b; --i18n-bad-soft: #fbe7e9;
  --i18n-shadow: 0 1px 2px rgba(23,20,51,.06), 0 8px 24px rgba(23,20,51,.06);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --i18n-bg: #12111c; --i18n-card: #1b1a29; --i18n-line: #2b2a3d; --i18n-ink: #ececf3; --i18n-muted: #9a9db0; --i18n-soft: #22213a;
    --i18n-navy: #0e0c1f; --i18n-gold-ink: #e7cf86; --i18n-gold-soft: #2c2614; --i18n-ok-soft: #173224; --i18n-bad-soft: #3a1d21;
    --i18n-shadow: 0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.35);
  }
}
.pnp-lang { background: var(--i18n-card); border: 1px solid var(--i18n-line); border-radius: 12px; box-shadow: var(--i18n-shadow); padding: 8px; max-width: 300px; display: flex; flex-direction: column; gap: 2px; color: var(--i18n-ink); }
.pnp-lang__h { margin: 4px 8px; font-size: 10.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--i18n-muted); font-weight: 700; }
.pnp-lang__opt { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 8px; text-align: left; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.pnp-lang__opt:hover { background: var(--i18n-soft); }
.pnp-lang__opt[aria-current="true"] { background: var(--i18n-navy); color: #fff; cursor: default; }
.pnp-lang__opt:focus-visible, .pnp-langbtn:focus-visible, .pnp-langbar button:focus-visible { outline: 2px solid var(--i18n-gold); outline-offset: 1px; }
.pnp-lang__fl { font-size: 16px; line-height: 1; }
.pnp-lang__sp { margin-left: auto; font-size: 11px; color: var(--i18n-muted); }
.pnp-lang__opt[aria-current="true"] .pnp-lang__sp { color: #cfc9ee; }
.pnp-lang__msg { margin: 8px 2px 0; font-size: 13px; min-height: 1.2em; color: var(--i18n-muted); }
.pnp-lang__msg[data-state="ok"] { color: var(--i18n-ok); }
.pnp-lang__msg[data-state="error"] { color: var(--i18n-bad); }
.pnp-langwrap { position: relative; display: inline-block; }
.pnp-langbtn { display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--i18n-line); border-radius: 9px; padding: 6px 11px; font: 600 12.5px/1.2 inherit; background: var(--i18n-card); color: var(--i18n-ink); cursor: pointer; }
.pnp-lang-pop { position: absolute; right: 0; top: calc(100% + 6px); z-index: 50; }
.pnp-langbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 16px; background: var(--i18n-gold-soft); color: var(--i18n-gold-ink); border-bottom: 1px solid var(--i18n-line); font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.pnp-langbar__q { flex: 1 1 auto; font-weight: 600; }
.pnp-langbar button { border-radius: 9px; padding: 6px 12px; font: 600 13px/1.2 inherit; cursor: pointer; border: 1px solid var(--i18n-line); }
.pnp-langbar__yes { background: var(--i18n-navy); color: #fff; border-color: var(--i18n-navy); }
.pnp-langbar__no { background: var(--i18n-card); color: var(--i18n-ink); }

/* rozwijana lista języków pod „PL ▾” obok logowania (notes_page.php, data-pnp-langtop / data-pnp-lang-panel) */
[data-pnp-lang-panel] { margin: 0 0 6px; --i18n-card: transparent; --i18n-soft: #eef0f6; --i18n-ink: #1b1a2e; --i18n-muted: #747b88; --i18n-line: #e1e5ef; } /* okienko ma zawsze jasne tło */
[data-pnp-lang-panel] .pnp-lang { box-shadow: none; max-width: none; padding: 0; border: 0; border-radius: 10px; }
[data-pnp-lang-panel] .pnp-lang__h { display: none; }
[data-pnp-lang-panel] .pnp-lang__msg { margin: 4px 2px 0; min-height: 0; font-size: 12px; }
[data-pnp-langtop-btn]:hover, [data-pnp-langtop-btn][aria-expanded="true"] { background: #fbf3dc !important; color: #7a5d12 !important; }
[data-pnp-langtop-btn]:focus-visible { outline: 2px solid var(--i18n-gold); outline-offset: 1px; }
@media (max-width: 560px) { /* telefon: okienko na całą szerokość (pozycję ustawia notes_page), większe pola pod palec */
  [data-pnp-lang-panel] .pnp-lang__opt { padding: 13px 12px; font-size: 15px; }
  [data-pnp-lang-panel] { max-height: calc(100vh - 100px); overflow-y: auto; }
}

/* strona „Język i format” (public/jezyk.php) */
.i18n-page { margin: 0; background: var(--i18n-bg); color: var(--i18n-ink); font: 14px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
.i18n-wrap { max-width: 1000px; margin: 0 auto; padding: 16px; display: flex; flex-direction: column; gap: 14px; }
.i18n-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.i18n-bar h1 { margin: 0; font-size: 20px; }
.i18n-bar .sp { flex: 1; }
.i18n-hint { font-size: 12px; color: var(--i18n-muted); }
.i18n-two { display: grid; grid-template-columns: 1.1fr 1fr; gap: 14px; }
@media (max-width: 720px) { .i18n-two { grid-template-columns: 1fr; } }
.i18n-card { background: var(--i18n-card); border: 1px solid var(--i18n-line); border-radius: 12px; padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.i18n-card h3 { margin: 0; font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--i18n-muted); }
.i18n-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 13.5px; }
.i18n-row .lbl { color: var(--i18n-muted); min-width: 120px; font-size: 12px; }
.i18n-chip { background: var(--i18n-soft); border-radius: 8px; padding: 5px 10px; font-weight: 600; overflow-wrap: anywhere; }
.i18n-back { color: var(--i18n-gold-ink); font-weight: 600; text-decoration: none; }
/* PNP_PISACZEK_I18N_LANG_SCROLL_V1 (27.09): lista języków = mały panel przewijany (ok. 5 pozycji), cienki złoty pasek */
.pnp-lang__scroll { display: flex; flex-direction: column; gap: 2px; max-height: 206px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: var(--i18n-gold, #c9a95a) transparent; padding-right: 3px; }
.pnp-lang__scroll::-webkit-scrollbar { width: 6px; } .pnp-lang__scroll::-webkit-scrollbar-thumb { background: var(--i18n-gold, #c9a95a); border-radius: 6px; } .pnp-lang__scroll::-webkit-scrollbar-track { background: transparent; }