/**
 * Earth theme — responsive overrides
 * Loaded after style.css; keeps desktop rules intact above 980px.
 */

/* ------------------------------------------------------------------------- */
/* Global box model for predictable fluid widths                             */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 979px) {
	html {
		box-sizing: border-box;
	}
	*,
	*::before,
	*::after {
		box-sizing: inherit;
	}
}

/* ------------------------------------------------------------------------- */
/* Tablet and down — fluid shell                                             */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 979px) {
	#wrapper {
		width: 100%;
		max-width: 940px;
		margin-left: auto;
		margin-right: auto;
		padding-left: clamp(12px, 4vw, 20px);
		padding-right: clamp(12px, 4vw, 20px);
	}

	#masterhead {
		width: 100%;
		max-width: 940px;
		padding-left: clamp(12px, 4vw, 0);
		padding-right: clamp(12px, 4vw, 0);
	}

	#footer-botttom {
		width: 100%;
		max-width: 940px;
		padding-left: clamp(12px, 4vw, 20px);
		padding-right: clamp(12px, 4vw, 20px);
		box-sizing: border-box;
	}

	/* Home columns */
	#recent-events,
	#recent-news {
		float: none;
		width: 100%;
		margin-bottom: 30px;
	}

	#recent-events .event-entry-content,
	.recent-entry-content {
		width: auto;
		max-width: 100%;
		overflow: hidden;
	}

	.hp-highlight {
		width: calc(50% - 15px);
		margin-right: 15px;
	}
	.hp-highlight:nth-child(even) {
		margin-right: 0;
	}

	/* Slider */
	#slider-wrap {
		width: auto;
		margin-left: -20px;
		margin-right: -20px;
		height: auto;
		min-height: 180px;
	}
	#slider-wrap:before {
		width: 100%;
	}
	#slider .slides_container {
		width: 100% !important;
		height: auto !important;
		min-height: 160px;
	}
	#slider .slides_container div.single_slide {
		width: 100% !important;
	}
	#slider div.slides_container img {
		width: 100% !important;
		height: auto !important;
		max-height: none;
		object-fit: cover;
	}

	#flickr-slideshow-wrap {
		height: auto;
		min-height: 200px;
		margin-left: -20px;
		margin-right: -20px;
	}
	#flickr-slideshow-wrap iframe,
	#flickr-slideshow-wrap object,
	#flickr-slideshow-wrap embed {
		max-width: 100% !important;
		width: 100% !important;
		height: auto !important;
		min-height: 220px;
	}

	.gallery-slider {
		height: auto;
	}
	.gallery-slider .slides_container,
	.gallery-slider .slides_container div.single_slide {
		width: 100% !important;
		max-width: 100%;
		height: auto !important;
	}
	.gallery-slider .slides_container img {
		width: 100%;
		height: auto !important;
	}

	/* Footer widgets */
	#footer-widget-first,
	#footer-widget-second,
	#footer-widget-third,
	#footer-widget-fourth {
		float: none;
		width: 100%;
		max-width: 420px;
		margin-left: auto;
		margin-right: auto;
	}

	.loga .box {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		align-items: center;
		gap: 8px;
	}
	#footer-wrapper .loga img {
		max-width: min(140px, 28vw);
		height: auto;
		margin: 6px;
	}

	/* Export controls */
	.controls-wrapper {
		flex-wrap: wrap !important;
		gap: 10px;
	}
	#films_list_wrapper {
		position: relative;
		padding-top: 0;
	}
	#films_list_wrapper .export-buttons,
	.export-buttons {
		position: relative !important;
		float: none !important;
		display: flex !important;
		flex-wrap: wrap;
		gap: 8px;
		justify-content: flex-start;
		margin: 0 0 10px 0 !important;
	}
}

/* ------------------------------------------------------------------------- */
/* Single column content + sidebar                                           */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 860px) {
	.post,
	.post.full-width,
	#sidebar {
		float: none;
		width: 100%;
		max-width: 100%;
	}

	.loop-entry-left,
	.loop-entry-right,
	.entry-left,
	.entry-right,
	.entry-right-single {
		float: none;
		width: 100%;
	}

	.related-entry .featured-image,
	.recent-entry .featured-image {
		float: none;
		display: block;
		margin: 0 0 12px;
	}

	.related-entry-content {
		float: none;
		width: 100%;
	}

	#event-wrap .event-entry-content,
	#event-details-right {
		float: none;
		width: 100%;
	}

	#event-tabs #tab-gallery-inner {
		width: 100%;
	}
	#event-tabs #tab-gallery a {
		width: calc(50% - 10px);
		margin-right: 10px;
	}

	#detail-layout div.text.floatright,
	#detail-layout div.text.floatright div.text_wrapper,
	#detail-layout div.text div.detail-heading,
	#detail-layout div.text.floatright div.detail-heading {
		float: none;
		width: 100%;
		max-width: 100%;
	}
	#detail-layout div.text div.text_wrapper {
		position: relative;
		width: 100% !important;
	}
	#detail-layout {
		right: 0;
		padding-left: clamp(12px, 3vw, 20px);
		padding-right: clamp(12px, 3vw, 20px);
	}

	.gallery-entry {
		width: calc(50% - 12px);
		margin-right: 12px;
	}
}

@media screen and (max-width: 979px) {
	.hp-highlight {
		width: 100%;
		margin-right: 0;
		float: none;
	}
	#home-highlights {
		margin-right: 0;
	}
}

/* ------------------------------------------------------------------------- */
/* Stacked navigation + search                                                 */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 782px) {
	body {
		overflow-x: hidden;
	}

	#mastersocial {
		position: static;
		text-align: center;
		margin: 0 0 15px;
	}
	#mastersocial li {
		float: none;
		display: inline-block;
		margin: 0 4px;
	}

	#logo {
		float: none;
		text-align: center;
		margin-bottom: 10px;
	}
	#logo img {
		margin: 0 auto;
		max-height: 70px;
		width: auto;
	}

	#header-donate {
		position: static;
		display: table;
		margin: 12px auto 0;
		right: auto;
	}

	#mainnav {
		height: auto;
		margin-left: clamp(-16px, -4vw, -20px);
		margin-right: clamp(-16px, -4vw, -20px);
		padding-bottom: 12px;
	}

	#mainnav .sf-menu {
		border-bottom: none;
	}
	#mainnav .sf-menu > li {
		float: none;
		width: 100%;
		background-image: none;
		border-bottom: 1px solid rgba(0, 0, 0, 0.12);
	}
	#mainnav .sf-menu > li:last-child {
		border-bottom: none;
	}
	#mainnav .sf-menu a {
		height: auto;
		line-height: 1.35;
		padding: 14px 16px;
	}

	/* Submenus: static stack; open state via .earth-submenu-open (JS) */
	#mainnav .sf-menu li:hover > ul,
	#mainnav .sf-menu li.sfHover > ul {
		left: auto !important;
		top: auto !important;
	}
	#mainnav .sf-menu ul {
		position: static !important;
		width: 100% !important;
		top: auto !important;
		left: auto !important;
		box-shadow: none;
		display: none !important;
		opacity: 1 !important;
		visibility: visible !important;
		padding-left: 0;
	}
	#mainnav .sf-menu li.earth-submenu-open > ul {
		display: block !important;
	}
	#mainnav .sf-menu ul a {
		padding: 12px 16px 12px 28px;
	}
	#mainnav .sf-menu ul ul a {
		padding-left: 40px;
	}

	ul.sf-menu li li:hover ul,
	ul.sf-menu li li.sfHover ul {
		left: auto !important;
		top: auto !important;
	}

	#mainnav .sf-menu li.menu-item-has-children > a {
		padding-right: 2.5em;
	}

	/*
	 * Nav search: keep position:relative so #searchsubmit (absolute) stays inside the form.
	 * Reset desktop #mainnav #searchbar absolute coords (top/right/margin-top).
	 */
	#mainnav #searchbar {
		position: relative;
		left: auto;
		right: auto;
		top: auto;
		margin: 12px clamp(12px, 4vw, 20px) 10px;
		width: auto;
		max-width: 100%;
		height: 38px;
		line-height: 38px;
		box-sizing: border-box;
	}
	#mainnav #searchbar input#search {
		height: 38px;
		line-height: 38px;
		padding: 0 6.5rem 0 8px;
		vertical-align: top;
	}
	#mainnav #searchbar #searchsubmit {
		top: 0;
		right: 0;
		height: 38px;
		line-height: 38px;
		margin-top: 0;
		padding: 0 10px;
		width: auto;
		min-width: 4.5rem;
		background: #bdd3f3 none;
		-webkit-border-top-right-radius: 3px;
		-webkit-border-bottom-right-radius: 3px;
		-moz-border-radius-topright: 3px;
		-moz-border-radius-bottomright: 3px;
		border-top-right-radius: 3px;
		border-bottom-right-radius: 3px;
	}
	#mainnav #searchbar #searchsubmit:hover,
	#mainnav #searchbar #searchsubmit:focus {
		background: #a8c8f0 none;
	}

	.center-column #page-heading h1,
	.center-column #page-heading h2 {
		margin-right: 0;
	}

	#page-heading {
		margin-left: clamp(-16px, -4vw, -20px);
		margin-right: clamp(-16px, -4vw, -20px);
		padding: 18px clamp(12px, 4vw, 20px);
		font-size: clamp(1.125rem, 4vw, 1.5rem);
	}
	#page-heading h1,
	#page-heading h2 {
		font-size: inherit;
		line-height: 1.2;
	}

	blockquote.left,
	blockquote.right {
		float: none;
		width: 100%;
		margin: 20px 0;
		text-align: left;
	}

	.gallery-entry {
		float: none;
		width: 100%;
		margin-right: 0;
	}

	#single-gallery-media a,
	#single-gallery-media img {
		float: none;
		max-width: 100%;
	}

	.two-columns {
		width: 100% !important;
		float: none !important;
		margin-bottom: 1em;
	}

	table.calendar {
		font-size: 11px;
	}
	td.calendar-day-head {
		width: auto;
		padding: 4px 2px;
		font-size: 10px;
	}
	td.calendar-day,
	td.calendar-day-np {
		padding: 6px 4px;
		min-height: 50px;
	}
}

/* ------------------------------------------------------------------------- */
/* Plán premiér — only the films table scrolls horizontally on small screens   */
/* (filter/export stay full width; table lives in #films_list_wrapper)        */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 920px) {
	#table-layout {
		width: 100%;
		max-width: 100%;
		overflow-x: visible;
	}
	#table-layout #films_list_wrapper {
		display: block;
		width: 100%;
		max-width: 100%;
		overflow-x: auto;
		overflow-y: visible;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior-x: contain;
	}
	#table-layout #films_list_wrapper table.table-box,
	#table-layout table.table-box {
		width: auto;
		min-width: 720px;
		max-width: none;
		box-sizing: border-box;
	}
}

/* Plán premiér — stack filter panel + export card on narrow screens */
@media screen and (max-width: 640px) {
	#table-layout .premiere-filter-card {
		flex-wrap: wrap;
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
	}
	#table-layout .premiere-export-card {
		align-self: stretch;
		justify-content: flex-start;
	}
	#table-layout #tbl_display .smbox {
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
	}
	#table-layout #tbl_display #film_tags {
		flex-basis: auto;
	}
	#table-layout #tbl_display input[name="_display"].button {
		align-self: flex-start;
		margin-top: 2px;
	}
}

/* ------------------------------------------------------------------------- */
/* Small phones                                                                */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 480px) {
	body {
		font-size: 14px;
	}

	#event-tabs #tab-gallery a {
		float: none;
		width: 100%;
		margin-right: 0;
	}

	#error-page-title {
		font-size: clamp(4rem, 22vw, 12rem);
		line-height: 1;
	}
	#error-page-text {
		margin-top: -20px;
		padding: 0 10px;
	}

	.wpcf7 input[type="text"],
	.wpcf7 input[type="email"],
	.wpcf7 input[type="tel"],
	.wpcf7 input[type="url"] {
		width: 100% !important;
		max-width: 100%;
		box-sizing: border-box;
	}

	#commentform input#author,
	#commentform input#email,
	#commentform input#url {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	.backup {
		bottom: 16px;
		right: 16px;
		padding: 10px 12px;
	}

	.text-logo {
		font-size: clamp(1.25rem, 6vw, 2rem);
	}
}

/* ------------------------------------------------------------------------- */
/* Post / page content — no nested horizontal scroll on .entry               */
/* (overflow-x:auto on the whole entry felt like “scrolling inside the page”) */
/* ------------------------------------------------------------------------- */
.post .entry,
article.post .entry,
.page .post .entry {
	max-width: 100%;
	min-width: 0;
	overflow-x: visible;
	box-sizing: border-box;
}

.post .entry table,
article.post .entry table,
.page .post .entry table {
	max-width: 100%;
	table-layout: fixed;
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

.post .entry th,
.post .entry td,
article.post .entry th,
article.post .entry td,
.page .post .entry th,
.page .post .entry td {
	word-wrap: break-word;
	overflow-wrap: anywhere;
}

.post .entry img,
.post .entry iframe,
.post .entry video,
.post .entry embed,
article.post .entry img,
article.post .entry iframe,
.page .post .entry img,
.page .post .entry iframe {
	max-width: 100%;
	height: auto;
}

.post .entry pre,
article.post .entry pre,
.page .post .entry pre {
	max-width: 100%;
	overflow-x: visible;
	white-space: pre-wrap;
	word-break: break-word;
}

/* ------------------------------------------------------------------------- */
/* Film detail + archiv — tab bar (archiv); stacked blocks (film detail)    */
/* ------------------------------------------------------------------------- */
@media screen and (max-width: 979px) {
	#tabs {
		padding-top: 48px;
	}
	#tabs ul {
		position: static;
		margin: 0 0 12px;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		gap: 4px 6px;
	}
	#tabs ul li {
		float: none;
		height: auto;
		margin: 0;
	}
	#tabs ul li a {
		height: auto;
		line-height: 1.25;
		padding: 8px 10px;
	}
	#tabs ul li.ui-state-active a {
		height: auto;
		line-height: 1.25;
	}
	table.detail_info {
		width: 100%;
		max-width: 100%;
		table-layout: fixed;
		word-wrap: break-word;
	}
	table.detail_info td {
		padding: 8px 10px 8px 4px;
		word-break: break-word;
	}
	#tabs div.tab div.item,
	.film-detail-blocks .film-detail-block__body .item {
		display: block;
		overflow: visible;
	}
	#tabs div.tab div.item img,
	.film-detail-blocks .film-detail-block__body .item img {
		float: none;
		display: block;
		margin: 0 0 10px;
		max-width: 100%;
		height: auto;
	}
	#tabs div.tab div.item div.url,
	#tabs div.tab div.item div.url.floatleft,
	.film-detail-blocks .film-detail-block__body .item div.url,
	.film-detail-blocks .film-detail-block__body .item div.url.floatleft {
		float: none;
		width: 100% !important;
		max-width: 100%;
	}
	#tabs div.tab div.item div.url input.uri,
	.film-detail-blocks .film-detail-block__body .item div.url input.uri {
		float: none;
		width: 100% !important;
		max-width: 100%;
		margin-right: 0;
		margin-top: 10px;
		box-sizing: border-box;
	}
	#tabs div.url .toclipboard_wrapper,
	#tabs div.url.floatleft .toclipboard_wrapper,
	.film-detail-blocks .film-detail-block__body div.url .toclipboard_wrapper,
	.film-detail-blocks .film-detail-block__body div.url.floatleft .toclipboard_wrapper {
		position: static;
		margin: 10px 0 0;
	}
	#tabs iframe.ytplayer,
	.film-detail-blocks iframe.ytplayer {
		max-width: 100%;
		width: 100% !important;
		height: auto;
		min-height: 200px;
		aspect-ratio: 16 / 9;
	}
}

@media screen and (max-width: 782px) {
	#detail-layout img.ilustr {
		float: none;
		display: block;
		margin: 0 auto 14px;
	}
	#detail-layout div.text.floatright,
	#detail-layout div.text.floatright div.text_wrapper,
	#detail-layout div.text div.detail-heading,
	#detail-layout div.text.floatright div.detail-heading {
		float: none;
		width: 100% !important;
		max-width: 100%;
	}
	#detail-layout div.text div.text_wrapper {
		position: relative;
		width: 100% !important;
	}
	#detail-layout div.detail-heading {
		height: auto !important;
		min-height: 0;
		overflow: visible !important;
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		width: 100%;
	}
	#detail-layout div.detail-heading h1 {
		float: none;
		margin-bottom: 0;
		line-height: 1.2;
		width: 100%;
	}
	#detail-layout div.detail-heading div.icons {
		float: none;
		clear: both;
		display: flex;
		flex-wrap: wrap;
		gap: 6px;
		align-items: center;
	}
	#detail-layout .release {
		clear: both;
		margin-top: 12px;
	}
}