/*!
 * BHP Modern 1.0 - szablon Joomla! 3.10
 * Arkusz statyczny. Wszystkie wartosci konfigurowalne pochodza ze zmiennych
 * CSS generowanych po stronie serwera (helper.php) - ten plik nigdy nie jest
 * modyfikowany przez panel administracyjny.
 */

/* ==================================================================
   1. Wartosci awaryjne (gdyby blok inline nie zostal osadzony)
   ================================================================== */
:root {
	--bhp-primary: #6750a4;
	--bhp-primary-hover: #56438f;
	--bhp-primary-container: #eaddff;
	--bhp-on-primary: #ffffff;
	--bhp-on-primary-container: #21005d;
	--bhp-primary-a08: rgba(103, 80, 164, .08);
	--bhp-primary-a16: rgba(103, 80, 164, .16);
	--bhp-accent: #7d5260;
	--bhp-on-accent: #ffffff;
	--bhp-bg: #f6f4fa;
	--bhp-surface: #ffffff;
	--bhp-surface-2: #f4f1f8;
	--bhp-surface-3: #ece7f3;
	--bhp-text: #1c1b1f;
	--bhp-text-muted: #5f5c67;
	--bhp-heading: #1c1b1f;
	--bhp-link: #6750a4;
	--bhp-link-hover: #4f3d84;
	--bhp-outline: rgba(28, 27, 31, .14);
	--bhp-outline-strong: rgba(28, 27, 31, .26);
	--bhp-header-bg: #ffffff;
	--bhp-header-text: #1c1b1f;
	--bhp-topbar-bg: #6750a4;
	--bhp-topbar-text: #ffffff;
	--bhp-footer-bg: #1c1b1f;
	--bhp-footer-text: #e7e0ec;
	--bhp-footer-muted: rgba(231, 224, 236, .66);
	--bhp-footer-outline: rgba(231, 224, 236, .18);
	--bhp-menu-bg: #ffffff;
	--bhp-menu-link: #1c1b1f;
	--bhp-menu-hover: #6750a4;
	--bhp-menu-hover-bg: rgba(103, 80, 164, .1);
	--bhp-menu-active: #21005d;
	--bhp-menu-active-bg: #eaddff;
	--bhp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	--bhp-font-heading: var(--bhp-font);
	--bhp-fs: 16px;
	--bhp-lh: 1.65;
	--bhp-h1: 40px;
	--bhp-h2: 32px;
	--bhp-h3: 26px;
	--bhp-h4: 21px;
	--bhp-h5: 18px;
	--bhp-h6: 16px;
	--bhp-h-weight: 700;
	--bhp-h-transform: none;
	--bhp-menu-fs: 15px;
	--bhp-menu-weight: 500;
	--bhp-menu-transform: none;
	--bhp-menu-gap: 6px;
	--bhp-radius: 16px;
	--bhp-radius-sm: 8px;
	--bhp-radius-lg: 24px;
	--bhp-radius-btn: 40px;
	--bhp-radius-pill: 999px;
	--bhp-container: 1200px;
	--bhp-sidebar: 300px;
	--bhp-section: 48px;
	--bhp-header-pad: 14px;
	--bhp-logo-h: 44px;
	--bhp-shadow-1: 0 1px 2px rgba(0, 0, 0, .08), 0 1px 3px 1px rgba(0, 0, 0, .06);
	--bhp-shadow-2: 0 2px 6px 2px rgba(0, 0, 0, .09), 0 1px 2px rgba(0, 0, 0, .1);
	--bhp-shadow-3: 0 8px 24px rgba(0, 0, 0, .14);
	--bhp-motion: 200ms;
	--bhp-gap: 24px;
}

/* ==================================================================
   2. Reset
   ================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	scroll-padding-top: 90px;
}

body {
	margin: 0;
	background: var(--bhp-bg);
	color: var(--bhp-text);
	font-family: var(--bhp-font);
	font-size: var(--bhp-fs);
	line-height: var(--bhp-lh);
	-webkit-font-smoothing: antialiased;
	overflow-wrap: break-word;
}

body.is-boxed {
	max-width: calc(var(--bhp-container) + 120px);
	margin: 0 auto;
	background: var(--bhp-surface);
	box-shadow: var(--bhp-shadow-2);
}

img, svg, video, iframe, canvas { max-width: 100%; }
img, svg, video { height: auto; }
iframe { border: 0; }

figure { margin: 0 0 1rem; }

hr {
	border: 0;
	border-top: 1px solid var(--bhp-outline);
	margin: var(--bhp-gap) 0;
}

/* ==================================================================
   3. Typografia
   ================================================================== */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--bhp-font-heading);
	color: var(--bhp-heading);
	font-weight: var(--bhp-h-weight);
	text-transform: var(--bhp-h-transform);
	line-height: 1.22;
	margin: 0 0 .6em;
	letter-spacing: -.01em;
}

h1 { font-size: var(--bhp-h1); }
h2 { font-size: var(--bhp-h2); }
h3 { font-size: var(--bhp-h3); }
h4 { font-size: var(--bhp-h4); }
h5 { font-size: var(--bhp-h5); }
h6 { font-size: var(--bhp-h6); }

p, ul, ol, dl, table, pre, blockquote { margin: 0 0 1rem; }

a {
	color: var(--bhp-link);
	text-decoration: none;
	transition: color var(--bhp-motion) ease;
}

a:hover, a:focus { color: var(--bhp-link-hover); text-decoration: underline; }

small { font-size: .875em; color: var(--bhp-text-muted); }
strong, b { font-weight: 700; }

blockquote {
	padding: 12px 20px;
	border-left: 4px solid var(--bhp-primary);
	background: var(--bhp-surface-2);
	border-radius: 0 var(--bhp-radius-sm) var(--bhp-radius-sm) 0;
	color: var(--bhp-text-muted);
	font-style: italic;
}

code, pre, kbd, samp { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; }

code {
	background: var(--bhp-surface-3);
	padding: .15em .4em;
	border-radius: 4px;
}

pre {
	background: var(--bhp-surface-3);
	padding: 16px;
	border-radius: var(--bhp-radius-sm);
	overflow-x: auto;
}

pre code { background: none; padding: 0; }

/* ==================================================================
   4. Uklad
   ================================================================== */
.bhp-container {
	width: 100%;
	max-width: var(--bhp-container);
	margin: 0 auto;
	padding: 0 20px;
}

.bhp-main { padding: var(--bhp-section) 0; }

.bhp-section { padding: var(--bhp-section) 0 0; }
.bhp-section--bottom { padding: 0 0 var(--bhp-section); }

.bhp-layout { display: grid; gap: 32px; grid-template-columns: minmax(0, 1fr); }

.bhp-content { min-width: 0; }

.bhp-grid { display: grid; gap: var(--bhp-gap); grid-template-columns: minmax(0, 1fr); }

@media (min-width: 768px) {
	.bhp-grid.cols-2, .bhp-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.bhp-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 992px) {
	.bhp-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

	body.has-sidebar-left .bhp-layout { grid-template-columns: var(--bhp-sidebar) minmax(0, 1fr); }
	body.has-sidebar-right .bhp-layout { grid-template-columns: minmax(0, 1fr) var(--bhp-sidebar); }
	body.has-sidebar-left.has-sidebar-right .bhp-layout { grid-template-columns: var(--bhp-sidebar) minmax(0, 1fr) var(--bhp-sidebar); }
}

/* ==================================================================
   5. Pasek gorny i naglowek
   ================================================================== */
.bhp-topbar {
	background: var(--bhp-topbar-bg);
	color: var(--bhp-topbar-text);
	font-size: .875rem;
}

.bhp-topbar a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.bhp-topbar__inner { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; padding-top: 8px; padding-bottom: 8px; }
.bhp-topbar .bhp-module { margin: 0; }

.bhp-header {
	background: var(--bhp-header-bg);
	color: var(--bhp-header-text);
	position: relative;
	z-index: 100;
	transition: box-shadow var(--bhp-motion) ease;
}

body.has-sticky-header .bhp-header { position: sticky; top: 0; }
body.has-header-shadow .bhp-header.is-stuck { box-shadow: var(--bhp-shadow-2); }

.bhp-header__inner {
	display: flex;
	align-items: center;
	gap: 20px;
	padding-top: var(--bhp-header-pad);
	padding-bottom: var(--bhp-header-pad);
	min-height: 56px;
}

.bhp-brand { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-right: auto; }
.bhp-brand__link { display: inline-flex; align-items: center; gap: 12px; color: inherit; text-decoration: none; }
.bhp-brand__link:hover { text-decoration: none; }
.bhp-brand__img { height: var(--bhp-logo-h); width: auto; display: block; }
.bhp-brand__text { font-family: var(--bhp-font-heading); font-size: 1.25rem; font-weight: 700; letter-spacing: -.02em; color: inherit; }
.bhp-brand__tagline { font-size: .8125rem; color: var(--bhp-text-muted); }

.bhp-header__tools { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.bhp-header__search { display: none; }

@media (min-width: 768px) { .bhp-header__search { display: block; } }

/* Wyrownanie i wysrodkowanie menu ustala helper.php - zalezy od progu
   przelaczenia, ktory jest parametrem, wiec nie moze stac w tym pliku. */

/* Ikony w naglowku */
.bhp-icon-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 0;
	border-radius: var(--bhp-radius-btn);
	background: transparent;
	color: inherit;
	cursor: pointer;
	transition: background var(--bhp-motion) ease;
}

.bhp-icon-btn:hover, .bhp-icon-btn:focus-visible { background: var(--bhp-primary-a08); }

.bhp-theme-toggle .bhp-ico-sun,
.bhp-theme-toggle .bhp-ico-moon {
	width: 20px;
	height: 20px;
	display: block;
	background: currentColor;
}

.bhp-theme-toggle .bhp-ico-sun {
	-webkit-mask: no-repeat center/20px 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' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E");
	mask: no-repeat center/20px 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' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v2M12 20v2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M2 12h2M20 12h2M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4'/%3E%3C/svg%3E");
}

.bhp-theme-toggle .bhp-ico-moon {
	display: none;
	-webkit-mask: no-repeat center/20px 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E");
	mask: no-repeat center/20px 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' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E");
}

html[data-theme="dark"] .bhp-theme-toggle .bhp-ico-sun { display: none; }
html[data-theme="dark"] .bhp-theme-toggle .bhp-ico-moon { display: block; }

@media (prefers-color-scheme: dark) {
	html:not([data-theme="light"]) .bhp-theme-toggle .bhp-ico-sun { display: none; }
	html:not([data-theme="light"]) .bhp-theme-toggle .bhp-ico-moon { display: block; }
}

/* Przycisk hamburgera */
.bhp-burger {
	width: 44px;
	height: 44px;
	border: 0;
	padding: 0;
	background: transparent;
	color: inherit;
	border-radius: var(--bhp-radius-btn);
	cursor: pointer;
	position: relative;
	transition: background var(--bhp-motion) ease;
}

.bhp-burger:hover, .bhp-burger:focus-visible { background: var(--bhp-primary-a08); }

.bhp-burger span,
.bhp-burger span::before,
.bhp-burger span::after {
	position: absolute;
	left: 50%;
	width: 22px;
	height: 2px;
	background: currentColor;
	border-radius: 2px;
	transform: translateX(-50%);
	transition: transform var(--bhp-motion) ease, opacity var(--bhp-motion) ease;
}

.bhp-burger span { top: 50%; margin-top: -1px; }
.bhp-burger span::before { content: ""; top: -7px; left: 0; transform: none; }
.bhp-burger span::after { content: ""; top: 7px; left: 0; transform: none; }

body.nav-open .bhp-burger span { background: transparent; }
body.nav-open .bhp-burger span::before { transform: translateY(7px) rotate(45deg); }
body.nav-open .bhp-burger span::after { transform: translateY(-7px) rotate(-45deg); }

/* ==================================================================
   6. Nawigacja - stan bazowy = panel wysuwany (mobile first)
   ================================================================== */
.bhp-nav {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 0;
	width: 320px;
	max-width: 86vw;
	z-index: 130;
	padding: 12px;
	background: var(--bhp-surface);
	color: var(--bhp-menu-link);
	box-shadow: var(--bhp-shadow-3);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	transform: translateX(100%);
	visibility: hidden;
	/* Ukrycie nastepuje dopiero po wysunieciu panelu, ale pokazanie jest
	   natychmiastowe - element niewidoczny nie moze przyjac fokusu. */
	transition: transform 260ms ease, visibility 0s linear 260ms;
}

body.nav-open .bhp-nav {
	transform: translateX(0);
	visibility: visible;
	transition: transform 260ms ease, visibility 0s linear 0s;
}

.bhp-nav__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px 8px 12px;
	margin-bottom: 8px;
	border-bottom: 1px solid var(--bhp-outline);
}

.bhp-nav__title { font-weight: 600; font-size: .875rem; text-transform: uppercase; letter-spacing: .08em; color: var(--bhp-text-muted); }

.bhp-nav__close {
	border: 0;
	background: transparent;
	color: inherit;
	font-size: 1.75rem;
	line-height: 1;
	width: 40px;
	height: 40px;
	border-radius: var(--bhp-radius-btn);
	cursor: pointer;
}

.bhp-nav__close:hover { background: var(--bhp-primary-a08); }

.bhp-nav__group-title { font-size: .8125rem; text-transform: uppercase; letter-spacing: .06em; color: var(--bhp-text-muted); margin: 12px 8px 4px; }
.bhp-nav__extra { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--bhp-outline); }

.bhp-nav ul.menu,
.bhp-nav ul.nav {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.bhp-nav ul.menu ul { list-style: none; margin: 0 0 0 12px; padding: 4px 0 4px 8px; border-left: 2px solid var(--bhp-outline); }

.bhp-nav ul.menu li { position: relative; }

.bhp-nav ul.menu a,
.bhp-nav ul.menu span.separator {
	display: block;
	padding: 10px 12px;
	color: var(--bhp-menu-link);
	text-decoration: none;
	font-size: var(--bhp-menu-fs);
	font-weight: var(--bhp-menu-weight);
	text-transform: var(--bhp-menu-transform);
	border-radius: var(--bhp-radius-sm);
	line-height: 1.35;
	transition: background var(--bhp-motion) ease, color var(--bhp-motion) ease;
}

.bhp-nav ul.menu a:hover,
.bhp-nav ul.menu a:focus-visible {
	color: var(--bhp-menu-hover);
	background: var(--bhp-menu-hover-bg);
	text-decoration: none;
}

.bhp-nav ul.menu > li.active > a,
.bhp-nav ul.menu > li.current > a,
.bhp-nav ul.menu li.active > a {
	color: var(--bhp-menu-active);
	background: var(--bhp-menu-active-bg);
}

.bhp-nav ul.menu span.separator { color: var(--bhp-text-muted); cursor: default; }
.bhp-nav ul.menu img { display: inline-block; vertical-align: middle; margin-right: 8px; }

/* Warianty wygladu pozycji menu */
body.menu-style-pill .bhp-nav ul.menu > li > a { border-radius: var(--bhp-radius-btn); }

body.menu-style-plain .bhp-nav ul.menu > li > a:hover,
body.menu-style-plain .bhp-nav ul.menu > li.active > a { background: transparent; }

body.menu-style-underline .bhp-nav ul.menu > li > a { border-radius: 0; box-shadow: inset 0 -2px 0 transparent; }
body.menu-style-underline .bhp-nav ul.menu > li > a:hover { background: transparent; box-shadow: inset 0 -2px 0 var(--bhp-menu-hover); }
body.menu-style-underline .bhp-nav ul.menu > li.active > a { background: transparent; color: var(--bhp-menu-active); box-shadow: inset 0 -2px 0 var(--bhp-menu-active); }

/* Przelacznik podmenu (wstrzykiwany przez JS na malych ekranach) */
.bhp-submenu-toggle {
	position: absolute;
	top: 3px;
	right: 4px;
	width: 36px;
	height: 36px;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
	border-radius: var(--bhp-radius-btn);
}

.bhp-submenu-toggle::before {
	content: "";
	display: block;
	width: 8px;
	height: 8px;
	margin: 0 auto;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform var(--bhp-motion) ease;
}

.bhp-submenu-toggle[aria-expanded="true"]::before { transform: rotate(-135deg) translate(-2px, -2px); }

/* Podmenu zwiniete domyslnie; rozwijane klasa is-open (mobile) lub reguła desktopowa. */
.bhp-nav ul.menu li.parent > ul { display: none; }
.bhp-nav ul.menu li.is-open > ul { display: block; }

.bhp-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, .45);
	z-index: 120;
	opacity: 0;
	transition: opacity var(--bhp-motion) ease;
}

body.nav-open .bhp-backdrop { opacity: 1; }
body.nav-open { overflow: hidden; }

/*
 * Panel nawigacji jest dzieckiem naglowka (lub paska menu), a te - majac
 * position: relative/sticky wraz z z-index - tworza wlasny kontekst nakladania.
 * Wartosc z-index panelu nie moze wiec przekroczyc wartosci swojego kontenera,
 * przez co przeslona (dziecko body) przykrywalaby CALY naglowek razem z panelem:
 * uzytkownik widzial ciemna warstwe na wszystkim i nie mogl kliknac zadnej
 * pozycji menu. Dopoki panel jest otwarty, gorne elementy strony musza wiec
 * znalezc sie ponad przeslona.
 */
body.nav-open .bhp-header,
body.nav-open .bhp-menubar { z-index: 140; }

body.nav-open .bhp-topbar { position: relative; z-index: 140; }

/* Pasek menu (menuLayout = bar) */
.bhp-menubar { background: var(--bhp-menu-bg); border-top: 1px solid var(--bhp-outline); border-bottom: 1px solid var(--bhp-outline); position: relative; z-index: 90; }
.bhp-menubar__inner { display: flex; }
body.menu-bar.has-sticky-header .bhp-menubar { position: sticky; top: 0; }
body.menu-bar .bhp-menubar .bhp-nav { flex: 1; }

/* ==================================================================
   7. Moduly / karty
   ================================================================== */
.bhp-module { margin-bottom: var(--bhp-gap); }
.bhp-module:last-child { margin-bottom: 0; }

.bhp-card {
	background: var(--bhp-surface);
	border-radius: var(--bhp-radius);
	padding: 24px;
}

body.cards-elevated .bhp-card { box-shadow: var(--bhp-shadow-1); }
body.cards-outlined .bhp-card { border: 1px solid var(--bhp-outline); }
body.cards-flat .bhp-card { background: var(--bhp-surface-2); }

.bhp-module__title { font-size: var(--bhp-h4); margin: 0 0 16px; }
.bhp-module__body > *:last-child { margin-bottom: 0; }

.bhp-module ul { padding-left: 18px; }
.bhp-module .nav.menu,
.bhp-module ul.menu { list-style: none; padding: 0; margin: 0; }

.bhp-module ul.menu a {
	display: block;
	padding: 8px 10px;
	border-radius: var(--bhp-radius-sm);
	color: var(--bhp-text);
	transition: background var(--bhp-motion) ease, color var(--bhp-motion) ease;
}

.bhp-module ul.menu a:hover { background: var(--bhp-primary-a08); color: var(--bhp-link); text-decoration: none; }
.bhp-module ul.menu li.active > a { background: var(--bhp-primary-container); color: var(--bhp-on-primary-container); }

.bhp-hero > * { margin: 0; }
.bhp-breadcrumbs { padding: 16px 0 0; font-size: .875rem; }

/* ==================================================================
   8. Przyciski i formularze
   ================================================================== */
.bhp-btn,
.btn,
button.btn,
input[type="submit"],
input[type="button"],
.readmore .btn,
a.readmore {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 22px;
	border: 1px solid transparent;
	border-radius: var(--bhp-radius-btn);
	background: var(--bhp-primary);
	color: var(--bhp-on-primary);
	font: inherit;
	font-weight: 600;
	font-size: .9375rem;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition: background var(--bhp-motion) ease, box-shadow var(--bhp-motion) ease, transform var(--bhp-motion) ease;
}

.bhp-btn:hover, .btn:hover, input[type="submit"]:hover, a.readmore:hover {
	background: var(--bhp-primary-hover);
	color: var(--bhp-on-primary);
	text-decoration: none;
	box-shadow: var(--bhp-shadow-1);
}

.bhp-btn:active, .btn:active { transform: translateY(1px); }

/* Kolor wiodacy sluzy do wypelnien i moze byc jasny (np. pomarancz z logo),
   dlatego jako kolor TEKSTU na jasnym tle uzywamy tokenu odnosnika, ktory
   w kazdej palecie spelnia WCAG AA. */
.bhp-btn--ghost, .btn-link, .btn.btn-secondary {
	background: transparent;
	color: var(--bhp-link);
	border-color: var(--bhp-outline-strong);
}

.bhp-btn--ghost:hover, .btn-link:hover { background: var(--bhp-primary-a08); color: var(--bhp-link-hover); box-shadow: none; }

.btn-danger { background: #b3261e; color: #fff; }
.btn-success { background: #2e7d32; color: #fff; }
.btn-small, .btn-sm { padding: 6px 14px; font-size: .8125rem; }

input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="tel"], input[type="number"], input[type="date"],
select, textarea, .inputbox, .form-control {
	width: 100%;
	max-width: 100%;
	padding: 10px 14px;
	font: inherit;
	font-size: .9375rem;
	color: var(--bhp-text);
	background: var(--bhp-surface);
	border: 1px solid var(--bhp-outline-strong);
	border-radius: var(--bhp-radius-sm);
	transition: border-color var(--bhp-motion) ease, box-shadow var(--bhp-motion) ease;
}

input:focus, select:focus, textarea:focus {
	outline: 0;
	border-color: var(--bhp-primary);
	box-shadow: 0 0 0 3px var(--bhp-primary-a16);
}

textarea { min-height: 140px; resize: vertical; }
select { appearance: none; -webkit-appearance: none; padding-right: 36px; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 18px) 50%, calc(100% - 12px) 50%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
input[type="checkbox"], input[type="radio"] { width: auto; accent-color: var(--bhp-primary); }
label { display: inline-block; margin-bottom: 6px; font-weight: 500; font-size: .9375rem; }

.bhp-field { margin-bottom: 16px; }
.bhp-field--check { display: flex; align-items: center; gap: 8px; }
.bhp-field--check label { margin: 0; }

/* ==================================================================
   9. Zgodnosc z markupem rdzenia Joomla 3 (Bootstrap 2)
   ================================================================== */
.row-fluid { display: flex; flex-wrap: wrap; margin-left: -12px; margin-right: -12px; }
.row-fluid > [class*="span"] { padding-left: 12px; padding-right: 12px; width: 100%; min-width: 0; }

@media (min-width: 768px) {
	.row-fluid > .span1 { width: 8.333%; }
	.row-fluid > .span2 { width: 16.666%; }
	.row-fluid > .span3 { width: 25%; }
	.row-fluid > .span4 { width: 33.333%; }
	.row-fluid > .span5 { width: 41.666%; }
	.row-fluid > .span6 { width: 50%; }
	.row-fluid > .span7 { width: 58.333%; }
	.row-fluid > .span8 { width: 66.666%; }
	.row-fluid > .span9 { width: 75%; }
	.row-fluid > .span10 { width: 83.333%; }
	.row-fluid > .span11 { width: 91.666%; }
	.row-fluid > .span12 { width: 100%; }
}

.control-group { margin-bottom: 16px; }
.control-label { display: block; margin-bottom: 6px; font-weight: 500; }
.form-horizontal .controls { margin: 0; }
.pull-left { float: left; }
.pull-right { float: right; }
.clearfix::after { content: ""; display: table; clear: both; }
.hide, .hidden { display: none !important; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.well { background: var(--bhp-surface-2); border: 1px solid var(--bhp-outline); border-radius: var(--bhp-radius); padding: 20px; }
.input-append, .input-prepend { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.input-append .inputbox, .input-prepend .inputbox { flex: 1 1 180px; }

/* Komunikaty systemowe */
#system-message-container { display:none; }

.alert, .joomla-alert {
	position: relative;
	padding: 14px 18px;
	border-radius: var(--bhp-radius-sm);
	border: 1px solid var(--bhp-outline);
	border-left-width: 4px;
	background: var(--bhp-surface-2);
	margin-bottom: 16px;
}

.alert h4, .alert .alert-heading { margin: 0 0 6px; font-size: 1rem; }
.alert p:last-child, .alert ul:last-child { margin-bottom: 0; }
.alert-success { border-left-color: #2e7d32; }
.alert-info, .alert-notice { border-left-color: #0277bd; }
.alert-warning { border-left-color: #ef6c00; }
.alert-error, .alert-danger { border-left-color: #b3261e; }
.alert .close { position: absolute; top: 8px; right: 12px; background: none; border: 0; font-size: 1.4rem; line-height: 1; cursor: pointer; color: inherit; opacity: .6; }
.alert .close:hover { opacity: 1; }

/* Artykuly i blog */
.item-page, .blog, .blog-featured, .contact, .newsfeed, .categories-list, .category-list, .search, .login, .registration, .profile, .reset, .remind, .finder {
	background: var(--bhp-surface);
	border-radius: var(--bhp-radius);
	padding: 28px;
}

body.cards-elevated .item-page, body.cards-elevated .blog, body.cards-elevated .blog-featured,
body.cards-elevated .contact, body.cards-elevated .category-list, body.cards-elevated .search,
body.cards-elevated .login, body.cards-elevated .registration, body.cards-elevated .finder { box-shadow: var(--bhp-shadow-1); }

body.cards-outlined .item-page, body.cards-outlined .blog, body.cards-outlined .blog-featured,
body.cards-outlined .contact, body.cards-outlined .category-list, body.cards-outlined .search,
body.cards-outlined .login, body.cards-outlined .registration, body.cards-outlined .finder { border: 1px solid var(--bhp-outline); }

.page-header { margin-bottom: 20px; }
.page-header h1, .page-header h2 { margin: 0; }
.page-header h2 a { color: var(--bhp-heading); }

.article-info, .category-desc + .cat-items .article-info { font-size: .8125rem; color: var(--bhp-text-muted); margin-bottom: 16px; }
.article-info dd { display: inline-block; margin: 0 14px 0 0; }
.article-info .article-info-term { display: none; }

.items-row { display: grid; gap: var(--bhp-gap); grid-template-columns: minmax(0, 1fr); margin-bottom: var(--bhp-gap); }

@media (min-width: 768px) {
	.items-row.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.items-row.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.items-row.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

.items-row .row-fluid { display: contents; }
.items-row [class*="span"] { width: auto !important; padding: 0; }

.items-leading .leading-item, .item-content { margin-bottom: var(--bhp-gap); padding-bottom: var(--bhp-gap); border-bottom: 1px solid var(--bhp-outline); }
.items-row .item { background: var(--bhp-surface-2); border-radius: var(--bhp-radius); padding: 20px; }
.items-row .item .item-content { margin: 0; padding: 0; border: 0; }

.readmore { margin-top: 16px; }
.img-intro-left, .img-fulltext-left { float: left; margin: 0 20px 12px 0; max-width: 45%; }
.img-intro-right, .img-fulltext-right { float: right; margin: 0 0 12px 20px; max-width: 45%; }
.img-intro-none img, .img-fulltext-none img { margin-bottom: 16px; }
.item-image img, .img-intro-left img, .img-intro-right img { border-radius: var(--bhp-radius-sm); }

.pagination { margin-top: var(--bhp-gap); }
.pagination ul { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 0; justify-content: center; }

.pagination li a, .pagination li span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border-radius: var(--bhp-radius-btn);
	border: 1px solid var(--bhp-outline);
	color: var(--bhp-text);
	font-size: .9375rem;
}

.pagination li a:hover { background: var(--bhp-primary-a08); border-color: var(--bhp-primary); text-decoration: none; }
.pagination li.active span, .pagination li span.pagenav { background: var(--bhp-primary); border-color: var(--bhp-primary); color: var(--bhp-on-primary); }
.counter, .pagination .counter { text-align: center; color: var(--bhp-text-muted); font-size: .875rem; margin-top: 10px; }

/* Okruszki */
.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 0;
	font-size: .875rem;
	color: var(--bhp-text-muted);
}

.breadcrumb li { display: flex; align-items: center; gap: 8px; }
.breadcrumb .divider { color: var(--bhp-outline-strong); }
.breadcrumb .divider img { display: none; }
.breadcrumb .divider::after { content: "/"; }
.breadcrumb a { color: var(--bhp-text-muted); }
.breadcrumb a:hover { color: var(--bhp-link); }
.breadcrumb .active { color: var(--bhp-text); font-weight: 500; }

/* Zakladki i akordeony rdzenia */
.nav-tabs { display: flex; flex-wrap: wrap; gap: 4px; list-style: none; padding: 0; margin: 0 0 -1px; border-bottom: 1px solid var(--bhp-outline); }
.nav-tabs > li > a { display: block; padding: 10px 18px; border-radius: var(--bhp-radius-sm) var(--bhp-radius-sm) 0 0; color: var(--bhp-text-muted); }
.nav-tabs > li.active > a { background: var(--bhp-surface); border: 1px solid var(--bhp-outline); border-bottom-color: var(--bhp-surface); color: var(--bhp-text); }
.tab-content { padding: 20px 0; }
.tab-content > .tab-pane { display: none; }
.tab-content > .active { display: block; }

/* Tabele */
table { width: 100%; border-collapse: collapse; }
.table, table.category, table.contentpane { background: var(--bhp-surface); }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--bhp-outline); text-align: left; }
th { font-weight: 600; color: var(--bhp-heading); }
.table-responsive { overflow-x: auto; }

/* Znaczniki (tagi) */
.tags { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; padding: 0; margin: 12px 0; }
.tags .label, .tags a { display: inline-block; padding: 4px 12px; border-radius: var(--bhp-radius-btn); background: var(--bhp-primary-container); color: var(--bhp-on-primary-container); font-size: .8125rem; }
.tags a:hover { text-decoration: none; background: var(--bhp-primary); color: var(--bhp-on-primary); }

/* Wyszukiwarka w naglowku */
.bhp-header__search .search input, .bhp-header__search .finder input { min-width: 180px; padding: 8px 14px; border-radius: var(--bhp-radius-btn); }
.bhp-header__search .bhp-module { margin: 0; }

/* ==================================================================
   10. Stopka, powrot na gore, pasek postepu
   ================================================================== */
.bhp-footer {
	background: var(--bhp-footer-bg);
	color: var(--bhp-footer-text);
	padding: var(--bhp-section) 0 0;
	margin-top: var(--bhp-section);
}

.bhp-footer a { color: var(--bhp-footer-text); }
.bhp-footer a:hover { color: var(--bhp-footer-text); text-decoration: underline; }
.bhp-footer h1, .bhp-footer h2, .bhp-footer h3, .bhp-footer h4, .bhp-footer h5, .bhp-footer h6 { color: var(--bhp-footer-text); }
.bhp-footer .bhp-module__title { font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; opacity: .85; }
.bhp-footer ul.menu a { padding: 6px 0; color: var(--bhp-footer-muted); }
.bhp-footer ul.menu a:hover { color: var(--bhp-footer-text); background: none; }
.bhp-footer__cols { padding-bottom: var(--bhp-section); }

.bhp-footer__bar {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
	justify-content: space-between;
	padding-top: 20px;
	padding-bottom: 20px;
	border-top: 1px solid var(--bhp-footer-outline);
	font-size: .875rem;
	color: var(--bhp-footer-muted);
}

.bhp-footer__copy { margin: 0; }
.bhp-footer__menu ul { display: flex; flex-wrap: wrap; gap: 18px; list-style: none; margin: 0; padding: 0; }

.bhp-totop {
	position: fixed;
	right: 20px;
	bottom: 20px;
	width: 48px;
	height: 48px;
	z-index: 90;
	border: 0;
	border-radius: var(--bhp-radius-btn);
	background: var(--bhp-primary);
	color: var(--bhp-on-primary);
	box-shadow: var(--bhp-shadow-2);
	cursor: pointer;
	opacity: 0;
	transform: translateY(12px);
	transition: opacity var(--bhp-motion) ease, transform var(--bhp-motion) ease, background var(--bhp-motion) ease;
}

.bhp-totop[hidden] { display: none; }
.bhp-totop.is-visible { opacity: 1; transform: none; }
.bhp-totop:hover { background: var(--bhp-primary-hover); }

.bhp-totop span {
	display: block;
	width: 10px;
	height: 10px;
	margin: 0 auto;
	border-left: 2px solid currentColor;
	border-top: 2px solid currentColor;
	transform: rotate(45deg) translate(2px, 2px);
}

.bhp-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 200; pointer-events: none; }
.bhp-progress span { display: block; height: 100%; width: 0; background: var(--bhp-primary); transition: width 80ms linear; }

/* ==================================================================
   11. Strona bledu i tryb offline
   ================================================================== */
.bhp-error { text-align: center; padding: 12vh 20px; max-width: 620px; }
.bhp-error__code { font-size: clamp(64px, 18vw, 140px); font-weight: 800; line-height: 1; margin: 0; color: var(--bhp-primary); opacity: .3; }
.bhp-error__title { margin: 0 0 12px; }
.bhp-error__msg { color: var(--bhp-text-muted); margin-bottom: 28px; }
.bhp-error__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.bhp-error__trace { text-align: left; margin-top: 32px; font-size: .8125rem; overflow-x: auto; }

.bhp-offline { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 40px 20px; }

.bhp-offline__box {
	width: 100%;
	max-width: 420px;
	background: var(--bhp-surface);
	border-radius: var(--bhp-radius-lg);
	box-shadow: var(--bhp-shadow-2);
	padding: 36px;
	text-align: center;
}

.bhp-offline__img { max-height: 90px; width: auto; margin-bottom: 20px; }
.bhp-offline__msg { color: var(--bhp-text-muted); margin-bottom: 24px; }
.bhp-offline__form { text-align: left; }
.bhp-offline__form .bhp-btn { width: 100%; }

.bhp-component__inner { padding: 24px 0; }

/* ==================================================================
   12. Dostepnosc, druk, preferencje ruchu
   ================================================================== */
.bhp-skip {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 300;
	padding: 12px 20px;
	background: var(--bhp-primary);
	color: var(--bhp-on-primary);
	border-radius: 0 0 var(--bhp-radius-sm) 0;
}

.bhp-skip:focus { left: 0; color: var(--bhp-on-primary); }

:focus-visible { outline: 3px solid var(--bhp-primary); outline-offset: 2px; }

.sr-only, .element-invisible, .visually-hidden {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

html.smooth-scroll { scroll-behavior: smooth; }

body.no-motion *,
body.no-motion *::before,
body.no-motion *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; scroll-behavior: auto !important; }
}

@media print {
	.bhp-header, .bhp-topbar, .bhp-menubar, .bhp-footer, .bhp-totop, .bhp-nav,
	.bhp-backdrop, .bhp-sidebar, .bhp-progress, .bhp-skip, .bhp-breadcrumbs { display: none !important; }

	body { background: #fff; color: #000; font-size: 12pt; }
	.bhp-container { max-width: none; padding: 0; }
	.item-page, .blog { box-shadow: none; border: 0; padding: 0; }
	a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; word-break: break-all; }
}

/* Kierunek RTL */
[dir="rtl"] .bhp-brand { margin-right: 0; margin-left: auto; }
[dir="rtl"] .bhp-header__tools { margin-left: 0; margin-right: auto; }
[dir="rtl"] .bhp-nav ul.menu ul { margin: 0 12px 0 0; border-left: 0; border-right: 2px solid var(--bhp-outline); }
[dir="rtl"] .bhp-submenu-toggle { right: auto; left: 4px; }
[dir="rtl"] blockquote { border-left: 0; border-right: 4px solid var(--bhp-primary); border-radius: var(--bhp-radius-sm) 0 0 var(--bhp-radius-sm); }
[dir="rtl"] th, [dir="rtl"] td { text-align: right; }