* { margin: 0; padding: 0; box-sizing: border-box; }

:root{
  --yellow:#FFD166;
  --orange:#EF6C00;
  --coral:#FF6B6B;
  --mint:#06D6A0;
  --blue:#118AB2;
  --purple:#7B2D8B;
  --dark:#2D3142;
  --light:#FEFEFE;
  --gray:#F4F4F4;
  --green:#4CAF50;
}

body{
  font-family:'Nunito',sans-serif;
  color:var(--dark);
  line-height:1.6;
  background:linear-gradient(135deg,#FFF9E6 0%,#FFE8E0 100%);
  min-height:100vh;
}

h1,h2,h3,h4{ font-family:'Poppins',sans-serif; }

.container{ max-width:1200px; margin:0 auto; padding:20px; }

/* Hero */
.hero{
  background:linear-gradient(135deg,var(--orange) 0%,var(--yellow) 100%);
  color:white;
  text-align:center;
  padding:60px 30px;
  border-radius:30px;
  margin-bottom:40px;
  box-shadow:0 10px 40px rgba(239,108,0,.3);
  position:relative;
  overflow:hidden;
}

.language-switcher{
  position:absolute;
  top:18px;
  right:18px;
  display:flex;
  gap:8px;
  z-index:2;
}

.language-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:999px;
  border:2px solid rgba(255,255,255,.45);
  background:rgba(255,255,255,.16);
  color:white;
  font-weight:900;
  cursor:pointer;
  backdrop-filter:blur(10px);
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}

.language-button:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.24);
}

.language-button.is-active{
  background:white;
  color:var(--orange);
  border-color:white;
}

.language-flag{
  font-size:.85em;
  letter-spacing:.04em;
}

.hero::before{
  content:'🎉';
  position:absolute;
  font-size:120px;
  opacity:.1;
  top:-20px;
  left:50px;
  animation:float 6s ease-in-out infinite;
}

.hero::after{
  content:'🏕️';
  position:absolute;
  font-size:100px;
  opacity:.1;
  bottom:-10px;
  right:80px;
  animation:float 8s ease-in-out infinite;
}

@keyframes float{
  0%,100%{ transform:translateY(0px); }
  50%{ transform:translateY(-20px); }
}

.hero h1{
  font-size:3.5em;
  font-weight:800;
  margin-bottom:15px;
  text-shadow:2px 2px 4px rgba(0,0,0,.2);
}

.hero p{
  font-size:1.4em;
  font-weight:600;
  opacity:.95;
}

.hero-subtitle{
  display:inline-block;
  background:rgba(255,255,255,.2);
  padding:10px 30px;
  border-radius:50px;
  margin-top:20px;
  backdrop-filter:blur(10px);
}

/* Day cards */
.day-card{
  background:white;
  border-radius:25px;
  padding:40px;
  margin-bottom:40px;
  box-shadow:0 8px 30px rgba(0,0,0,.1);
  border-left:8px solid var(--blue);
  transition:transform .3s ease, box-shadow .3s ease;
}

.day-card:hover{ transform:translateY(-5px); box-shadow:0 12px 40px rgba(0,0,0,.15); }

.day-card.day-1{ border-left-color:var(--blue); }
.day-card.day-2{ border-left-color:var(--coral); position:relative; }
.day-card.day-3{ border-left-color:var(--mint); }

.day-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:25px;
  flex-wrap:wrap;
  gap:15px;
}

.day-title{
  font-size:2em;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:15px;
}

.day-motto{
  font-size:1.1em;
  color:#666;
  font-style:italic;
  font-weight:600;
}

.main-day-badge{
  background:linear-gradient(135deg,var(--coral),var(--orange));
  color:white;
  padding:8px 20px;
  border-radius:50px;
  font-weight:700;
  font-size:.9em;
  display:inline-flex;
  align-items:center;
  gap:8px;
  box-shadow:0 4px 15px rgba(239,108,0,.3);
  animation:pulse 2s ease-in-out infinite;
}

@keyframes pulse{
  0%,100%{ transform:scale(1); }
  50%{ transform:scale(1.05); }
}

/* Timeline */
.timeline{ margin:30px 0; }

.timeline-item{
  display:grid;
  grid-template-columns:120px 1fr auto;
  gap:20px;
  padding:20px;
  background:var(--gray);
  border-radius:15px;
  margin-bottom:15px;
  align-items:center;
  transition:all .3s ease;
}

.timeline-item:hover{ background:#EBEBEB; transform:translateX(5px); }

.timeline-time{ font-weight:700; color:var(--orange); font-size:1.1em; }
.timeline-content{ font-weight:600; }
.timeline-person{ text-align:right; }

/* Free slot */
.slot-free{
  display:inline-block;
  padding:8px 16px;
  background:white;
  border:3px dashed var(--coral);
  border-radius:10px;
  color:var(--coral);
  font-weight:800;
  cursor:pointer;
  transition:all .3s ease;
  font-size:.9em;
  user-select:none;
}

.slot-free:hover{
  background:var(--coral);
  color:white;
  border-style:solid;
  transform:scale(1.05);
}

/* Taken slot */
.slot-taken{
  display:inline-block;
  padding:8px 16px;
  background:white;
  border:3px solid var(--green);
  border-radius:10px;
  color:var(--dark);
  font-weight:900;
  font-size:.9em;
  user-select:none;
  cursor:pointer;
  transition:transform .2s ease;
}
.slot-taken:hover{ transform:scale(1.02); }

/* Sections */
.section-title{
  font-size:1.8em;
  font-weight:700;
  margin:30px 0 20px 0;
  color:var(--dark);
  display:flex;
  align-items:center;
  gap:12px;
}

/* Stations */
.stations-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:20px;
  margin-bottom:30px;
}

.station-card{
  background:linear-gradient(135deg,#FFF 0%,#F9F9F9 100%);
  border-radius:20px;
  padding:25px;
  border:3px solid var(--yellow);
  transition:all .3s ease;
}

.station-card:hover{
  transform:translateY(-8px);
  box-shadow:0 12px 30px rgba(0,0,0,.15);
  border-color:var(--orange);
}

.station-icon{ font-size:3em; margin-bottom:10px; display:block; }
.station-title{ font-size:1.3em; font-weight:700; margin-bottom:15px; color:var(--dark); }
.station-info{ margin:10px 0; }
.station-label{ font-weight:700; color:#666; display:block; margin-bottom:5px; font-size:.9em; }

.slot-box{
  display:inline-block;
  padding:10px 15px;
  margin:5px 5px 5px 0;
  background:white;
  border:3px dashed var(--coral);
  border-radius:10px;
  color:var(--coral);
  font-weight:800;
  cursor:pointer;
  transition:all .3s ease;
  font-size:.9em;
  user-select:none;
}

.slot-box:hover{
  background:var(--coral);
  color:white;
  border-style:solid;
  transform:scale(1.05);
}

/* Children groups */
.children-groups{ margin:30px 0; }

.group-card{
  background:white;
  border-radius:20px;
  padding:30px;
  margin-bottom:20px;
  border-left:6px solid var(--mint);
  box-shadow:0 4px 15px rgba(0,0,0,.08);
  transition:all .3s ease;
}
.group-card:nth-child(1){ border-left-color:#FFB4B4; }
.group-card:nth-child(2){ border-left-color:#FFD166; }
.group-card:nth-child(3){ border-left-color:#06D6A0; }
.group-card:nth-child(4){ border-left-color:#7B2D8B; }

.group-card:hover{ transform:translateX(10px); box-shadow:0 6px 25px rgba(0,0,0,.12); }

.group-header{ display:flex; align-items:center; gap:15px; margin-bottom:20px; }
.group-icon{ font-size:2.5em; }
.group-title{ font-size:1.4em; font-weight:700; }
.group-age{ font-size:.9em; color:#666; font-weight:600; }

/* Legend */
.legend{
  background:linear-gradient(135deg,var(--mint) 0%,var(--blue) 100%);
  color:white;
  padding:40px;
  border-radius:25px;
  margin:40px 0;
  text-align:center;
}

.legend h3{ font-size:2em; margin-bottom:20px; }

.legend-items{
  display:flex;
  justify-content:center;
  gap:40px;
  flex-wrap:wrap;
  margin-top:25px;
}

.legend-item{
  display:flex;
  align-items:center;
  gap:12px;
  font-size:1.1em;
  font-weight:600;
}

.legend-box{ width:30px; height:30px; border-radius:8px; }
.legend-box.free{ background:white; border:3px dashed var(--coral); }
.legend-box.taken{ background:var(--green); }

/* Footer */
.footer{
  text-align:center;
  padding:40px 20px;
  background:white;
  border-radius:25px;
  margin-top:40px;
  box-shadow:0 -5px 20px rgba(0,0,0,.05);
}
.footer p{ font-size:1.2em; font-weight:600; color:var(--dark); }

/* Note box */
.note-box{
  background:#FFF3CD;
  border-left:5px solid #FFC107;
  padding:20px;
  border-radius:12px;
  margin:20px 0;
  font-weight:600;
}

/* Editable meal placeholder */
.meal-note{
  display:inline-block;
  padding:8px 12px;
  border-radius:10px;
  background:white;
  border:2px dashed #ddd;
  color:#666;
  font-weight:800;
  font-size:.9em;
  min-width:240px;
  text-align:left;
}
.meal-note:focus{
  outline:none;
  border-color:var(--orange);
  box-shadow:0 0 0 4px rgba(239,108,0,.12);
  color:#333;
}

/* Modal */
#signupModal{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:9999;
  padding:20px;
}

#signupCard{
  max-width:720px;
  margin:40px auto;
  background:white;
  border-radius:18px;
  padding:22px;
}

#signupCard button[disabled]{
  pointer-events:none;
}

/* Toast */
#toast{
  display:none;
  position:fixed;
  left:50%;
  bottom:22px;
  transform:translateX(-50%);
  background:white;
  border-radius:14px;
  padding:12px 16px;
  z-index:10000;
  box-shadow:0 10px 30px rgba(0,0,0,.18);
  border-left:6px solid var(--mint);
  font-weight:900;
}

@media (max-width:768px){
  .hero h1{ font-size:2.2em; }
  .hero p{ font-size:1.1em; }
  .day-title{ font-size:1.5em; }
  .language-switcher{
    position:static;
    justify-content:center;
    margin-bottom:14px;
  }
  .timeline-item{ grid-template-columns:1fr; gap:10px; }
  .timeline-person{ text-align:left; }
  .legend-items{ flex-direction:column; align-items:center; gap:20px; }
  .stations-grid{ grid-template-columns:1fr; }
  .meal-note{ min-width:0; width:100%; }
}

/* =========================
   Add-on: Pills / Multi-Slots
   (ans ENDE der styles.css)
   ========================= */

.slot-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  margin: 6px 6px 0 0;
  border-radius: 999px;
  background: white;
  border: 2px solid #eee;
  font-weight: 800;
  font-size: 0.9em;
  color: var(--dark);
  white-space: nowrap;
}

.slot-pill strong {
  font-weight: 900;
}

.slot-pill.taken {
  border-color: var(--green);
}

.slot-pill.taken::before {
  content: "✅";
}

.slot-pill.free {
  border-style: dashed;
  border-color: var(--coral);
  color: var(--coral);
  cursor: pointer;
}

.slot-pill.free:hover {
  background: var(--coral);
  color: white;
  border-style: solid;
}

/* kleiner "Add another" Button-Stil (falls du das nutzt) */
.slot-add {
  display: inline-block;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  border: 2px dashed #ddd;
  background: white;
  font-weight: 900;
  cursor: pointer;
}

.slot-add:hover {
  border-color: var(--orange);
  box-shadow: 0 0 0 4px rgba(239,108,0,.12);
}

.hero-actions{
  margin-top:18px;
}

.hero-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:10px 18px;
  border-radius:999px;
  color:white;
  text-decoration:none;
  font-weight:800;
  border:2px solid rgba(255,255,255,.45);
  background:rgba(255,255,255,.14);
}

.hero-link:hover{
  background:white;
  color:var(--orange);
}

.admin-shell{
  max-width:1200px;
  margin:0 auto;
  padding:24px;
}

.admin-header{
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom:0;
  flex-direction:column;
}

.admin-title{
  font-size:2.4em;
  font-weight:800;
}

.admin-subtitle{
  color:#5b5f6b;
  font-weight:600;
  margin-top:8px;
}

.admin-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
}

.admin-button{
  min-height:44px;
  padding:10px 16px;
  border:none;
  border-radius:14px;
  background:var(--orange);
  color:white;
  font-weight:800;
  cursor:pointer;
}

.admin-button.secondary{
  background:white;
  color:var(--dark);
  border:2px solid #ececec;
}

.admin-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:16px;
  margin-bottom:24px;
}

.admin-stat{
  background:white;
  border-radius:20px;
  padding:20px;
  box-shadow:0 8px 24px rgba(0,0,0,.08);
}

.admin-stat-label{
  display:block;
  color:#5b5f6b;
  font-size:.95em;
  font-weight:700;
  margin-bottom:8px;
}

.admin-stat-value{
  font-family:'Poppins',sans-serif;
  font-size:2em;
  font-weight:800;
}

.admin-panel{
  background:white;
  border-radius:24px;
  padding:24px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.admin-toolbar{
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:12px;
  margin-bottom:18px;
}

.admin-input,
.admin-select{
  width:100%;
  min-height:46px;
  border:2px solid #ececec;
  border-radius:14px;
  padding:10px 14px;
  font:inherit;
  background:white;
}

.admin-input:focus,
.admin-select:focus{
  outline:none;
  border-color:var(--orange);
  box-shadow:0 0 0 4px rgba(239,108,0,.12);
}

.admin-status{
  margin-bottom:16px;
  color:#5b5f6b;
  font-weight:600;
}

.admin-table-wrap{
  overflow:auto;
  border:1px solid #ececec;
  border-radius:18px;
}

.admin-table{
  width:100%;
  border-collapse:collapse;
  min-width:780px;
}

.admin-table th,
.admin-table td{
  text-align:left;
  padding:14px 16px;
  border-bottom:1px solid #f1f1f1;
  vertical-align:top;
}

.admin-table th{
  font-family:'Poppins',sans-serif;
  font-size:.95em;
  background:#fff7ef;
}

.admin-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-size:.85em;
  font-weight:800;
  background:#fff1e6;
  color:var(--orange);
}

.admin-pill.idea{
  background:#ebfffa;
  color:#0b8d6c;
}

.admin-pill.warning{
  background:#fff7d6;
  color:#b45309;
}

.admin-empty{
  padding:28px;
  text-align:center;
  color:#6b7280;
  font-weight:600;
}

.admin-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.admin-section-title{
  font-family:'Poppins',sans-serif;
  font-size:1.3em;
  font-weight:800;
  margin-bottom:6px;
}

.admin-section-copy{
  color:#5b5f6b;
  font-weight:600;
}

.admin-toolbar-bookings{
  grid-template-columns:2fr 1fr 1fr;
}

.booking-admin-sections{
  display:grid;
  gap:18px;
}

.booking-admin-section{
  border:1px solid #ececec;
  border-radius:20px;
  padding:16px;
  background:#fffdfa;
}

.booking-admin-section-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.booking-admin-section-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
  font-weight:800;
}

.booking-admin-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:34px;
  height:34px;
  border-radius:999px;
  background:#fff1e6;
  color:var(--orange);
  font-weight:800;
}

.booking-admin-list{
  display:grid;
  gap:12px;
}

.booking-admin-card{
  border:1px solid #ececec;
  border-radius:18px;
  padding:0;
  background:#fffdfa;
}

.booking-admin-summary{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  flex-wrap:wrap;
  padding:16px 18px;
  cursor:pointer;
  list-style:none;
}

.booking-admin-summary::-webkit-details-marker{
  display:none;
}

.booking-admin-summary-main{
  min-width:0;
  flex:1 1 420px;
}

.booking-admin-summary-side{
  display:grid;
  gap:6px;
  justify-items:end;
}

.admin-quick-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.booking-admin-title-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

.booking-admin-title-row h3{
  font-family:'Poppins',sans-serif;
  font-size:1.15em;
}

.booking-admin-meta{
  color:#5b5f6b;
  font-weight:600;
}

.booking-admin-total{
  font-family:'Poppins',sans-serif;
  font-size:1.3em;
  font-weight:800;
  color:var(--orange);
}

.booking-admin-summary-count{
  color:#5b5f6b;
  font-size:.95em;
  font-weight:700;
}

.booking-admin-mini-list{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:10px;
}

.booking-admin-mini{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#f4f4f4;
  color:#374151;
  font-size:.85em;
  font-weight:700;
}

.booking-admin-body{
  border-top:1px solid #ececec;
  padding:16px 18px 18px;
}

.booking-admin-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-bottom:18px;
}

.booking-admin-block{
  background:white;
  border-radius:18px;
  padding:14px;
  border:1px solid #f0ebe4;
}

.booking-admin-label{
  display:block;
  margin-bottom:8px;
  color:#5b5f6b;
  font-size:.9em;
  font-weight:800;
}

.booking-admin-block p{
  margin:0 0 6px 0;
  font-weight:600;
  color:#374151;
}

.booking-admin-person-list{
  list-style:none;
  display:grid;
  gap:10px;
  padding:0;
  margin:12px 0 0 0;
}

.booking-admin-person{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  padding:12px 14px;
  border-radius:16px;
  background:white;
  border:1px solid #f0ebe4;
}

.booking-admin-person div{
  display:grid;
  gap:4px;
}

.booking-admin-person strong{
  font-weight:800;
}

.booking-admin-person span{
  color:#5b5f6b;
  font-size:.95em;
  font-weight:600;
}

.booking-admin-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}

.admin-dialog{
  width:min(960px, calc(100vw - 32px));
  max-height:calc(100vh - 32px);
  padding:0;
  border:none;
  border-radius:28px;
  box-shadow:0 24px 60px rgba(0,0,0,.24);
}

.admin-dialog::backdrop{
  background:rgba(15,23,42,.42);
  backdrop-filter:blur(4px);
}

.admin-dialog-card{
  display:grid;
  gap:18px;
  padding:24px;
}

.admin-dialog-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}

.admin-dialog-head h2{
  font-family:'Poppins',sans-serif;
  font-size:1.4em;
  margin-bottom:6px;
}

.admin-dialog-head p{
  color:#5b5f6b;
  font-weight:600;
}

.admin-dialog-close{
  border:none;
  background:#f3f4f6;
  color:#111827;
  border-radius:999px;
  padding:10px 14px;
  font-weight:800;
  cursor:pointer;
}

.admin-editor-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.admin-dialog-section-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
}

.admin-dialog-section-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
}

.admin-participant-card{
  background:#fcfcfc;
}

.admin-editor-summary{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  flex-wrap:wrap;
  padding:18px 20px;
  border-radius:20px;
  background:#fff7ef;
}

.admin-editor-summary span{
  display:block;
  color:#5b5f6b;
  font-weight:700;
  margin-bottom:6px;
}

.admin-editor-summary strong{
  font-family:'Poppins',sans-serif;
  font-size:1.4em;
  color:var(--orange);
}

.admin-editor-summary p{
  color:#5b5f6b;
  font-weight:700;
}

.admin-dialog-actions{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.admin-empty.compact{
  padding:14px;
}

@media (max-width:768px){
  .admin-title{ font-size:1.9em; }
  .admin-toolbar{ grid-template-columns:1fr; }
  .admin-shell{ padding:18px; }
  .admin-toolbar-bookings{ grid-template-columns:1fr; }
  .admin-editor-grid{ grid-template-columns:1fr; }
  .admin-dialog-card{ padding:18px; }
  .admin-dialog-actions{ justify-content:flex-start; }
  .booking-admin-grid{ grid-template-columns:1fr; }
  .booking-admin-person{ flex-direction:column; }
  .booking-admin-summary{ padding:14px; }
  .booking-admin-body{ padding:14px; }
  .booking-admin-summary-side{ justify-items:start; }
  .admin-quick-actions{ justify-content:flex-start; }
}

.booking-shell{
  max-width:1280px;
  margin:0 auto;
  padding:24px;
}

.booking-hero{
  margin-bottom:28px;
}

.booking-layout{
  display:grid;
  grid-template-columns:minmax(0, 1.4fr) minmax(320px, 0.8fr);
  gap:24px;
  align-items:start;
}

.booking-panel,
.booking-summary-card{
  background:white;
  border-radius:24px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
}

.booking-panel{
  padding:28px;
}

.booking-panel-head{
  margin-bottom:22px;
}

.booking-title{
  font-family:'Poppins',sans-serif;
  font-size:2.2em;
  font-weight:800;
  margin-bottom:8px;
}

.booking-copy{
  color:#5b5f6b;
  font-weight:600;
  line-height:1.6;
}

.booking-copy.small{
  font-size:.95em;
}

.booking-form{
  display:grid;
  gap:22px;
}

.booking-section{
  padding:20px;
  border:1px solid #ececec;
  border-radius:20px;
  background:#fffdfa;
}

.booking-section-muted{
  background:#f8fbff;
}

.booking-section-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.booking-section-title{
  font-family:'Poppins',sans-serif;
  font-size:1.25em;
  font-weight:800;
  margin-bottom:8px;
}

.booking-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.booking-field{
  display:grid;
  gap:8px;
  font-weight:700;
  color:#374151;
}

.booking-field-full{
  grid-column:1 / -1;
}

.booking-field input,
.booking-field select,
.booking-field textarea{
  width:100%;
  min-height:48px;
  border:2px solid #ececec;
  border-radius:16px;
  padding:12px 14px;
  font:inherit;
  background:white;
}

.booking-field textarea{
  min-height:100px;
  resize:vertical;
}

.booking-field input:focus,
.booking-field select:focus,
.booking-field textarea:focus{
  outline:none;
  border-color:var(--orange);
  box-shadow:0 0 0 4px rgba(239,108,0,.12);
}

.booking-field input.is-invalid,
.booking-field select.is-invalid,
.booking-field textarea.is-invalid{
  border-color:#d92d20;
  box-shadow:0 0 0 4px rgba(217,45,32,.12);
  background:#fff5f4;
}

.participant-community-badge{
  background:#f3eefc;
  color:#5b3d8a;
}

.booking-toggle{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.booking-toggle-option{
  position:relative;
  display:flex;
}

.booking-toggle-option input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.booking-toggle-option span{
  width:100%;
  min-height:56px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:14px 16px;
  border-radius:18px;
  border:2px solid #ececec;
  background:white;
  font-weight:800;
  cursor:pointer;
  transition:all .2s ease;
}

.booking-toggle-option input:checked + span{
  border-color:var(--orange);
  background:#fff3ea;
  color:var(--orange);
}

.participant-list{
  display:grid;
  gap:14px;
}

.participant-card{
  background:white;
  border:1px solid #ececec;
  border-radius:20px;
  padding:18px;
}

.participant-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  margin-bottom:14px;
}

.participant-card-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
}

.participant-remove{
  border:none;
  background:#fff1f2;
  color:#b42318;
  border-radius:999px;
  padding:8px 12px;
  font-weight:800;
  cursor:pointer;
}

.participant-badges{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}

.participant-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
  border-radius:999px;
  background:#f4f4f4;
  font-size:.9em;
  font-weight:800;
}

.participant-price{
  background:#fff7ef;
  color:var(--orange);
}

.participant-group{
  background:#eef8ff;
  color:#145374;
}

.participant-meals{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid #ececec;
}

.participant-meals-label{
  display:block;
  margin-bottom:10px;
  font-weight:800;
}

.participant-meals-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.participant-meal-option{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid #ececec;
  background:#fff;
}

.participant-meal-option input{
  margin-top:4px;
}

.booking-actions{
  display:flex;
  justify-content:flex-end;
}

.booking-sidebar{
  display:grid;
  gap:20px;
  align-content:start;
  position:sticky;
  top:24px;
}

.booking-summary-card{
  padding:22px;
  border:1px solid rgba(239,108,0,.08);
}

.booking-summary-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
  margin-bottom:18px;
}

.booking-summary-item{
  background:#faf7f2;
  border-radius:18px;
  padding:14px;
}

.booking-summary-item span{
  display:block;
  color:#5b5f6b;
  font-weight:700;
  margin-bottom:8px;
}

.booking-summary-item strong{
  font-family:'Poppins',sans-serif;
  font-size:1.5em;
}

.booking-total{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  padding-top:16px;
  border-top:1px solid #ececec;
  font-weight:800;
}

.booking-total strong{
  font-family:'Poppins',sans-serif;
  font-size:1.35em;
  color:var(--orange);
}

.booking-summary-details{
  margin-top:14px;
  color:#5b5f6b;
  font-weight:600;
  display:grid;
  gap:6px;
}

.booking-help-card{
  background:linear-gradient(180deg,#fffdf8 0%,#fff7ef 100%);
  border:1px solid #f6dfc5;
}

.booking-process-card{
  background:linear-gradient(180deg,#f8fcff 0%,#eef8ff 100%);
  border:1px solid #d7e7fb;
}

.booking-process-card .booking-section-title{
  color:#145374;
}

.booking-process-list{
  padding-left:18px;
  display:grid;
  gap:10px;
  color:#374151;
  font-weight:700;
}

.booking-help-card .booking-section-title,
.login-help strong{
  color:var(--orange);
}

.login-help{
  margin-top:20px;
  padding:16px 18px;
  border-radius:18px;
  background:#fff7ef;
  border:1px solid #f6dfc5;
  display:grid;
  gap:6px;
}

.login-help p{
  color:#5b5f6b;
  font-weight:700;
}

.booking-included-list,
.booking-room-list{
  padding-left:18px;
  display:grid;
  gap:8px;
  color:#374151;
  font-weight:600;
}

.booking-toast{
  display:none;
  position:sticky;
  bottom:18px;
  border-radius:18px;
  padding:14px 16px;
  color:white;
  font-weight:800;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}

.landing-container{
  max-width:1240px;
}

.landing-hero{
  display:grid;
  gap:18px;
  justify-items:center;
}

.landing-badge{
  display:inline-flex;
  align-items:center;
  padding:8px 16px;
  border-radius:999px;
  background:rgba(255,255,255,.2);
  backdrop-filter:blur(10px);
  font-weight:800;
}

.landing-facts{
  width:min(100%, 920px);
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.landing-fact{
  display:grid;
  gap:4px;
  padding:16px 18px;
  border-radius:20px;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.28);
  backdrop-filter:blur(10px);
  text-align:left;
}

.landing-fact strong{
  font-family:'Poppins',sans-serif;
  font-size:.98em;
  font-weight:800;
}

.landing-fact span{
  font-size:.95em;
  font-weight:700;
  line-height:1.45;
}

.landing-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:24px;
  margin-bottom:24px;
}

.landing-grid-intro{
  align-items:stretch;
}

.landing-card,
.landing-section{
  margin-bottom:24px;
}

.landing-card{
  height:100%;
}

.landing-card-icon{
  font-size:2.4em;
  margin-bottom:10px;
}

.landing-copy{
  color:#374151;
  font-weight:600;
  margin-bottom:12px;
}

.landing-copy.small{
  font-size:.95em;
}

.landing-inline-link{
  color:var(--orange);
  font-weight:800;
  text-decoration:none;
}

.landing-inline-link:hover{
  text-decoration:underline;
}

.landing-steps,
.landing-list{
  display:grid;
  gap:10px;
  padding-left:20px;
  color:#374151;
  font-weight:600;
}

.landing-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.landing-price-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.landing-price-card{
  background:white;
  border-radius:20px;
  padding:18px;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 6px 18px rgba(0,0,0,.06);
}

.landing-price-card span{
  display:block;
  color:#5b5f6b;
  font-weight:800;
  margin-bottom:8px;
}

.landing-price-card strong{
  display:block;
  font-family:'Poppins',sans-serif;
  font-size:2em;
  color:var(--orange);
  margin-bottom:6px;
}

.landing-price-card p{
  color:#374151;
  font-weight:600;
}

.landing-note{
  margin-top:18px;
}

.landing-cta-link{
  color:var(--orange);
  background:white;
  border-color:#ffd5b5;
}

.landing-legend .hero-link{
  background:rgba(255,255,255,.18);
}

.accent-orange{ border-left-color:var(--orange) !important; }
.accent-blue{ border-left-color:var(--blue) !important; }
.accent-coral{ border-left-color:var(--coral) !important; }
.accent-mint{ border-left-color:var(--mint) !important; }
.accent-purple{ border-left-color:var(--purple) !important; }

.login-shell{
  max-width:960px;
  margin:0 auto;
  padding:24px;
}

.login-hero{
  margin-bottom:28px;
}

.login-card{
  background:white;
  border-radius:24px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  padding:28px;
  max-width:620px;
  margin:0 auto;
}

.login-form{
  display:grid;
  gap:16px;
}

.login-status{
  min-height:24px;
  color:#b42318;
  font-weight:800;
}

@media (max-width:1080px){
  .booking-layout{
    grid-template-columns:1fr;
  }

  .booking-sidebar{
    position:static;
  }

  .landing-grid,
  .landing-price-grid,
  .landing-facts{
    grid-template-columns:1fr;
  }
}

@media (max-width:768px){
  .booking-shell{ padding:18px; }
  .booking-grid{ grid-template-columns:1fr; }
  .booking-toggle{ grid-template-columns:1fr; }
  .participant-meals-grid{ grid-template-columns:1fr; }
  .booking-summary-grid{ grid-template-columns:1fr 1fr; }
  .landing-container{ padding:18px; }
}

.rooms-shell{
  max-width:1400px;
  margin:0 auto;
  padding:24px;
}

.rooms-hero{
  margin-bottom:28px;
}

.rooms-layout{
  display:grid;
  grid-template-columns:1fr;
  gap:24px;
  align-items:start;
}

.rooms-summary-layout{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:24px;
  margin-bottom:24px;
}

.rooms-toolbar{
  grid-template-columns:2fr 1fr;
}

.rooming-bookings{
  display:grid;
  gap:18px;
}

.rooming-booking-card{
  border:1px solid #ececec;
  border-radius:22px;
  padding:18px;
  background:#fffdfa;
}

.rooming-booking-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.rooming-booking-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.15em;
  margin-bottom:6px;
}

.rooming-booking-head p{
  margin:0 0 6px 0;
  color:#5b5f6b;
  font-weight:600;
}

.rooming-booking-badges{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.rooming-person-list{
  display:grid;
  gap:12px;
}

.rooming-person-row{
  border:1px solid #ececec;
  border-radius:18px;
  padding:14px;
  background:white;
}

.rooming-person-main{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:12px;
}

.rooming-person-main strong{
  font-weight:800;
}

.rooming-person-main span{
  color:#5b5f6b;
  font-weight:700;
}

.rooming-person-fields{
  display:grid;
  grid-template-columns:1.2fr .9fr 1.4fr;
  gap:12px;
}

.rooming-person-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:10px;
}

.rooming-booking-actions{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:16px;
}

.rooming-booking-button-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
}

.rooming-booking-total{
  color:#5b5f6b;
  font-weight:800;
}

.family-costs-list{
  display:grid;
  gap:14px;
}

.community-billing-list,
.special-cases-list{
  display:grid;
  gap:14px;
}

.family-cost-card{
  border:1px solid #ececec;
  border-radius:22px;
  padding:18px;
  background:#fffdfa;
}

.family-cost-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.family-cost-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
  margin-bottom:4px;
}

.family-cost-head p{
  color:#5b5f6b;
  font-weight:600;
}

.family-cost-head strong{
  font-family:'Poppins',sans-serif;
  font-size:1.25em;
  color:var(--orange);
}

.family-cost-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:12px;
}

.family-cost-meta span{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#f4f4f4;
  color:#374151;
  font-size:.85em;
  font-weight:700;
}

.family-cost-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}

.family-cost-list li{
  display:grid;
  grid-template-columns:1.1fr 1fr auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:14px;
  background:white;
  border:1px solid #f0ebe4;
}

.family-cost-list strong{
  font-weight:800;
}

.family-cost-list span{
  color:#5b5f6b;
  font-weight:600;
}

.family-cost-warning{
  margin-top:12px;
  color:#b45309;
  font-weight:800;
}

.hotel-list-wrap{
  overflow:auto;
  border:1px solid #ececec;
  border-radius:18px;
}

.hotel-list-table{
  min-width:760px;
}

.table-subline{
  color:#6b7280;
  font-size:.85em;
  font-weight:600;
}

.community-billing-card,
.special-case-card{
  border:1px solid #ececec;
  border-radius:22px;
  padding:18px;
  background:#fffdfa;
}

.community-billing-head,
.special-case-head{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:flex-start;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.community-billing-head h3,
.special-case-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
  margin-bottom:4px;
}

.community-billing-head strong{
  font-family:'Poppins',sans-serif;
  font-size:1.25em;
  color:var(--orange);
}

.special-case-head p{
  color:#5b5f6b;
  font-weight:600;
}

.community-billing-list-inner{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  gap:8px;
}

.community-billing-list-inner li{
  display:grid;
  grid-template-columns:1.2fr .9fr auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:14px;
  background:white;
  border:1px solid #f0ebe4;
}

.community-billing-list-inner strong{
  font-weight:800;
}

.community-billing-list-inner span{
  color:#5b5f6b;
  font-weight:600;
}

.special-case-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.special-case-note{
  color:#374151;
  font-weight:600;
}

.rooms-overview-grid{
  display:grid;
  gap:18px;
}

.room-floor-section{
  border:1px solid #ececec;
  border-radius:22px;
  padding:16px;
  background:#fffdfa;
}

.room-floor-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
}

.room-floor-head > div:first-child{
  display:grid;
  gap:4px;
}

.room-floor-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.05em;
}

.room-floor-head span{
  color:#5b5f6b;
  font-size:.9em;
  font-weight:800;
}

.room-floor-summary{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.room-floor-pill{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:.78em;
  font-weight:800;
  border:1px solid transparent;
  white-space:nowrap;
}

.room-floor-pill-empty{
  background:#e9f9ef;
  color:#117a42;
}

.room-floor-pill-partial{
  background:#fff1e6;
  color:var(--orange);
}

.room-floor-pill-full{
  background:#ffe7e7;
  color:#c2410c;
}

.room-floor-pill-overflow{
  background:#fff7d6;
  color:#b45309;
}

.room-floor-columns{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.room-floor-column{
  display:grid;
  gap:10px;
}

.room-floor-column-head{
  font-size:.92em;
  font-weight:800;
  color:#5b5f6b;
}

.room-floor-room-list{
  display:grid;
  gap:10px;
}

.room-card{
  border:1px solid #ececec;
  border-radius:22px;
  padding:18px;
  background:#fffdfa;
}

.room-card.compact{
  padding:14px;
}

.room-card.warning{
  border-color:#f59e0b;
  box-shadow:0 0 0 3px rgba(245,158,11,.14);
}

.room-card-empty{
  border-color:#d7f2e6;
  background:linear-gradient(180deg, #ffffff 0%, #f4fff8 100%);
}

.room-card-partial{
  border-color:#ffe2bd;
  background:linear-gradient(180deg, #ffffff 0%, #fff9f1 100%);
}

.room-card-full{
  border-color:#ffd1d1;
  background:linear-gradient(180deg, #ffffff 0%, #fff5f5 100%);
}

.room-card-overflow{
  border-color:#f59e0b;
  box-shadow:0 0 0 3px rgba(245,158,11,.14);
  background:linear-gradient(180deg, #ffffff 0%, #fff7e8 100%);
}

.room-card-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  margin-bottom:14px;
}

.room-card-head h3{
  font-family:'Poppins',sans-serif;
  font-size:1.1em;
  margin-bottom:4px;
}

.room-card-head p{
  color:#5b5f6b;
  font-weight:600;
}

.room-card-badges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:10px;
}

.room-card-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 10px;
  border-radius:999px;
  background:#fff6ef;
  color:#7c4a12;
  font-size:.76em;
  font-weight:800;
  border:1px solid #ffe3cc;
}

.room-card-badge-accent{
  background:#f2f8ff;
  color:#1d4f91;
  border-color:#d7e7fb;
}

.room-card-usage{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:6px 10px;
  border-radius:999px;
  background:#fff1e6;
  color:var(--orange);
  font-weight:800;
}

.room-card-usage-empty{
  background:#e9f9ef;
  color:#117a42;
}

.room-card-usage-partial{
  background:#fff1e6;
  color:var(--orange);
}

.room-card-usage-full{
  background:#ffe7e7;
  color:#c2410c;
}

.room-card-usage-overflow{
  background:#fff7d6;
  color:#b45309;
}

.room-card-capacity{
  margin-bottom:10px;
}

.room-card-capacity-bar{
  height:8px;
  border-radius:999px;
  background:#f1f1f1;
  overflow:hidden;
}

.room-card-capacity-bar span{
  display:block;
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, #ffb34d 0%, #ef6c00 100%);
}

.room-card-stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  margin-bottom:14px;
}

.room-card-stats.compact{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  margin-bottom:10px;
}

.room-card-stats div{
  background:white;
  border-radius:16px;
  padding:12px;
  border:1px solid #f0ebe4;
}

.room-card-stats span{
  display:block;
  color:#5b5f6b;
  font-size:.85em;
  font-weight:700;
  margin-bottom:6px;
}

.room-card-stats strong{
  font-family:'Poppins',sans-serif;
  font-size:1.15em;
}

.room-card-meta{
  display:flex;
  justify-content:space-between;
  gap:8px;
  margin-bottom:10px;
}

.room-card-meta span{
  color:#5b5f6b;
  font-size:.85em;
  font-weight:800;
}

.rooming-assigned-rooms{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}

.rooming-assigned-room{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:#fff6ef;
  color:#ef6c00;
  font-size:.8em;
  font-weight:800;
  border:1px solid #ffd7b0;
}

.room-card-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}

.room-card-list li{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  background:white;
  border:1px solid #f0ebe4;
}

.room-card-list strong{
  font-weight:800;
}

.room-card-list span{
  color:#6b7280;
  font-size:.85em;
}

.room-card-note{
  margin-top:12px;
  color:#6b7280;
  font-weight:600;
}

.room-card-actions{
  display:flex;
  justify-content:flex-end;
}

.room-detail-body{
  display:grid;
  gap:16px;
}

.room-detail-stats{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.room-detail-stats div{
  background:#fff7ef;
  border-radius:16px;
  padding:14px;
}

.room-detail-stats span{
  display:block;
  color:#5b5f6b;
  font-size:.85em;
  font-weight:700;
  margin-bottom:6px;
}

.room-detail-stats strong{
  font-family:'Poppins',sans-serif;
  font-size:1.15em;
}

.room-detail-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}

.room-detail-list li{
  display:grid;
  grid-template-columns:1fr 1fr 1fr auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:14px;
  background:white;
  border:1px solid #f0ebe4;
}

@media (max-width:1180px){
  .rooms-summary-layout{
    grid-template-columns:1fr;
  }

  .rooms-layout{
    grid-template-columns:1fr;
  }

  .room-floor-columns{
    grid-template-columns:1fr;
  }

  .room-floor-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .room-floor-summary{
    justify-content:flex-start;
  }
}

@media (max-width:768px){
  .rooms-shell{ padding:18px; }
  .rooms-toolbar{ grid-template-columns:1fr; }
  .community-billing-list-inner li{ grid-template-columns:1fr; }
  .rooming-person-fields{ grid-template-columns:1fr; }
  .family-cost-list li{ grid-template-columns:1fr; }
  .room-card-stats{ grid-template-columns:1fr; }
  .room-detail-stats{ grid-template-columns:1fr; }
  .room-detail-list li{ grid-template-columns:1fr; }
  .rooming-booking-actions{ align-items:flex-start; flex-direction:column; }
  .rooming-booking-button-row{ justify-content:flex-start; width:100%; }
}

@media print{
  body{
    background:white;
  }

  .hero,
  .admin-actions,
  .rooms-toolbar,
  .rooming-bookings,
  .admin-status,
  #roomsRefreshButton,
  #roomsPrintButton{
    display:none !important;
  }

  .rooms-shell{
    max-width:none;
    padding:0;
  }

  .admin-panel,
  .admin-stat,
  .room-card,
  .family-cost-card{
    box-shadow:none;
    border:1px solid #d1d5db;
    break-inside:avoid;
  }

  .rooms-summary-layout,
  .rooms-layout{
    grid-template-columns:1fr;
    gap:16px;
  }
}

/* Final safe icon overrides */
.hero::before{
  content:"\1F389";
}

.hero::after{
  content:"\1F3D5\FE0F";
}

.slot-pill.taken::before,
.planning-slot.slot-taken::before{
  content:"\2705";
}

/* Planning page slot buttons: single visual system */
.planning-slot{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 14px;
  margin:6px 6px 0 0;
  border-radius:999px;
  border:2px solid #eadccd;
  background:#fff;
  color:var(--dark);
  font-size:.92em;
  font-weight:800;
  line-height:1.2;
  white-space:nowrap;
  cursor:pointer;
  user-select:none;
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.planning-slot:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(0,0,0,.08);
}

.planning-slot:focus-visible{
  outline:none;
  box-shadow:0 0 0 4px rgba(239,108,0,.18);
}

.planning-slot.slot-free,
.planning-slot.slot-box{
  border-style:dashed;
  border-color:var(--coral);
  color:var(--coral);
  background:#fff;
}

.planning-slot.slot-free:hover,
.planning-slot.slot-box:hover{
  background:var(--coral);
  color:#fff;
  border-style:solid;
}

.planning-slot.slot-taken{
  border-style:solid;
  border-color:var(--green);
  background:#f6fff8;
  color:var(--dark);
}

.planning-slot.slot-taken:hover{
  background:#eefcf2;
  color:var(--dark);
}