/* WRAPPER */
#clinic-form{
  max-width:420px !important;
  margin:40px auto!important;
  padding:20px !important;
  background:#fff !important;
  border-radius:18px !important;
  box-shadow:0 15px 40px rgba(0,0,0,0.08) !important;
}

/* STEPS */
.c-step{display:none;}
.c-step.active{
  display:block;
  animation:fadeIn 0.3s ease !important;
}

@keyframes fadeIn{
  from{opacity:0; transform:translateY(10px);}
  to{opacity:1; transform:translateY(0);}
}

/* GRID */
.c-grid{
  display:grid !important;
  grid-template-columns:repeat(2,1fr) !important;
  gap:14px !important;
}

/* CARD */
.c-card{
  padding:16px !important;
  border-radius:14px !important;
  background:#f8fafc !important;
  cursor:pointer !important;
  text-align:center !important;
  font-weight:500 !important;
  transition:all 0.2s ease !important;
  border:1px solid transparent !important;
}

/* HOVER */
.c-card:hover{
  background:#eef2ff !important;
  transform:translateY(-3px) !important;
}

/* ACTIVE (SELECTED) */
.c-card.active{
  background:#2271b1 !important;
  color:#fff !important;
  box-shadow:0 6px 20px rgba(34,113,177,0.3) !important;
  border-color:#2271b1 !important;
}

/* INPUT */
.c-input{
  width:100% !important;
  padding:14px !important;
  margin-bottom:12px !important;
  border-radius:10px !important;
  border:1px solid #e5e7eb !important;
  font-size:14px !important;
  transition:all 0.2s ease !important;
}

.c-input:focus{
  border-color:#2271b1 !important;
  outline:none !important;
  box-shadow:0 0 0 3px rgba(34,113,177,0.15) !important;
}

/* BUTTON */
.c-btn{
  width:100% !important;
  padding:15px !important;
  background:#2271b1 !important;
  color:#fff !important;
  border:none !important;
  border-radius:12px !important;
  font-size:16px !important;
  font-weight:500 !important;
  cursor:pointer !important;
  transition:all 0.2s ease !important;
}

.c-btn:hover{
  background:#1d5f94 !important;
  transform:translateY(-1px) !important;
}

/* OPTIONAL: PAGE BG */
body{
  background:#f3f6fb;
}
.flatpickr-calendar {
  z-index: 999999 !important;
 background: #fff !important;
  opacity: 1 !important;
  box-shadow: 0 5px 20px rgba(0,0,0,0.2) !important;
  border-radius: 10px !important;
padding: 12px !important;   /* ðŸ”¥ main padding */
position: fixed !important;
top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;

}
/* 🔴 Disabled dates (grey) */
.flatpickr-day.flatpickr-disabled {
  color: #ccc !important;
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}

/* 🔵 Available dates (blue text like your image) */
.flatpickr-day:not(.flatpickr-disabled) {
  color: #2563eb !important;
  font-weight: 500 !important;
}

/* 🔵 Hover */
.flatpickr-day:not(.flatpickr-disabled):hover {
  background: #2563eb !important;
  color: #fff !important;
}

/* 🔵 Selected date (circle like your UI) */
.flatpickr-day.selected {
  background: transparent !important;
  border: 2px solid #2563eb !important;
  color: #2563eb !important;
  border-radius: 50% !important;
}

/* 🔵 Today (optional subtle highlight) */
.flatpickr-day.today {
  border-color: #2563eb !important;
}
.c-success-card{
  text-align:center !important;
  padding:30px 20px !important;
}

.c-success-icon{
  width:70px !important;
  height:70px !important;
  margin:0 auto 15px !important;
  border-radius:50% !important;
  background:#22c55e !important;
  color:#fff !important;
  font-size:32px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.c-success-card h3{
  font-size:22px !important;
  margin-bottom:5px !important;
}

.c-sub{
  color:#6b7280 !important;
  font-size:14px !important;
  margin-bottom:20px !important;
}

.c-info{
  background:#f9fafb !important;
  border-radius:10px !important;
  padding:15px !important;
  text-align:left !important;
  margin-bottom:20px !important;
}

.c-info div{
  margin-bottom:8px !important;
  font-size:14px !important;
}

.c-btn{
  width:100% !important;
  padding:14px !important;
  border:none !important;
  border-radius:12px !important;
  background:#2271b1 !important;
  color:#fff !important;
  font-size:16px !important;
}
.c-confirm-card{
  background:#fff !important;
  border-radius:16px !important;
  padding:20px !important;
  box-shadow:0 10px 25px rgba(0,0,0,0.06) !important;
}

.c-confirm-card h3{
  font-size:20px !important;
  margin-bottom:15px !important;
}

.c-confirm-box{
  background:#f9fafb !important;
  border-radius:12px !important;
  padding:15px !important;
  margin-bottom:20px !important;
}

.c-confirm-box .row{
  display:flex !important;
  justify-content:space-between !important;
  margin-bottom:10px !important;
  font-size:14px !important;
}

.c-confirm-box .row span{
  color:#6b7280 !important;
}

.c-confirm-box .row strong{
  color:#111 !important;
}

.c-confirm-box .highlight{
  border-top:1px solid #e5e7eb !important;
  padding-top:10px !important;
  margin-top:10px !important;
  font-size:15px !important;
}

.c-confirm-btn{
  width:100% !important;
  padding:14px !important;
  border:none !important;
  border-radius:12px !important;
  background:#2271b1 !important;
  color:#fff !important;
  font-size:16px !important;
}
#clinic-form {
  position: relative;
  z-index: 1;
}
