/*
 * CZEXPEDITION – responzivní úpravy šablony (SIMPLO, 2026-10)
 *
 * Původní šablona má pevnou šířku 990 px. Tyto styly se načítají až za
 * style.css a dark.css a na užších obrazovkách layout přestaví: rozbalovací
 * menu, obsah a pravý sloupec pod sebe, karty článků přes celou šířku.
 * Na počítači (nad 1010 px) se vzhled nemění.
 */

/* Obrázky a vložený obsah nikdy nepřetečou */
#content img,
#primary img,
#footer img {
	max-width: 100%;
	height: auto;
}
#content iframe,
#content embed,
#content object,
#content video {
	max-width: 100%;
}

/* Tlačítko mobilního menu je jen na mobilu a tabletu */
.menu-toggle {
	display: none;
}

/* Mapa skutečné trasy (Leaflet + OpenStreetMap) */
.trasa-mapa {
	height: 600px;
	background: #e8eef2;
}
.mapa-trasy img {
	display: block;
	margin: 0 auto;
}

/* Stránkování – i na počítači čistší čísla stránek */
.wp-pagenavi {
	clear: both;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 6px;
	padding: 5px 0 20px;
	font-size: 13px;
	line-height: 1;
}
.wp-pagenavi a,
.wp-pagenavi span {
	margin: 0 !important;
	padding: 8px 11px !important;
	border: 0 !important;
	border-radius: 3px;
	background: #fff;
	color: #0b5f89;
	text-decoration: none;
}
.wp-pagenavi a:hover {
	background: #e6f3f9;
}
.wp-pagenavi span.current {
	background: #1597c9;
	color: #fff;
	font-weight: bold;
}
.wp-pagenavi span.pages {
	background: none;
	color: #cfe6f2;
	padding-left: 0 !important;
	padding-right: 4px !important;
}
.wp-pagenavi span.extend {
	background: none;
	color: #cfe6f2;
	padding-left: 2px !important;
	padding-right: 2px !important;
}

@media (max-width: 1010px) {
	html,
	body {
		overflow-x: hidden;
	}

	#wrapper,
	#main,
	div.menu,
	.colophon,
	#access .menu-header {
		width: auto;
		max-width: 990px;
		box-sizing: border-box;
	}
	#wrapper {
		padding: 0 10px;
	}
	#header {
		padding-left: 0;
	}
	#masthead,
	#masthead-en {
		background-position: right 10px top 60px;
	}

	/* Rozbalovací menu */
	#access {
		width: auto;
		height: auto;
		border-radius: 2px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	}
	.menu-toggle {
		display: flex;
		align-items: center;
		gap: 12px;
		width: 100%;
		height: 52px;
		margin: 0;
		padding: 0 18px;
		border: 0;
		background: transparent;
		color: #1d1d1d;
		font: 15px/1 "DIN Next", "Trebuchet MS", Arial, sans-serif;
		text-align: left;
		cursor: pointer;
		-webkit-tap-highlight-color: transparent;
	}
	.menu-toggle-icon,
	.menu-toggle-icon::before,
	.menu-toggle-icon::after {
		display: block;
		width: 20px;
		height: 2px;
		border-radius: 1px;
		background: #1597c9;
		transition: transform 0.2s, background 0.2s;
	}
	.menu-toggle-icon {
		position: relative;
	}
	.menu-toggle-icon::before,
	.menu-toggle-icon::after {
		content: "";
		position: absolute;
		left: 0;
	}
	.menu-toggle-icon::before {
		top: -6px;
	}
	.menu-toggle-icon::after {
		top: 6px;
	}
	.is-open .menu-toggle-icon {
		background: transparent;
	}
	.is-open .menu-toggle-icon::before {
		transform: translateY(6px) rotate(45deg);
	}
	.is-open .menu-toggle-icon::after {
		transform: translateY(-6px) rotate(-45deg);
	}
	.menu-toggle-current {
		margin-left: auto;
		color: #0b5f89;
		font-size: 14px;
	}
	#navigace,
	#navigace_en {
		display: none;
		height: auto;
		width: auto;
	}
	#access.is-open #navigace,
	#access.is-open #navigace_en {
		display: block;
	}
	#navigace li {
		display: block;
	}
	#navigace a {
		float: none;
		display: block;
		width: auto !important;
		height: auto !important;
		padding: 15px 18px 15px 50px !important;
		overflow: visible;
		border-top: 1px solid #e4e4e4;
		background: none !important;
		color: #1d1d1d;
		font: 15px/1.2 "DIN Next", "Trebuchet MS", Arial, sans-serif;
		text-decoration: none;
	}
	#navigace a:hover {
		background: #f3f8fb !important;
	}
	#navigace a.selected {
		background: #1597c9 !important;
		color: #fff;
	}

	/* Obsah a pravý sloupec pod sebe */
	#container {
		float: none;
		margin: 0;
	}
	#content,
	.one-column #content,
	.single-attachment #content {
		margin: 0;
		width: auto;
		padding-left: 0;
	}
	/* Stránky, nadpis archivu, 404 a prázdné vyhledávání mají v šabloně
	   margin-left: 10px (na počítači místo „ouška“ stužky). Na mobilu by bílý
	   box odskočil. */
	#content > div[style*="margin-left"],
	#header1,
	#post-0 {
		margin-left: 0 !important;
	}

	#primary,
	#secondary {
		float: none;
		width: auto;
		margin-top: 15px;
	}

	/* Karty článků a komentářů na šířku obrazovky. První sloupec tabulky
	   (10 px) nese jen „ouško“ stužky s datem – posuneme ho do okraje, aby
	   bílá karta měla vlevo i vpravo stejné odsazení. */
	#content table[width],
	#comments table[width] {
		width: calc(100% + 10px) !important;
		max-width: none;
		margin-left: -10px;
		table-layout: fixed;
	}
	#content td[width]:not([width="10"]):not(.post-table-comments),
	#comments td[width]:not([width="10"]):not(.comment-table-comments) {
		width: auto !important;
	}
	/* Fotky mají v šabloně rámeček s paddingem – bez border-box by
	   max-width: 100 % přetekla o rámeček přes okraj karty */
	#content img {
		box-sizing: border-box;
	}
	.wp-caption {
		max-width: 100%;
		box-sizing: border-box;
	}
	.wp-caption img {
		max-width: calc(100% - 10px) !important;
	}

	/* Záložka „Sdílejte článek“ je v obrázku pozadí – na širší kartě by se opakovala */
	.post-table-bottom,
	.post-table-bottom-en {
		background-repeat: no-repeat;
	}

	/* Odpočet „Na cestě jsme byli“ na střed */
	#countdown_dashboard {
		margin: 0 auto;
	}

	/* Patička */
	#footer-widget-area {
		padding-right: 10px;
	}
	#footer-widget-area .widget-area {
		width: calc(33.33% - 20px);
		margin-right: 20px;
		margin-bottom: 20px;
	}
	#site-info,
	#site-generator {
		width: auto;
		float: none;
	}
}

@media (max-width: 640px) {
	/* Hlavička: logo na střed, bez tečkované mapy za ním, pod ním podtitul */
	#header {
		margin: 0 -10px;
		padding: 22px 10px 0;
		/* Barvy navazují na pozadí loga, takže logo nemá viditelný rámeček */
		background: linear-gradient(to bottom, #061c37 0, #061c37 22px, #07223e 153px, #0b2c50 100%);
		border-bottom: 1px solid rgba(255, 255, 255, 0.06);
		margin-bottom: 12px;
		padding-bottom: 1px;
	}
	#masthead,
	#masthead-en {
		height: auto;
		background: none;
		overflow: hidden;
		text-align: center;
	}
	#masthead::after {
		content: "";
		display: block;
		width: 300px;
		max-width: 88%;
		height: 58px;
		margin: 14px auto 18px;
		background: url("../images/img_podnadpis.png") no-repeat center / contain;
	}
	#masthead-en::after {
		content: "";
		display: block;
		width: 300px;
		max-width: 88%;
		height: 58px;
		margin: 14px auto 18px;
		background: url("../images/img_podnadpis-en.png") no-repeat center / contain;
	}
	#branding {
		float: none;
		width: auto;
	}
	#branding img {
		width: 160px;
		height: auto;
	}

	/* Menší okraje v článcích */
	.post-table-title {
		padding: 20px 15px 18px;
	}
	.post-table-title h1,
	.post-table-title h2,
	#content .entry-title {
		font-size: 24px;
		line-height: 1.25;
	}
	/* Bez sloupce s počtem komentářů vedle nadpisu – je na něj málo místa.
	   Buňka zůstává s nulovou šířkou, jinak by si tabulka sloupec ponechala. */
	.post-table-comments,
	.post-table-name-back02 {
		width: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: none;
		font-size: 0;
		overflow: hidden;
		visibility: hidden;
	}
	.post-table-name-right {
		min-width: 0;
		padding-right: 18px;
		font-size: 11px;
	}
	.post-table-main {
		padding-left: 15px;
		padding-right: 15px;
		padding-bottom: 20px;
	}
	.post-table-bottom-social {
		padding-left: 15px;
	}

	/* Stránkování: jen čísla, bez „Strana x z y“ a „Poslední“ */
	.wp-pagenavi span.pages,
	.wp-pagenavi a.first,
	.wp-pagenavi a.last {
		display: none;
	}

	.trasa-mapa {
		height: 420px;
	}

	#footer-widget-area .widget-area {
		width: auto;
		float: none;
		margin-right: 0;
	}

	/* Fotky s popiskem přes celou šířku místo obtékání */
	.wp-caption.alignleft,
	.wp-caption.alignright,
	#content img.alignleft,
	#content img.alignright {
		float: none;
		display: block;
		margin: 0 auto 18px;
	}
}
