/*
Theme Name: Trachtenverein Chieming
Theme URI: https://www.trachtenverein-chieming.de/
Description: Übernimmt das Erscheinungsbild der GTEV Chiemseer Chieming e.V.
Version: 1.0.0
Requires at least: 7.1
Tested up to: 7.1
Requires PHP: 8.5
Text Domain: trachtenverein
*/

body.admin-bar .menu_wraper {
	top: 32px;
}

@media (max-width: 782px) {
	body.admin-bar .menu_wraper {
		top: 46px;
	}
}

@media (max-width: 767px) {
	.menu_wraper {
		position: fixed;
		left: 0;
		transition: top 0.25s ease;
	}

	body .menu_wraper.nav-up {
		top: calc(var(--tv-menu-hide, 120px) * -1);
	}
}

.ce-gallery:has(.tv-video) {
	container-type: inline-size;
}

.tv-video {
	margin: 0 auto 1.2em;
	width: calc(var(--tv-w, 445) * 1px);
	max-width: 100%;
	min-width: 0;
}

@supports (width: min(1px, 100cqw)) {
	.tv-video {
		width: min(calc(var(--tv-w, 445) * 1px), 100cqw);
	}
}

.ce-gallery:has(.tv-video)[data-ce-columns="2"] .ce-column {
	width: calc(50% - 5px);
}

.ce-gallery:has(.tv-video)[data-ce-columns="1"] .ce-column {
	float: none;
	width: 100%;
}

.ce-gallery[data-ce-columns="2"] .tv-video,
.ce-column .tv-video {
	max-width: 100%;
	margin-bottom: 0;
}

@media (max-width: 600px) {
	.ce-gallery:has(.tv-video)[data-ce-columns="2"] .ce-column,
	.ce-gallery[data-ce-columns="2"] .ce-column,
	.ce-gallery[data-ce-columns="3"] .ce-column {
		float: none;
		width: 100%;
		margin-right: 0;
	}
}

.tv-video__start {
	display: grid;
	width: 100%;
	padding: 0;
	border: 4px solid #c2a364;
	background: #304030;
	color: #c2a364;
	cursor: pointer;
}

.tv-video__start img {
	grid-area: 1 / 1;
	display: block;
	width: 100%;
	height: auto;
}

.tv-video__start::before {
	content: "";
	grid-area: 1 / 1;
	justify-self: center;
	align-self: center;
	z-index: 1;
	width: 68px;
	height: 48px;
	border-radius: 12px;
	background: #ff0000 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 48'%3E%3Cpath d='M27 14v20l18-10z' fill='white'/%3E%3C/svg%3E") center / 68px 48px no-repeat;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
	pointer-events: none;
	transform: translateY(-14px);
}

.tv-video__start:hover::before,
.tv-video__start:focus-visible::before {
	background-color: #e00000;
}

.tv-video__label {
	grid-area: 1 / 1;
	align-self: center;
	justify-self: center;
	z-index: 1;
	margin: 0;
	padding: 2px 8px;
	transform: translateY(30px);
	border-radius: 4px;
	background: rgba(0, 0, 0, 0.55);
	color: #fff;
	font-family: Times, sans-serif;
	font-size: 17px;
	font-weight: normal;
	line-height: 1.2;
	pointer-events: none;
}

.tv-video iframe {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: var(--tv-w, 445) / var(--tv-h, 250);
	border: 0;
}

figcaption {
	font-family: Times, sans-serif;
	font-size: 1.7em;
	font-weight: normal;
	line-height: 1.45;
}

.ce-gallery figure figcaption,
.tv-bild figcaption {
	font-size: 15px;
	color: #777777;
	padding-top: 2px;
}

.ce-gallery:has(.tv-video) figcaption {
	font-size: 1.7em;
	color: #777777;
	padding-top: 0;
}

.col-sm-8,
.content_top .col-sm-10,
.wp-block-group.ce-textpic,
.tv-ce-hr {
	display: flow-root;
}

.wp-block-group.ce-textpic {
	overflow: visible;
}

.wp-block-group.ce-below.ce-right .ce-gallery {
	float: right;
}

.wp-block-group.ce-below.ce-left .ce-gallery {
	float: none;
}

.tv-intext {
	max-width: 45%;
	padding: 10px;
}

.tv-intext--left {
	float: left;
	margin: 0 10px 10px 0;
}

.tv-intext--right {
	float: right;
	margin: 0 0 10px 10px;
}

.tx-powermail .powermail_fieldset {
	margin: 0 9%;
}

.tx-powermail .powermail_fieldwrap {
	display: grid;
	grid-template-columns: minmax(9rem, 13.5rem) minmax(0, 1fr);
	align-items: center;
	column-gap: 1rem;
	margin: 0 0 0.85rem;
}

.tx-powermail .powermail_fieldwrap_textarea {
	align-items: start;
}

.tx-powermail .powermail_label {
	margin: 0;
	font-size: 1.65em;
	line-height: 1.15;
	text-align: right;
}

.tx-powermail .powermail_label::after {
	content: ":";
}

.tx-powermail .powermail_input,
.tx-powermail .powermail_select,
.tx-powermail .powermail_textarea {
	width: 100%;
	box-sizing: border-box;
	margin: 0;
	padding: 0.45em 0.6em;
	border: 1px solid #304030;
	border-radius: 0;
	background: #fff;
	color: #304030;
	font-family: Times, serif;
	font-size: 18px;
	line-height: 1.4;
}

.tx-powermail .powermail_fieldwrap_textarea .powermail_label {
	padding-top: 0.35em;
}

.tx-powermail .powermail_submit {
	grid-column: 2;
	justify-self: end;
	width: auto;
	float: none;
	margin: 0;
}

.tv-form-note {
	clear: both;
	margin: 1.4em 9% 0;
	color: #304030;
	font-size: 16px;
	line-height: 1.45;
	text-align: left;
}

@media (max-width: 767px) {
	.tx-powermail .powermail_fieldset,
	.tv-form-note {
		margin-left: 0;
		margin-right: 0;
	}

	.tx-powermail .powermail_fieldwrap {
		grid-template-columns: 1fr;
		row-gap: 0.25rem;
	}

	.tx-powermail .powermail_label {
		text-align: left;
	}

	.tx-powermail .powermail_submit {
		grid-column: 1;
		justify-self: start;
	}
}

.tv-form-ok,
.tv-form-error {
	margin: 0 9% 1em;
	font-size: 1.2em;
}

.powermail_hp {
	position: absolute;
	left: -99999px;
}
