/* ============================================================================
   bgpw-podstawy.css — PODSTAWY
   ----------------------------------------------------------------------------
   Rzeczy uzywane w calym serwisie, niezalezne od ukladu strony i od Joomli:
   maski ikon SVG, kotwice, zamienniki stylow wpisywanych dawniej w tresc.

   TEN PLIK PRZECHODZI DO DRUPALA praktycznie bez zmian. Nie ma tu niczego,
   co zalezy od Artisteera ani od struktury szablonu.

   KOLEJNOSC LADOWANIA: template.css, custom.css, TEN PLIK, bgpw-komponenty.css,
   custom-articles.css, template.responsive.css. Nie zmieniac — podzial opiera
   sie na zachowaniu wzglednego polozenia regul.

   Wydzielone z custom.css 2026-10-27, linie 2233-2297 oraz 2444-2465.
   ============================================================================ */

/*ukryte_naglowki tabel - thead oraz inne elementy DOM*/
.naglowki_ukryte,.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Ikona linku zewnętrznego */
.external-link-icon {
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  margin-left: 0.3em;
  vertical-align: baseline;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  flex-shrink: 0;
}

/* Nie pokazuj ikony przy linkach-obrazkach */
a[target="_blank"]:has(> img) .external-link-icon { display: none; }

/* Tryb wysokiego kontrastu — maska CSS bywa niewidoczna */
@media (forced-colors: active) {
  .external-link-icon {
    background-color: LinkText;
  }
}

/* Ikona nie łamie się do nowej linii sama */
a[target="_blank"] {
  word-break: break-word;
}



/* --- A1. Ikony ------------------------------------------------------------
   Użycie:  <span class="ikona ikona-email" aria-hidden="true"></span>
   Ikona to maska SVG wypełniona kolorem tła: kolor zmienia jedna właściwość,
   rozmiar idzie za rozmiarem tekstu (1em), nie jest potrzebny żaden font.   */

.ikona{
  display:inline-block;
  width:1em;
  height:1em;
  margin-right:5px;
  vertical-align:-0.125em;
  background-color:#3c3c4c;
  -webkit-mask:var(--ikona) center / contain no-repeat;
  mask:var(--ikona) center / contain no-repeat;
}
/* Ikona z wlasnym inline font-size jest WIEKSZA od otaczajacego tekstu.
   Bazowe vertical-align:-0.125em liczy sie we wlasnym em IKONY, wiec przy
   powiekszeniu wypycha ja ponad linie tekstu: przy 19px na tekscie 16px
   srodek ikony lezy 7,1px nad linia bazowa, a srodek wersalikow na 5,6px.
   middle centruje wzgledem wysokosci x RODZICA i o to tu chodzi.
   Selektor trafia wylacznie w ikony z wlasnym rozmiarem: krzyzyki, godziny,
   pinezki i spisy maja rozmiar tekstu i zostaja przy bazowym -0.125em.
   Docelowo font-size i marginesy zejda z tresci do arkusza i wtedy ta
   regula ustapi miejsca klasie modyfikujacej. 2026-10-27. */
.ikona[style*="font-size"]{
  vertical-align:middle;
}
.ikona-email{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18l-9 7zM2 6.5l10 7.8 10-7.8V19H2z'/%3E%3C/svg%3E");
}
.ikona-telefon{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='2.3 1.3 20.4 20.4'%3E%3Cpath d='M4 3h5l1 5-2.4 1.6a11 11 0 0 0 6.8 6.8L16 14l5 1v5C10 20 4 14 4 3z'/%3E%3C/svg%3E");
}
.ikona-adres{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a7 7 0 0 0-7 7c0 5 7 13 7 13s7-8 7-13a7 7 0 0 0-7-7zm0 9.5a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5z'/%3E%3C/svg%3E");
}
.ikona-zegar{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16zM11 7h2v4.6l3.2 1.9-1 1.7L11 12.7z'/%3E%3C/svg%3E");
}
/* tryb wysokiego kontrastu Windows wymusza kolor tła — bez tego ikony znikają */
@media (forced-colors: active){
  .ikona{background-color:CanvasText;}
}

/* --- A2. Kotwice ---------------------------------------------------------
   Zastępuje sztuczkę z pustym <span class="anchor_not_link"> przesuniętym
   o -150 px. Przeglądarka sama zostawia miejsce na przyklejony pasek przy
   każdym skoku do kotwicy i przy przewijaniu do elementu z fokusem.
   Pasek jest przyklejony tylko od 1100 px, więc reguła obowiązuje tylko tam.
   49 px paska + 11 px zapasu; zwiększ, jeśli wolisz większy odstęp.

   UWAGA: scroll-margin-top na samym nagłówku tu NIE zadziała — .pasiak ma
   overflow:hidden i margines jest obcinany do jego pudełka.                 */

@media (min-width: 1100px){
  html{
    scroll-padding-top:150px;
  }
}

/* --- A10. Wizytowka, informacja, strzalka w gore --------------------------
   Zastepuja klasy IcoMoon "icon-vcard", "icon-info" i "icon-uparrow".
     <span class="ikona ikona-wizytowka" aria-hidden="true"></span>         */

.ikona-wizytowka{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M3 5h18a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V6a1 1 0 0 1 1-1zM8.5 9.5a2 2 0 1 0 0 4 2 2 0 0 0 0-4zM5.5 17c0-1.7 1.3-2.5 3-2.5s3 .8 3 2.5zM14 9h5v1.6h-5zM14 12h5v1.6h-5zM14 15h3.5v1.6H14z'/%3E%3C/svg%3E");
}
.ikona-informacja{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2a8 8 0 1 1 0 16 8 8 0 0 1 0-16zm-1 3h2v2h-2zm0 4h2v6h-2z'/%3E%3C/svg%3E");
}
/* Nagranie wideo. Zastepuje klase IcoMoon "icon-video-2" w art. 1043,
   przy linkach do prezentacji .mp4. Konstrukcja jak w ikonie informacja:
   pierscien plus wypelniony znak w srodku, zasieg 2..22 w obu osiach,
   czyli 83% pola 1em zgodnie z przyjetym standardem. 2026-10-27. */
.ikona-nagranie{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2.2a7.8 7.8 0 1 1 0 15.6 7.8 7.8 0 0 1 0-15.6zM9.8 7.6l6.6 4.4-6.6 4.4z'/%3E%3C/svg%3E");
}
.ikona-strzalka-gora{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='3 2.5 18 18'%3E%3Cpath d='M12 4l7 7h-3.2v8H8.2v-8H5z'/%3E%3C/svg%3E");
  margin-right:0;
  background-color:currentColor;
}