/* ============================================================================
   bgpw-komponenty.css — KOMPONENTY
   ----------------------------------------------------------------------------
   Powtarzalne elementy tresci: paski godzin otwarcia, spis tresci, strony
   kursow, link do galerii, tabele, okna map i planow pieter. Kazdy zaczepiony
   o klase w TRESCI artykulu albo o Page Class pozycji menu — nie o id artykulu.

   TEN PLIK PRZECHODZI DO DRUPALA i to jest wlasnie to, co zespol instytucjonalny
   ma dostac. Od Artisteera zalezy tylko tam, gdzie selektor zawiera .art-* —
   te miejsca sa do PODMIANY selektora, nie do wyrzucenia reguly.

   KOLEJNOSC LADOWANIA: template.css, custom.css, bgpw-podstawy.css, TEN PLIK,
   custom-articles.css, template.responsive.css. Nie zmieniac.

   Wydzielone z custom.css 2026-10-27, linie 2298-2443 oraz 2466-2726.
   ============================================================================ */

/* anulowanie oplywanie obrazka*/
.tamowanie{
  clear:both;
  height:0;
}
/*serwis dziedzinowy - tabele*/
.serwis .art-article table td{
border:none;
}
.serwis table tr td:first-child{
text-align: center;
padding-right:20px;
}
.serwis table tr td:last-child{
text-align: left;
vertical-align:middle;
}
.serwis table thead{
display:none;
}
/* serwis dziedzinowy - marginesy */
.serwis img{
  margin:0;
  transition: all .2s ease-in-out;
}
.serwis img:hover{
  transform: scale(1.1);
}
.serwis .wizytowka img:hover, .serwis .art-postheadericons img:hover{
  transform:none;
}
.serwis p{
  margin: 5px 0 !important;
}
.serwis .art-article .tab-content div *{
color: #000 !important;
}
.serwis .art-article .tab-content div a{
color: #373399 !important;
}
.serwis .art-article .tab-content div a:hover{
color: #000 !important;
}
.serwis .art-postcontent h1, .serwis .art-postcontent h2,.serwis .art-postcontent h3,.serwis .art-postcontent h4{
  font-size:16px !important;
  text-transform:uppercase !important;
  font-weight:bold !important;
  margin: 30px 0 10px !important;
}
.serwis .art-postcontent h1 *, .serwis .art-postcontent h2 *,.serwis .art-postcontent h3 *,.serwis .art-postcontent h4 *{
  font-size:16px !important;
  text-transform:uppercase !important;
  font-weight:bold !important;
}
body .serwis .art-postcontent .bg_tabs h3{
  font-size:20px !important;
  text-transform: none !important;
font-weight: bold !important;
}
.serwis .art-postcontent h5{
margin: 5px 0 !important;
font-size:16px !important;
font-weight:bold;
text-transform:none !important;
}
.serwis .art-postcontent h5 *{
  font-size:16px !important;
font-weight:bold;
text-transform:none !important;
}
.serwis .tab-content{
  padding-top:15px;
}
.ograniczony .tab-content *{
background-color: transparent !important;
}
.ograniczony .tab-content *{
font-size:16px !important;
}
.serwis.ograniczony .tab-content img{
margin:8px 10px !important;
}

/* wykaz dzialow*/
.art-postcontent .tabela-wykaz td a{
  margin-top: 10px;
display: inline-block;
  line-height:140%;
}
/* lista e-baz*/
.bazy .pasiak .lewy{
  width:50%;
margin-right:4%;  
}
.bazy .pasiak .prawy{
  width:46%;
}
.bazy .art-article img, .bazy img.art-article,#wiecej_zasady #zasady_e-bazy img{
  margin:0;
}
.bazy .pasiak:nth-child(2n){
  background-color:#fefefe;
}
.bazy .pasiak:nth-child(2n+1){
  background-color:#f6f6f6;
}
/* linki do bibliotek w godzinach*/
.art-postcontent a.linki-biblioteki{
  text-decoration:underline;
  font-size:12pt;
  line-height:100%;
}
/* linki do prezentacji e-learningowych */
.art-postcontent a.linki-prezentacje{
  font-size:12pt;
  line-height:100%;
}


/*bibliometria*/
.item-page.bibliometria .art-postcontent,.item-page .art-postcontent:has(.bibliometria_naglowek){
  margin-top:5px;
}

.bibliometria_naglowek{
display: flex;
justify-content: space-around;
align-items: center;
  min-height:100px;
  background-image:radial-gradient(circle at 0% 0%,#004A6C 35%, #fff 98%)
}
.bibliometria_naglowek > div, .bibliometria_naglowek > h2{
font-size: 28px;
width: 65%;
padding: 10px;
box-sizing:border-box;
  color:#fff;
  line-height:110%;
  margin:0;
}
.bibliometria_naglowek > img{
  width:130px;
}
/*menu wektorowe - bibliometria i serwis dziedz*/
.art-post .art-article .pozycja{
  margin: 15px 10px;
  padding:0;

background-repeat: no-repeat;
background-position: center top;
box-sizing: border-box;
  transition:all 0.4s;
}
.art-post .art-article .pozycja:before{
  display:none;
}
.art-post .art-article .pozycja a{
  color: #004A6C;
width: 100%;
height: 100%;
display: flex;
text-align: center;
justify-content: center;
text-decoration: none;
padding: 5px 5px 5%;
line-height: 120%;
font-weight: bold;
box-sizing: border-box;
}
.art-post .art-article .pozycja a span{
 display: inline-block;
position: relative; 
}
.bibliometria .wektor-bib{
width: 200px;
height: 160px;
  background-size: auto 45%;
}
.bibliometria .wektor-bib:hover{
  filter:grayscale(100%) brightness(55%);
  background-size:auto 50%;
}
.bibliometria .wektor-bib a{
  font-size:20px;
}
.bibliometria .wektor-bib a span{
  top: 58%;
height: 35%;
}
.serwis .wektor-dz{
  width:170px;
  height:150px;
  background-size: auto 40%;
}
.serwis .wektor-dz:hover{
  background-size:auto 45%;
  filter:grayscale(100%) brightness(55%);
}
.serwis .wektor-dz a{
  font-size:18px;
}
.serwis .wektor-dz a span{
  top: 52%;
height: 35%;
}

/*galeria - godziny*/
.godziny.ikonki .pasiak > p{
margin-bottom:5px;
}
.godziny.ikonki .pasiak .lewy{
width:40%;
margin-right: 7%;
}
.godziny.ikonki .pasiak .prawy{
width:45%;
margin-right:3%;
}
/* Usunieto 2026-10-27: trzy zakomentowane bloki z glifami IcoMoona —
   ikony godzin otwarcia, aparat w pasiaku i wariant .aparat-resp.
   Wszystkie zastapione maskami SVG i klasami .ikona-*, a .aparat-resp
   oraz a.icon-camera nie wystepuja juz w zadnym artykule. */
.godziny.ikonki .pasiak .prawy-2{
float:left;
box-sizing:border-box;
width:10%;
min-height:60px;
}
.godziny.ikonki .pasiak .prawy p:nth-child(2), .godziny.ikonki .pasiak .prawy p:nth-child(3), .godziny.ikonki .pasiak .prawy p:nth-child(4){
padding-left:22px;
}
.godziny .pasiak h4{
font-size:16px;
margin-top:0;
}

/*galeria - interactive image*/
.interactive-image .item .text-item a {
    color: rgb(0, 51, 153);
}
.art-postcontent .interactive-image ul > li::before, .art-post .interactive-image ul > li::before, .art-textblock .interactive-image ul > li::before{
/* Glif bral kolor z color, maska maluje sie przez background-color. */
background-color:#000;
}
/*galeria - ekran startowy*/
.galeria div.galeria_kontener{
display: flex;
flex-flow: row wrap;
justify-content: center;
}
.galeria div.galeria_pietro h3{
padding:7px 0;
margin:0;
  background-color:#C0D1C8;
}
.galeria div.galeria_img{
margin: 5px;
width: 225px;
height: 268px;
display: flex;
justify-content: center;
align-items: center;
background-repeat:no-repeat;
background-position:center;
}
.galeria .art-postcontent a.galeria_link{
  position:relative;
display:flex;
justify-content:center;
  flex-direction:column;
text-align:center;
align-items:stretch;
font-size:18px;
color:white;
text-decoration:none;
text-shadow: 0px 1px 3px rgba(0,0,0,0.95);
width:100%;
height:100%;
text-transform:uppercase;
font-weight:bold;
font-family:arial;
background:
     linear-gradient(
       to bottom, rgba(0,0,0,0.3) 0%,
       rgba(0,0,0,0.3) 100%
     );
    background-position: 0 50%;
    background-repeat: repeat-x;
    background-size: 100% 45%;
	transition: all ease .2s;
  padding: 5px;
box-sizing: border-box;
}
.galeria a.galeria_link:hover{
background-size:100% 100% !important;
color:#C0D1C8;
text-decoration:none;
}

.galeria a.galeria_link span{
  display:block;
  margin-bottom:15px;
  width:100%;
  font-size:25px;
}
/* Aparat w kafelku galerii: bialy symbol na zdjeciu, nie ikonka przy tekscie.
   Glif IcoMoona bral kolor z color:white reguly a.galeria_link, a maska
   maluje sie przez background-color — stad zwiazanie z currentColor.
   Dzieki temu dziala tez zmiana koloru przy najechaniu (#C0D1C8).
   margin-right z bazy .ikona zerujemy, bo ikona jest tu blokiem na cala
   szerokosc i 5px zepchneloby ja z osi. Rozmiar 25px i odstep pod spodem
   daje regula .galeria a.galeria_link span o wadze (0,2,2). 2026-10-27. */
.galeria a.galeria_link .ikona{
  background-color:currentColor;
  margin-right:0;
}
.galeria div.galeria_pietro{
  text-align:center;
  margin:35px 0 25px 0;
  text-transform:uppercase;
}
/* Znacznik w galerii jest bialy; w pionie bibliotecznym zostaje zielony
   z bazy w interactive-image.bgpw.css. Po przejsciu na maske SVG kolor
   daje background-color, a nie color — dawna deklaracja przestala dzialac
   i to ja tu zastepujemy. 2026-10-27. */
.galeria .tabelka-scroll .bialy_znacznik.interactive-image .hotspot {
    background-color: #fff;
}
.galeria .tabelka-scroll .bialy_znacznik.interactive-image .item {
    text-align: left;
}

/* ruchomy spis tresci */
#spis{
display:flex;
position:relative;
top:55px;
z-index:1;
}
.responsive div#spis{
top:5px;
}

.sidepanel {
  height: 520px;; /* Specify a height */
  width: 0; /* 0 width - change this with JavaScript */
  position: absolute; /* Stay in place */
  z-index: 1; /* Stay on top */
  top: 35px;
  left: 0;
  background-color: #C0D1C8; /* Black*/
  overflow-x: hidden; /* Disable horizontal scroll */
overflow-y:scroll;
  padding-top: 20px; /* Place content 60px from the top */
  transition: 0.5s; /* 0.5 second transition effect to slide in the sidepanel */
border-top:2px solid black;
}

.sidepanel a {
  padding: 4px 8px 4px 32px;
  text-decoration: none;
  font-size: 17px !important;
  color: #000 !important;
  display: block;
  transition: 0.3s;
text-decoration:none !important;

}
.sidepanel a:hover{
text-decoration:underline !important;
}
.sidepanel ol li a{
padding:0px;
display:inline;
}

.menu-btn-wrapper{
width:160px;
display:flex;
top:55px;
align-items:center;
justify-content:center;
text-decoration:none !important;;
color:#000 !important;
cursor:pointer;
background-color:#C0D1C8;
padding:3px;
height:35px;
box-sizing:border-box;
border: 0;
  box-shadow: none;
  border-radius: 0px;

}
.menu-btn {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
 padding-right:5px;
  cursor: pointer;
  transition: all .3s ease-in-out;
}
.menu-btn__burger {
  width: 20px;
  height: 3px;
  background: #000;
  border-radius: 2px;
  transition: all .5s ease-in-out;

}
.menu-btn__burger::before,
.menu-btn__burger::after {
  content: '';
  position: absolute;
  display:flex;
  width: 20px;
  height: 3px;
  background: #000;
  border-radius: 2px;
  transition: all .5s ease-in-out;
}
#spis .menu-btn-wrapper span{
font-size:19px;
}
.menu-btn__burger::before {
  transform: translateY(-6px);
}
.menu-btn__burger::after {
  transform: translateY(6px);
}
/* ANIMATION */
.menu-btn.open .menu-btn__burger {
  background: transparent;
  box-shadow: none;
}
.menu-btn.open .menu-btn__burger::before {
  transform: rotate(45deg) translate(35px, -35px);
transform: rotate(45deg);
}
.menu-btn.open .menu-btn__burger::after {
  transform: rotate(-45deg) translate(35px, 35px);
transform: rotate(-45deg);
}

/* Naglowki z kolorowym tlem.
   Podwojona klasa daje (0,2,0) — tyle, ile mial stary selektor z .art-postcontent.
   Bez tego regula typografii Artisteera (.art-postcontent h3, waga 0,1,1)
   wygralaby font-size i text-transform.
   NIE upraszczac do jednej klasy — stracilaby z Artisteerem.
   Dawna nazwa klasy: yellow_h, zmieniona 2026-10-26. */
.bg-naglowek-wyrozniony.bg-naglowek-wyrozniony{
margin: 25px 0 15px -10px;
  padding: 7px 0 7px 10px;
  background-color: #C0D1C8;
  display: block;
  text-transform: uppercase;
  font-size: 17px;
  line-height:150%;
}
/* uklad dzialowy - nawigacja*/
.wykaz_nav div{
display:flex;
flex-direction:row;
justify-content:flex-start;
}
.wykaz_nav ul{
list-style-type:none;
flex:1 1 0;
}
.wykaz_nav ul:first-child{
border-right:solid 1px #C7C7C7;
}
/* Punktor witryny jest od 2026-10-27 maska SVG, a nie glifem IcoMoona.
   Maska ma wlasne width/height, wiec oproznienie content juz niczego nie
   chowa — pudelko nadal sie maluje. content:none usuwa pseudoelement. */
.wykaz_nav ul > li::before{
content:none;
}
.wykaz_nav ul > li{
line-height:170%;
}

.tabela_formatowana caption,.art-postcontent .tabela_formatowana tr td.align_left{
  text-align:left;
}
.art-postcontent .tabela_formatowana tr th,.art-postcontent .tabela_formatowana tr td{
  text-align:center;
  vertical-align: middle;
}


/*katalogi kartkowe*/
article form.katalogi_kartkowe_form{
margin-top:30px !important;
}
article form.katalogi_kartkowe_form fieldset{
border: 1px solid #bdbdbd;
}
form.katalogi_kartkowe_form div,form.katalogi_kartkowe_form input,form.katalogi_kartkowe_form label{
  margin:5px;
}
form.katalogi_kartkowe_form input{
  width:80px;
  height:24px;
  padding:0 4px;
}
form.katalogi_kartkowe_form select{
  height:24px;
  max-width: 200px;
}
form.katalogi_kartkowe_form label{
	width:auto;
	font-weight:bold;
}
form.katalogi_kartkowe_form .form_katkart_blok{
	display: flex;
	align-items: center;
	flex-wrap:wrap;
}

form.primo_search_tabs{
  display:flex;
  width:90%;
  justify-content: flex-end;
  flex-wrap:wrap;
  margin-left: 6px !important;
}

input.primoQueryTemp{
width: calc(100% - 180px);
box-sizing: border-box;
height: 30px;
border-left: 1px solid #bdbdbd;
border-top: 1px solid #bdbdbd;
border-bottom: 1px solid #bdbdbd;
box-shadow:none;
font-size:16px;  
}

.primo_go{
width: 90px;
border: none;
height: 30px;
background-color: #004A6C;
color:#fff;
font-size: 16px;
box-sizing: border-box;
margin:0;
cursor:pointer;
}
.primo_account{
display:flex;
width: 90px;
border: none;
height: 30px;
background-color: #C0D1C8;
font-size: 16px;
box-sizing: border-box;
color:#000 !important;
justify-content: center;
align-items: center;
text-decoration:none !important;
}
.responsive form input.primoQueryTemp{
  width: calc(100% - 90px);
}

.tabelka_wyszukiwarki tbody tr:nth-child(2) td{
  padding:6px 0 6px 6px;
}
/* accordion własny BG */
  .bg-accordion {
    list-style: none;
    padding: 0;
    margin: 0 !important;
    width: 100%;
	box-sizing: border-box;
  }
.bg-accordion.green .bg-accordion-header,.bg-accordion-item.green .bg-accordion-header{
   background:#C0D1C8;
}
.bg-accordion.green .bg-accordion-item,.bg-accordion-item.green{
  border: 1px solid #C0D1C8; 
}
  .bg-accordion-item {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 6px;
    margin-bottom: 8px !important;
	margin-top: 8px;
    overflow: hidden;
	box-sizing: border-box;
	padding:0px !important;
	display: flex;
  }
  li.bg-accordion-item::before{
  display:hidden;
  }
  .bg-accordion-details {
    width: 100%;
    background: #fff;
	box-sizing: border-box;	    
  }
  .bg-accordion-header {
    width: 100%;
    background: #f5f5f5;
    border: none;
    padding: 8px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
	box-sizing: border-box;
  }
.bg-accordion-header::-webkit-details-marker {
  display: none;
}
.bg-accordion-header:focus-visible {
  outline: 3px solid #004a6c;
  outline-offset: -3px;
}
  .bg-accordion-header::-webkit-details-marker {
    display: none;
	box-sizing: border-box;
  }
  .bg-accordion-header .icon {
    flex-shrink: 0;
    width: 16px;
    height: 16px;
    margin-left: 8px;
    transition: transform 0.3s ease;
	box-sizing: border-box;
  }
  .bg-accordion-details[open] > .bg-accordion-header .icon {
    transform: rotate(180deg);
	box-sizing: border-box;
  }

  /* pure CSS animation: grid-template-rows 0fr -> 1fr, driven only by [open] */
  .bg-accordion-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.3s ease;
	box-sizing: border-box;
  }
  .bg-accordion-details[open] > .bg-accordion-body {
    grid-template-rows: 1fr;
	box-sizing: border-box;
  }
  .bg-accordion-body-inner {
    overflow: hidden;
	box-sizing: border-box;
	display:flex;
	flex-direction:row;
	flex-wrap:wrap;
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .bg-accordion-body-inner p {
    padding: 12px 16px 8px;
    margin: 0;
	box-sizing: border-box;
    flex: 0 0 100%;
  }
.bg-accordion-body-inner table,.bg-accordion-body-inner h4 {
  margin: 12px 16px 8px !important;
  box-sizing: border-box;
}

  .bg-accordion-close {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 4px 16px 12px;
    padding: 6px 10px;
    background: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 15px;
    cursor: pointer;
	box-sizing: border-box;
	flex-grow: 1;
	width: 100%;
	justify-content: center;
  }
  .bg-accordion-close .icon {
    width: 14px;
    height: 14px;
    transform: rotate(180deg);
	box-sizing: border-box;
  }
/* ── Struktura organizacyjna BG PW (rozszerzenie .bg-accordion) ── */
.bgpw-org {
  max-width: 60rem;
  margin: 0 auto;
  line-height: 1.5;
}
.bgpw-org h2 { font-size: 1.5rem; margin: 0 0 0.5rem; }
.bgpw-org h3 {
  font-size: 1.125rem;
  margin: 1.75rem 0 0.75rem;
  padding-bottom: 0.375rem;
  border-bottom: 3px solid var(--g-akcent, #bdbdbd);
}
.bgpw-org .org-legend { margin: 0 0 1rem; font-size: 0.9375rem; color: #595959; }

/* Kolory grup — paleta z księgi znaku: #004a6c, #c0d1c8, szarości.
   #dce8ee = tinta #004a6c, #00344d = przyciemnienie #004a6c.
   Kontrasty nagłówków (WCAG AA wymaga >= 4,5:1):
   dyrekcja     #ffffff na #004a6c =  9,6:1 | #c0d1c8 na #004a6c = 6,0:1
   pelnomocnicy #262626 na #ececec = 12,8:1 | #595959 na #ececec = 5,9:1
   oddzialy     #004a6c na #c0d1c8 =  6,0:1 | #3d3d3d na #c0d1c8 = 6,8:1
   filie        #004a6c na #dce8ee =  7,7:1 | #3d5a6b na #dce8ee = 5,9:1
   Wnetrza kart pozostaja biale (style witryny), wiec tresc ma
   domyslne, wysokie kontrasty tekstu i linkow. */
.bgpw-org .grp-dyrekcja     { --g-akcent:#004a6c; --g-bg:#004a6c; --g-ramka:#00344d; --g-nazwa:#ffffff; --g-osoba:#c0d1c8; }
.bgpw-org .grp-pelnomocnicy { --g-akcent:#8a8a8a; --g-bg:#ececec; --g-ramka:#c9c9c9; --g-nazwa:#262626; --g-osoba:#595959; }
.bgpw-org .grp-oddzialy     { --g-akcent:#c0d1c8; --g-bg:#c0d1c8; --g-ramka:#9db5a9; --g-nazwa:#004a6c; --g-osoba:#3d3d3d; }
.bgpw-org .grp-filie        { --g-akcent:#004a6c; --g-bg:#dce8ee; --g-ramka:#aec8d6; --g-nazwa:#004a6c; --g-osoba:#3d5a6b; }

/* Siatka kart (zawija sie do 1 kolumny na waskich ekranach) */
.bgpw-org ul.org-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
  gap: 0.75rem;
}
.bgpw-org ul.org-grid > li::before { content: none; }        /* neutralizacja bulletow witryny */
.bgpw-org .org-grid .bg-accordion-item { margin: 0 !important; border-color: var(--g-ramka); }

/* Kolor naglowka wg grupy (wieksza specyficznosc niz .bg-accordion-header,
   wiec nadpisuje tlo #f5f5f5 z template.css bez !important) */
.bgpw-org .grp-dyrekcja .bg-accordion-header,
.bgpw-org .grp-pelnomocnicy .bg-accordion-header,
.bgpw-org .grp-oddzialy .bg-accordion-header,
.bgpw-org .grp-filie .bg-accordion-header { background: var(--g-bg); color: var(--g-nazwa); }

/* Siatka wyrownuje wysokosc kart w wierszu; kolorem grupy wypelniamy
   caly <details> (nie tylko summary), a rozwijana tresc przykrywamy
   bielem — dzieki temu zwinieta karta nie ma bialego paska pod
   naglowkiem, niezaleznie od wysokosci sasiadow w wierszu */
.bgpw-org .org-grid .bg-accordion-details {
  background: var(--g-bg);
  height: 100%;
	display: grid;
	grid-template-rows: minmax(auto, 100px) 1fr;}
.bgpw-org .org-grid .bg-accordion-body-inner { background: #fff; }

.bgpw-org .org-name  { display: block; font-weight: bold; color: var(--g-nazwa); }
.bgpw-org .org-osoba { display: block; /*font-size: 0.9375rem;*/ color: var(--g-osoba); }

/* Sekcje wewnatrz oddzialu */
.bgpw-org ul.org-sekcje { list-style: none; margin: 0.25rem 1rem 0.75rem; padding: 0; flex: 0 0 100%; max-width: 90%;}
.bgpw-org ul.org-sekcje > li { margin: 0.5rem 0 0; padding: 0.5rem 0.75rem; background: #f5f5f5; border-left: 4px solid var(--g-akcent); }
.bgpw-org ul.org-sekcje > li::before { content: none; }

.bgpw-org details:not(:open) summary{
  height:100%;
}

/* Przycisk "rozwin / zwin wszystkie" — widoczny tylko z dzialajacym JS */
.bgpw-org .org-toggle {
  display: none;
  margin: 0 0 1rem;
  padding: 0.5rem 1rem;
  background: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 4px;
  cursor: pointer;
}
.bgpw-org.js .org-toggle { display: inline-block; }
.bgpw-org .org-toggle:hover { background: #ececec; }
.bgpw-org .org-toggle:focus-visible { outline: 3px solid #004a6c; outline-offset: 2px; }

@media print {
  .bgpw-org .org-toggle, .bgpw-org .bg-accordion-close, .bgpw-org .icon { display: none; }
  .bgpw-org .bg-accordion-body { grid-template-rows: 1fr; }
}
  
/* tabs własny BG*/
  /* ==== KONTENER ZAKŁADEK ==== */
  .bg_tabs {
    box-sizing: border-box;
    margin: 10px auto 0;
  }

  /* ==== PASEK "UCHWYTÓW" (handles) - wyśrodkowany, na górze ==== */
  .bg_tabs_handles {
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   /* align_center */
    gap: 4px;
    border-bottom: 1px solid #bdbdbd;
    margin-bottom: 0;
  }

  .bg_tabs_handles [role="tab"] {
    box-sizing: border-box;
    display: inline-block;
    padding: 12px 10px;
    cursor: pointer;
    font-weight: 600;
    font-family: inherit;
    color: #55606b;
    background: #e9ebec;
    border: 1px solid #bdbdbd;
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    margin-bottom: 0px;
    transition: background 0.25s ease, color 0.25s ease, transform 0.15s ease;
    user-select: none;
	font-weight: bold;
	font-size: 16px;
  }

  .bg_tabs_handles [role="tab"]:hover {
    box-sizing: border-box;
    background: #dfe3e5;
    color: #2c3640;
  }

  /* Aktywna zakładka — stan sterowany atrybutem aria-selected (nie klasą!) */
  .bg_tabs_handles [role="tab"][aria-selected="true"] {
    box-sizing: border-box;
    background: #004A6C;
	color: #fff;
	border-color: #004A6C;
	box-shadow: #004A6C 0 1px;
  }

  .bg_tabs_handles [role="tab"]:focus-visible {
    box-sizing: border-box;
    outline: 2px solid #005ea8;
    outline-offset: 2px;
  }

  /* ==== PANEL TREŚCI (outline_content) ==== */
  .bg_tabs_content {
    box-sizing: border-box;
    border-top: none;
    background: #ffffff;
    border-radius: 0;
    min-height: 160px;
  }

  .bg_tabs_content [role="tabpanel"] {
    box-sizing: border-box;
    padding: 0 8px 30px;
    animation: fadeIn 0.35s ease;
  }

  .bg_tabs_content [role="tabpanel"][hidden] {
    box-sizing: border-box;
    display: none;
  }

  .bg_tabs_content [role="tabpanel"]:focus-visible {
    box-sizing: border-box;
    outline: 2px solid #005ea8;
    outline-offset: -2px;
  }

  @keyframes fadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
  }

  .bg_tabs_content [role="tabpanel"] h3 {
    margin-bottom: 15px;
  }

  .bg_tabs_content [role="tabpanel"] p {
    box-sizing: border-box;
    line-height: 1.6;
    margin: 0 0 12px;
  }

  .bg_tabs_content [role="tabpanel"] ul {
    box-sizing: border-box;
    line-height: 1.7;
  }
  .bg_tabs_content:has(.tabelka_wyszukiwarki),.custom.panel .bg_tabs_content {
  border: 1px solid #bdbdbd;
  border-top:none;
	}
	.bg_tabs_content:has(.tabelka_wyszukiwarki) [role="tabpanel"],.custom.panel .bg_tabs_content [role="tabpanel"] {
  padding: 0 2px;
}

  @media (max-width: 600px) {
    .bg_tabs_handles {
      box-sizing: border-box;
      justify-content: stretch;
    }
    .bg_tabs_handles [role="tab"] {
      box-sizing: border-box;
      flex: 1 1 auto;
      text-align: center;
      border-radius: 0;
    }
    .bg_tabs_content [role="tabpanel"] {
      box-sizing: border-box;
      padding: 20px;
    }
  }
.grey{
  background:#f5f5f5;
}
dt{
  margin-top:10px;
}


/* --- A3. Tabela godzin ----------------------------------------------------
   Dni tygodnia są teraz nagłówkami wierszy <th scope="row">; mają wyglądać
   jak zwykła komórka.                                                       */

.godziny.ikonki .pasiak .prawy tbody th{
  min-width:70px;
  padding:0 0 0 20px;
  border:0;
  font-weight:normal;
  text-align:left;
  vertical-align:top;
}

/* --- A4. Zamienniki stylów wpisanych w treść ------------------------------ */

/* zamiast style="font-size: 12pt" na linku w nagłówku */
.godziny.ikonki .pasiak h4 a{
  font-size:inherit;
}

/* zamiast style="border-bottom: none" na ostatnim bloku w grupie */
.godziny.ikonki section > section:last-child > .pasiak{
  border-bottom:none;
}

/* --- A5. NOWE: wcięcie drugiej linii pod tekst, nie pod ikonę --------------
   Dotyczy każdego akapitu zaczynającego się od ikony: gdy tekst się zawinie
   albo ma <br>, kolejne linie zaczynają się równo z tekstem pierwszej.
   Zastępuje <span style="margin-left: 20px;"> w treści.                     */
 
.godziny.ikonki .pasiak p:has(> .ikona:first-child){
  padding-left:calc(1em + 5px);
  text-indent:calc(-1em - 5px);
}
 
/* --- A6. NOWE: link do galerii (aparat) -----------------------------------
   Jeden link zamiast dwóch (a.icon-camera + p.aparat-resp):
     <a class="galeria-link" href="…"><span class="ikona ikona-aparat"
     aria-hidden="true"></span><span class="galeria-link-tekst">Gallery<span
     class="visually-hidden"> – Computer Lab</span></span></a>
   Od 741 px: sama duża ikona, tekst zostaje tylko dla czytników ekranu.
   Do 740 px: mała ikona i widoczny napis, jak dotychczas.                   */
 
.ikona-aparat{
  --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 7h3.5L8 5h8l1.5 2H21a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V8a1 1 0 0 1 1-1zm9 2a4.5 4.5 0 1 0 0 9 4.5 4.5 0 0 0 0-9zm0 1.5a3 3 0 1 0 0 6 3 3 0 0 0 0-6z'/%3E%3C/svg%3E");
}
.godziny.ikonki .pasiak .prawy-2 .galeria-link{
  display:inline-block;
  position:relative;
  top:12px;
  font-size:36px;
  line-height:36px;
  color:#004A6C;
  text-decoration:none;
}
.godziny.ikonki .pasiak .prawy-2 .galeria-link:hover{
  color:#000;
}
.galeria-link .ikona{
  margin-right:0;
  vertical-align:top;
  background-color:currentColor;
}
@media (min-width: 741px){
  .galeria-link-tekst{
    position:absolute;
    width:1px;
    height:1px;
    padding:0;
    margin:-1px;
    overflow:hidden;
    clip:rect(0, 0, 0, 0);
    white-space:nowrap;
    border:0;
  }
}
@media (max-width: 740px){
  .godziny.ikonki .pasiak .prawy-2 .galeria-link{
    position:static;
    font-size:16px;
    line-height:150%;
    color:#003399;
    text-decoration:underline;
  }
  .galeria-link .ikona{
    margin-right:5px;
    vertical-align:-0.125em;
    background-color:#3c3c4c;
  }
}
@media (forced-colors: active){
  .galeria-link .ikona{background-color:LinkText;}
}

/* --- A7. NOWE: tabela z widocznymi nagłówkami kolumn i przypis -------------
   Strona bibliotek wydziałowych (tabela Lending Room / Reading Room).       */
 
/* narożna komórka nagłówka, w której jest tylko tekst dla czytników ekranu —
   zamiast style="border: none" */
.godziny.ikonki .pasiak .prawy thead th:has(> .visually-hidden:only-child){
  border:0;
}
 
/* przypis pod tabelą — zamiast style="font-size: 15px; color: #565656; …" */
.godziny.ikonki .pasiak .prawy .przypis{
  margin-top:5px;
  font-size:15px;
  color:#565656;
}

/* --- A8. NOWE: pinezka lokalizacji i krzyżyk zamykający --------------------
   Zastępują klasy IcoMoon "icon-location" i "icon-delete".
     <span class="ikona ikona-lokalizacja" aria-hidden="true"></span>
     <button type="button" aria-label="Zamknij"><span class="ikona ikona-zamknij" aria-hidden="true"></span></button>
   Rozmiar ikony = rozmiar czcionki elementu, w którym stoi (1em).
   Krzyżyk bierze kolor tekstu z otoczenia (currentColor), więc pasuje
   zarówno na jasnym, jak i na ciemnym tle. Pinezka jest zawsze czerwona.   */
 
.ikona-lokalizacja{
  --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");
  background-color:#E63312;
}
.ikona-zamknij{
  --ikona:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='1.8 1.8 20.4 20.4'%3E%3Cpath d='M6.1 3.5 12 9.4l5.9-5.9 2.6 2.6-5.9 5.9 5.9 5.9-2.6 2.6-5.9-5.9-5.9 5.9-2.6-2.6 5.9-5.9-5.9-5.9z'/%3E%3C/svg%3E");
  margin-right:0;
  background-color:currentColor;
}
/* ikona jako jedyna zawartość przycisku pinezki — bez odstępu po prawej */
.linkiMapa .ikona{
  margin-right:0;
}
@media (forced-colors: active){
  .ikona-lokalizacja,
  .ikona-zamknij{background-color:ButtonText;}
}

/* --- A9. NOWE: tło okna z planem piętra (pinezki-lokalizacji.js) ------------
   Okno jest natywnym <dialog>; przyciemnienia tła nie da się ustawić
   stylem inline, stąd ta jedna reguła.                                      */
 
#plan_popup_container::backdrop{
  background:rgba(0, 0, 0, 0.5);
}



/* ============================================================================
   GODZINY OTWARCIA — paski agend
   ----------------------------------------------------------------------------
   Wariant wybiera klasa na div.pasiak W TRESCI artykulu, nie na <body>.
   Powod: warianty sezonowe (wakacje, sesja, ferie) powstaja przez
   SKOPIOWANIE artykulu. Kopia dostaje nowe id, wiec przy zawezaniu po
   art-id po cichu tracila wszystkie style. Klasa w tresci jedzie z kopia.

   Przy zakladaniu nowego wariantu sezonowego: skopiuj artykul i nic wiecej
   nie trzeba — klasa jest juz w srodku.
   ============================================================================ */

/* --- wspolne dla wszystkich wariantow ------------------------------------- */
.godziny.ikonki .art-article div.pasiak div.lewy {
  width: 50%;
}
.godziny.ikonki .art-article div.pasiak table tbody td {
  border: none;
  padding: 0 0 0 20px;
}

/* --- A. Biblioteka Glowna (dawniej art. 220, 1022) ------------------------ */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-glowna div.prawy {
  width: 30%;
}

/* --- C. agendy BG (dawniej art. 458, 496, 498, 1023) ---------------------- */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-agendy div.prawy {
  width: 30%;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-agendy table tbody tr td:first-child {
  white-space: nowrap;
}

/* --- D. filie BG (dawniej art. 221, 460, 1024) ---------------------------- */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-filie div.prawy {
  width: 30%;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-filie table tbody tr td:first-child {
  width: 70px;
}

/* --- E. filie sezonowo (dawniej art. 497, 499, 1025, 954) ----------------- */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-filie-sezon div.prawy {
  width: 40%;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-filie-sezon table tbody tr td:first-child {
  white-space: nowrap;
}

/* --- h4 w paskach filii i bibliotek wydzialowych -------------------------- */
.godziny.ikonki .art-article div.pasiak:is(.bgpw-godz-filie, .bgpw-godz-wydzialowe) h4 {
  margin-bottom: 5px;
  font-size: 12pt;
}

/* --- B. biblioteki wydzialowe i inne (dawniej art. 222, 461) -------------- */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe div.lewy {
  width: 48%;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe div.prawy {
  width: 40%;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table tbody td {
  border: none;
  border-top: 1px solid #C7C7C7;
  padding: 0 0 0 10px;
  vertical-align: middle;
  white-space: nowrap;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table thead th {
  border: none;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table tbody tr td:first-child {
  width: 125px;
}
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe div.prawy table tbody th {
  width: 125px;
  min-width: 0;
  padding: 0 0 0 10px;
  border-top: 1px solid #C7C7C7;
  vertical-align: middle;
}
/* etykieta wiersza ("Mon.-Fri.") nie lamie sie w tabelach o 3+ kolumnach */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table tbody th:nth-last-child(n+3) {
  white-space: nowrap;
}
/* wiersz-uwaga na cala szerokosc ("kontakt: e-mail") bez linii nad soba */
.godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table tbody td[colspan] {
  border-top: none;
}
/* naglowki kolumn nie lamia sie tylko w pelnym ukladzie */
@media (min-width: 1100px) {
  .godziny.ikonki .art-article div.pasiak.bgpw-godz-wydzialowe table thead th {
    white-space: nowrap;
  }
}

/* --- telefon: prawa kolumna na pelna szerokosc ---------------------------
   Przeniesione z template.responsive.css (blok @media max-width:740px),
   bo reguly wariantow maja (0,6,2) i wygralyby ze starym (0,5,3).
   Selektor [class*="bgpw-godz"] laduje tu te sama wage, a lezy pozniej
   w pliku, wiec nadpisuje warianty. Po zakonczeniu Etapu 5a galaz
   body:where(.art-id-...) w template.responsive.css zostaje usunieta
   i responsywnosc paskow ma jedno zrodlo — ten plik.                      */
@media (max-width: 740px) {
  .godziny.ikonki .art-article div.pasiak[class*="bgpw-godz"] div.prawy {
    float: none;
    width: 100%;
    margin-top: 10px;
  }
}
/* ============================================================================
   SPIS TRESCI — panel granatowy
   ----------------------------------------------------------------------------
   Klasa bgpw-spis pochodzi z Page Class pozycji menu i siedzi na .item-page
   (nie na <body> — porownaj istniejace .item-page.news).

   Zastapila CZTERY identyczne kopie: art. 5, art. 26/28, art. 215/216/224
   w custom-articles.css oraz caly plik sticky_menu.css (art. 1029, 1031,
   1035, 1036, 1038). Razem 11 artykulow.

   #art-main jest PRZODKIEM .item-page, wiec regula overflow uzywa :has().
   Wymaga Chrome 105+ / Safari 15.4+ / Firefox 121+ (2022-2023).

   Elementem nosnym jest nav#spis albo nav#contents (wersja angielska),
   stad :is() w selektorach.                                                  */

/* sticky nie dziala wewnatrz przodka z overflow:hidden.
   Regulaminy dopisane 2026-10-26: .regulamin to art. 504, 921 i 922,
   .regulations to art. 936. Maja spis na bazie globalnej, nie na tej
   nakladce, ale ten sam problem z overflow. */
#art-main:has(.bgpw-spis, .regulamin, .regulations) {
  overflow: visible;
}

.bgpw-spis :is(nav#spis, nav#contents) {
  position: sticky;
}
.bgpw-spis :is(nav#spis, nav#contents) .sidepanel {
  background-color: #004A6C;
  overflow-y: initial;
  border-top: 2px solid white;
}
.bgpw-spis :is(nav#spis, nav#contents) .sidepanel li {
  color: #fff;
  padding-bottom: 9px;
}
.bgpw-spis :is(nav#spis, nav#contents) .sidepanel ol {
  padding-left: 50px !important;
  padding-right: 20px;
}
.bgpw-spis :is(nav#spis, nav#contents) .menu-btn__burger::before,
.bgpw-spis :is(nav#spis, nav#contents) .menu-btn__burger::after,
.bgpw-spis :is(nav#spis, nav#contents) .menu-btn__burger {
  background: #fff;
}
.bgpw-spis :is(nav#spis, nav#contents) .menu-btn-wrapper {
  color: #fff !important;
  background-color: #004A6C;
}
.bgpw-spis :is(nav#spis, nav#contents) .menu-btn.open .menu-btn__burger {
  background: transparent;
}
.bgpw-spis :is(nav#spis, nav#contents) .sidepanel a {
  color: #fff !important;
}

/* --- wariant angielski: art. 215, 216, 224 ------------------------------- */
.bgpw-spis--en nav#contents {
  top: 55px;
  z-index: 1;
}
.bgpw-spis--en .menu-btn-wrapper {
  width: 185px !important;
}
.bgpw-spis--en .menu-btn-wrapper span {
  font-size: 19px;
}

/* --- wariant kursow: art. 1029, 1031, 1035, 1036, 1038 -------------------
   Panel nizszy i przewijalny. overflow-y:scroll przywraca wartosc bazowa
   z custom.css, ktora regula powyzej zmienia na initial.                   */
.bgpw-spis--maxh :is(nav#spis, nav#contents) .sidepanel {
  max-height: 300px;
  overflow-y: scroll;
}

/* --- wariant regulaminu angielskiego: art. 936 ---------------------------
   Spis tresci tego artykulu stoi na BAZIE globalnej (panel zielony,
   linie 1570-1685), a nie na nakladce bgpw-spis (panel granatowy).
   Dlatego NIE dostaje klasy bgpw-spis — tylko te dwa nadpisania.

   Do 2026-10-26 artykul mial wlasna kopie calej bazy, zawezona po art-id:
   15 regul, 131 linii w custom-articles.css. Porownanie deklaracja po
   deklaracji wykazalo, ze od bazy rozni ja tylko to, co nizej. Reszta byla
   redundancja i zostala usunieta.                                       */
.regulations div#spis {
  position: sticky;
}
.regulations .menu-btn-wrapper {
  width: 185px !important;   /* baza ma 160px; angielskie napisy sa dluzsze */
  position: sticky;
}

/* ---------- KURSY: tresc stron szkoleniowych ----------------------------
   Klasa bgpw-kurs pochodzi z Page Class pozycji menu 800, 802, 803, 805,
   806 i 807 — artykuly 1029, 1031, 1035, 1036, 1038.

   Zastapila plik css/sticky_menu.css, ladowany warunkowo z index.php.
   Skrypt sticky_menu.js ZOSTAJE: obsluguje przelacznik #mySidepanel,
   ktorego pozostale artykuly ze spisem nie maja, bo te obsluguje
   custom-articles.js.

   OSTATNIA REGULA — uwaga na wage. Dawniej byla zapisana jako
   body #art-main .art-article img, czyli (1,1,2). Tutaj ma (0,2,1), bo
   #art-main jest PRZODKIEM .item-page i po klasie strony nie da sie go
   uzyc. Sprawdzone grepem: jedyne, co konkuruje o margines obrazkow, to
   .art-article img z template.css o wadze (0,1,1), wiec zapas wystarcza.
   NIE upraszczac do .art-article img — przegra z Artisteerem.

   REGULA activityicon — margin PRZYWROCONY SWIADOMIE 2026-10-26.
   W starym ukladzie ta deklaracja przegrywala (0,2,1 kontra 1,1,2) z regula
   ponizej i nigdy nie dzialala: ikonki stykaly sie z tekstem. Tutaj
   activityicon ma (0,3,1), a regula ogolna (0,2,1), wiec odstep dziala.

   img.activityicon wystepuje takze w art. 1043 i 1050, ktore tej klasy
   nie maja i tych stylow nie dostaja — tak samo jak przed przenosinami.
   Gdyby ich ikonki wygladaly zle, wystarczy dopisac bgpw-kurs do ich
   pozycji menu; CSS nie wymaga zmian.

   Przeniesione 2026-10-26 z css/sticky_menu.css.                       */

.bgpw-kurs .art-article img.activityicon {
  height: 24px;
  width: 24px;
  margin: 0 6px 0 0;
  vertical-align: bottom;
}
.bgpw-kurs .art-article section > p:first-of-type {
  margin-top: 0;
}
.bgpw-kurs .art-article table th {
  text-align: center !important;
}
.bgpw-kurs .art-article table caption {
  text-align: left;
  font-size: 17px;
  font-weight: bold;
  padding-bottom: 10px;
}
.bgpw-kurs .art-article table td figure {
  margin: 0;
  text-align: center;
}
.bgpw-kurs .art-article table td figure figcaption {
  text-align: left;
}
.bgpw-kurs .art-article img {
  margin: 0;
}