/*
Theme Name: chill in
Theme URI: https://www.chill-in.at
Author: chill in – Alpine Lifestyle Apartments
Description: Eigenes Theme für chill in Lofer: Corporate Design (Domine, Outfit, Tannengrün, Beige, Koralle), Video-Startseite, 10 Sprachen (mit Polylang) und Frühstücksbestellung (mit dem Plugin „chill in Frühstück“).
Version: 1.5.1
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GPLv2 or later
Text Domain: chillin
*/

/* ---------- Grundlagen ---------- */
:root {
	--chillin-radius: 18px;
	--chillin-gutter: max(20px, env(safe-area-inset-left));
	color-scheme: light;
}
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { -webkit-font-smoothing: antialiased; }
:where(h1, h2, h3, h4) { text-wrap: balance; }
:focus-visible { outline: 3px solid var(--wp--preset--color--tuerkis); outline-offset: 3px; }
[id] { scroll-margin-top: 92px; }
img, video { max-width: 100%; height: auto; }

/* Breite Inhaltsspalte in Abschnitten */
.chillin-section > .chillin-wide { max-width: var(--wp--style--global--wide-size, 1200px); margin-inline: auto; display: flex; flex-direction: column; gap: var(--wp--preset--spacing--50); }
.chillin-section { overflow: hidden; }
.chillin-gap-top { margin-top: var(--wp--preset--spacing--50) !important; }
.chillin-head { display: flex; flex-direction: column; gap: .75rem; max-width: 760px; }
.chillin-head > * { margin: 0 !important; }
.chillin-lead { font-size: var(--wp--preset--font-size--gross); line-height: 1.5; max-width: 58ch; }
.chillin-small { font-size: var(--wp--preset--font-size--klein); line-height: 1.5; }
.chillin-right { justify-content: flex-end; margin-left: auto; }

/* Dunkle Abschnitte: Überschriften und Links hell */
.has-tannengruen-background-color :is(h1, h2, h3, h4),
.has-waldgruen-background-color :is(h1, h2, h3, h4) { color: var(--wp--preset--color--beige); }
.has-tannengruen-background-color a:where(:not(.wp-element-button)),
.has-waldgruen-background-color a:where(:not(.wp-element-button)) { color: var(--wp--preset--color--beige); }
.has-tannengruen-background-color .chillin-lead, .has-waldgruen-background-color .chillin-lead { opacity: .92; }

/* Überzeile */
p.is-style-eyebrow { font-size: var(--wp--preset--font-size--klein); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--koralle-dunkel); margin-bottom: -.4rem; }
:is(.has-tannengruen-background-color, .has-waldgruen-background-color, .wp-block-cover) p.is-style-eyebrow { color: var(--wp--preset--color--gold); }

/* Liste mit Punkten */
ul.is-style-ticks { list-style: none; padding-left: 0; display: flex; flex-direction: column; gap: .55rem; }
ul.is-style-ticks li { display: flex; gap: .75rem; align-items: baseline; }
ul.is-style-ticks li::before { content: ""; flex: 0 0 10px; height: 10px; border-radius: 50%; background: var(--wp--preset--color--koralle); transform: translateY(-1px); }

/* Karten */
.wp-block-group.is-style-card { border-radius: var(--chillin-radius); padding: 1.5rem; gap: .75rem; height: 100%; box-sizing: border-box; }
.wp-block-group.is-style-card.has-weiss-background-color { border: 1px solid var(--wp--preset--color--linie); }
.wp-block-group.is-style-card > * { margin: 0 !important; }
.wp-block-group.is-style-card .wp-block-buttons { margin-top: auto !important; }
.chillin-card-img { margin: -1.5rem -1.5rem .5rem !important; }
.chillin-card-img img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; border-radius: var(--chillin-radius) var(--chillin-radius) 0 0; }
.chillin-card-meta { color: var(--wp--preset--color--grau); font-size: var(--wp--preset--font-size--klein); }
.chillin-card-price { font-family: var(--wp--preset--font-family--domine); font-size: var(--wp--preset--font-size--gross); }
.chillin-pack { color: var(--wp--preset--color--tannengruen); }
.chillin-pack h3 { color: var(--wp--preset--color--tannengruen) !important; }
.chillin-pack-when { font-size: var(--wp--preset--font-size--klein); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }
.chillin-pack-from { margin-top: auto !important; padding-top: .6rem; border-top: 1px solid rgba(24, 51, 37, .25); }

/* Bilder */
.wp-block-image.is-style-rounded-soft img { border-radius: var(--chillin-radius); }
.chillin-chillo-small img { width: 190px; }
.chillin-chillo-big { text-align: center; }
.chillin-chillo-big img { width: min(320px, 70%); }

/* Startbild (Video) */
.chillin-hero.wp-block-cover { padding-block: clamp(90px, 12vw, 170px) clamp(80px, 10vw, 140px); }
.chillin-hero .wp-block-cover__background { background: linear-gradient(90deg, rgba(24,51,37,.88) 0%, rgba(24,51,37,.55) 45%, rgba(24,51,37,.12) 100%) !important; opacity: 1 !important; }
.wp-block-cover.chillin-hero.has-custom-content-position .wp-block-cover__inner-container, .chillin-hero .wp-block-cover__inner-container { position: relative; max-width: var(--wp--style--global--wide-size, 1200px) !important; width: 100% !important; margin-inline: auto !important; color: var(--wp--preset--color--beige); }
.chillin-hero .wp-block-cover__inner-container > *:not(.chillin-hero-badge) { max-width: 680px; margin-left: 0 !important; margin-right: auto !important; }
.chillin-hero .wp-block-cover__inner-container > p.chillin-lead { max-width: 560px; }
.chillin-hero h1 { color: var(--wp--preset--color--beige); }
.chillin-hero .chillin-lead { color: var(--wp--preset--color--beige); }
.chillin-hero .wp-block-buttons { margin-top: 1.5rem; }
.chillin-hero-badge { position: absolute !important; right: 0; bottom: 0; margin: 0 !important; width: clamp(130px, 16vw, 210px); transform: rotate(-8deg); }
@media (max-width: 700px) { .chillin-hero-badge { position: relative !important; width: 120px; margin-top: 1.5rem !important; } .chillin-hero .wp-block-cover__background { background: rgba(24, 51, 37, .74) !important; } }

/* Knöpfe: Umriss-Variante */
.wp-block-button.is-style-outline > .wp-block-button__link { background: transparent; color: currentColor; border: 2px solid currentColor; padding: calc(.8rem - 2px) calc(1.7rem - 2px); }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: rgba(243, 230, 203, .12); }

/* Fakten */
.chillin-facts .wp-block-group.chillin-fact { border-left: 1px solid rgba(24, 51, 37, .15); padding-left: 1.25rem; gap: .25rem; display: flex; flex-direction: column; }
.chillin-fact > * { margin: 0 !important; }
.chillin-fact-value { font-family: var(--wp--preset--font-family--domine); font-weight: 700; font-size: var(--wp--preset--font-size--xxl); line-height: 1; color: var(--wp--preset--color--tannengruen); font-variant-numeric: tabular-nums; }
.chillin-fact-text { font-size: var(--wp--preset--font-size--klein); color: var(--wp--preset--color--grau); line-height: 1.35; }

/* Film und Clips */
.chillin-film video { border-radius: var(--chillin-radius); aspect-ratio: 1 / 1; object-fit: cover; width: 100%; background: #0d1d15; }
.chillin-clip video { aspect-ratio: 4 / 5; object-fit: cover; width: 100%; border-radius: var(--chillin-radius); background: var(--wp--preset--color--waldgruen); }
.chillin-clip { margin: 0 0 .5rem !important; }
.chillin-clip-item > * { margin: 0 !important; }
.chillin-clip-title { font-family: var(--wp--preset--font-family--domine); font-size: var(--wp--preset--font-size--gross); }
.chillin-clip-text { font-size: var(--wp--preset--font-size--klein); opacity: .85; }

/* Ausstattung */
.chillin-amenity { border-top: 2px solid var(--wp--preset--color--tannengruen); padding-top: .6rem; }
.chillin-amenity > * { margin: 0 !important; }

/* Jahreszeiten */
.chillin-season { border-top: 2px solid var(--wp--preset--color--gold); padding-top: .9rem; }
.chillin-season > * { margin: 0 0 .7rem !important; }
.chillin-season-title { color: var(--wp--preset--color--gold) !important; }

/* Buchung (Snowoffice) */
.chillin-booking-box { border-radius: var(--chillin-radius); border: 1px solid var(--wp--preset--color--linie); padding: clamp(12px, 2.5vw, 32px) !important; min-height: 560px; }
.chillin-booking-box > * { max-width: none !important; width: 100%; }

/* Instagram */
.chillin-insta img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; border-radius: 12px; transition: transform .3s ease; }
.chillin-insta a:hover img { transform: scale(1.03); }
.chillin-insta { margin: 0 !important; }

/* FAQ */
.chillin-faq { max-width: 820px; }
.chillin-faq .wp-block-details summary { cursor: pointer; font-family: var(--wp--preset--font-family--domine); font-weight: 700; font-size: var(--wp--preset--font-size--gross); list-style: none; display: flex; justify-content: space-between; gap: 1.25rem; color: var(--wp--preset--color--tannengruen); }
.chillin-faq .wp-block-details summary::-webkit-details-marker { display: none; }
.chillin-faq .wp-block-details summary::after { content: "+"; font-family: var(--wp--preset--font-family--outfit); color: var(--wp--preset--color--koralle-dunkel); font-size: 1.5em; line-height: 1; }
.chillin-faq .wp-block-details[open] summary::after { content: "–"; }
.chillin-faq .wp-block-details p { color: var(--wp--preset--color--grau); max-width: 65ch; }

/* Frühstücksseite */
.chillin-step { display: flex; flex-direction: column; gap: .5rem; }
.chillin-step > * { margin: 0 !important; }
.chillin-step-no { width: 48px; height: 48px; border-radius: 50%; background: var(--wp--preset--color--koralle); color: var(--wp--preset--color--tannengruen); display: flex; align-items: center; justify-content: center; font-family: var(--wp--preset--font-family--domine); font-weight: 700; font-size: 1.3rem; }
.chillin-supplier { color: var(--wp--preset--color--gold) !important; font-size: var(--wp--preset--font-size--normal) !important; }

/* ---------- Kopfbereich ---------- */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 60; background: var(--wp--preset--color--tannengruen); }
.chillin-site-header { position: sticky; top: env(safe-area-inset-top, 0px); z-index: 50; }
.admin-bar .chillin-site-header { top: calc(32px + env(safe-area-inset-top, 0px)); }
@media (max-width: 782px) { .admin-bar .chillin-site-header { top: 0; position: relative; } }
.chillin-header { background: var(--wp--preset--color--tannengruen); color: var(--wp--preset--color--beige); }
.chillin-header__inner { max-width: var(--wp--style--global--wide-size, 1200px); margin-inline: auto; padding: 0 max(20px, env(safe-area-inset-right)) 0 max(20px, env(safe-area-inset-left)); min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; position: relative; }
.chillin-header__brand img { height: 48px; width: auto; display: block; }
.chillin-header__nav { display: flex; align-items: center; gap: 1.5rem; font-weight: 500; }
.chillin-header__nav > a:not(.chillin-btn) { color: var(--wp--preset--color--beige); text-decoration: none; opacity: .92; }
.chillin-header__nav > a:not(.chillin-btn):hover { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }
.chillin-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55rem 1.4rem; border-radius: 999px; background: var(--wp--preset--color--koralle); color: var(--wp--preset--color--tannengruen) !important; font-weight: 600; text-decoration: none; white-space: nowrap; }
.chillin-btn:hover { background: #F07B5D; }
.chillin-header__toggle { display: none; background: none; border: 2px solid var(--wp--preset--color--beige); color: var(--wp--preset--color--beige); border-radius: 999px; min-height: 44px; padding: .3rem 1.1rem; font: 600 var(--wp--preset--font-size--klein)/1 var(--wp--preset--font-family--outfit); cursor: pointer; }
.chillin-lang { position: relative; font-size: var(--wp--preset--font-size--klein); font-weight: 600; }
.chillin-lang summary { list-style: none; cursor: pointer; min-height: 40px; min-width: 58px; padding: .35rem .9rem; border: 2px solid rgba(243, 230, 203, .5); border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.chillin-lang summary::-webkit-details-marker { display: none; }
.chillin-lang summary::after { content: ""; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.chillin-lang[open] summary { background: var(--wp--preset--color--beige); color: var(--wp--preset--color--tannengruen); border-color: var(--wp--preset--color--beige); }
.chillin-lang__menu { position: absolute; right: 0; top: calc(100% + 8px); background: var(--wp--preset--color--creme); color: var(--wp--preset--color--tinte); border-radius: 14px; box-shadow: 0 12px 32px rgba(0, 0, 0, .18); padding: .5rem; display: grid; grid-template-columns: repeat(2, minmax(130px, 1fr)); gap: 2px; z-index: 70; }
.chillin-lang__menu a { padding: .55rem .75rem; border-radius: 9px; text-decoration: none; font-weight: 500; color: inherit; white-space: nowrap; }
.chillin-lang__menu a:hover { background: var(--wp--preset--color--beige); }
.chillin-lang__menu a[aria-current="page"] { background: var(--wp--preset--color--tannengruen); color: var(--wp--preset--color--beige); }
.chillin-mobile-book { display: none; }
@media (max-width: 1080px) {
	.chillin-header__toggle { display: inline-flex; align-items: center; }
	.chillin-header__nav { display: none; position: absolute; left: 0; right: 0; top: 100%; background: var(--wp--preset--color--tannengruen); flex-direction: column; align-items: flex-start; gap: 1.1rem; padding: 1.25rem max(20px, env(safe-area-inset-left)) 1.75rem; border-top: 1px solid rgba(243, 230, 203, .15); }
	.chillin-header__nav.is-open { display: flex; }
	.chillin-lang__menu { position: static; margin-top: .6rem; box-shadow: none; }
}
@media (max-width: 700px) {
	/* Kompakter Knopf links unten – rechts bleibt Platz für den Snowoffice-Warenkorb */
	.chillin-mobile-book { display: block; position: fixed; left: max(14px, env(safe-area-inset-left)); bottom: calc(14px + env(safe-area-inset-bottom)); z-index: 40; pointer-events: none; }
	.chillin-mobile-book .chillin-btn { pointer-events: auto; min-height: 48px; padding: .5rem 1.3rem; font-size: 1rem; box-shadow: 0 0 0 3px var(--wp--preset--color--tannengruen), 0 10px 26px rgba(0, 0, 0, .35); }
	body:has(.chillin-mobile-book) { padding-bottom: 84px; }
}

/* ---------- Fußbereich ---------- */
.chillin-footer { background: var(--wp--preset--color--tannengruen); color: var(--wp--preset--color--beige); padding-block: 56px 40px; }
.chillin-footer__inner { max-width: var(--wp--style--global--wide-size, 1200px); margin-inline: auto; padding: 0 max(20px, env(safe-area-inset-right)) 0 max(20px, env(safe-area-inset-left)); display: grid; grid-template-columns: minmax(0, 1.2fr) repeat(3, minmax(0, 1fr)); gap: 32px; }
.chillin-footer p { margin: 0 0 .4rem; }
.chillin-footer a { color: var(--wp--preset--color--beige); text-decoration: none; opacity: .9; }
.chillin-footer a:hover { text-decoration: underline; opacity: 1; }
.chillin-footer ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .5rem; }
.chillin-footer__h { font-family: var(--wp--preset--font-family--outfit); font-size: var(--wp--preset--font-size--klein); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--gold); margin: 0 0 .8rem; }
.chillin-footer__brand img { height: 92px; width: auto; }
.chillin-footer__claim { font-family: var(--wp--preset--font-family--domine); font-size: var(--wp--preset--font-size--xl); margin-top: 1rem !important; }
@media (max-width: 800px) { .chillin-footer__inner { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .chillin-footer__inner { grid-template-columns: 1fr; } }

/* Editor: Platzhalter für Kopf/Fuß */
.chillin-editor-ph { display: flex; flex-direction: column; gap: 4px; padding: 18px 22px; background: var(--wp--preset--color--tannengruen); color: var(--wp--preset--color--beige); font-family: var(--wp--preset--font-family--outfit); }

/* Self-Check-in-Bereich  */
.chillin-checkin-steps .wp-block-image { margin: 0 0 .9rem; }
.chillin-checkin-steps .wp-block-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 16px; }
.chillin-checkin-steps .wp-block-image.is-chillo img { object-fit: contain; background: var(--wp--preset--color--beige, #F3E6CB); padding: 10%; }
.chillin-checkin-steps .wp-block-image.is-chillo.is-dark img { background: var(--wp--preset--color--tannengruen, #183325); }
.chillin-video-slot:not(:has(video, iframe)) { display: none; }
@media (max-width: 781px) {
	.chillin-checkin-steps { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; gap: 14px !important; margin-left: calc(-1 * var(--chillin-gutter, 20px)) !important; margin-right: calc(-1 * var(--chillin-gutter, 20px)) !important; padding: 0 var(--chillin-gutter, 20px) 8px; scrollbar-width: none; }
	.chillin-checkin-steps::-webkit-scrollbar { display: none; }
	.chillin-checkin-steps > .wp-block-group { flex: 0 0 78%; scroll-snap-align: center; }
}

/* Abschnitte ohne Lücke aneinander */
.wp-block-post-content > .alignfull { margin-block-start: 0 !important; margin-block-end: 0 !important; }
.wp-site-blocks > * + * { margin-block-start: 0; }

/* Salzburger Saalachtal Card */
.chillin-card-section .chillin-card-chillo img { display: block; width: 100%; max-width: 340px; margin: 0 auto; padding: 14%; border-radius: 50%; background: var(--wp--preset--color--tannengruen); box-shadow: 0 0 0 8px rgba(24, 51, 37, .15); box-sizing: border-box; aspect-ratio: 1; object-fit: contain; }
.chillin-card-section .is-style-eyebrow { color: var(--wp--preset--color--koralle-dunkel); }
.chillin-card-section h3 { margin-top: 1.6rem; }
.chillin-card-section .wp-block-button.is-style-outline .wp-block-button__link { border-color: var(--wp--preset--color--tannengruen); color: var(--wp--preset--color--tannengruen); }
@media (max-width: 781px) { .chillin-card-section .chillin-card-chillo img { max-width: 220px; } }

/* Rechtstexte */
.chillin-legal { padding-top: var(--wp--preset--spacing--50); padding-bottom: var(--wp--preset--spacing--60); }
.chillin-legal h2 { margin-top: 2.2rem; font-size: var(--wp--preset--font-size--gross); }
.chillin-legal h3 { margin-top: 1.6rem; }
