:root{
  --ng-green-1:#5c7f67;
  --ng-green-2:#3f5f4a;
  --ng-bg:#f5f6f6;
  --ng-card:#ffffff;
  --ng-text:#1f2a24;
  --ng-muted:rgba(31,42,36,.65);
  --ng-border:rgba(0,0,0,.08);
  --ng-shadow:0 12px 30px rgba(0,0,0,.12);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Roboto,system-ui,-apple-system,Segoe UI,Arial,sans-serif;
  color:var(--ng-text);
  background:var(--ng-bg);
}

/* HERO wie Hauptseite (Bild + Overlay) */
.ng-hero{
  position:relative;
  min-height:300px;
  background-size:cover;
  background-position:center;
}
.ng-hero__overlay{
  position:absolute; inset:0;
  background:linear-gradient(60deg, rgba(92,127,103,.82), rgba(63,95,74,.82));
}
.ng-hero__inner{
  position:relative;
  padding:34px 18px 46px;
  max-width:1120px;
  margin:0 auto;
  text-align:center;
  color:#fff;
}
.ng-back{
  display:inline-block;
  color:rgba(255,255,255,.9);
  text-decoration:none;
  font-size:14px;
  margin-bottom:14px;
}
.ng-hero__title{
  margin:0;
  font-size:40px;
  letter-spacing:.2px;
}
.ng-hero__subtitle{
  margin:8px 0 0;
  font-size:18px;
  opacity:.95;
}

/* Main */
.ng-main{
  margin-top:-50px; /* „raised“-Effekt */
  padding-bottom:40px;
}
.ng-container{
  max-width:1120px;
  margin:0 auto;
  padding:0 18px;
}
.ng-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:18px;
}
@media (max-width: 980px){
  .ng-grid{ grid-template-columns:1fr; }
  .ng-hero__title{font-size:34px;}
}

/* Card */
.ng-card{
  background:var(--ng-card);
  border:1px solid var(--ng-border);
  border-radius:18px;
  box-shadow:var(--ng-shadow);
  overflow:hidden;
}
.ng-card__head{
  padding:18px 18px 10px;
  border-bottom:1px solid var(--ng-border);
}
.ng-card__head h2{
  margin:8px 0 4px;
  font-size:20px;
}
.ng-muted{ margin:0; color:var(--ng-muted); font-size:13px; }
.ng-card__body{ padding:18px; }

.ng-badge{
  display:inline-block;
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  color:#fff;
  background:linear-gradient(60deg, var(--ng-green-1), var(--ng-green-2));
}

/* Form */
.ng-form{ display:block; }
.ng-row{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
@media (max-width: 560px){
  .ng-row{ grid-template-columns:1fr; }
}
.ng-label{
  display:block;
  font-size:13px;
  color:var(--ng-muted);
  margin:10px 0 6px;
}
.ng-input, .ng-textarea{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid var(--ng-border);
  background:#fff;
  font-size:15px;
  outline:none;
}
.ng-input:focus, .ng-textarea:focus{
  border-color: rgba(92,127,103,.55);
  box-shadow: 0 0 0 4px rgba(92,127,103,.12);
}
.ng-textarea{ resize:vertical; }

.ng-check{
  display:flex;
  gap:10px;
  align-items:flex-start;
  margin-top:12px;
  font-size:14px;
  color:var(--ng-text);
}
.ng-check input{ margin-top:3px; }
.ng-check--rules small{
  display:block;
  margin-top:2px;
  color:var(--ng-muted);
  font-size:12px;
}

.ng-checkwrap{ display:flex; align-items:flex-end; }

.ng-btn{
  width:100%;
  margin-top:14px;
  border:none;
  cursor:pointer;
  padding:12px 14px;
  border-radius:999px;
  color:#fff;
  font-weight:600;
  font-size:15px;
  background:linear-gradient(60deg, var(--ng-green-1), var(--ng-green-2));
  box-shadow:0 10px 24px rgba(63,95,74,.22);
}
.ng-btn:hover{ filter:brightness(1.02); }
.ng-small{ margin:10px 0 0; font-size:12px; color:var(--ng-muted); }

/* Alerts */
.ng-alert{
  border-radius:14px;
  padding:12px 14px;
  margin:14px 0 16px;
  border:1px solid var(--ng-border);
}
.ng-alert--danger{ background:rgba(244,67,54,.08); border-color:rgba(244,67,54,.22); }
.ng-alert--success{ background:rgba(76,175,80,.10); border-color:rgba(76,175,80,.24); }

/* Legend */
.ng-legend{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.ng-pill{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--ng-border);
}
.ng-pill--booked{ background: rgba(76,175,80,.14); }
.ng-pill--pending{ background: rgba(255,152,0,.14); }

.ng-note{
  margin-top:12px;
  padding:12px 12px;
  border-radius:14px;
  background: rgba(92,127,103,.10);
  border:1px solid rgba(92,127,103,.16);
  font-size:13px;
  color:rgba(31,42,36,.85);
}

/* ============================
   Flatpickr – Nik’s Godset
============================ */

/* Grundlayout */
.flatpickr-calendar {
  font-family: Roboto, Arial, sans-serif;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0,0,0,.18);
}

/* Standard-Tage (frei) */
.flatpickr-day {
  background: #fff;
  color: #333;
  border-radius: 50%;
  transition: all .15s ease;
}

/* Hover auf freie Tage */
.flatpickr-day:not(.flatpickr-disabled):hover {
  background: #e8f5e9;
}

/* Heute */
.flatpickr-day.today {
  border: 2px solid #4caf50;
}

/* ============================
   BELEGT (confirmed)
============================ */
.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
  background: #d32f2f !important;   /* ruhig & kräftig */
  color: #fff !important;
  opacity: 0.9;
  cursor: not-allowed;
}

/* ============================
   AUSWAHL (Range)
============================ */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
  background: #4caf50 !important;
  color: #fff;
}

.flatpickr-day.inRange {
  background: rgba(76,175,80,.25);
  color: #2e7d32;
}

/* ============================
   Tage außerhalb des Monats
============================ */
.flatpickr-day.prevMonthDay,
.flatpickr-day.nextMonthDay {
  color: #bbb;
}
/* ============================
   Footer zentrieren
============================ */
.footer,
.footer.footer-default {
  text-align: center;
}

.footer .container {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* ============================
   Footer vom Theme korrekt zentrieren
   (Override Material Kit)
============================ */
.footer.footer-default {
  text-align: center !important;
}

.footer.footer-default .container {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* falls Material Kit inline margins setzt */
.footer.footer-default .container > * {
  margin: 0 auto !important;
}
html {
  scroll-behavior: smooth;
}

/* Fix für fixed Navbar */
.section[id] {
  scroll-margin-top: 90px;
}
.navbar-nav .nav-link.active {
  color: #4caf50 !important;
  font-weight: 500;
}

.navbar-nav .nav-link.btn.active {
  background-color: #43a047 !important;
  box-shadow: 0 4px 10px rgba(76,175,80,.4);
}
/* Logo standardmäßig ausblenden */
.navbar-brand img {
  opacity: 0;
  transition: opacity 0.3s ease;
}

/* Logo sichtbar, sobald Navbar Farbe bekommt */
.navbar-color-on-scroll.navbar-scrolled .navbar-brand img {
  opacity: 1;
}
/* Mehr Innenabstand für Flatpickr-Anzeige */
.flatpickr-input.form-control,
.form-control.flatpickr-input {
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box;
}

/* Falls altInput genutzt wird */
input.flatpickr-alt-input {
  padding-left: 16px !important;
  padding-right: 16px !important;
}
input.flatpickr-alt-input {
  height: 44px;
  font-size: 15px;
}
.accordion-button {
  font-weight: 500;
}

.accordion-body ul {
  padding-left: 1.2rem;
}

.accordion-item {
  border-radius: 8px;
  overflow: hidden;
}
/* Standard bleibt groß */
.page-header {
  min-height: 100vh;
}

/* NUR auf bestimmten Seiten */
.page-header.page-header-small {
  min-height: 70vh !important;
  height: 70vh;
}