/* Restaurants */

.gfes { font-size: 16px; line-height: 1.5; }
.gfes .gfes-error { color: #b00020; }

.gfes--cards .gfes-grid {
  display: grid;
  gap: 16px;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

.gfes-card {
  border: 1px solid #e6e6e6;
  border-radius: 3px;
  padding: 16px;
  background: #fff;
}

.gfes-title { margin: 0 0 18px; font-size: 22px !important; }

.gfes-row { margin-bottom: 8px !important;  }

.gfes-row a { text-decoration: none; border-bottom: 1px dotted currentColor; margin-bottom: 8px !important;  }
.gfes-row a:hover { border-bottom-style: solid; }

.gfes-pager { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.gfes-pager a, .gfes-pager span {
  padding: 6px 10px; border: 1px solid #ccc; border-radius: 4px; text-decoration: none;
}
.gfes-pager .is-current { background: #eee; }


/* Menuliste */

/* =========================
   Menuliste (pro Tag)
   ========================= */

/* Grundlayout */
.gfes--menu-list {
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  margin: 2rem 0;
  color: #222;
}

/* Restaurant-Abschnitt */
.gfes-restaurant {
  margin-bottom: 3rem;
}

.gfes-restaurant-name {
  font-size: 1.6rem !important;
  margin: 0 0 1rem 0;
  padding-bottom: .3rem;
  border-bottom: 2px solid #ddd;
}

/* Wrapper der Menüs eines Restaurants (nur strukturell) */
.gfes-menus {
  display: block; /* wichtig: kein flex/grid hier, das Layout macht .gfes-menu */
}

/* Datum über der Menüliste */
.gfes-day {
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0 0 2.5rem 0 !important;
  color: #000;
}

/* Ein Menü-Eintrag (enthält bis zu 2 Varianten: Fleisch & Vegi) */
.gfes-menu {
  display: grid;
  grid-template-columns: repeat(2, minmax(300px, 1fr)); /* genau 2 Spalten, min 300px */
  gap: 1.5rem;
  margin-bottom: 2rem;
}

/* Variante/Kästchen */
.gfes-menu-block {
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #fafafa;
  padding: 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
}

/* Überschrift der Variante (Fleisch/Vegi) */
.gfes-menu-block h3 {
  margin: 0 0 .5rem 0;
  font-size: 1.3rem !important;
  color: #333;
}

/* Beschreibung & Preis */
.gfes-menu-desc {
  margin-bottom: .5rem;
  line-height: 1.35;
  color: #444;
  white-space: normal;
}

.gfes-menu-price {
  font-weight: 700;
  margin-bottom: .95rem;
  margin-top: 1.95rem;
  color: #111;
}

/* Button */
.gfes-btn {
  display: inline-block;
  padding: .6rem 1.1rem;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  background: #EB5B25;
  color: #fff !important;
  transition: background .2s ease, transform .05s ease;
}

.gfes-btn:hover { 
	background:#FAD6C8;
	color: #EB5B25 !important;
 }
.gfes-btn:active { transform: translateY(1px); }

/* Responsiv: unter 768px auf eine Spalte fallen */
@media (max-width: 768px) {
  .gfes-menu {
    grid-template-columns: 1fr;
  }
}

/* Mit Kapazitäten */

.gfes-restaurant-name { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.gfes-capacity-badge {
  display: inline-block; font-size: .9rem; line-height: 1;
  background: #FAD6C8; color: #EB5B25; border: 0.5px solid #EB5B25;
  padding: .25rem .5rem; border-radius: 999px;
}
.gfes-capacity-badge--full {
  background: #FAD6C8; color: #EB5B25; border-color: #EB5B25;
}
.gfes-btn--disabled {
  background: #ccc; color: #666 !important; pointer-events: none; cursor: not-allowed;
}

.gfes-total-remaining{
  display:inline-block;margin:6px 0 14px;padding:.4rem .7rem;
  border:0.5px solid #EB5B25;background:#FAD6C8;color:#EB5B25;
  border-radius:999px;font-weight:600;line-height:1;
}
.gfes-total-remaining--full{
  border-color:#fac5c2;background:#fdecec;color:#d93025;
}

/* Übersicht: Reservationen pro Tag */
.gfes-reservation-overview { max-width: 1100px; margin: 0 auto; }
.gfes-reservation-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed; /* bessere Platznutzung */
  font-size: 1rem;
}
.gfes-reservation-table th,
.gfes-reservation-table td {
  padding: .6rem .8rem;
  border-bottom: 1px solid #e6e6e6;
  vertical-align: middle;
}
.gfes-reservation-table thead th {
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  border-bottom: 2px solid #cfd8e3;
}
.gfes-reservation-table tbody tr:nth-child(odd) { background: #fafbfc; }

.gfes-reservation-table th:nth-child(1),
.gfes-reservation-table td:nth-child(1) { /* Restaurant */
  width: 48%;
}
.gfes-reservation-table th:nth-child(2),
.gfes-reservation-table td:nth-child(2),
.gfes-reservation-table th:nth-child(3),
.gfes-reservation-table td:nth-child(3),
.gfes-reservation-table th:nth-child(4),
.gfes-reservation-table td:nth-child(4) {
  width: 17%;
  text-align: right; /* Zahlen rechtsbündig */
}

.gfes-reservation-table tfoot td {
  font-weight: 700;
  border-top: 2px solid #cfd8e3;
  background: #f5f7fb;
}

/* Mobil-Optimierung: unter 640px Restaurant oben, Zahlen in 2 Spalten */
@media (max-width: 640px) {
  .gfes-reservation-table { font-size: .95rem; table-layout: auto; }
  .gfes-reservation-table thead { display: none; }
  .gfes-reservation-table tr { display: block; padding: .6rem 0; }
  .gfes-reservation-table td { display: flex; justify-content: space-between; border: 0; padding: .25rem 0; }
  .gfes-reservation-table td::before {
    content: attr(data-th);
    font-weight: 600;
    margin-right: 1rem;
    color: #475569;
  }
  .gfes-reservation-table td:nth-child(1) { /* Restaurant-Zeile */
    display: block; font-weight: 700; padding: .3rem 0 .4rem;
  }
  .gfes-reservation-table tfoot { display: none; }
}

/* ===== Reservation-Übersicht: Basis (Desktop) ===== */
.gfes-reservation-overview { max-width: 1100px; margin: 0 auto; }
.gfes-reservation-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 1rem; }
.gfes-reservation-table th,
.gfes-reservation-table td { padding: .6rem .8rem; border-bottom: 1px solid #e6e6e6; vertical-align: middle; }
.gfes-reservation-table thead th { font-weight: 700; text-align: left; white-space: nowrap; border-bottom: 2px solid #cfd8e3; }
.gfes-reservation-table tbody tr:nth-child(odd) { background: #fafbfc; }
.gfes-reservation-table th:nth-child(1),
.gfes-reservation-table td:nth-child(1) { width: 48%; }
.gfes-reservation-table th:nth-child(2),
.gfes-reservation-table td:nth-child(2),
.gfes-reservation-table th:nth-child(3),
.gfes-reservation-table td:nth-child(3),
.gfes-reservation-table th:nth-child(4),
.gfes-reservation-table td:nth-child(4) { width: 17%; text-align: right; }
.gfes-reservation-table tfoot td { font-weight: 700; border-top: 2px solid #cfd8e3; background: #f5f7fb; }

/* ===== Mobile (≤ 640px): Tabelle -> Kartenlayout ===== */
@media (max-width: 640px) {
  .gfes-reservation-table { table-layout: auto; font-size: .95rem; border-collapse: separate; border-spacing: 0; }
  .gfes-reservation-table thead,
  .gfes-reservation-table tfoot { display: none; }

  .gfes-reservation-table tbody tr {
    display: block;
    background: #fff;
    border: 1px solid #e6e6e6;
    border-radius: 10px;
    margin: .75rem 0;
    padding: .5rem .75rem;
    box-shadow: 0 1px 0 rgba(0,0,0,.02);
  }

  .gfes-reservation-table td {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .4rem 0;
    border: 0;
  }

  /* Erste Zeile (Restaurant) hervorgehoben */
  .gfes-reservation-table td:nth-child(1) {
    display: block;
    font-weight: 700;
    font-size: 1.05rem;
    padding-top: .2rem;
    padding-bottom: .6rem;
  }

  /* Labels aus data-th anzeigen */
  .gfes-reservation-table td::before {
    content: attr(data-th);
    font-weight: 600;
    color: #475569;
  }
  /* Für Restaurant-Zeile kein Label anzeigen */
  .gfes-reservation-table td:nth-child(1)::before { content: none; }

  /* Zahlen rechtsbündig halten */
  .gfes-reservation-table td:nth-child(2),
  .gfes-reservation-table td:nth-child(3),
  .gfes-reservation-table td:nth-child(4) {
    text-align: right;
  }
}

/* Optional: visuelle Hinweise für wenig Restplätze */
.gfes-reservation-table .is-low { color: #b42318; font-weight: 700; }

/* Reservations-Details */

.gfes-reservation-details { max-width: 1100px; margin: 0 auto; }
.gfes-reserv-group { margin: 1.2rem 0 2rem; }
.gfes-reserv-restaurant { margin: 0 0 .4rem; font-size: 1.2rem; }
.gfes-reserv-count { color: #64748b; font-weight: 600; margin-left: .25rem; }
.gfes-reserv-empty { color: #667085; margin: .5rem 0 1rem; }
.gfes-reservation-table--details td:nth-child(2) { /* Menü-Spalte etwas breiter auf Desktop */
  width: 50%;
}
@media (max-width: 640px){
  .gfes-reservation-table--details td:nth-child(2){ width: auto; }
}

/* Gecancelte Reservationen in der Detailansicht optisch zurücknehmen */
.gfes-reservation-details tr.gfes-row-cancelled td,
.gfes-reservation-details-by-restaurant tr.gfes-row-cancelled td {
  color: #999;
  opacity: 0.75;
}

.gfes-reservation-details tr.gfes-row-cancelled td:nth-child(6),
.gfes-reservation-details-by-restaurant tr.gfes-row-cancelled td:nth-child(6) {
  font-style: italic;
}

/* Verfügbarkeitsanzeige bei Produkt in Reservation */

.gfes-availability { color:#1e293b; }

/* Tabellen für Übersicht */

.gfes-table { table-layout: fixed; }
.gfes-table thead th:nth-child(1),
.gfes-table tbody td:nth-child(1) { width: 46%; }
.gfes-table thead th:nth-child(2),
.gfes-table tbody td:nth-child(2) { width: 22%; }
.gfes-table thead th:nth-child(3),
.gfes-table tbody td:nth-child(3) { width: 32%; }


/* Alle Menüs pro Restaurant */

/* Nur für die "Menu-by-Restaurant"-Ansicht */
.gfes--by-restaurant .gfes-menus {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
}

.gfes--by-restaurant .gfes-menu {
  display: block; /* sicherstellen, dass die Karte selbst kein Grid ist */
}

.gfes--by-restaurant .gfes-menu .gfes-menu-block {
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #fafafa;
  padding: 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,.05);
}

.gfes--by-restaurant .gfes-menu-title {
  margin: .2rem 0 .5rem;
}

.gfes--by-restaurant .gfes-menu-desc {
  line-height: 1.35;
  font-size: .95rem;
}

.gfes--by-restaurant .gfes-menu-price {
  font-weight: 700;
  margin-top: 1.1rem;
  margin-bottom: .95rem; /* fehlendes Semikolon vermeiden */
  color: #111;
}

.gfes--by-restaurant .gfes-btn {
  display: inline-block;
  padding: .6rem 1.1rem;
  border-radius: 6px;
  text-decoration: none;
  font-weight: 600;
  background: #0073e6;
  color: #fff !important;
  transition: background .2s ease, transform .05s ease;
}
.gfes--by-restaurant .gfes-btn:hover { background: #005bb5; }
.gfes--by-restaurant .gfes-btn:active { transform: translateY(1px); }

/* Badge-Stil konsistent halten */
.gfes--by-restaurant .gfes-cap-badge {
  font-size: .85em;
  background: #eef;
  padding: .2em .6em;
  border-radius: 999px;
}

/* Mobile: 1 Spalte */
@media (max-width: 768px) {
  .gfes--by-restaurant .gfes-menus { grid-template-columns: 1fr; }
}

/* ==========================================
   Menu by Restaurant (neue Klassen)
   Desktop: 2 Spalten nebeneinander
   Mobile: 1 Spalte
   ========================================== */
   
.gfes-day__header {
	margin-bottom: 18px; 
}

.gfes-card__title {
	margin-bottom: 7px; 
	margin-top: 7px; 
}

.gfes--menu-by-restaurant .gfes-cards{
  display: grid;
  gap: 1.5rem;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
}

/* Mobile: 1 Spalte */
@media (max-width: 768px){
  .gfes--menu-by-restaurant .gfes-cards{
    grid-template-columns: 1fr;
  }
}

/* Karten auf gleiche Höhe (optional, wirkt „sauberer“) */
.gfes--menu-by-restaurant .gfes-card__inner{
  height: 100%;
}

/* ------------------------------------------
   Konflikt: .gfes-day ist in deinem CSS als
   "Datum über Menüliste" sehr groß gestylt.
   In der neuen Ansicht ist .gfes-day aber ein Wrapper.
   -> Wir neutralisieren das nur für diese Ansicht.
   ------------------------------------------ */
.gfes--menu-by-restaurant .gfes-day{
  font-size: inherit;
  font-weight: inherit;
  margin: 0 0 2.5rem 0 !important; /* behält Abstand, aber ohne riesige Schrift */
  color: inherit;
}

.gfes--menu-by-restaurant .gfes-day__title{
  font-size: 1.4rem;
  font-weight: 600;
  margin: 0;
  margin-bottom: 7px; 
  color: #000;
}

/* ------------------------------------------
   Badge: du hast bereits .gfes-capacity-badge.
   In der neuen PHP-Datei heisst es .gfes-badge--capacity.
   -> Wir mappen es auf deinen bestehenden Look.
   ------------------------------------------ */
.gfes--menu-by-restaurant .gfes-badge--capacity{
  display: inline-block;
  font-size: .9rem;
  line-height: 1;
  background: #eef6ff;
  color: #0b6efd;
  border: 1px solid #cfe2ff;
  padding: .25rem .5rem;
  border-radius: 999px;
}