.swai-booking {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  color: #2E4257;
  max-width: 640px;
  background: #FFFFFF;
  border: 1px solid #E2E8ED;
  border-radius: 14px;
  padding: 32px;
}
.swai-booking * { box-sizing: border-box; }
.swai-booking h3 {
  font-family: Inter, system-ui, sans-serif;
  font-weight: 400;
  font-size: 20px;
  line-height: 1.3;
  color: #172434;
  margin: 0 0 4px;
}
.swai-booking .swai-step-label {
  font-size: 13px;
  font-weight: 600;
  color: #6B7C8D;
  margin: 24px 0 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.swai-booking .swai-step-label:first-of-type { margin-top: 4px; }

.swai-pill-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.swai-pill {
  font-family: inherit;
  font-size: 14px;
  font-weight: 500;
  color: #172434;
  background: #FFFFFF;
  border: 1px solid #E2E8ED;
  border-radius: 9999px;
  padding: 9px 18px;
  cursor: pointer;
  transition: box-shadow .15s ease, border-color .15s ease, background .15s ease;
  font-feature-settings: "tnum";
}
.swai-pill:hover { border-color: #16E0F5; box-shadow: 0 4px 16px rgba(22,224,245,.25); }
.swai-pill.is-selected { background: #16E0F5; border-color: #16E0F5; color: #172434; font-weight: 600; }
.swai-pill:disabled { opacity: .35; cursor: not-allowed; box-shadow: none; }

.swai-date-row { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
.swai-date-row .swai-pill { flex: 0 0 auto; text-align: center; min-width: 68px; }
.swai-date-row .swai-pill .swai-date-day { display: block; font-size: 11px; color: #6B7C8D; }
.swai-date-row .swai-pill.is-selected .swai-date-day { color: #172434; }

.swai-slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); gap: 8px; }

.swai-field { margin-bottom: 14px; }
.swai-field label { display: block; font-size: 13px; font-weight: 500; color: #172434; margin-bottom: 6px; }
.swai-field input, .swai-field textarea {
  width: 100%;
  font-family: inherit;
  font-size: 15px;
  color: #172434;
  border: 1px solid #C9D5DE;
  border-radius: 8px;
  padding: 10px 12px;
}
.swai-field input:focus, .swai-field textarea:focus { outline: none; border-color: #16E0F5; box-shadow: 0 0 0 3px #D9F7FC; }
.swai-honeypot { position: absolute; left: -9999px; opacity: 0; height: 0; }

.swai-submit {
  font-family: inherit;
  font-size: 15px;
  font-weight: 500;
  background: #16E0F5;
  color: #172434;
  border: none;
  border-radius: 9999px;
  padding: 14px 28px;
  cursor: pointer;
  margin-top: 8px;
}
.swai-submit:hover { box-shadow: 0 8px 24px rgba(22,224,245,.35); }
.swai-submit:disabled { opacity: .5; cursor: not-allowed; box-shadow: none; }

.swai-hint { font-size: 13px; color: #6B7C8D; margin-top: 4px; }
.swai-error { font-size: 14px; color: #B3261E; margin-top: 10px; }

.swai-confirmation h3 { font-size: 24px; font-weight: 300; letter-spacing: -0.4px; margin-bottom: 12px; }
.swai-confirmation .swai-when { font-weight: 600; color: #172434; font-feature-settings: "tnum"; }
.swai-confirmation a.swai-meet-link {
  display: inline-block; margin-top: 16px; background: #172434; color: #FFFFFF;
  border-radius: 9999px; padding: 12px 24px; text-decoration: none; font-weight: 500; font-size: 14px;
}

.swai-loading { font-size: 14px; color: #6B7C8D; }

@media (max-width: 480px) {
  .swai-booking { padding: 20px; }
}
