/* Alpenlodge – Availability UI (Listing Pages) v47
   Ziel:
   - Zeitraum + Personen Controls auf Listing-Seiten
   - Unit-Badges: Gesamtpreis + Status, darunter Preis/Nacht · Nächte und Hinweis "inkl. KT & ER"
   - Design: Glas/Dark-Overlay beibehalten.
*/

/* Controls (Datum / Personen) */
.al-avail-controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin: 10px 0 6px;
}
.al-avail-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background: rgba(0,0,0,0.35);
  border: 1px solid rgba(255,255,255,0.18);
  color:#fff;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 10px 26px rgba(0,0,0,.18);
  font-size: 13px;
}
.al-avail-chip .lbl{ font-weight:800; opacity:.95; }
.al-avail-chip input,
.al-avail-chip select{
  appearance:none;
  background: rgba(0,0,0,0.18);
  color:#fff;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 10px;
  padding: 6px 8px;
  font-size: 13px;
  line-height: 1.1;
}
.al-avail-chip input{ min-width: 138px; }
.al-avail-chip select{ min-width: 76px; }
.al-avail-chip .sep{ opacity:.75; }

/* iOS/WebKit: Datum-Picker Icon sichtbar machen */
.al-avail-chip input[type="date"]::-webkit-calendar-picker-indicator{
  filter: invert(1);
  opacity: .9;
}

/* Unit badges in cards */
.al-unit-card{ position:relative; }

.hero-unitlist .unitlinks a.al-unit-card,
.units-pill.al-unit-card{
  /* Platz rechts für Badge */
  padding-right: 154px;
}

.al-avail-badge{
  position:absolute;
  top: 12px;
  right: 12px;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
  pointer-events:none;
}

.al-avail-row1{
  display:flex;
  align-items:center;
  gap:10px;
}

.al-avail-price{
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .02em;
  white-space: nowrap;
  opacity: .95;
}

.al-avail-meta{
  font-weight: 700;
  font-size: 11.5px;
  line-height: 1.1;
  opacity: .92;
  white-space: nowrap;
  text-align: right;
}

.al-avail-hint{
  font-weight: 700;
  font-size: 10.5px;
  line-height: 1.1;
  opacity: .78;
  white-space: nowrap;
  text-align: right;
}

.al-avail-icon{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,0.26);
  background: rgba(0,0,0,0.22);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.al-avail-icon.is-available{
  background: rgba(24,150,60,0.33);
  border-color: rgba(120,255,170,0.36);
  color: #eaffea;
}
.al-avail-icon.is-unavailable{
  background: rgba(210,50,40,0.33);
  border-color: rgba(255,140,140,0.36);
  color: #ffecec;
}
.al-avail-icon.is-loading{
  background: rgba(255,255,255,0.16);
  border-color: rgba(255,255,255,0.22);
  color: rgba(255,255,255,0.92);
}
.al-avail-icon.is-error{
  background: rgba(255,180,0,0.22);
  border-color: rgba(255,220,130,0.30);
  color: #fff8dc;
}

.al-unit-card.al-unavailable{
  opacity: .92;
}

@media (max-width: 520px){
  .al-avail-chip input{ min-width: 130px; }
  .al-avail-controls{ gap:8px; }
  .al-avail-badge{ top:10px; right:10px; }
  .hero-unitlist .unitlinks a.al-unit-card,
  .units-pill.al-unit-card{ padding-right: 150px; }
}