*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#f6efe7;color:#2e2a25}
.hero{position:relative;min-height:86vh;overflow:hidden;display:grid;place-items:center;text-align:center;color:white}
.hero::before{content:"";position:absolute;inset:-20px;background-image:linear-gradient(rgba(32,22,14,.25),rgba(32,22,14,.58)),url("verlobung-hintergrund.jpeg");background-size:cover;background-position:center;filter:blur(5px);transform:scale(1.05);z-index:0}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,255,255,.10),rgba(0,0,0,.22));z-index:1}
.hero-content{position:relative;z-index:2;padding:34px 28px;border-radius:28px;background:rgba(255,255,255,.13);backdrop-filter:blur(7px);border:1px solid rgba(255,255,255,.28);box-shadow:0 24px 80px rgba(0,0,0,.22)}
.overline{text-transform:uppercase;letter-spacing:.22em;font-weight:700}
.overline-dark{text-transform:uppercase;letter-spacing:.18em;font-weight:800;color:#8d6b4d;font-size:.85rem}
.hero h1{font-family:Georgia,serif;font-size:clamp(3rem,8vw,7rem);margin:0;text-shadow:0 3px 20px rgba(0,0,0,.35)}
.date{font-size:clamp(1.2rem,3vw,2rem)}
.countdown{display:grid;grid-template-columns:repeat(4,minmax(72px,1fr));gap:12px;margin-top:24px}
.countdown div{background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.28);border-radius:18px;padding:16px 10px}
.countdown span{display:block;font-size:clamp(1.7rem,4vw,3rem);font-weight:800}
.countdown small{text-transform:uppercase;letter-spacing:.08em}
main{max-width:1100px;margin:-45px auto 0;padding:0 16px 50px;position:relative;z-index:3}
.card{background:rgba(255,255,255,.93);border-radius:24px;padding:clamp(20px,4vw,36px);margin-bottom:22px;box-shadow:0 18px 45px rgba(80,52,27,.12);border:1px solid rgba(141,107,77,.14)}
h2,h3{font-family:Georgia,serif}
label{display:block;font-weight:700;margin:16px 0}
input,select{width:100%;padding:13px;margin-top:7px;border-radius:14px;border:1px solid #d9c8b6;font:inherit;background:white}
button{border:0;border-radius:999px;background:#8d6b4d;color:white;padding:12px 18px;font-weight:800;cursor:pointer}
button:hover{background:#654832}
button.secondary{background:#8f8a84}
button.danger{background:#a33b3b}
.hidden{display:none}
.hint{color:#766d63}
.radio-group,.sleep-grid label{background:#fbf7f1;border:1px solid #ead9c6;border-radius:18px;padding:15px}
.sleep-grid{display:grid;gap:12px}
.sleep-grid span,.sleep-grid small{display:block;color:#766d63;margin-top:4px;line-height:1.4}
.planwagen-special{display:grid;grid-template-columns:1fr 1.15fr;gap:24px;align-items:center;background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(244,231,215,.95))}
.planwagen-special ul{padding-left:20px;line-height:1.8}
.planwagen-photos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.planwagen-photos img,.gallery-grid img{width:100%;height:260px;object-fit:cover;border-radius:20px;border:1px solid #d8c5af;box-shadow:0 12px 28px rgba(80,52,27,.12)}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pic{height:260px;border-radius:20px;background-size:cover;background-position:center;border:1px solid #d8c5af}
.pic.camping{background:linear-gradient(135deg,#6f7b52,#d2c088)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:20px 0}
.stats div{background:#fbf7f1;border-radius:18px;padding:16px}
.stats strong{font-size:2rem;display:block}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;background:white}
th,td{border-bottom:1px solid #eee0d1;padding:10px;text-align:left;vertical-align:middle}
th{background:#f4e7d7}
.action-buttons{display:flex;gap:8px;flex-wrap:wrap}
.edit-form{margin-top:16px;padding:18px;border-radius:20px;background:#fbf7f1;border:1px solid #ead9c6}
.admin-actions{display:flex;gap:10px;flex-wrap:wrap}
@media(max-width:860px){.planwagen-special,.gallery-grid,.stats{grid-template-columns:1fr}.planwagen-photos{grid-template-columns:1fr}.countdown{grid-template-columns:repeat(2,1fr)}main{margin-top:-25px}}


/* Bilder in den Auswahlkarten */
.sleep-grid label {
  overflow: hidden;
}

.sleep-grid label img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 14px;
  margin-bottom: 12px;
  border: 1px solid #d8c5af;
}

.gallery .hint {
  margin-top: -8px;
  margin-bottom: 24px;
}

.gallery-grid.location-grid {
  grid-template-columns: repeat(2, 1fr);
}

.gallery-grid img {
  display: block;
}

@media(max-width:860px){
  .gallery-grid.location-grid{grid-template-columns:1fr}
}


textarea {
  width: 100%;
  padding: 13px;
  margin-top: 7px;
  border-radius: 14px;
  border: 1px solid #d9c8b6;
  font: inherit;
  background: white;
  resize: vertical;
}

.coming-extra {
  margin-top: 18px;
  padding: 18px;
  border-radius: 20px;
  background: #fbf7f1;
  border: 1px solid #ead9c6;
}

.checkbox-line {
  display: flex;
  align-items: center;
  gap: 10px;
}

.checkbox-line input {
  width: auto;
  margin: 0;
}

.date-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media(max-width:760px){
  .date-grid{grid-template-columns:1fr}
}


.location-card {
  overflow: hidden;
}

.location-actions {
  margin: 18px 0;
}

.map-button {
  display: inline-block;
  text-decoration: none;
  border-radius: 999px;
  background: #8d6b4d;
  color: white;
  padding: 13px 20px;
  font-weight: 800;
}

.map-button:hover {
  background: #654832;
}

.map-embed {
  width: 100%;
  height: 360px;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid #d8c5af;
  box-shadow: 0 12px 28px rgba(80,52,27,.12);
  background: #f4e7d7;
}

.map-embed iframe {
  width: 100%;
  height: 100%;
  border: 0;
}

@media(max-width:760px){
  .map-embed{height:280px}
}


.secondary-map {
  background: #6f7b52;
  margin-left: 8px;
}

.secondary-map:hover {
  background: #4f5a38;
}

.important-choice {
  background: #f4e7d7 !important;
  border: 2px solid #8d6b4d !important;
  padding: 14px !important;
  border-radius: 16px !important;
  margin-top: 8px !important;
}

.important-choice input {
  transform: scale(1.2);
}

@media(max-width:760px){
  .secondary-map{margin-left:0;margin-top:8px}
  .location-actions{display:grid;gap:8px}
}


.coming-extra h3 {
  margin-top: 18px;
}

.coming-extra .date-grid input[type="number"] {
  font-size: 1.05rem;
  font-weight: 700;
}

.important-choice {
  display: flex !important;
  align-items: center;
  gap: 10px;
}


/* Sichtbarer Gäste-Bereich für Essen & Anreise */
#comingExtraFields {
  display: block;
  margin-top: 22px;
}

#comingExtraFields.hidden {
  display: none !important;
}

#comingExtraFields h3 {
  margin-bottom: 10px;
}

#comingExtraFields .important-choice {
  font-size: 1.02rem;
}


/* Desktop Bild-Fix für Unterkunftskarten */
.sleep-option img,
.option-card img,
.accommodation-card img,
.gallery-card img {
  width: 100%;
  height: auto !important;
  max-height: 420px;
  object-fit: contain !important;
  object-position: center;
  background: #f5efe7;
  border-radius: 18px;
}

@media (max-width: 760px) {
  .sleep-option img,
  .option-card img,
  .accommodation-card img,
  .gallery-card img {
    max-height: 260px;
    object-fit: cover !important;
  }
}


.food-count-box,
#comingExtraFields .date-grid:first-of-type {
  background: #fffaf3;
  border: 2px solid #d8c5af;
  border-radius: 18px;
  padding: 16px;
  margin: 14px 0 20px;
}

#vegetarianCount,
#veganCount {
  font-size: 1.15rem;
  font-weight: 800;
  text-align: center;
}


/* Auswahlbuttons links ausrichten */
.sleep-option,
.status-option,
.radio-option {
  position: relative;
  padding-left: 58px !important;
}

.sleep-option input[type="radio"],
.status-option input[type="radio"],
.radio-option input[type="radio"] {
  position: absolute;
  left: 22px;
  top: 28px;
  transform: scale(1.3);
  margin: 0;
}

.sleep-option label,
.status-option label,
.radio-option label {
  width: 100%;
  display: block;
}



.radio-group{
display:flex;
flex-direction:column;
align-items:flex-start;
gap:12px;
}

.radio-group label{
width:100%;
display:flex;
align-items:center;
gap:12px;
text-align:left;
}

.radio-group input[type="radio"]{
width:auto;
margin:0;
}

.food-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:22px;
margin-top:20px;
}

.sleep-grid label{
display:grid;
grid-template-columns:42px minmax(240px,550px) 1fr;
gap:22px;
align-items:center;
}

.sleep-grid input[type="radio"]{
width:auto;
margin:0;
justify-self:center;
}

.sleep-grid img{
width:100%;
height:280px;
object-fit:cover;
object-position:center center;
border-radius:18px;
}

@media (max-width: 860px){
  .food-grid{
    grid-template-columns:1fr;
  }

  .sleep-grid label{
    grid-template-columns:1fr;
  }

  .sleep-grid img{
    height:220px;
  }
}


/* Finale Anpassungen v21 */
.radio-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.radio-group label {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  text-align: left;
}

.radio-group input[type="radio"] {
  width: auto;
  margin: 0;
  flex: 0 0 auto;
}

.sleep-grid label {
  display: grid;
  grid-template-columns: 32px minmax(220px, 1.3fr) minmax(220px, 1fr);
  gap: 18px;
  align-items: center;
}

.sleep-grid label input[type="radio"] {
  width: auto;
  margin: 0;
  justify-self: center;
}

.sleep-grid label img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  object-position: center 42%;
  border-radius: 14px;
  margin: 0;
  border: 1px solid #d8c5af;
}

.sleep-grid label strong,
.sleep-grid label span,
.sleep-grid label small {
  grid-column: 3;
}

.sleep-grid label strong {
  align-self: end;
  font-size: 1.1rem;
}

.sleep-grid label span,
.sleep-grid label small {
  align-self: start;
}

.food-grid select {
  text-align: center;
  font-size: 1.1rem;
  font-weight: 800;
}

@media(max-width:860px){
  .sleep-grid label {
    grid-template-columns: 32px 1fr;
  }

  .sleep-grid label img {
    grid-column: 2;
    height: 190px;
  }

  .sleep-grid label strong,
  .sleep-grid label span,
  .sleep-grid label small {
    grid-column: 2;
  }

  .food-grid { grid-template-columns: 1fr; }
}


/* v22 final: Ernährung erst nach Zusage, Auswahl links, Planwagen-Bild sauber */
#comingExtraFields.hidden, #sleepSection.hidden { display: none !important; }
#comingExtraFields { margin-top: 22px; padding: 18px; border-radius: 20px; background: #fbf7f1; border: 1px solid #ead9c6; }
#comingExtraFields h3 { margin-top: 0; }
.radio-group label { justify-content: flex-start !important; }
.radio-group input[type="radio"], .sleep-grid input[type="radio"] { width: auto !important; min-width: 16px; }
.sleep-grid label img[src="planwagen-aussen.jpeg"] { object-position: center center; }
@media (min-width: 861px) { .sleep-grid label img { height: 230px; } }