.kmch-appt{
  width: 100%;
  max-width: var(--kmch-appt-max, 1100px);
  margin: 0 auto;
  padding: 0 12px;
}
.kmch-appt__card{
  width: 100%;
  background: rgba(255,255,255,0.9);
  border: 1px solid rgba(15,23,42,0.08);
  border-radius: 22px;
  padding: 26px;
  box-shadow: 0 18px 40px rgba(15,23,42,0.08);
}
.kmch-appt__header{display:flex;gap:14px;justify-content:space-between;align-items:flex-start;padding:6px 4px 16px;border-bottom:1px solid rgba(0,0,0,.06)}
.kmch-appt__title{font-size:20px;font-weight:700;letter-spacing:-0.02em}
.kmch-appt__subtitle{margin-top:4px;font-size:13px;opacity:.8}
.kmch-appt__badge{display:inline-flex;gap:8px;align-items:center;padding:8px 10px;border-radius:999px;border:1px solid rgba(0,0,0,.08);background:rgba(255,255,255,.7);font-size:12px;white-space:nowrap}
.kmch-dot{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 6px rgba(34,197,94,.15)}
.kmch-appt__grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 22px;
  align-items: start;
}
@media (max-width:760px){.kmch-appt__grid{grid-template-columns:1fr}}
.kmch-field__label{display:block;font-size:12px;font-weight:600;margin-bottom:8px}
.kmch-field__control{position:relative}
.kmch-select{width:100%;appearance:none;border-radius:14px;border:1px solid rgba(0,0,0,.12);padding:12px 42px 12px 12px;background:#fff;font-size:14px;outline:none;transition:transform .08s ease,box-shadow .12s ease}
.kmch-select:focus{box-shadow:0 0 0 4px rgba(59,130,246,.18)}
.kmch-field__hint{display:block;margin-top:8px;font-size:12px;opacity:.7}
.kmch-spinner{position:absolute;right:14px;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;border:2px solid rgba(0,0,0,.18);border-top-color:rgba(0,0,0,.55);animation:kmchSpin .7s linear infinite;opacity:0;pointer-events:none}
@keyframes kmchSpin{to{transform:rotate(360deg)}}
.kmch-appt__footer{display:flex;gap:12px;justify-content:space-between;align-items:center;padding:12px 4px 6px}
.kmch-appt__status{font-size:13px;opacity:.85;min-height:18px}
.kmch-btn{border:0;border-radius:14px;padding:12px 16px;font-size:14px;font-weight:700;cursor:pointer;background:#111827;color:#fff;box-shadow:0 10px 22px rgba(17,24,39,.18);display:inline-flex;align-items:center;gap:10px;transition:transform .08s ease,opacity .12s ease}
.kmch-btn:hover{transform:translateY(-1px)}
.kmch-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.kmch-appt__note{margin-top:8px;padding:10px 12px;border-radius:14px;border:1px dashed rgba(0,0,0,.12);font-size:12px;opacity:.78;display:flex;gap:8px;align-items:center}


/* Live availability badge states */
.kmch-appt__badge.is-live .kmch-dot { background: #16a34a; box-shadow: 0 0 0 6px rgba(22,163,74,0.15); }
.kmch-appt__badge.is-down { opacity: 0.9; }
.kmch-appt__badge.is-down .kmch-dot { background: #dc2626; box-shadow: 0 0 0 6px rgba(220,38,38,0.15); }
.kmch-appt__badge.is-checking .kmch-dot { background: #f59e0b; box-shadow: 0 0 0 6px rgba(245,158,11,0.15); animation: kmchPulse 1.2s infinite; }

@keyframes kmchPulse {
  0% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.15); opacity: 0.7; }
  100% { transform: scale(1); opacity: 1; }
}


@media (max-width: 860px){
  .kmch-appt{ max-width: 100%; padding: 0 10px; }
  .kmch-appt__card{ padding: 18px; border-radius: 18px; }
  .kmch-appt__grid{ grid-template-columns: 1fr; }
  .kmch-appt__footer{ flex-direction: column; align-items: stretch; gap: 12px; }
  .kmch-appt__cta{ width: 100%; justify-content: center; }
}