/* =====================================================================
   Fotoceramika.pl — redesign (Claude Design handoff)
   System designu + globalny chrome: top-bar, nagłówek, stopka.
   Wszystko scopowane pod body.fc-redesign — reszta serwisu nietknięta.
   Paleta wg handoffu: granat #1A2A5E, akcent złoty #C9A86A.
   Typografia: DM Serif Display (nagłówki) + Inter (treść).
   ===================================================================== */

.fc-redesign {
  --navy: #1A2A5E;
  --navy-deep: #0C153A;
  --navy-soft: #24367E;
  --ink: #15192B;
  --paper: #FBFAF7;
  --paper-warm: #F4F1EA;
  --line: #E6E2D8;
  --line-dark: rgba(255, 255, 255, 0.14);
  --muted: #6F7280;
  --muted-light: rgba(255, 255, 255, 0.62);
  --accent: #C9A86A;
  --accent-soft: rgba(201, 168, 106, 0.7);

  --serif: "DM Serif Display", Georgia, serif;
  --sans: "Inter", system-ui, -apple-system, sans-serif;

  --top-stack-h: 82px;
}

/* ---------- base / reset (scoped) ---------- */
body.fc-redesign {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* clip (a NIE hidden) — blokuje poziomy scroll, ale nie tworzy kontenera
     przewijania, więc position:sticky (np. aside FAQ) działa poprawnie */
  overflow-x: clip;
  max-width: 100%;
}
/* twarda blokada poziomego scrolla na telefonie (iOS: sam body nie wystarcza) */
html:has(body.fc-redesign) { overflow-x: clip; max-width: 100%; }
.fc-redesign *, .fc-redesign *::before, .fc-redesign *::after { box-sizing: border-box; }
.fc-redesign img { max-width: 100%; display: block; }
.fc-redesign h1, .fc-redesign h2, .fc-redesign h3, .fc-redesign h4, .fc-redesign p, .fc-redesign ul { margin: 0; }
.fc-redesign ul { padding: 0; list-style: none; }
.fc-redesign a { color: inherit; }
.fc-redesign :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }

/* ---------- typography helpers ---------- */
.fc-redesign .serif { font-family: var(--serif); font-weight: 400; letter-spacing: -0.005em; }
.fc-redesign .serif em, .fc-redesign em.serif { font-style: italic; }
.fc-redesign .tag {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--sans); font-size: 11px;
  text-transform: uppercase; letter-spacing: 0.2em; font-weight: 600;
  color: var(--muted);
}
.fc-redesign .dark .tag { color: var(--muted-light); }
.fc-redesign .crest {
  width: 28px; height: 1px; background: currentColor; opacity: 0.4;
  display: inline-block; vertical-align: middle; margin-right: 4px;
}

/* ---------- layout containers ---------- */
.fc-redesign .container { max-width: 1280px; margin: 0 auto; padding: 0 48px; }
.fc-redesign .container-wide { max-width: 1440px; margin: 0 auto; padding: 0 56px; }

/* ---------- light / dark sections ---------- */
.fc-redesign .dark { background: var(--navy); color: #fff; }
.fc-redesign .dark.deep { background: var(--navy-deep); }
.fc-redesign .dark .muted { color: var(--muted-light); }
.fc-redesign .light { background: var(--paper); color: var(--ink); }
.fc-redesign .light.warm { background: var(--paper-warm); }
.fc-redesign .light .muted { color: var(--muted); }
.fc-redesign .hairline { height: 1px; width: 100%; }
.fc-redesign .dark .hairline { background: var(--line-dark); }
.fc-redesign .light .hairline { background: var(--line); }

/* ---------- buttons ---------- */
.fc-redesign .btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 14px 24px; border-radius: 999px;
  font-family: var(--sans); font-size: 14px; font-weight: 500;
  letter-spacing: 0.01em; cursor: pointer; border: none;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .15s ease, box-shadow .2s ease;
  text-decoration: none; line-height: 1;
}
.fc-redesign .btn svg { display: block; }
.fc-redesign .btn:active { transform: translateY(1px); }
.fc-redesign .btn.primary { background: var(--ink); color: #fff; }
.fc-redesign .btn.primary:hover { background: #000; }
.fc-redesign .dark .btn.primary { background: #fff; color: var(--ink); }
.fc-redesign .dark .btn.primary:hover { background: var(--paper-warm); }
.fc-redesign .btn.ghost { background: transparent; color: var(--ink); border: 1px solid rgba(21,25,43,0.18); }
.fc-redesign .btn.ghost:hover { border-color: var(--ink); }
.fc-redesign .dark .btn.ghost { color: #fff; border-color: rgba(255,255,255,0.22); }
.fc-redesign .dark .btn.ghost:hover { border-color: #fff; }
.fc-redesign .btn.accent { background: var(--accent); color: var(--ink); }
.fc-redesign .btn.accent:hover { filter: brightness(0.95); }

/* ---------- pulse dot ---------- */
.fc-redesign .pulse {
  width: 6px; height: 6px; border-radius: 99px; background: currentColor;
  display: inline-block; animation: fcPulse 2.4s ease-in-out infinite;
}
@keyframes fcPulse {
  0%, 100% { opacity: 0.35; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.4); }
}

.fc-redesign section[id] { scroll-margin-top: 120px; }

/* =====================================================================
   TOP-BAR (pasek kontaktowy + ogłoszenia)
   ===================================================================== */
/* Odporność chrome redesignu na stary globalny CSS ładowany na podstronach konta
   (common.css: body{font-family:'Montserrat'!important}). Elementy nagłówka z
   font-family:inherit (m.in. .fc-nav-link) muszą trzymać font designu, nie Montserrat. */
.fc-redesign .fc-topbar,
.fc-redesign .fc-header { font-family: var(--sans); }

.fc-topbar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 81;
  transition: transform .35s ease;
}
.fc-topbar.up { transform: translateY(-100%); pointer-events: none; }

.fc-topbar-utility {
  background: var(--navy-deep); color: rgba(255,255,255,0.85);
  font-size: 12px; letter-spacing: 0.02em; height: 38px;
  display: flex; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.fc-topbar-utility .container-wide {
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; height: 100%; width: 100%;
}
.fc-tb-contacts { display: flex; align-items: center; gap: 18px; min-width: 0; overflow: hidden; }
.fc-tb-link { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; transition: color .15s; }
.fc-tb-link:hover { color: #fff; }
.fc-tb-link .lbl { opacity: 0.7; margin-right: 5px; }
.fc-tb-ico { width: 18px; height: 18px; border-radius: 4px; background: rgba(255,255,255,0.08); display: inline-flex; align-items: center; justify-content: center; color: var(--accent); flex-shrink: 0; }
.fc-tb-sep { width: 1px; height: 14px; background: rgba(255,255,255,0.18); display: inline-block; flex-shrink: 0; }
.fc-tb-hours { display: flex; align-items: center; gap: 8px; color: rgba(255,255,255,0.65); flex-shrink: 0; }

.fc-topbar-anno {
  height: 44px; display: flex; align-items: center; position: relative; overflow: hidden;
  font-size: 13px; letter-spacing: 0.01em;
  background: linear-gradient(90deg, var(--accent) 0%, #B8965A 100%);
  color: var(--navy-deep);
}
.fc-topbar-anno .container-wide { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; position: relative; }
/* kolumna kropek po lewej równoważy X po prawej, dzięki czemu treść jest wyśrodkowana (jak w projekcie) */
.fc-anno-dots { display: flex; gap: 6px; align-items: center; flex-shrink: 0; width: 60px; }
.fc-anno-dots button { width: 6px; height: 6px; border-radius: 99px; border: none; padding: 0; cursor: pointer; background: rgba(7,15,44,0.30); transition: width .3s, background .2s; position: relative; }
/* dostępność: większy obszar dotyku kropek i krzyżyka bez zmiany wyglądu */
.fc-anno-dots button::before { content: ""; position: absolute; inset: -14px -7px; }
.fc-anno-dots button.active { width: 18px; background: var(--navy-deep); }
.fc-anno-track { flex: 1; display: flex; align-items: center; justify-content: center; min-width: 0; }
.fc-anno-slide { display: none; align-items: center; gap: 12px; min-width: 0; animation: fcAnnoFade .4s ease; }
.fc-anno-slide.active { display: flex; }
/* Na podstronach konta ładuje się stary CSS (LoginAsset: common/login/zamowienie.css), który przebija
   pasek ogłoszeń na kilka sposobów:
   - zamowienie.css `* { font-size:14px }` — trafia BEZPOŚREDNIO w .txt i bije dziedziczone 13px (różnica rozmiaru),
   - goły `.active { background:#0e2049!important }` — granatowe tło pod tekstem (nieczytelny),
   - common.css `body { font-family:Montserrat!important }` — zmienia krój.
   Wymuszamy font + rozmiar designu i neutralizujemy tło, żeby pasek był identyczny na każdej stronie. */
.fc-redesign .fc-topbar-anno,
.fc-redesign .fc-topbar-anno .txt,
.fc-redesign .fc-topbar-anno .more { font-family: var(--sans); font-size: 13px; }
.fc-redesign .fc-anno-slide.active { background-color: transparent !important; }
/* Lejek redesignu: chowamy stary szary baner „FORMULARZ ZAMÓWIENIA" (page-heading). */
body.fc-redesign .page-heading { display: none; }
@keyframes fcAnnoFade { from { opacity: 0; } to { opacity: 1; } }
.fc-topbar-anno .ico { font-size: 16px; line-height: 1; flex-shrink: 0; }
.fc-topbar-anno .txt { font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fc-topbar-anno a.more { color: inherit; margin-left: 10px; text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.fc-topbar-anno .txt a.mail { color: inherit; text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.fc-anno-close {
  flex-shrink: 0;
  width: 28px; height: 28px; border-radius: 99px; border: none; cursor: pointer;
  background: rgba(7,15,44,0.12); color: inherit;
  display: flex; align-items: center; justify-content: center; transition: background .15s;
  position: relative;
}
.fc-anno-close::before { content: ""; position: absolute; inset: -8px; border-radius: 99px; }
.fc-anno-close:hover { background: rgba(7,15,44,0.22); }
@media (max-width: 480px) { .fc-anno-dots { display: none !important; } }
/* dłuższe komunikaty (np. prośba o zgłaszanie błędów) na wąskich ekranach zawijają
   się zamiast ucinać wielokropkiem */
@media (max-width: 640px) {
  .fc-topbar-anno { height: auto; min-height: 44px; padding: 8px 0; }
  .fc-topbar-anno .txt { white-space: normal; overflow: visible; text-overflow: unset; line-height: 1.45; }
}

/* =====================================================================
   HEADER (nagłówek główny)
   ===================================================================== */
.fc-header {
  position: fixed; top: var(--top-stack-h, 82px); left: 0; right: 0; z-index: 80;
  padding: 20px 0;
  /* header-v2.jsx: JEDNOLITE krycie 94-96% nad każdym tłem (także granatowe hero) */
  background: rgba(251,250,247,0.94);
  -webkit-backdrop-filter: saturate(1.4) blur(14px);
  backdrop-filter: saturate(1.4) blur(14px);
  border-bottom: 1px solid rgba(21,25,43,0.07);
  transition: top .35s ease, padding .3s ease, background .3s ease, border-color .3s ease;
}
.fc-header.scrolled {
  top: 0; padding: 12px 0;
  background: rgba(251,250,247,0.96);
  border-bottom: 1px solid rgba(21,25,43,0.1);
}
/* złoty akcent — linia oddzielająca menu od treści (wg header.jsx) */
.fc-header::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--accent) 25%, var(--accent) 75%, transparent 100%);
  opacity: 0.55; transition: opacity .3s ease; pointer-events: none;
}
.fc-header.scrolled::after { opacity: 0.9; }
.fc-header > .container-wide { display: flex; align-items: center; gap: 16px; }

.fc-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.fc-logo-mark { width: 60px; height: 42px; flex: 0 0 60px; background: url("/img/design/logo.svg") left center / contain no-repeat; }
.fc-logo-name { font-family: var(--sans); font-size: 17px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink); display: flex; align-items: baseline; gap: 2px; line-height: 1; }
.fc-logo-name .pl { font-family: var(--serif); font-size: 15px; font-weight: 400; font-style: italic; letter-spacing: 0; text-transform: none; color: var(--navy); }
.fc-logo-sub { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--muted); font-weight: 500; margin-top: 4px; }

.fc-nav { margin-left: auto; display: flex; gap: 2px; align-items: center; }
.fc-nav-link {
  text-decoration: none; color: var(--ink); font-size: 13px; font-weight: 500;
  padding: 9px 12px; border-radius: 8px; opacity: 0.78; background: transparent;
  transition: opacity .2s, background .2s; display: inline-flex; align-items: center; gap: 6px;
  cursor: pointer; white-space: nowrap; border: none; font-family: inherit;
}
.fc-nav-link:hover { background: rgba(26,42,94,0.04); }
.fc-nav-link.active { opacity: 1; background: rgba(26,42,94,0.06); }
.fc-nav-link .chev { transition: transform .2s; }

.fc-nav-drop { position: relative; }
.fc-nav-drop:hover .chev { transform: rotate(180deg); }
.fc-drop-menu {
  position: absolute; top: 100%; left: -12px; margin-top: 8px; width: 360px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 30px 60px -20px rgba(14,32,73,0.18), 0 0 0 1px rgba(14,32,73,0.04);
  padding: 8px; z-index: 90;
  opacity: 0; visibility: hidden; transform: translateY(6px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.fc-nav-drop:hover .fc-drop-menu, .fc-nav-drop:focus-within .fc-drop-menu { opacity: 1; visibility: visible; transform: translateY(0); }
/* wąski wariant dropdownu (Poradniki/FAQ — pozycje bez miniatur) */
.fc-drop-menu--maly { width: 320px; }
.fc-drop-menu--maly .fc-drop-title { display: block; }
.fc-drop-menu--maly .fc-drop-note { display: block; margin-top: 2px; }
.fc-drop-item { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 10px; text-decoration: none; color: var(--ink); transition: background .15s; }
.fc-drop-item:hover { background: var(--paper-warm); }
/* miniaturki menu: wycinki produktów na przezroczystym tle — bez maski, ramki i tła */
.fc-drop-thumb { width: 52px; height: 56px; flex: 0 0 52px; display: flex; align-items: center; justify-content: center; }
.fc-drop-thumb img { width: 100%; height: 100%; object-fit: contain; }
.fc-drop-title { font-family: var(--serif); font-size: 16px; line-height: 1.2; }
.fc-drop-note { font-size: 11px; color: var(--muted); margin-top: 3px; }
.fc-drop-foot { display: flex; align-items: center; justify-content: space-between; padding: 12px 14px; border-radius: 10px; text-decoration: none; color: var(--navy); font-size: 13px; font-weight: 500; }
.fc-drop-sep { height: 1px; background: var(--line); margin: 8px 4px; }

.fc-cta-pill {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 42px; padding: 0 16px; border-radius: 99px;
  border: 1px solid rgba(26,42,94,0.18); background: transparent; color: var(--ink);
  text-decoration: none; font-size: 13px; font-weight: 500; font-family: inherit; cursor: pointer;
  transition: border-color .2s, background .2s; white-space: nowrap;
}
.fc-cta-pill:hover { border-color: var(--ink); }
.fc-header-order { padding: 0 18px; }
.fc-header-order.btn { height: 42px; }

.fc-lang { position: relative; }
.fc-lang-btn { gap: 6px; font-weight: 600; letter-spacing: 0.06em; font-size: 12px; }
.fc-lang-menu {
  position: absolute; top: 100%; right: 0; margin-top: 8px; min-width: 180px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: 0 30px 60px -20px rgba(14,32,73,0.18); padding: 6px; z-index: 90;
  display: none;
}
.fc-lang.open .fc-lang-menu { display: block; }
.fc-lang-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border: none; background: transparent; border-radius: 8px; cursor: pointer; font: inherit; color: var(--ink); text-align: left; text-decoration: none; transition: background .15s; }
.fc-lang-item:hover, .fc-lang-item.active { background: var(--paper-warm); }
.fc-lang-item .flag { font-size: 18px; line-height: 1; }
.fc-lang-off, .fc-lang-off:hover { opacity: .45; filter: grayscale(1); cursor: not-allowed; background: transparent !important; pointer-events: auto; }

/* ---- menu konta (popup po zalogowaniu) ---- */
.fc-acct { position: relative; display: inline-flex; align-items: center; }
.fc-acct-btn {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 5px 14px 5px 5px; height: 42px;
  border: 1px solid rgba(26,42,94,0.18); background: transparent; border-radius: 99px;
  font: inherit; font-size: 13px; font-weight: 500; color: var(--ink); cursor: pointer;
  transition: border-color .2s, background .2s;
}
.fc-acct-btn:hover { border-color: var(--ink); }
.fc-acct.open .fc-acct-btn { border-color: var(--ink); background: rgba(14,32,73,0.04); }
.fc-acct.open .fc-acct-btn .chev { transform: rotate(180deg); }
.fc-acct-btn .chev { transition: transform .2s; opacity: .6; }
.fc-acct-ava {
  position: relative; flex-shrink: 0;
  width: 32px; height: 32px; border-radius: 99px;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--navy); color: #fff;
  font-size: 12px; font-weight: 600; letter-spacing: .04em;
}
.fc-acct-ava.is-company { background: var(--accent); color: var(--navy); }
/* plakietka firmy: w dolnym rogu, mała — siedzi na krawędzi, nie zakrywa inicjałów/zdjęcia */
.fc-acct-ava-badge {
  position: absolute; bottom: -3px; right: -3px;
  width: 16px; height: 16px; border-radius: 99px;
  background: var(--navy); color: var(--accent);
  display: flex; align-items: center; justify-content: center;
  border: 2px solid #fff; z-index: 2;
}
.fc-acct-ava-badge svg { width: 9px; height: 9px; }
.fc-macct .fc-acct-ava-badge { width: 17px; height: 17px; }
.fc-macct .fc-acct-ava-badge svg { width: 10px; height: 10px; }
/* własne zdjęcie/logo (z localStorage, kompresowane po stronie klienta) */
[data-fc-avatar] { position: relative; }
[data-fc-avatar] .ini { position: relative; z-index: 0; }
[data-fc-avatar] .fc-ava-photo {
  position: absolute; inset: 0; width: 100%; height: 100%;
  border-radius: inherit; object-fit: cover; display: block; z-index: 1;
}
[data-fc-avatar].has-img .ini { visibility: hidden; }
.fc-acct-first { max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fc-acct-menu {
  position: absolute; top: 100%; right: 0; margin-top: 8px; width: 290px;
  background: #fff; border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 30px 60px -20px rgba(14,32,73,0.18), 0 0 0 1px rgba(14,32,73,0.04);
  overflow: hidden; z-index: 90; display: none;
}
.fc-acct.open .fc-acct-menu { display: block; }
.fc-acct-head { padding: 16px 18px; border-bottom: 1px solid var(--line); }
.fc-acct-id { display: flex; align-items: center; gap: 12px; }
.fc-acct-id-meta { min-width: 0; flex: 1; }
.fc-acct-ava-lg { width: 52px; height: 52px; font-size: 16px; }
.fc-acct-id .fc-acct-name { margin-top: 2px; }
/* przycisk aparatu na avatarze — dodaj/zmień własne zdjęcie lub logo */
.fc-acct-ava-edit {
  position: absolute; bottom: -4px; right: -4px;
  width: 22px; height: 22px; border-radius: 99px; padding: 0;
  background: var(--navy); color: #fff; border: 2px solid #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center; z-index: 3;
  transition: background .15s, color .15s;
}
.fc-acct-ava-edit:hover { background: var(--accent); color: var(--navy); }
.fc-acct-ava-edit svg { width: 12px; height: 12px; }
/* pasek akcji zdjęcia pod nagłówkiem konta */
.fc-acct-ava-hint { margin-top: 12px; display: flex; align-items: center; gap: 14px; }
.fc-acct-ava-hint .lnk {
  font: inherit; font-size: 12px; font-weight: 500; cursor: pointer;
  background: none; border: none; padding: 0; color: var(--navy);
  text-decoration: underline; text-underline-offset: 2px;
}
.fc-acct-ava-hint .lnk:hover { color: var(--accent); }
.fc-acct-ava-hint .lnk.danger { color: var(--muted); }
.fc-acct-ava-hint .lnk.danger:hover { color: #b3261e; }
.fc-acct-role { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .16em; }
.fc-acct-name { font-size: 18px; font-weight: 500; margin-top: 4px; color: var(--ink); }
.fc-acct-email { font-size: 12px; color: var(--muted); margin-top: 8px; word-break: break-all; }
/* pasek rabatu w popupie (tylko gdy naliczony) */
.fc-acct-rabat {
  margin-top: 10px; padding: 8px 12px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(201,168,106,0.18) 0%, rgba(201,168,106,0.06) 100%);
  border: 1px solid rgba(201,168,106,0.4);
  display: flex; align-items: center; gap: 9px;
}
.fc-acct-rabat .ic {
  width: 26px; height: 26px; border-radius: 7px; flex-shrink: 0;
  background: var(--accent); color: var(--navy);
  display: flex; align-items: center; justify-content: center;
}
.fc-acct-rabat .lbl { flex: 1; min-width: 0; font-size: 12px; font-weight: 600; color: var(--navy); letter-spacing: .02em; }
.fc-acct-rabat .val { font-size: 15px; font-weight: 700; color: var(--navy); font-variant-numeric: tabular-nums; }
.fc-acct-company {
  margin-top: 10px; padding: 10px 12px; border-radius: 10px;
  background: linear-gradient(135deg, rgba(201,168,106,0.15) 0%, rgba(201,168,106,0.05) 100%);
  border: 1px solid rgba(201,168,106,0.35);
  display: flex; align-items: center; gap: 10px;
}
.fc-acct-company-ico {
  width: 28px; height: 28px; border-radius: 7px; flex-shrink: 0;
  background: var(--accent); color: var(--navy);
  display: flex; align-items: center; justify-content: center;
}
.fc-acct-company-ico svg { width: 14px; height: 14px; }
.fc-acct-company-meta { min-width: 0; flex: 1; }
.fc-acct-company-meta .cn { display: block; font-size: 13px; font-weight: 600; color: var(--navy); line-height: 1.2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fc-acct-company-meta .nip { display: block; font-size: 10px; color: var(--muted); margin-top: 2px; font-family: ui-monospace, monospace; }
.fc-acct-b2b { font-size: 9px; padding: 3px 7px; border-radius: 99px; background: var(--navy); color: var(--accent); font-weight: 700; letter-spacing: .1em; flex-shrink: 0; }
.fc-acct-links { padding: 8px; }
.fc-acct-sep { height: 1px; background: var(--line); margin: 8px 4px; }
.fc-acct-link { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px; text-decoration: none; color: var(--ink); transition: background .15s; }
.fc-acct-link:hover { background: var(--paper-warm); }
.fc-acct-link .ic { width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0; background: var(--paper-warm); color: var(--navy); display: flex; align-items: center; justify-content: center; }
.fc-acct-link .tx { flex: 1; min-width: 0; }
.fc-acct-link .tx .t { display: block; font-size: 14px; font-weight: 500; }
.fc-acct-link .tx .s { display: block; font-size: 11px; color: var(--muted); margin-top: 1px; }
.fc-acct-link .bd { font-size: 10px; padding: 3px 8px; border-radius: 99px; background: var(--navy); color: #fff; font-weight: 600; letter-spacing: .06em; flex-shrink: 0; }
.fc-acct-logout { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border-radius: 8px; text-decoration: none; color: var(--ink); font-size: 14px; transition: background .15s; }
.fc-acct-logout:hover { background: var(--paper-warm); }
.fc-acct-logout .ic { display: inline-flex; }

/* karta konta w drawerze mobilnym */
.fc-macct { display: flex; align-items: center; gap: 12px; padding: 4px 0 16px; margin-bottom: 8px; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.fc-macct .fc-acct-ava { width: 38px; height: 38px; font-size: 13px; }
.fc-macct-meta { flex: 1; min-width: 0; }
.fc-macct-meta .nm { display: block; font-size: 16px; font-weight: 500; }
.fc-macct-meta .rl { display: block; font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.fc-burger { display: none; background: transparent; border: none; cursor: pointer; color: var(--ink); padding: 8px; }

/* mobile drawer */
.fc-mobile { display: none; background: #fff; border-top: 1px solid var(--line); padding: 20px 24px 28px; flex-direction: column; gap: 4px; }
.fc-header.menu-open .fc-mobile {
  display: flex;
  /* drawer siedzi w fixed headerze — bez własnego scrolla dolne linki (Cennik, Kontakt…)
     były poza ekranem i nieosiągalne. Wysokość = ekran minus pasek+nagłówek. */
  max-height: calc(100vh - var(--top-stack-h, 82px) - 84px);
  max-height: calc(100dvh - var(--top-stack-h, 82px) - 84px);
  overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
.fc-header.scrolled.menu-open .fc-mobile { max-height: calc(100vh - 68px); max-height: calc(100dvh - 68px); }
.fc-mobile a.m-link { padding: 10px 0; font-size: 17px; color: var(--ink); text-decoration: none; }
.fc-mobile .tag { margin: 16px 0 6px; }
.fc-mobile .m-prod { display: flex; align-items: center; gap: 14px; padding: 10px 0; font-size: 16px; color: var(--ink); text-decoration: none; }
.fc-mobile .m-prod .fc-drop-thumb { width: 44px; height: 48px; flex: 0 0 44px; }
.fc-mobile-sep { height: 1px; background: var(--line); margin: 12px 0; }

@media (max-width: 1365px) {
  .fc-logo-sub { display: none; }
  .fc-nav-link { padding: 8px 9px; font-size: 12px; }
  .fc-lang-code { display: none; }
}
@media (max-width: 1254px) {
  .fc-header-order .full { display: none; }
}
@media (max-width: 1024px) {
  .fc-header-order .full { display: inline; }
}
@media (max-width: 980px) {
  .fc-nav, .fc-header-order, .fc-lang, .fc-login-desktop { display: none !important; }
  .fc-burger { display: block; }
}
@media (min-width: 981px) { .fc-mobile { display: none !important; } }

/* TOP-BAR responsywnie — NIE chowamy kontaktów; zawijamy je, by wszystkie
   telefony + email (z ikoną) były widoczne także na telefonie. Wysokość paska
   rośnie, a JS przelicza --top-stack-h, więc header nie nachodzi. */
@media (max-width: 980px) {
  .fc-topbar-utility { height: auto; padding: 8px 0; }
  .fc-topbar-utility .container-wide { flex-direction: column; gap: 7px; }
  .fc-tb-contacts {
    flex-wrap: wrap; justify-content: center;
    gap: 7px 14px; overflow: visible; min-width: 0;
  }
  .fc-tb-sep { display: none !important; }
  .fc-tb-link .lbl { display: none; }            /* 'tel.'/'kom.' — zbędne na mobile, numer + ikona zostają */
  .fc-tb-third, .fc-tb-mail { display: inline-flex !important; } /* gdyby coś je wcześniej skryło */
  .fc-tb-hours { color: rgba(255,255,255,0.6); }
}
@media (max-width: 480px) {
  .fc-topbar-utility { font-size: 11px; }
  .fc-tb-contacts { gap: 6px 12px; }
  .fc-tb-ico { width: 16px; height: 16px; }
}

/* =====================================================================
   FOOTER
   ===================================================================== */
.fc-footer { padding: 100px 0 40px; }
.fc-footer .ft-map-grid { display: grid; grid-template-columns: 1fr 1.4fr; gap: 56px; margin-bottom: 80px; align-items: stretch; }
.fc-footer .ft-brand { display: flex; align-items: center; gap: 14px; margin-bottom: 24px; }
.fc-footer .logo-mark-dark { width: 72px; height: 50px; flex: 0 0 72px; background: url("/img/design/logo-light.svg") left center / contain no-repeat; }
.fc-footer .ft-brand-name { font-family: var(--sans); font-size: 22px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: #fff; display: flex; align-items: baseline; gap: 2px; }
.fc-footer .ft-brand-name .pl { font-family: var(--serif); font-size: 20px; font-weight: 400; font-style: italic; letter-spacing: 0; text-transform: none; color: var(--accent); }
.fc-footer .ft-addr { font-size: 15px; color: var(--muted-light); line-height: 1.7; }
.fc-footer .ft-addr .city { font-family: var(--serif); font-size: 20px; color: #fff; margin-bottom: 4px; }
.fc-footer .ft-addr a { color: var(--accent); text-decoration: none; }
.fc-footer .ft-socials { display: flex; gap: 12px; margin-top: 32px; }
.fc-footer .ft-social { width: 42px; height: 42px; border-radius: 99px; border: 1px solid rgba(255,255,255,0.18); display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.8); text-decoration: none; transition: color .2s, border-color .2s; }
.fc-footer .ft-social:hover { color: var(--accent); border-color: var(--accent); }
.fc-footer .ft-map { border-radius: 18px; overflow: hidden; min-height: 360px; border: 1px solid rgba(255,255,255,0.1); position: relative; }
.fc-footer .ft-map iframe { border: 0; display: block; width: 100%; height: 360px; filter: grayscale(0.15) contrast(1.05); }
.fc-footer .ft-map-cta { position: absolute; bottom: 14px; right: 14px; padding: 9px 14px; background: var(--accent); color: var(--navy); border-radius: 8px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.1em; text-decoration: none; box-shadow: 0 8px 20px rgba(0,0,0,0.35); }

.fc-footer .ft-cols { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 56px; margin-bottom: 56px; }
.fc-footer .ft-cols .tag { margin-bottom: 20px; color: var(--accent-soft); }
.fc-footer .ft-about p { font-size: 14px; color: var(--muted-light); line-height: 1.65; max-width: 360px; }
.fc-footer .ft-about-stat { display: flex; gap: 16px; align-items: center; margin-top: 28px; }
.fc-footer .ft-about-stat .num { font-family: var(--serif); font-size: 32px; color: var(--accent); font-style: italic; }
.fc-footer .ft-about-stat .div { width: 1px; height: 40px; background: rgba(255,255,255,0.15); }
.fc-footer .ft-about-stat .lbl { font-size: 12px; color: var(--muted-light); line-height: 1.5; }
.fc-footer .ft-col ul { display: flex; flex-direction: column; gap: 10px; }
.fc-footer .ft-col a { color: rgba(255,255,255,0.78); text-decoration: none; font-size: 14px; transition: color .2s; }
.fc-footer .ft-col a:hover { color: var(--accent); }

.fc-footer .ft-pay-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; padding: 32px 0; border-top: 1px solid rgba(255,255,255,0.1); border-bottom: 1px solid rgba(255,255,255,0.1); margin-bottom: 32px; }
.fc-footer .ft-pay-grid .tag { margin-bottom: 16px; color: var(--accent-soft); }
.fc-footer .pay-badges { display: flex; gap: 10px; flex-wrap: wrap; }
.fc-footer .pay-badge { padding: 8px 14px; border-radius: 8px; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; border: 1px solid rgba(255,255,255,0.12); display: inline-flex; align-items: center; color: #fff; }
.fc-footer .ft-ship-note { font-size: 12px; color: var(--muted-light); margin-top: 14px; }

.fc-footer .ft-legal { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
.fc-footer .ft-legal .links { display: flex; gap: 28px; flex-wrap: wrap; font-size: 12px; color: var(--muted-light); }
.fc-footer .ft-legal a { color: var(--muted-light); text-decoration: none; }
.fc-footer .ft-legal a:hover { color: var(--accent); }
.fc-footer .ft-legal .credit { font-size: 11px; color: var(--muted-light); letter-spacing: 0.06em; }

@media (max-width: 1024px) {
  .fc-footer .ft-map-grid { grid-template-columns: 1fr; }
  .fc-footer .ft-cols { grid-template-columns: 1fr 1fr; gap: 40px; }
  .fc-footer .ft-pay-grid { grid-template-columns: 1fr; gap: 24px; }
}
@media (max-width: 600px) { .fc-footer .ft-cols { grid-template-columns: 1fr; } }

@media (max-width: 900px) {
  .fc-redesign .container, .fc-redesign .container-wide { padding: 0 24px; }
}

/* =====================================================================
   MODAL LOGOWANIA (popup z headera — wygląd z projektu, realny formularz Yii)
   ===================================================================== */
.fc-auth { position: fixed; inset: 0; z-index: 200; display: none; align-items: center; justify-content: center; padding: 24px; }
.fc-auth.open { display: flex; }
.fc-auth-overlay { position: absolute; inset: 0; background: rgba(7,15,44,0.55); backdrop-filter: blur(4px); animation: fcAuthFade .25s ease; }
.fc-auth-card {
  position: relative; background: #fff; border-radius: 22px; width: 100%; max-width: 460px;
  padding: 36px; box-shadow: 0 50px 100px -30px rgba(7,15,44,0.5); animation: fcAuthSlide .3s ease;
  max-height: calc(100vh - 48px); overflow-y: auto;
}
@keyframes fcAuthFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes fcAuthSlide { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.fc-auth-x {
  position: absolute; top: 18px; right: 18px; width: 36px; height: 36px; border-radius: 99px;
  background: var(--paper-warm); border: none; cursor: pointer; color: var(--ink);
  display: flex; align-items: center; justify-content: center; transition: background .2s;
}
.fc-auth-x:hover { background: var(--line); }
.fc-auth-title { font-size: 30px; margin: 0; font-weight: 500; letter-spacing: -0.01em; line-height: 1.1; color: var(--ink); }
.fc-auth-title .sub { display: block; font-style: italic; color: var(--navy); margin-top: 4px; font-size: 22px; }
/* odstępy 1:1 z projektu LoginModal.jsx: akapit 12/24, form gap 16 */
.fc-auth-intro { font-size: 13.5px; color: var(--muted); margin: 12px 0 24px; line-height: 1.6; }
.fc-auth-form { display: flex; flex-direction: column; gap: 16px; }
.fc-auth-reset-form { display: flex; flex-direction: column; gap: 16px; }
.fc-auth-field { display: flex; flex-direction: column; gap: 6px; }
.fc-auth-field > span { font-size: 11px; text-transform: uppercase; letter-spacing: 0.14em; color: var(--muted); font-weight: 500; }
.fc-auth-field input {
  width: 100%; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px;
  font-size: 14px; font-family: inherit; background: #fff; color: var(--ink); outline: none; transition: border-color .2s;
}
.fc-auth-field input:focus { border-color: var(--accent); }
.fc-auth-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 12.5px; }
.fc-auth-remember { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); cursor: pointer; }
.fc-auth-remember input { accent-color: var(--accent); }
.fc-auth-view[hidden] { display: none; }
.fc-auth-ok { background: #ECF8F0; border: 1px solid #BFE6CC; color: #1E7D45; font-size: 13.5px; line-height: 1.5; padding: 12px 16px; border-radius: 12px; margin-bottom: 16px; }
.fc-auth-forgot { color: var(--muted); text-decoration: none; background: none; border: none; padding: 0; cursor: pointer; font: inherit; }
.fc-auth-forgot:hover { color: var(--navy); text-decoration: underline; text-underline-offset: 3px; }
.fc-auth-error { background: #FCEDED; border: 1px solid #F1C7C7; color: #9B2C2C; font-size: 13px; line-height: 1.45; padding: 11px 14px; border-radius: 10px; }
.fc-auth-or { display: flex; align-items: center; gap: 14px; margin: 18px 0 16px; color: var(--muted); font-size: 11.5px; letter-spacing: 0.06em; text-transform: uppercase; }
.fc-auth-or::before, .fc-auth-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.fc-auth-submit-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.fc-auth-submit-row .btn.primary {
  flex: 1 1 auto; justify-content: center; min-width: 150px;
  height: 52px; padding-top: 0; padding-bottom: 0;
  border-radius: 999px; background: var(--ink); border-color: var(--ink);
}
.fc-auth-submit-row .btn.primary:hover { background: #20263d; border-color: #20263d; }
.fc-auth-social { display: flex; gap: 8px; }
.fc-auth-soc {
  width: 52px; height: 52px; border-radius: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--line); background: #fff; color: var(--ink); text-decoration: none;
  transition: border-color .2s, transform .15s, box-shadow .2s;
}
.fc-auth-soc:hover { border-color: var(--navy); transform: translateY(-2px); box-shadow: 0 8px 18px -8px rgba(14,32,73,0.3); }
.fc-auth-guest-btn {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  margin-top: 16px; padding: 15px 20px; width: 100%; box-sizing: border-box;
  background: var(--accent); color: var(--navy);
  border: 1px solid var(--accent); border-radius: 999px;
  font-size: 14.5px; font-weight: 700; letter-spacing: 0.01em; text-decoration: none;
  box-shadow: 0 12px 26px -12px rgba(201,168,106,0.7);
  transition: filter .2s, transform .15s, box-shadow .2s;
}
.fc-auth-guest-btn:hover { transform: translateY(-1px); filter: brightness(0.96); box-shadow: 0 16px 32px -12px rgba(201,168,106,0.9); }
.fc-auth-guest-btn strong { font-weight: 700; }
.fc-auth-guest-btn svg { flex-shrink: 0; }
.fc-auth-reg { display: block; width: 100%; text-align: center; font-size: 13px; color: var(--muted); text-decoration: none; margin-top: 16px; background: none; border: none; cursor: pointer; font-family: inherit; }
.fc-auth-reg strong { color: var(--navy); }
.fc-auth-reg:hover strong { text-decoration: underline; text-underline-offset: 3px; }
body.fc-auth-lock { overflow: hidden; }
@media (max-width: 480px) {
  .fc-auth-card { padding: 28px 22px; }
}

/* ═══ Jednolite komunikaty (toast) + potwierdzenia (confirm) — cały serwis ═══ */
.fc-toasty {
    position: fixed; top: 88px; right: 18px; z-index: 12000;
    display: flex; flex-direction: column; gap: 10px; max-width: min(400px, calc(100vw - 36px));
}
.fc-toast {
    position: relative; display: flex; align-items: flex-start; gap: 12px;
    background: #fff; border: 1px solid var(--line); border-radius: 14px;
    padding: 14px 40px 14px 14px; box-shadow: 0 18px 50px -20px rgba(14,32,73,0.35);
    font-family: var(--sans); font-size: 13.5px; line-height: 1.45; color: var(--ink);
    opacity: 0; transform: translateX(16px); transition: opacity .25s ease, transform .25s ease;
    overflow: hidden;
}
.fc-toast.is-in { opacity: 1; transform: translateX(0); }
.fc-toast__ic {
    flex: none; width: 26px; height: 26px; border-radius: 99px; margin-top: 1px;
    display: flex; align-items: center; justify-content: center;
    font-size: 13px; font-weight: 800; color: #fff;
}
.fc-toast--success .fc-toast__ic { background: #2C7A3F; }
.fc-toast--error .fc-toast__ic { background: #B3402A; }
.fc-toast--info .fc-toast__ic { background: var(--navy); color: var(--accent); }
.fc-toast__x {
    position: absolute; top: 8px; right: 8px; width: 24px; height: 24px;
    border: 0; background: transparent; color: var(--muted); font-size: 16px; line-height: 1;
    cursor: pointer; border-radius: 99px;
}
.fc-toast__x:hover { background: var(--paper-warm); color: var(--ink); }
.fc-toast__pasek {
    position: absolute; left: 0; bottom: 0; height: 3px; width: 100%;
    transform-origin: left; animation: fc-toast-pasek linear forwards;
}
.fc-toast--success .fc-toast__pasek { background: rgba(44,122,63,.45); }
.fc-toast--error .fc-toast__pasek { background: rgba(179,64,42,.45); }
.fc-toast--info .fc-toast__pasek { background: rgba(201,168,106,.6); }
@keyframes fc-toast-pasek { from { transform: scaleX(1); } to { transform: scaleX(0); } }
@media (max-width: 640px) { .fc-toasty { top: auto; bottom: 16px; right: 16px; left: 16px; } }

.fc-confirm-tlo {
    position: fixed; inset: 0; z-index: 12500; background: rgba(14,32,73,0.45);
    display: flex; align-items: center; justify-content: center; padding: 20px;
    opacity: 0; transition: opacity .2s ease;
}
.fc-confirm-tlo.is-in { opacity: 1; }
.fc-confirm {
    background: #fff; border-radius: 18px; padding: 26px 26px 22px; max-width: 420px; width: 100%;
    box-shadow: 0 30px 80px -30px rgba(14,32,73,0.6);
    transform: translateY(10px) scale(.98); transition: transform .2s ease;
    font-family: var(--sans);
}
.fc-confirm-tlo.is-in .fc-confirm { transform: none; }
.fc-confirm__tytul { font-family: var(--serif); font-size: 21px; color: var(--ink); margin: 0 0 8px; }
.fc-confirm__tresc { font-size: 14px; color: var(--muted); line-height: 1.55; margin: 0 0 20px; }
.fc-confirm__akcje { display: flex; gap: 10px; justify-content: flex-end; }
.fc-confirm__nie {
    padding: 11px 20px; border-radius: 99px; border: 1.5px solid var(--line);
    background: #fff; color: var(--ink); font-weight: 600; font-size: 13.5px; cursor: pointer;
}
.fc-confirm__nie:hover { border-color: var(--navy); }
.fc-confirm__tak {
    padding: 11px 22px; border-radius: 99px; border: 0;
    background: var(--navy); color: #fff; font-weight: 600; font-size: 13.5px; cursor: pointer;
}
.fc-confirm__tak:hover { background: var(--navy-deep, #0a1836); }

/* ═══ System uwag (narzędzie przeglądu kopii) ═══ */
.fc-uwagi-warstwa { position: absolute; top: 0; left: 0; width: 100%; height: 0; z-index: 500; overflow-x: clip; /* pinezki z desktopu (x>szer. ekranu) nie poszerzaja strony na telefonie */ }
.fc-uwaga { position: absolute; transform: translate(-11px, -11px); cursor: pointer; }
.fc-uwaga .pin { touch-action: none; }
.fc-uwaga.przenoszenie { cursor: grabbing; z-index: 350; }
.fc-uwaga.przenoszenie .pin { transform: scale(1.3); box-shadow: 0 8px 20px rgba(0,0,0,0.5); }
.fc-uwaga .pin {
  display: flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 999px;
  background: #FFE100; color: #1a1a1a; border: 2px solid #1a1a1a;
  font: 700 11px/1 Inter, system-ui, sans-serif;
  box-shadow: 0 4px 12px rgba(0,0,0,0.35);
  transition: transform .15s;
}
.fc-uwaga:hover .pin { transform: scale(1.18); }
/* uwaga oznaczona jako ZROBIONA: zielony pin (✓) + zielony dymek; klik na stronie usuwa */
.fc-uwaga.zrobiona .pin { background: #28C76F; color: #fff; border-color: #0f7a3f; font-size: 13px; }
.fc-uwaga.zrobiona .dymek { background: #E6F9EE; border-color: #0f7a3f; }
.fc-uwaga.zrobiona .dymek .tekst { color: #14532d; }
.fc-uwaga.zrobiona .dymek .tip { color: #0f7a3f; border-top-color: rgba(15,122,63,0.3); }
.fc-uwaga .dymek {
  display: none; position: absolute; left: 26px; top: -6px; width: 240px;
  background: #FFF44F; border: 1.5px solid #1a1a1a; border-radius: 10px;
  padding: 10px 12px; box-shadow: 0 14px 34px -10px rgba(0,0,0,0.4);
}
.fc-uwaga.otwarta .dymek { display: block; }
.fc-uwaga .dymek .tekst {
  display: block; font: 400 13px/1.5 Inter, system-ui, sans-serif;
  font-style: normal; color: #2b2417; white-space: pre-wrap; word-break: break-word;
}
.fc-uwaga .dymek .tip {
  display: block; margin-top: 7px; padding-top: 6px; border-top: 1px dashed rgba(0,0,0,0.25);
  font: 600 9.5px/1 Inter, system-ui, sans-serif; font-style: normal;
  letter-spacing: 0.06em; text-transform: uppercase; color: #7a6a00;
}
.fc-uwaga .dymek .pole {
  width: 100%; min-height: 64px; resize: vertical; border: 1px solid rgba(0,0,0,0.3);
  border-radius: 6px; padding: 7px 9px; font: 400 13px/1.5 Inter, system-ui, sans-serif;
  color: #2b2417; background: #fff; outline: none;
}

/* ═══ Popup konta: dane na żywo z KontoMenuController (bloki mk-*) ═══ */
.fc-acct-dyn:empty { display: none; }
.fc-acct-dyn { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.fc-acct-dyn a { text-decoration: none; color: inherit; }
.fc-acct-dyn .mk-alert {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--line); background: var(--paper-warm); transition: border-color .2s;
}
.fc-acct-dyn .mk-alert:hover { border-color: var(--accent); }
.fc-acct-dyn .mk-alert.danger { background: #FCEFEC; border-color: #F0D2C9; }
.fc-acct-dyn .mk-alert.warn { background: #FBF4E1; border-color: #EBDCB2; }
.fc-acct-dyn .mk-aic { flex: 0 0 26px; width: 26px; height: 26px; color: var(--navy); }
.fc-acct-dyn .mk-alert.danger .mk-aic { color: #B3402A; }
.fc-acct-dyn .mk-alert.warn .mk-aic { color: #8a6410; }
.fc-acct-dyn .mk-aic svg, .fc-acct-dyn .mk-icw svg { width: 100%; height: 100%; }
.fc-acct-dyn .mk-att { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.fc-acct-dyn .mk-att b { font-size: 12.5px; font-weight: 600; color: var(--ink); }
.fc-acct-dyn .mk-att small { font-size: 11px; color: var(--muted); }
.fc-acct-dyn .mk-amt { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.fc-acct-dyn .mk-v { font-size: 13px; font-weight: 700; color: var(--navy); }
.fc-acct-dyn .mk-go { display: inline-flex; align-items: center; gap: 2px; font-size: 10.5px; font-weight: 600; color: var(--accent); text-transform: uppercase; letter-spacing: .04em; }
.fc-acct-dyn .mk-go svg { width: 10px; height: 10px; }
.fc-acct-dyn .mk-track a {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 12px;
  border: 1px solid var(--line); background: #fff; transition: border-color .2s;
}
.fc-acct-dyn .mk-track a:hover { border-color: var(--accent); }
.fc-acct-dyn .mk-icw { flex: 0 0 24px; width: 24px; height: 24px; color: var(--navy); }
.fc-acct-dyn .mk-tt { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.fc-acct-dyn .mk-tt b { font-size: 12.5px; font-weight: 600; color: var(--ink); }
.fc-acct-dyn .mk-tt small { font-size: 11px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fc-acct-dyn .mk-badge {
  display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px;
  padding: 0 7px; border-radius: 99px; background: var(--navy); color: #fff; font-size: 11.5px; font-weight: 700;
}
.fc-acct-dyn .mk-podglad {
  display: flex; align-items: center; gap: 6px; padding: 8px 12px; border-radius: 10px;
  background: #FBF1E1; color: #8a6410; font-size: 12px; font-weight: 600;
}
.fc-acct-dyn .mk-podglad-koniec { margin-left: auto; color: inherit; text-decoration: underline; }

/* hover na ZROBIONEJ (zielonej) uwadze pokazuje jej treść (klik dopiero usuwa) */
.fc-uwaga.zrobiona:hover .dymek { display: block; }
/* sticky licznik uwag na stronie (ile do zrobienia / zrobione) */
.fc-uwagi-licznik {
  position: fixed; bottom: 16px; left: 50%; transform: translateX(-50%); z-index: 300;
  display: flex; align-items: center; gap: 8px;
  background: #1a1a1a; color: #fff; border-radius: 999px; padding: 7px 12px 7px 14px;
  box-shadow: 0 10px 28px -8px rgba(0,0,0,0.5); font: 700 12px/1 Inter, system-ui, sans-serif;
}
.fc-uwagi-licznik .u-tit { font-weight: 600; opacity: 0.75; letter-spacing: 0.04em; margin-right: 2px; }
.fc-uwagi-licznik .u-b { display: inline-flex; align-items: center; gap: 5px; padding: 4px 9px; border-radius: 999px; cursor: pointer; user-select: none; transition: transform .12s, box-shadow .12s; }
.fc-uwagi-licznik .u-b:hover { transform: translateY(-1px); box-shadow: 0 4px 10px -3px rgba(0,0,0,0.6); }
.fc-uwagi-licznik .u-b:active { transform: translateY(0); }
.fc-uwagi-licznik .u-todo { background: #FFE100; color: #1a1a1a; }
.fc-uwagi-licznik .u-todo i { width: 7px; height: 7px; border-radius: 999px; background: #1a1a1a; display: inline-block; }
.fc-uwagi-licznik .u-done { background: #28C76F; color: #fff; }
/* skok nawigacyjny do uwagi — chwilowe podświetlenie */
.fc-uwaga.nawigacja-hit .pin { animation: fcUwagaPuls 1.8s ease-out; }
@keyframes fcUwagaPuls {
  0% { box-shadow: 0 0 0 0 rgba(255,225,0,0.9); transform: scale(1.5); }
  100% { box-shadow: 0 0 0 22px rgba(255,225,0,0); transform: scale(1); }
}
.fc-uwaga.zrobiona.nawigacja-hit .pin { animation: fcUwagaPulsZ 1.8s ease-out; }
@keyframes fcUwagaPulsZ {
  0% { box-shadow: 0 0 0 0 rgba(40,199,111,0.9); transform: scale(1.5); }
  100% { box-shadow: 0 0 0 22px rgba(40,199,111,0); transform: scale(1); }
}

/* telefon: linki w pasku kontaktowym i stopce miały ~17px wysokości pola dotyku.
   Padding + ujemny margines = większe pole bez zmiany wyglądu/odstępów. */
@media (max-width: 980px) {
  .fc-tb-link { padding: 6px 0; margin: -6px 0; }
  .fc-footer .ft-col a, .fc-footer .ft-legal a { padding: 6px 0; } /* inline: padding nie zmienia układu */
  .fc-footer .ft-addr a { padding: 2px 0; } /* wiersze co ~25px — większy padding nachodziłby na sąsiedni telefon */
}

/* telefon (≤600px): góra strony zajmowała ~275px z 844 (pasek kontaktów w 3 wierszach,
   belka ogłoszeń w 5, nagłówek 83px). Pasek kontaktów w JEDNYM wierszu: główny telefon
   + e-mail (pozostałe numery i godziny zostają w DOM, w menu i w stopce); belka niższa
   (mniejsza czcionka i odstępy, bez ikony); nagłówek w wysokości „po przewinięciu".
   JS przelicza --top-stack-h z realnej wysokości, więc treść zjeżdża razem. Desktop bez zmian. */
@media (max-width: 600px) {
  .fc-topbar-utility { padding: 6px 0; }
  .fc-topbar-utility .container-wide { flex-direction: row; justify-content: center; gap: 0; }
  .fc-tb-contacts { flex-wrap: nowrap; gap: 0 18px; }
  .fc-tb-contacts .fc-tb-link:nth-of-type(n+2):not(.fc-tb-mail) { display: none !important; }
  .fc-tb-hours { display: none; }
  .fc-topbar-anno { min-height: 0; padding: 5px 0; }
  .fc-topbar-anno .container-wide { gap: 10px; }
  .fc-redesign .fc-topbar-anno,
  .fc-redesign .fc-topbar-anno .txt { font-size: 11px; letter-spacing: 0; }
  .fc-topbar-anno .txt { line-height: 1.3; }
  .fc-topbar-anno .ico { display: none; }
  .fc-anno-close { width: 22px; height: 22px; }
  .fc-anno-close::before { inset: -10px; }
  .fc-header { padding: 12px 0; }
}