/* --- ZMIENNE KOLORÓW DLA TRYBU JASNEGO (DOMYŚLNY) --- */
:root {
  /* Tekst i tło główne */
  --main-text-color: #545454; /* body, td, p, center */
  --main-bg-color: #e7e7de; /* body background */
  
  /* Kontenery (Okienka, bloki treści) */
  --container-bg: #ffffff; /* .okienko, .szstopka, .szmenule, .szglow2, .szglow3 */
  
  /* Linki */
  --link-color: #545454;
  --link-hover-color: #e77614;
  
  /* Inne specyficzne kolory */
  --highlight-color: #D12C00; /* .litdzialy, .litdata, .litnag */
  --secondary-highlight-color: #0F218B; /* .litdzialy2, .littyt, .menu_tytul */
  --white-text: #ffffff; /* .litpag, .litbiale, .kolorb */
  --button-bg-color: #dd3f36; /* .guzik */
  --menu-dropdown-bg: rgba(255, 255, 255, 0.95);
  --menu-hover-bg: rgba(0, 0, 0, 0.1);
  --banner-menu-text: white; /* Tekst na banerze (na obrazku) */
}

/* --- ZMIANY DLA TRYBU CIEMNEGO (.dark-mode) --- */
.dark-mode {
  /* Odwrócenie głównego schematu */
  --main-text-color: #e0e0e0; 
  --main-bg-color: #1a1a1a; 
  
  /* Kontenery (Okienka, bloki treści) */
  --container-bg: #2a2a2a; 
  
  /* Linki */
  --link-color: #b0b0b0;
  --link-hover-color: #81c72f; /* Zmieniony hover na bardziej kontrastowy zielony */
  
  /* Inne specyficzne kolory */
  --highlight-color: #FF5733; 
  --secondary-highlight-color: #79a6ff; 
  --white-text: #000000; 
  --button-bg-color: #8b0000; 
  --menu-dropdown-bg: rgba(0, 0, 0, 0.95);
  --menu-hover-bg: rgba(255, 255, 255, 0.2);
  --banner-menu-text: #e0e0e0;
}

html {
  font-size: 17px; 
}

body, td, br, p, center {font-family: Arial, sans-serif; color: var(--main-text-color); }

img {border-color: #000000}

body {  margin-top: 20px; margin-left: 0px; margin-right: 0px; margin-bottom: 20px; padding: 0px; background-color: var(--main-bg-color); }

.menule {color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; line-height:14px;}

.menupr {color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; line-height:14px;}

.glowna {color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial;}

.okienko {background-color: var(--container-bg);}

.szhead {width:980px; color: var(--main-text-color); ; border-width:0px;}

.szstopka {width:980px; background-color: var(--container-bg); color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; border-width:0px;}

.szmenule {width:240px; background-color: var(--container-bg); color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; border-width:0px;}

.szglow2  {width:740px; background-color: var(--container-bg); color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; border-width:0px;}

.szglow3  {width:980px; background-color: var(--container-bg); color: var(--main-text-color); ; font-size:0.8rem; font-family: Arial; border-width:0px;}

.szer2 {width:720px;}

.szer3 {width:960px;}

a:link { color:var(--link-color); text-decoration: none; }
a:visited { color:var(--link-color); text-decoration: none; }
a:active { color:var(--link-color); text-decoration: none; }
a:hover { color: var(--link-hover-color); text-decoration: underline; }

a.dwa:link { color:#970c0c; text-decoration: none; }
a.dwa:visited { color:#970c0c; text-decoration: none; }
a.dwa:active { color:#970c0c; text-decoration: none; }
a.dwa:hover { color: #81c72f; text-decoration: underline; }

a.trzy:link { color: var(--white-text); text-decoration: none; }
a.trzy:visited { color: var(--white-text); text-decoration: none; }
a.trzy:active { color: var(--white-text); text-decoration: none; }
a.trzy:hover { color: var(--white-text) text-decoration: underline; }

a.cztery:link { color:#D12C00; text-decoration: none; }
a.cztery:visited { color:#D12C00; text-decoration: none; }
a.cztery:active { color:#D12C00; text-decoration: none; }
a.cztery:hover { color: #D12C00; text-decoration: underline; }

a.piec:link { color:#dd3f36; text-decoration: none; }
a.piec:visited { color:#dd3f36; text-decoration: none; }
a.piec:active { color:#dd3f36; text-decoration: none; }
a.piec:hover { color: #dd3f36; text-decoration: underline; }

a.szesc:link { color:#e77614; text-decoration: none; }
a.szesc:visited { color:#e77614; text-decoration: none; }
a.szesc:active { color:#e77614; text-decoration: none; }
a.szesc:hover { color: #e77614; text-decoration: underline; }

a.siedem:link { color:#0F218B; text-decoration: none; }
a.siedem:visited { color:#0F218B; text-decoration: none; }
a.siedem:active { color:#0F218B; text-decoration: none; }
a.siedem:hover { color: #0F218B; text-decoration: underline; }

a:link img { border-color: var(--main-text-color); ; }
a:visited img { border-color: var(--main-text-color); ; }
a:hover img { border-color: var(--main-text-color); ; }
a:active img { border-color: var(--main-text-color); ; }

body {scrollbar-base-color : #dedede;}

.rogl {display: block; font-size: 1px; background: #dddddd; left: 0px; overflow: hidden; width: 1px; position: relative; top: 0px; height: 1px; }

.rogp { display: block; font-size: 1px; right: 0px; background: #dddddd; overflow: hidden; width: 1px; position: relative; top: 0px; height: 1px; }

.tlopag { height:23px; background-color: #149add; }

.tlopasek { background-color: #149add; }

.tlopasek2 { background-color: #b54321; }

.tlopasek3 { background-color: #d5d5cd; }

.litpag {color: #ffffff;}

.litbiale {color: #ffffff;}

.litdzialy {color: #D12C00;}

.litdata {color: #D12C00;}

.litdzialy2 {color: #0F218B;}

.litnaw {color: #D12C00; font-size:1rem;}

.litnag {color: #D12C00; font-size:1rem;}

.littyt {color: #15299a;}

.kolorb {color: #FFFFFF;}

.kolorc {color: #dd3f36;}

.tlonag { width:4px; background-color: #D12C00; }

.litnag {color: #D12C00; font-size:1rem;}

.kolorhs { background-color: #dddddd; }


.adm1 { width:10%; font-size:0.8rem;}
.adm2 { width:90%; font-size:0.8rem;}



.kreska { border-width:1px; border-style: solid; border-left-color: #ffffff; border-right-color: #ffffff; border-top-color: #dededd; border-bottom-color: #ffffff; }

.cien { background: #cac6c3; position: relative; top: 2px; left: 2px; }

.ramka { border: 1px solid white; background: white; color: var(--main-text-color); ; position: relative; top: -2px; left: -2px; }

.cien2 { background: #454641; position: relative; top: 0px; left: 0px; }

.ramka2 { border: 1px solid #454641; background: #454641; color: #ffffff; position: relative; top: 0px; left: 0px; }

.menu_tytul {
  font-size:0.8rem;
  background-color: var(--container-bg);
  border: 1px solid #FFFFFF;
  margin: 0px;
  padding: 0px;
  color: #0F218B;
  cursor:pointer;
}

.menu_opcje {
  font-size:0.9rem;
  position: absolute;
  white-space: nowrap;
  visibility: hidden;
  background-color: var(--container-bg);
  border: 0px solid #ffffff;
  padding: 0px;
  margin: 1px;
  color: #0F218B;
  z-index: 1;
}


.pole { BORDER-RIGHT: #FFFFFF 1px solid; BORDER-TOP: #FFFFFF 1px solid; BORDER-LEFT: #FFFFFF 1px solid; BORDER-BOTTOM: #FFFFFF 1px solid; BACKGROUND-COLOR: #FFFFFF }

.guzik { BORDER-RIGHT: #454641 0px solid; BORDER-TOP: #454641 0px solid; BORDER-LEFT: #454641 0px solid; BORDER-BOTTOM: #454641 0px solid; BACKGROUND-COLOR: #dd3f36; color: #FFFFFF; }


.table-container {
	overflow-x: auto;
	width: 960px;
}

.fixed-column {
	position: sticky;
	left: 0;
	background-color: white;
	z-index: 1;
}
.fixed-column-right {
	position: sticky;
	right: 0;
	background-color: white;
	z-index: 1;
}

.fixed-column-top {
	position: sticky;
	top: 0;
	background-color: white;
	z-index: 3;
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pagination>li {
    display: inline
}

.pagination>li>a,.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    text-decoration: none;
    background-color: var(--container-bg);
    color: var(--link-color);
    border: 1px solid var(--link-color);
}

.pagination>li:first-child>a,.pagination>li:first-child>span {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.pagination>li:last-child>a,.pagination>li:last-child>span {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px
}

.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover {
  color: var(--white-text);
  background-color: var(--secondary-highlight-color);
  border-color: var(--secondary-highlight-color);
}

.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover {
    z-index: 2;
    color: var(--white-text);
    background-color: var(--secondary-highlight-color);
    border-color: var(--secondary-highlight-color);
    cursor: default;
}

.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover {
    color: #777;
    cursor: not-allowed;
}

.container{
	width: 1000px;
	max-width: 95%;
	margin: auto;
}

.row {
  display: flex;
  gap: 20px;
}

.col {
  flex: 1;  
  display: flex;
  flex-direction: column;
}

.col label,
.col select,
.col input,
.col textarea {
  width: 100%;              /* wymusza, że select i label nie rozszerzają kolumny */
  box-sizing: border-box;
}

/* kolumna 1/4 */
.col-1-4 {
  flex: 1;
}
.col-1-5 {
  flex: 1;
}

/* kolumna 3/4 */
.col-3-4 {
  flex: 3;
}

.col-4-5 {
  flex: 4;
}

.form-label {
  font-weight: 600;
  margin-bottom: 4px;
}

.form-control {
  padding: 6px 8px;
  font-size: 0.8rem;
  border: 1px solid var(--link-color);
  border-radius: 4px;
  background-color: var(--container-bg);
  color: var(--main-text-color);
}

.btn {
  cursor: pointer;
  border: 1px solid var(--link-color);
  background: #f2f2f2;
  border-radius: 4px;
  padding: 6px 12px;
  color: var(--main-text-color);
  background-color: var(--container-bg);
}
.btn:hover {
  background: var(--menu-hover-bg);
}


/* RESPONSYWNOŚĆ */
@media (max-width: 768px) {
	.row {
	  flex-wrap: wrap;
	}
	.col {
		flex: 1 1 100%;  /* na mniejszych ekranach jedna kolumna na całą szerokość */
	}
}

.form-group {
	margin-bottom: 0.8em;
}

.content img{
  max-width: 100%;
  height: auto !important;
}
