/* Appointment UI final hard-fix — 2026-09-24
   Keeps calendar/form overlays out of page flow and gives the booking panel a clean clinic look. */

/* Safety: overlays must NEVER render inline. */
.pro-calendar-backdrop,
.appt-quick-backdrop{
  position:fixed!important;
  inset:0!important;
  display:none!important;
  width:100vw!important;
  height:100dvh!important;
  margin:0!important;
  z-index:1000000!important;
  box-sizing:border-box!important;
}
.pro-calendar-backdrop.open,
.appt-quick-backdrop.open{display:flex!important}

/* Compact appointment card */
.dm-booking-shell{align-self:start!important;max-height:none!important}
.hospital-booking-card.mk-booking-card{
  overflow:hidden!important;
  border:1px solid #cfe5e9!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 18px 48px rgba(5,74,90,.10)!important;
}
.mk-booking-head,.hospital-booking-head{
  padding:17px 18px!important;
  gap:12px!important;
  background:linear-gradient(180deg,#ffffff,#f8fdfe)!important;
  border-bottom:1px solid #dcecef!important;
}
.mk-booking-head .icon,.hospital-booking-head .icon{
  width:42px!important;height:42px!important;flex:0 0 42px!important;
  border-radius:11px!important;background:#078c9c!important;
  color:#fff!important;box-shadow:none!important;
}
.mk-booking-head h2{font-size:22px!important;line-height:1.2!important;color:#0b4b5b!important}
.mk-booking-head p{font-size:11px!important;color:#7b8f96!important}
.mk-booking-body{padding:14px 16px 16px!important}

.hospital-doctor-select,.mk-chamber-select{
  position:relative!important;
  margin:0 0 11px!important;
  padding:12px!important;
  border:1px solid #d9eaed!important;
  border-radius:13px!important;
  background:#fbfeff!important;
}
.hospital-doctor-select:before{
  content:"1"!important;position:absolute!important;left:12px!important;top:11px!important;
  width:26px!important;height:26px!important;display:grid!important;place-items:center!important;
  border-radius:8px!important;background:#078c9c!important;color:#fff!important;font-size:12px!important;font-weight:900!important;
}
.hospital-doctor-select label{padding-left:37px!important;margin-bottom:8px!important;font-size:12px!important;color:#244b57!important}
.hospital-doctor-select select,.mk-chamber-select select{
  min-height:44px!important;border:1px solid #cee2e6!important;border-radius:10px!important;
  background:#fff!important;color:#173f4a!important;padding:0 12px!important;font-size:12px!important;font-weight:750!important;
}
.mk-chamber-select label{display:flex!important;align-items:center!important;gap:9px!important;margin-bottom:8px!important}
.mk-chamber-select label>span{width:26px!important;height:26px!important;border-radius:8px!important;background:#078c9c!important;color:#fff!important;font-size:12px!important}
.mk-chamber-select label b{font-size:12px!important;color:#244b57!important}.mk-chamber-select label small{font-size:10px!important;color:#83959b!important}

.pro-scheduler.mk-scheduler{margin-top:8px!important;border:0!important;border-radius:0!important;overflow:visible!important;background:#fff!important}
.mk-scheduler .pro-schedule-head{
  position:relative!important;display:grid!important;grid-template-columns:minmax(0,1fr) 145px!important;
  align-items:end!important;gap:10px!important;padding:10px 0 12px 38px!important;margin:0!important;
  border-top:1px solid #edf4f5!important;border-bottom:1px solid #dbeaec!important;
}
.mk-scheduler .pro-schedule-head:before{
  content:"3"!important;position:absolute!important;left:0!important;top:12px!important;
  width:26px!important;height:26px!important;display:grid!important;place-items:center!important;border-radius:8px!important;
  background:#0a9d81!important;color:#fff!important;font-size:12px!important;font-weight:900!important;
}
.mk-scheduler .pro-schedule-title{font-size:12px!important;color:#244b57!important;font-weight:900!important}
.mk-scheduler .pro-schedule-sub{font-size:9.5px!important;color:#87979c!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.mk-scheduler .pro-date-button{min-width:0!important;min-height:42px!important;height:42px!important;border:1px solid #cfe2e6!important;border-radius:10px!important;background:#fff!important;color:#173f4a!important;padding:0 11px!important;font-size:11px!important}
.mk-scheduler .cal-ico{font-size:15px!important;color:#078c9c!important}
.mk-slot-title{padding:11px 0 8px!important;margin:0!important;border:0!important;font-size:12px!important;color:#244b57!important}
.mk-scheduler .pro-day-tabs{display:grid!important;grid-template-columns:repeat(4,1fr)!important;margin:0 0 12px!important;border:1px solid #deebed!important;border-radius:10px!important;overflow:hidden!important}
.mk-scheduler .pro-day-tab{min-height:48px!important;padding:7px 3px!important;border:0!important;border-right:1px solid #e6f0f1!important;background:#fff!important;color:#5e777e!important;font-size:10px!important;box-shadow:none!important}
.mk-scheduler .pro-day-tab:last-child{border-right:0!important}
.mk-scheduler .pro-day-tab b{font-size:10.5px!important}.mk-scheduler .pro-day-tab small{font-size:9px!important}
.mk-scheduler .pro-day-tab.active{background:#f2fbfc!important;color:#00889a!important;box-shadow:inset 0 -3px 0 #0795a5!important}
.mk-scheduler .pro-slot-card{padding:0!important;border:0!important;background:#fff!important;box-shadow:none!important}
.mk-scheduler .pro-slot-top{margin:0 0 8px!important}.mk-scheduler .pro-slot-top b{font-size:12px!important;color:#244b57!important}
.mk-scheduler #slot_count{padding:4px 8px!important;background:#eef8f9!important;color:#078697!important;border-radius:999px!important;font-size:9px!important}
.mk-scheduler .pro-period{margin:0 0 9px!important}.mk-scheduler .pro-period-name{display:block!important;margin:5px 0 6px!important;font-size:10px!important;color:#688087!important;font-weight:850!important}
.mk-scheduler .pro-slot-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
.mk-scheduler .pro-slot{
  min-height:34px!important;padding:5px 2px!important;border:1px solid #d1e2e5!important;border-radius:8px!important;
  background:#fff!important;color:#2b5863!important;font-size:9.5px!important;font-weight:800!important;box-shadow:none!important;
}
.mk-scheduler .pro-slot:hover:not(:disabled){background:#effafb!important;border-color:#57b8c3!important;color:#08798a!important}
.mk-scheduler .pro-slot.active{background:#980b0b!important;color:#fff!important;border-color:#980b0b!important;box-shadow:none!important}
.mk-scheduler .pro-slot:disabled{opacity:.52!important;background:#f3f6f7!important;color:#8a989c!important}
.mk-scheduler .pro-empty{margin-top:8px!important;padding:10px!important;border:1px dashed #d6e6e9!important;border-radius:9px!important;background:#f9fcfd!important;color:#788d93!important;font-size:10px!important}
.mk-whatsapp-bar{margin-top:12px!important;padding:10px 12px!important;border-radius:10px!important;background:#eef9f4!important;border:1px solid #d3ebde!important;color:#24745d!important;font-size:10.5px!important}

/* Calendar overlay */
.pro-calendar-backdrop{align-items:center!important;justify-content:center!important;padding:18px!important;background:rgba(7,38,48,.48)!important;backdrop-filter:blur(5px)!important}
.pro-calendar{width:min(390px,96vw)!important;max-height:88dvh!important;overflow:auto!important;border:1px solid #d6e7ea!important;border-radius:18px!important;background:#fff!important;padding:16px!important;box-shadow:0 28px 80px rgba(5,45,58,.28)!important}
.pro-cal-head strong{color:#075b6d!important}.pro-cal-head button{background:#eef9fa!important;color:#087f90!important}
.pro-cal-day{border-color:#dce9eb!important;color:#214b55!important}.pro-cal-day.today{outline-color:#0a95a5!important}.pro-cal-day.selected{background:#078c9c!important;border-color:#078c9c!important}.pro-cal-close{background:#078c9c!important}

/* Patient information modal */
.appt-quick-backdrop{
  align-items:center!important;justify-content:center!important;padding:22px!important;
  background:rgba(5,35,47,.64)!important;backdrop-filter:blur(7px)!important;
}
.appt-quick-modal{
  width:min(540px,96vw)!important;max-height:90dvh!important;overflow:auto!important;
  padding:0!important;border:1px solid #cfe4e8!important;border-radius:19px!important;background:#fff!important;
  box-shadow:0 30px 90px rgba(0,33,45,.32)!important;color:#183f4a!important;
}
.appt-quick-head{
  position:sticky!important;top:0!important;z-index:2!important;display:flex!important;justify-content:space-between!important;align-items:flex-start!important;
  gap:14px!important;margin:0!important;padding:15px 16px 13px!important;background:linear-gradient(180deg,#f2fcfd,#e9f8fa)!important;border-bottom:1px solid #d5e8eb!important;
}
.appt-head-badge{display:inline-flex!important;align-items:center!important;width:max-content!important;margin-bottom:4px!important;padding:4px 7px!important;border-radius:999px!important;background:#dff6f1!important;color:#137963!important;font-size:9px!important;font-weight:900!important}
.appt-quick-head small{display:block!important;color:#168799!important;font-size:9px!important;font-weight:900!important;letter-spacing:0!important}
.appt-quick-head h3{margin:2px 0 1px!important;color:#064e61!important;font-size:21px!important;line-height:1.15!important}
.appt-quick-head p{margin:0!important;color:#496c75!important;font-size:10px!important;font-weight:700!important}
.appt-quick-close{width:34px!important;height:34px!important;flex:0 0 34px!important;border:1px solid #cfe4e8!important;border-radius:10px!important;background:#fff!important;color:#08758a!important;font-size:22px!important;line-height:1!important;cursor:pointer!important}
.appt-quick-content{padding:14px 16px 16px!important}
.appt-change-time{display:inline-flex!important;align-items:center!important;margin:0 0 12px!important;color:#07899a!important;font-size:10px!important;font-weight:900!important;text-decoration:none!important;cursor:pointer!important}
.appt-quick-fields{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
.appt-quick-fields label{display:block!important;margin:0!important;color:#214d59!important;font-size:10px!important;font-weight:900!important}
.appt-quick-fields label.full{grid-column:1/-1!important}
.appt-quick-fields .field{width:100%!important;min-height:40px!important;margin:5px 0 0!important;padding:0 10px!important;border:1px solid #cfe1e5!important;border-radius:9px!important;background:#fff!important;color:#173f49!important;font-size:11px!important;font-family:inherit!important;box-sizing:border-box!important;box-shadow:none!important}
.appt-quick-fields .field:focus{outline:none!important;border-color:#55aeba!important;box-shadow:0 0 0 3px rgba(7,140,156,.10)!important}
.appt-address-box{grid-column:1/-1!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;padding:10px!important;border:1px solid #d7e8eb!important;border-radius:11px!important;background:#f8fcfd!important}
.appt-address-title{grid-column:1/-1!important;color:#0b6878!important;font-size:11px!important;font-weight:900!important}
.appt-address-box label.full{grid-column:1/-1!important}
.appt-selected-info{display:grid!important;grid-template-columns:1.2fr 1fr 1fr!important;gap:8px!important;margin:12px 0!important}
.appt-selected-info>div{padding:9px 10px!important;border:1px solid #d8e8ea!important;border-radius:9px!important;background:#f9fcfd!important}
.appt-selected-info small{display:block!important;margin-bottom:3px!important;color:#7a9096!important;font-size:8.5px!important}.appt-selected-info b{display:block!important;color:#154653!important;font-size:10.5px!important;line-height:1.35!important}
.appt-save-btn{width:100%!important;min-height:44px!important;margin:0!important;border:0!important;border-radius:9px!important;background:#078c9c!important;color:#fff!important;font-size:12px!important;font-weight:900!important;box-shadow:none!important;cursor:pointer!important}
.appt-save-note{margin:7px 0 0!important;text-align:center!important;color:#7e9298!important;font-size:9px!important;line-height:1.45!important}
.appt-form-error{margin:9px 0!important;padding:9px 10px!important;border-radius:9px!important;background:#fff0f0!important;color:#9b2222!important;font-size:10px!important;font-weight:800!important}
body.appt-modal-open{overflow:hidden!important}

.appt-success-panel{display:none!important;margin:0!important;padding:12px!important;border:1px solid #cfe9dc!important;border-radius:12px!important;background:#f3fbf7!important;text-align:center!important}
.appt-success-panel.show{display:block!important}.appt-success-icon{width:48px!important;height:48px!important;margin:0 auto 7px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:#168c57!important;color:#fff!important;font-size:26px!important;font-weight:900!important}.appt-success-panel h3{margin:4px 0 10px!important;color:#145b3d!important}.appt-success-table{width:100%!important;border-collapse:collapse!important;background:#fff!important;text-align:left!important}.appt-success-table th,.appt-success-table td{padding:8px 9px!important;border-bottom:1px solid #edf2ef!important;font-size:10px!important}.appt-success-table th{width:34%!important;color:#5a6e65!important}.appt-success-table td{font-weight:800!important;color:#20382e!important}.appt-success-note{margin:9px 0 0!important;font-size:9px!important;color:#667870!important}.appt-success-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin-top:10px!important}.appt-success-actions .btn{min-height:40px!important;margin:0!important;text-decoration:none!important;text-align:center!important;border:0!important;border-radius:8px!important;cursor:pointer!important}.appt-wa-btn{background:#168c57!important}.appt-back-success{background:#29434d!important}

/* Standalone appointment page */
.page-appointment .card.appt{max-width:760px!important;padding:18px!important}.page-appointment .pro-slot-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important}.page-appointment .pro-slot{min-height:38px!important}.page-appointment .appt-chamber-picker{border-color:#d8e9ec!important;background:#f9fdfe!important}.page-appointment .appt-chamber-picker label b{color:#0a6677!important}.page-appointment .appt-chamber-picker select{border-color:#cfe2e6!important}.page-appointment .appt-slot-instruction{border-color:#d7e8eb!important;background:#f8fcfd!important}.page-appointment .appt-slot-instruction b{color:#087b8d!important}

@media(max-width:760px){
  .mk-scheduler .pro-schedule-head{grid-template-columns:1fr!important;padding-left:38px!important}.mk-scheduler .pro-date-button{width:100%!important}
  .mk-scheduler .pro-day-tabs{grid-template-columns:repeat(2,1fr)!important}.mk-scheduler .pro-slot-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .appt-quick-backdrop{align-items:flex-end!important;padding:0!important}.appt-quick-modal{width:100%!important;max-width:none!important;max-height:94dvh!important;border-radius:18px 18px 0 0!important}
  .appt-quick-fields{grid-template-columns:1fr 1fr!important}.appt-address-box{grid-template-columns:1fr 1fr!important}.appt-selected-info{grid-template-columns:1fr 1fr!important}.appt-selected-info>div:first-child{grid-column:1/-1!important}
}
@media(max-width:440px){
  .mk-scheduler .pro-slot-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .appt-quick-fields{grid-template-columns:1fr!important}.appt-address-box{grid-template-columns:1fr!important}.appt-address-title,.appt-address-box label.full{grid-column:auto!important}.appt-selected-info{grid-template-columns:1fr 1fr!important}.appt-success-actions{grid-template-columns:1fr!important}
}


/* Mobile modal fix — 2026-09-24 */
.appt-quick-backdrop.open{display:flex!important;justify-content:center!important;align-items:center!important}
.appt-quick-modal{margin:auto!important;align-self:center!important;box-sizing:border-box!important}
.appt-quick-content,.appt-quick-fields,.appt-address-box,.appt-selected-info{min-width:0!important}
.appt-quick-fields label,.appt-address-box label,.appt-selected-info>div{min-width:0!important}
.appt-selected-info>div b,.appt-selected-info>div small{overflow-wrap:anywhere!important;word-break:break-word!important}
@media(max-width:900px){
  .appt-quick-backdrop{padding:10px!important}
  .appt-quick-modal{width:min(560px,calc(100vw - 20px))!important;max-width:calc(100vw - 20px)!important;max-height:calc(100dvh - 20px)!important;margin:auto!important;border-radius:18px!important}
}
@media(max-width:640px){
  .appt-quick-backdrop.open{align-items:flex-end!important;justify-content:center!important;padding:0!important}
  .appt-quick-modal{width:100vw!important;max-width:100vw!important;min-width:0!important;max-height:94dvh!important;margin:0!important;border-radius:18px 18px 0 0!important}
  .appt-quick-content{padding:12px 14px 16px!important}
  .appt-selected-info{grid-template-columns:1fr!important}
  .appt-selected-info>div:first-child{grid-column:auto!important}
}
