/**
 * Theme Name: Heidi Suess
 * Template: margarethe
 */

@media screen and (min-width:600px) {
	:root :where(.hide-desktop) { display: none !important; } 
}

@media screen and (max-width:599px) {
	:root :where(.hide-mobile) { display: none !important; } 
}
 
.wp-block-navigation__responsive-container-close { 
	padding: 1.5rem; 
}

:root :where(.wp-block-details) {
	font-size: clamp(0.918rem, 0.918rem + ((1vw - 0.2rem) * 0.44), 1.38rem);
	letter-spacing: 0.02em;
	line-height: calc(1em + 0.625rem);
}

:root :where(header .heidi.posabs) { 
	position: absolute; 
	bottom: 1rem; 
	right: 0; 
	margin-bottom: 0; 
	text-align: right; 
	width: 100%; 
}
header.wp-block-template-part > .wp-block-cover { min-height: auto; }

.wp-block-navigation .wp-block-navigation-item {
	-webkit-transition: all 0.2s ease; 
	-moz-transition: all 0.2s ease; 
	-o-transition: all 0.2s ease; 
	transition: all 0.2s ease;
}

.wp-block-navigation .wp-block-navigation-item:hover, 
.wp-block-navigation .wp-block-navigation-item.current-menu-item {
	filter: alpha(opacity=60); 
	opacity: 0.6; 
}

figure.wp-block-image figcaption {
	box-sizing: border-box;
	color: #fff;
	font-size: 13px;
	margin: 0;
	overflow: auto;
	padding: 0.5em 1em;
	text-align: center;
	background: var(--wp--preset--color--primary);
	color: white; 
}

:root :where(.wp-block-cover.credit .wp-block-cover__inner-container) { height: 100%; }
:root :where(.wp-block-cover.credit .wp-block-cover__inner-container p) { letter-spacing: 0.02em; line-height: calc(1em + 0.625rem); font-size: var(--wp--preset--font-size--x-small) !important; position: absolute; bottom: -1em; }


/* Formular-Stile */

.wpcf7-form label > span { 
	display: block; 
	margin-top: 0.2rem;
}
.wpcf7-form .wpcf7-text, 
.wpcf7-form .wpcf7-textarea { 
	width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #cac6b9;
    box-sizing: border-box;
    transition: border-color 0.1s ease, box-shadow 0.1s ease;
	font-family: var(--wp--preset--font-family--jost);
    font-size: 22px; 
	font-weight: 300;
} 
.wpcf7-form .wpcf7-text:hover, 
.wpcf7-form .wpcf7-textarea:hover {
    border-color: #9ca3af;
}
.wpcf7-form .wpcf7-text:focus,
.wpcf7-form .wpcf7-textarea:focus {
    outline: none;
    border-color: #9b9686; 
    box-shadow: 0 0 0 3px rgba(202, 198, 185, 0.15);
}
.wpcf7-form .wpcf7-textarea {
    min-height: 120px;
    resize: vertical;
}
.wpcf7-form .wpcf7-submit {
    display: inline-block;
    background-color: var(--wp--preset--color--primary);
    color: var(--wp--preset--color--secondary);
    padding: 0.75rem 1.5rem;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.1s ease;
    width: auto;
    font-size: 22px; 
	font-weight: 300;
	font-family: var(--wp--preset--font-family--jost);
}
.wpcf7-form .wpcf7-submit:hover {
    background-color: var(--wp--preset--color--contrast);
}
.wpcf7-form .wpcf7-submit:active {
    transform: scale(0.98);
}

/* Erfolgreich gesendet */
.wpcf7 form .wpcf7-response-output {
	margin-left: 0;
	margin-right: 0;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	border: 2px solid #00a0d2; /* Blue */
}

.wpcf7 form.sent .wpcf7-response-output {
	border-color: #46b450; /* Green */
    background-color: #e9f6ea;	
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
	border-color: #dc3232; /* Red */
    background-color: #fbe6e6;	
}

.wpcf7 form.spam .wpcf7-response-output {
	border-color: #f56e28; /* Orange */
    background-color: #feede5;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
	border-color: #ffb900; /* Yellow */
    background-color: #fff6e0;	
}

@media screen and (max-width: 450px) {
	footer.wp-block-template-part .wp-block-group, footer.wp-block-template-part .wp-block-group > ul { display: block; }
	footer.wp-block-template-part .wp-block-group > ul, footer .wp-block-group > p { text-align: center; }
	footer.wp-block-template-part .wp-block-group .wp-block-navigation { --navigation-layout-justification-setting: center; --navigation-layout-justify: center; justify-content: center; }
}