/* Doplněk k původnímu template.css pro HTML, které generuje Joomla 6 (bez Bootstrapu). */

/* skryté popisky (J6 je označuje třídou visually-hidden) */
.visually-hidden, .element-invisible {
	position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important;
	margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important; border: 0 !important;
}

/* přihlašovací modul */
.mod-login .input-group, .mod-login .control-group, .mod-login .form-group { display: block; margin: 0 0 4px 0; }
.mod-login input.form-control { width: 140px; }
.mod-login .mod-login__options, .mod-login ul { list-style: none; margin: 4px 0 0 0; padding: 0; }
.mod-login .mod-login__options li, .mod-login ul li { background: none; padding: 0; }
.mod-login .input-group-text, .mod-login .icon-user, .mod-login .icon-lock { display: none; }
/* J6 přidává u hesla tlačítko "zobrazit heslo" (ikonový font šablona nemá -> prázdný obdélníček); v J3 nebylo */
.mod-login .input-password-toggle { display: none; }

/* Phoca Gallery 6: zamčená kategorie = SVG zámek 256x192 (inline styl); vrátit původní ikonu 64x64 z J3 */
svg.ph-si-lock-medium {
	width: 64px !important; height: 64px !important;
	background: url(/media/com_phocagallery/images/icon-folder-medium-key.png) no-repeat center;
}
svg.ph-si-lock-medium use { display: none; }

/* informace o článku (J6: dl.article-info) */
dl.article-info { margin: 0 0 8px 0; font-size: 0.9em; color: #666; }
dl.article-info dt.article-info-term { display: none; }
dl.article-info dd { display: inline; margin: 0 10px 0 0; }

/* stránkování (J6: ul.pagination) */
ul.pagination, .pagination ul { list-style: none; margin: 10px 0; padding: 0; }
ul.pagination li, .pagination ul li { display: inline; margin: 0 3px; background: none; padding: 0; }

/* ikony bez fontu ikon nezobrazovat */
span[class^="icon-"], span[class*=" icon-"] { display: none; }

/* stránkování: J6 má místo textu jen ikony -> vrátit texty jako v J3 */
.pagination span.icon-angle-double-left, .pagination span.icon-angle-left,
.pagination span.icon-angle-right, .pagination span.icon-angle-double-right { display: inline; }
.pagination .icon-angle-double-left::before { content: "Začátek"; }
.pagination .icon-angle-left::before { content: "Předchozí"; }
.pagination .icon-angle-right::before { content: "Následující"; }
.pagination .icon-angle-double-right::before { content: "Konec"; }

/* obrázky v obsahu nesmí přetéct sloupec */
#maincolumn img, #maincolumn_full img { max-width: 100%; height: auto; }

/* menu: J6 skrývá podmenu aktivní položky skriptem (aria-hidden) a nabízí tlačítko se šipkou (ikonový font chybí)
   -> podmenu aktivní položky vždy zobrazit jako v J3, tlačítko skrýt */
#leftcolumn ul.menu ul.mod-menu__sub, #rightcolumn ul.menu ul.mod-menu__sub { display: block !important; }
.mod-menu__toggle-sub { display: none !important; }

/* Phoca Gallery 6 (theme_simple) -> vzhled jako v J3: popisek pod náhledem, bez ikon akcí, bez tmavého pruhu */
.pg-item-box, .pg-category-box {
	width: min-content; min-width: 120px; margin: 6px; padding: 6px; background: #fff; text-align: center;
	border: 1px solid #e0e0e0; box-shadow: 0 1px 4px rgba(0, 0, 0, .15);
}
.pg-item-box-title, .pg-category-box-title {
	position: static !important; width: auto !important; padding: 4px 0 0 !important; background: none !important;
	border-radius: 0 !important; color: #333 !important; font-weight: normal !important; font-size: 12px !important;
}
#phocagallery .pg-item-box-title a, #phocagallery .pg-category-box-title a,
.pg-item-box-title a, .pg-category-box-title a { color: #333 !important; text-decoration: underline !important; }
.pg-item-box-title .ph-si-image { display: none; }
.pg-item-box-icons-box { display: none !important; }
.pg-category-box-count { color: #999 !important; }
.pg-category-box-image svg, .pg-item-box-image img, .pg-item-box-image svg, .pg-category-box-image img { box-shadow: none !important; }
.pg-svg-box { max-width: none !important; aspect-ratio: auto !important; }
.pg-svg-box svg { padding: 0 !important; }
svg.ph-si-back-medium { width: 64px !important; height: 64px !important; background: none !important; }
/* modální okno Phoca (Bootstrap modal) – bez Bootstrap CSS by se vykreslilo do stránky (Název / šedý obdélník / Zavřít) */
#pgCategoryModal:not(.show), .modal:not(.show) { display: none !important; }

/* ===== Responzivita (původní šablona má pevnou šířku 990 px; na počítači se nic nemění) ===== */
.nav-toggle { display: none; }
/* tablet a menší: bloky na šířku okna, obrázky záhlaví a pozadí zmenšit ve stejném poměru */
@media (max-width: 1000px) {
	#page_bg { background-size: 100% auto; }
	div.center, #header, .pill_m, #content_top, div#wrapper, #footer { width: 100%; }
	#header { height: auto; aspect-ratio: 990 / 287; background-size: 100% auto; }
	#logo { width: auto; padding: 6% 4% 0; }
	#logo a, #logo a:link, #logo a:hover { font-size: clamp(16px, 3.1vw, 30px); line-height: 1.25; letter-spacing: 0; }
	.pill_m { height: auto; aspect-ratio: 990 / 30; background-size: 100% auto; }
	#content_top { background-size: 100% auto; }
	#content { width: auto; padding: 20px 3%; }
	div#maincolumn { width: calc(100% - 380px); }
	div#maincolumn_full { width: calc(100% - 190px); }
	#footer p { padding-right: 4%; }
	input, select, textarea { max-width: 100%; box-sizing: border-box; }
}
/* mobil: sloupce pod sebou (menu + přihlášení, obsah, informace), větší písmo a položky menu */
@media (max-width: 760px) {
	body { font-size: 15px; }
	#leftcolumn, #rightcolumn, div#maincolumn, div#maincolumn_full {
		float: none !important; width: auto !important; padding: 0 !important; margin: 0 0 16px 0;
	}
	#leftcolumn ul.menu, #rightcolumn ul.menu { width: auto; }
	#leftcolumn ul.menu li a, #leftcolumn ul.menu li a:link, #rightcolumn ul.menu li a, #rightcolumn ul.menu li a:link {
		font-size: 15px; line-height: 30px;
	}
	#leftcolumn ul.menu li ul li a, #leftcolumn ul.menu li.active ul li a { font-size: 14px; line-height: 26px; }
	div.module div div div form { width: auto; }
	div.nopad { overflow-x: auto; }
	#maincolumn table, #maincolumn_full table { max-width: 100%; }
	#footer { height: auto; }
	#footer p { height: auto; text-align: center; padding: 10px 0 0; }
}

/* mobil: hamburger "Menu" v záhlaví; levý sloupec (hlavní nabídka + přihlášení) je skrytý, po klepnutí se rozbalí pod záhlavím */
@media (max-width: 760px) {
	#header { position: relative; }
	#logo { padding-right: 70px; text-align: left; }
	.nav-toggle {
		display: block; position: absolute; top: 10px; right: 10px; z-index: 10;
		width: 54px; padding: 8px 9px 4px; background: #fff; border: 2px solid #333; border-radius: 6px;
		cursor: pointer; box-shadow: 0 1px 4px rgba(0, 0, 0, .3);
	}
	.nav-toggle-bar { display: block; height: 3px; margin: 0 0 5px; background: #333; border-radius: 2px; }
	.nav-toggle-text { display: block; font-size: 10px; line-height: 12px; color: #333; text-align: center; }
	body.nav-open .nav-toggle { background: #333; }
	body.nav-open .nav-toggle-bar { background: #fff; }
	body.nav-open .nav-toggle-text { color: #fff; }
	#leftcolumn { display: none; }
	body.nav-open #leftcolumn { display: block; border-bottom: 1px solid #ccc; padding-bottom: 8px !important; }
}