@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,300&display=swap');

/* ═══════════════════════════════════════════════════
   MINDBOOKER — Design System
   Refined luxury booking experience
   ═══════════════════════════════════════════════════ */

:root {
  --mb-accent:      #7c5cbf;
  --mb-accent-dark: #5e3fa3;
  --mb-accent-soft: rgba(124,92,191,0.08);
  --mb-accent-mid:  rgba(124,92,191,0.15);
  --mb-accent-glow: rgba(124,92,191,0.25);
  --mb-ink:         #111018;
  --mb-ink2:        #2d2a3e;
  --mb-muted:       #7b7894;
  --mb-border:      #eae8f2;
  --mb-bg:          #f8f7fc;
  --mb-white:       #ffffff;
  --mb-green:       #16a34a;
  --mb-red:         #dc2626;
  --mb-font:        'DM Sans', -apple-system, sans-serif;
  --mb-font-display: 'Outfit', sans-serif;
  --mb-r:           14px;
  --mb-r-lg:        22px;
  --mb-r-xl:        28px;
  --mb-shadow-sm:   0 2px 8px rgba(17,16,24,0.06);
  --mb-shadow-md:   0 8px 32px rgba(17,16,24,0.10);
  --mb-shadow-lg:   0 24px 64px rgba(17,16,24,0.14);
}

/* ── Hard reset ── */
#mb-overlay *, .mb-inline-widget *, .mb-cal-widget *, .mb-open-btn {
  box-sizing: border-box !important;
  font-family: var(--mb-font) !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* ── Force colors (override theme) ── */
#mb-overlay p, #mb-overlay span, #mb-overlay div,
#mb-overlay h1, #mb-overlay h2, #mb-overlay h3,
#mb-overlay label, #mb-overlay a,
.mb-cal-widget p, .mb-cal-widget span, .mb-cal-widget div,
.mb-cal-widget h1, .mb-cal-widget h2, .mb-cal-widget h3,
.mb-cal-widget label, .mb-cal-widget a,
.mb-inline-widget p, .mb-inline-widget span,
.mb-inline-widget div, .mb-inline-widget label {
  color: #111018 !important;
}

/* ═══════════════════════════════════════════════════
   OVERLAY
   ═══════════════════════════════════════════════════ */
#mb-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  background: rgba(8,6,20,.88) !important;
  backdrop-filter: blur(24px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(180%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .28s cubic-bezier(.4,0,.2,1) !important;
}
#mb-overlay.open {
  opacity: 1 !important;
  pointer-events: all !important;
}

/* Shell */
.mb-modal-shell {
  background: #ffffff !important;
  border-radius: var(--mb-r-xl) !important;
  width: 100% !important;
  max-width: 900px !important;
  max-height: 92vh !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  box-shadow: 0 40px 120px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.08) !important;
  transform: translateY(32px) scale(.96) !important;
  transition: transform .38s cubic-bezier(.34,1.3,.64,1) !important;
}
#mb-overlay.open .mb-modal-shell {
  transform: none !important;
}

/* Header */
.mb-modal-head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 16px 24px !important;
  border-bottom: 1px solid var(--mb-border) !important;
  background: #ffffff !important;
  flex-shrink: 0 !important;
  flex-wrap: wrap !important;
}

/* Coach */
.mb-coach-bar {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
}
.mb-coach-avatar {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--mb-accent) !important;
}
.mb-coach-avatar-placeholder {
  background: linear-gradient(135deg, var(--mb-accent), var(--mb-accent-dark)) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  font-family: var(--mb-font-display) !important;
}
.mb-coach-name {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #111018 !important;
  line-height: 1.2 !important;
  font-family: var(--mb-font-display) !important;
  letter-spacing: -.2px !important;
}
.mb-coach-title {
  font-size: 11px !important;
  color: var(--mb-muted) !important;
  margin-top: 2px !important;
  font-weight: 400 !important;
}

/* Progress */
.mb-progress {
  display: flex !important;
  align-items: center !important;
  flex: 1 !important;
  justify-content: center !important;
}
.mb-progress-step {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 10px !important;
  border-radius: 30px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--mb-muted) !important;
  transition: all .22s !important;
  background: transparent !important;
  border: none !important;
  white-space: nowrap !important;
}
.mb-progress-step.active {
  background: var(--mb-accent-soft) !important;
  color: var(--mb-accent) !important;
}
.mb-progress-step.done { color: var(--mb-green) !important; }
.mb-ps-num {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  background: var(--mb-border) !important;
  color: var(--mb-muted) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  flex-shrink: 0 !important;
  transition: all .22s !important;
}
.mb-progress-step.active .mb-ps-num {
  background: var(--mb-accent) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px var(--mb-accent-glow) !important;
}
.mb-progress-step.done .mb-ps-num {
  background: var(--mb-green) !important;
  color: #fff !important;
}
.mb-progress-line {
  width: 20px !important;
  height: 1px !important;
  background: var(--mb-border) !important;
  flex-shrink: 0 !important;
}

/* Close */
.mb-ov-close, .mb-close {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--mb-border) !important;
  background: transparent !important;
  cursor: pointer !important;
  font-size: 13px !important;
  color: var(--mb-muted) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all .18s !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}
.mb-ov-close:hover, .mb-close:hover {
  background: #fef2f2 !important;
  border-color: #fca5a5 !important;
  color: var(--mb-red) !important;
  transform: rotate(90deg) !important;
}

/* Body */
.mb-modal-body {
  flex: 1 !important;
  overflow-y: auto !important;
  background: #ffffff !important;
  scroll-behavior: smooth !important;
}
.mb-modal-body::-webkit-scrollbar { width: 4px !important; }
.mb-modal-body::-webkit-scrollbar-track { background: transparent !important; }
.mb-modal-body::-webkit-scrollbar-thumb {
  background: var(--mb-border) !important;
  border-radius: 4px !important;
}

/* Panels */
.mb-panel {
  display: none !important;
  padding: 28px 28px 20px !important;
  animation: mbFadeIn .24s ease !important;
  background: #ffffff !important;
}
.mb-panel.active { display: block !important; }
@keyframes mbFadeIn {
  from { opacity: 0; transform: translateX(8px); }
  to   { opacity: 1; transform: none; }
}
.mb-panel-title {
  font-size: 22px !important;
  font-weight: 800 !important;
  color: #111018 !important;
  margin: 0 0 4px !important;
  letter-spacing: -.5px !important;
  font-family: var(--mb-font-display) !important;
}
.mb-panel-sub {
  font-size: 14px !important;
  color: var(--mb-muted) !important;
  margin: 0 0 22px !important;
  font-weight: 400 !important;
}

/* ── Services ── */
.mb-services-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
  gap: 12px !important;
}
.mb-service-card {
  border: 2px solid var(--mb-border) !important;
  border-radius: var(--mb-r-lg) !important;
  padding: 20px !important;
  cursor: pointer !important;
  transition: all .22s cubic-bezier(.4,0,.2,1) !important;
  position: relative !important;
  background: #ffffff !important;
  overflow: hidden !important;
}
.mb-service-card::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, var(--mb-accent), var(--mb-accent-dark)) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .25s !important;
}
.mb-service-card:hover {
  border-color: var(--mb-accent) !important;
  box-shadow: 0 8px 28px var(--mb-accent-glow) !important;
  transform: translateY(-3px) !important;
}
.mb-service-card:hover::before,
.mb-service-card.selected::before {
  transform: scaleX(1) !important;
}
.mb-service-card.selected {
  border-color: var(--mb-accent) !important;
  background: var(--mb-accent-soft) !important;
  box-shadow: 0 4px 20px var(--mb-accent-glow) !important;
}
.mb-service-check {
  position: absolute !important;
  top: 14px !important; right: 14px !important;
  width: 22px !important; height: 22px !important;
  border-radius: 50% !important;
  background: var(--mb-accent) !important;
  color: #fff !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  box-shadow: 0 2px 8px var(--mb-accent-glow) !important;
}
.mb-service-card.selected .mb-service-check { display: flex !important; }
.mb-service-name {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #111018 !important;
  margin: 0 26px 6px 0 !important;
  line-height: 1.3 !important;
  font-family: var(--mb-font-display) !important;
}
.mb-service-desc {
  font-size: 12px !important;
  color: var(--mb-muted) !important;
  line-height: 1.6 !important;
  margin: 0 0 14px !important;
}
.mb-service-footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--mb-border) !important;
}
.mb-service-duration {
  font-size: 11px !important;
  color: var(--mb-muted) !important;
  background: var(--mb-bg) !important;
  padding: 3px 10px !important;
  border-radius: 20px !important;
  font-weight: 500 !important;
}
.mb-service-price {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: var(--mb-accent) !important;
  font-family: var(--mb-font-display) !important;
  letter-spacing: -.4px !important;
}
.mb-service-price small { font-size: 12px !important; opacity: .7 !important; }

/* ── Calendar ── */
.mb-calendar-wrap {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 16px !important;
}
.mb-cal-box {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mb-border) !important;
  border-radius: var(--mb-r-lg) !important;
  padding: 18px !important;
}
.mb-slots-box {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mb-border) !important;
  border-radius: var(--mb-r-lg) !important;
  padding: 18px !important;
}
.mb-cal-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
}
.mb-cal-prev, .mb-cal-next {
  width: 32px !important; height: 32px !important;
  border-radius: 10px !important;
  border: 1.5px solid var(--mb-border) !important;
  background: #ffffff !important;
  cursor: pointer !important;
  font-size: 17px !important;
  color: #111018 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all .18s !important;
  padding: 0 !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-cal-prev:hover, .mb-cal-next:hover {
  background: var(--mb-accent) !important;
  border-color: var(--mb-accent) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
  transform: scale(1.05) !important;
}
.mb-cal-month-label {
  font-size: 14px !important;
  font-weight: 800 !important;
  color: #111018 !important;
  font-family: var(--mb-font-display) !important;
  letter-spacing: -.3px !important;
}
.mb-cal-header {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  margin-bottom: 6px !important;
}
.mb-cal-header span {
  text-align: center !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  color: var(--mb-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .6px !important;
  padding: 4px 0 !important;
  display: block !important;
}
.mb-cal-days {
  display: grid !important;
  grid-template-columns: repeat(7, 1fr) !important;
  gap: 3px !important;
}
.mb-cal-day {
  aspect-ratio: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 10px !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #ccc !important;
  cursor: default !important;
  transition: all .15s !important;
  background: transparent !important;
  border: none !important;
  position: relative !important;
}
.mb-cal-day.today {
  font-weight: 800 !important;
  color: var(--mb-accent) !important;
}
.mb-cal-day.today::after {
  content: '' !important;
  position: absolute !important;
  bottom: 3px !important; left: 50% !important;
  transform: translateX(-50%) !important;
  width: 4px !important; height: 4px !important;
  border-radius: 50% !important;
  background: var(--mb-accent) !important;
}
.mb-cal-day.available {
  color: #111018 !important;
  cursor: pointer !important;
  font-weight: 600 !important;
  background: #ffffff !important;
  border: 1.5px solid var(--mb-border) !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-cal-day.available:hover {
  background: var(--mb-accent) !important;
  border-color: var(--mb-accent) !important;
  color: #fff !important;
  transform: scale(1.12) !important;
  z-index: 1 !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-cal-day.selected {
  background: var(--mb-accent) !important;
  border-color: var(--mb-accent) !important;
  color: #fff !important;
  font-weight: 700 !important;
  transform: scale(1.08) !important;
  z-index: 1 !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-cal-day.selected::after { display: none !important; }
.mb-cal-day.past { opacity: .18 !important; pointer-events: none !important; }

.mb-slots-title {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--mb-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: .6px !important;
  margin: 0 0 12px !important;
}
.mb-slots-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 7px !important;
}
.mb-slot-btn {
  padding: 10px 4px !important;
  border: 1.5px solid var(--mb-border) !important;
  border-radius: 11px !important;
  background: #ffffff !important;
  cursor: pointer !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #111018 !important;
  text-align: center !important;
  transition: all .18s !important;
  display: block !important;
  width: 100% !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-slot-btn:hover {
  border-color: var(--mb-accent) !important;
  background: var(--mb-accent-soft) !important;
  color: var(--mb-accent) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 4px 12px var(--mb-accent-glow) !important;
}
.mb-slot-btn.selected {
  background: var(--mb-accent) !important;
  border-color: var(--mb-accent) !important;
  color: #fff !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
  transform: translateY(-1px) !important;
}
.mb-slots-container { min-height: 80px !important; }
.mb-slots-placeholder {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 28px 12px !important;
  color: var(--mb-muted) !important;
  font-size: 13px !important;
  text-align: center !important;
}
.ph-icon { font-size: 24px !important; opacity: .35 !important; }

/* ── Form ── */
.mb-sum-bar {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin: 0 0 22px !important;
  padding: 12px 16px !important;
  background: linear-gradient(135deg, var(--mb-accent-soft), rgba(124,92,191,0.04)) !important;
  border-radius: var(--mb-r) !important;
  border: 1px solid var(--mb-accent-mid) !important;
}
.mb-sum-item {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--mb-accent) !important;
  display: flex !important;
  gap: 5px !important;
  align-items: center !important;
  background: rgba(255,255,255,.8) !important;
  padding: 4px 11px !important;
  border-radius: 20px !important;
  backdrop-filter: blur(8px) !important;
}
.mb-sum-item span { color: var(--mb-ink2) !important; font-weight: 500 !important; }
.mb-form-fields { display: flex !important; flex-direction: column !important; gap: 14px !important; }
.mb-field { display: flex !important; flex-direction: column !important; gap: 5px !important; }
.mb-field label {
  font-size: 11px !important;
  font-weight: 700 !important;
  color: var(--mb-ink2) !important;
  text-transform: uppercase !important;
  letter-spacing: .5px !important;
  margin: 0 !important;
}
.mb-inp {
  width: 100% !important;
  padding: 11px 15px !important;
  border: 1.5px solid var(--mb-border) !important;
  border-radius: var(--mb-r) !important;
  font-size: 14px !important;
  color: #111018 !important;
  background: #ffffff !important;
  outline: none !important;
  transition: border .18s, box-shadow .18s !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-inp:focus {
  border-color: var(--mb-accent) !important;
  box-shadow: 0 0 0 4px var(--mb-accent-soft), var(--mb-shadow-sm) !important;
}
.mb-inp.error { border-color: var(--mb-red) !important; box-shadow: 0 0 0 4px rgba(220,38,38,.08) !important; }
.mb-inp::placeholder { color: #c0bcd4 !important; }
textarea.mb-inp { resize: vertical !important; min-height: 80px !important; }
.mb-gdpr-label {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  font-size: 12px !important;
  color: var(--mb-muted) !important;
  cursor: pointer !important;
  line-height: 1.7 !important;
  padding: 14px 16px !important;
  background: var(--mb-bg) !important;
  border-radius: var(--mb-r) !important;
  border: 1px solid var(--mb-border) !important;
}
.mb-gdpr-label input[type=checkbox] {
  width: 15px !important; height: 15px !important;
  flex-shrink: 0 !important; margin-top: 2px !important;
  accent-color: var(--mb-accent) !important;
  cursor: pointer !important;
}
.mb-gdpr-label a { color: var(--mb-accent) !important; text-decoration: underline !important; font-weight: 500 !important; }

/* Price card */
.mb-price-card {
  background: linear-gradient(135deg, #111018 0%, #1e1a2e 100%) !important;
  border-radius: var(--mb-r-lg) !important;
  padding: 24px !important;
  position: relative !important;
  overflow: hidden !important;
}
.mb-price-card::before {
  content: '' !important;
  position: absolute !important;
  top: -40px !important; right: -40px !important;
  width: 180px !important; height: 180px !important;
  background: radial-gradient(circle, rgba(124,92,191,.3), transparent 70%) !important;
  pointer-events: none !important;
}
.mb-price-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 10px 0 !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.45) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}
.mb-price-row span:last-child { color: rgba(255,255,255,.85) !important; font-weight: 500 !important; }
.mb-price-row:last-child {
  border: none !important;
  font-weight: 700 !important;
  font-size: 16px !important;
  color: rgba(255,255,255,.95) !important;
  padding-top: 14px !important;
}
.price-val {
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #c4a8f0 !important;
  letter-spacing: -.8px !important;
  font-family: var(--mb-font-display) !important;
}

/* Footer */
.mb-widget-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 24px !important;
  border-top: 1px solid var(--mb-border) !important;
  flex-shrink: 0 !important;
  background: #ffffff !important;
}
.mb-widget-next {
  padding: 11px 28px !important;
  background: var(--mb-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all .2s !important;
  letter-spacing: .1px !important;
  pointer-events: auto !important;
}
.mb-widget-next:hover:not(.dim) {
  background: var(--mb-accent-dark) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px var(--mb-accent-glow) !important;
}
.mb-widget-next.dim {
  opacity: .35 !important;
  cursor: not-allowed !important;
  transform: none !important;
  pointer-events: none !important;
}
.mb-widget-back {
  padding: 11px 16px !important;
  background: transparent !important;
  color: var(--mb-muted) !important;
  border: none !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  border-radius: 10px !important;
  transition: all .16s !important;
}
.mb-widget-back:hover { color: #111018 !important; background: var(--mb-bg) !important; }
.mb-error-bar {
  background: #fef2f2 !important;
  color: var(--mb-red) !important;
  padding: 10px 24px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border-top: 1px solid #fecaca !important;
}

/* Success */
.mb-success-wrap { text-align: center !important; padding: 32px 24px 24px !important; }
.mb-success-avatar {
  width: 80px !important; height: 80px !important;
  border-radius: 50% !important;
  background-size: cover !important;
  background-position: center !important;
  margin: 0 auto 18px !important;
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--mb-accent) !important;
}
.mb-success-icon {
  font-size: 64px !important;
  margin-bottom: 16px !important;
  display: block !important;
  animation: mbPop .5s cubic-bezier(.34,1.56,.64,1) !important;
}
@keyframes mbPop { from { transform: scale(0) rotate(-10deg); } to { transform: scale(1); } }
.mb-success-wrap h2 {
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #111018 !important;
  margin: 0 0 8px !important;
  letter-spacing: -.6px !important;
  font-family: var(--mb-font-display) !important;
}
.mb-success-wrap > p { font-size: 14px !important; color: var(--mb-muted) !important; margin: 0 0 24px !important; }
.mb-success-details {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mb-border) !important;
  border-radius: var(--mb-r-lg) !important;
  padding: 18px !important;
  margin: 0 auto !important;
  max-width: 380px !important;
  text-align: left !important;
}
.mb-success-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 8px 0 !important;
  font-size: 13px !important;
  border-bottom: 1px solid var(--mb-border) !important;
}
.mb-success-row:last-child { border: none !important; }
.mb-success-row .label { color: var(--mb-muted) !important; font-weight: 400 !important; }
.mb-success-row .val { font-weight: 700 !important; color: #111018 !important; }

/* ══════════════════════════════════════════════
   OPEN BUTTON
   ══════════════════════════════════════════════ */
.mb-open-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 28px !important;
  background: var(--mb-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  text-decoration: none !important;
  letter-spacing: .1px !important;
  position: relative !important;
  overflow: hidden !important;
  box-shadow: 0 4px 20px var(--mb-accent-glow) !important;
  transition: transform .24s cubic-bezier(.34,1.4,.64,1), box-shadow .24s, background .18s !important;
  font-family: var(--mb-font-display) !important;
}
.mb-open-btn::before {
  content: '' !important;
  position: absolute !important;
  top: 0 !important; left: -100% !important;
  width: 60% !important; height: 100% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.25), transparent) !important;
  transform: skewX(-18deg) !important;
  animation: mbShimmer 3.5s ease-in-out infinite !important;
  pointer-events: none !important;
}
.mb-open-btn::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 100px !important;
  animation: mbPulse 2.8s ease-out infinite !important;
  pointer-events: none !important;
}
@keyframes mbShimmer {
  0%   { left: -100%; }
  35%  { left: 120%; }
  100% { left: 120%; }
}
@keyframes mbPulse {
  0%   { box-shadow: 0 0 0 0 var(--mb-accent); opacity: .5; }
  70%  { box-shadow: 0 0 0 16px transparent; opacity: 0; }
  100% { box-shadow: 0 0 0 0 transparent; opacity: 0; }
}
.mb-open-btn:hover {
  background: var(--mb-accent-dark) !important;
  transform: translateY(-3px) scale(1.03) !important;
  box-shadow: 0 12px 32px var(--mb-accent-glow) !important;
  color: #fff !important;
  text-decoration: none !important;
}
.mb-open-btn:active {
  transform: translateY(0) scale(.97) !important;
}

/* ── Spinner ── */
.mb-spinner {
  width: 26px !important; height: 26px !important;
  border: 2.5px solid var(--mb-border) !important;
  border-top-color: var(--mb-accent) !important;
  border-radius: 50% !important;
  animation: mbSpin .65s linear infinite !important;
  margin: 24px auto !important;
  display: block !important;
}
@keyframes mbSpin { to { transform: rotate(360deg); } }

/* ── CTA ── */
.mb-cta-btn {
  padding: 11px 26px !important;
  background: var(--mb-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all .2s !important;
  pointer-events: auto !important;
}
.mb-cta-btn:hover:not(.dim) {
  background: var(--mb-accent-dark) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 20px var(--mb-accent-glow) !important;
}
.mb-cta-btn.dim { opacity: .38 !important; cursor: not-allowed !important; pointer-events: none !important; }

/* ══════════════════════════════════════════════
   INLINE WIDGET
   ══════════════════════════════════════════════ */
.mb-inline-widget {
  background: #ffffff !important;
  border: 1px solid var(--mb-border) !important;
  border-radius: var(--mb-r-xl) !important;
  box-shadow: var(--mb-shadow-lg) !important;
  overflow: hidden !important;
}
.mb-inline-steps {
  padding: 16px 22px !important;
  border-bottom: 1px solid var(--mb-border) !important;
  background: #ffffff !important;
}
.mb-inline-body .mb-panel { padding: 22px !important; }
.mb-inline-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 14px 22px !important;
  border-top: 1px solid var(--mb-border) !important;
  background: #ffffff !important;
}

/* ══════════════════════════════════════════════
   CALENDAR WIDGET [mindbooker_calendar]
   ══════════════════════════════════════════════ */
.mb-cal-widget {
  background: #ffffff !important;
  border-radius: var(--mb-r-xl) !important;
  box-shadow: var(--mb-shadow-lg) !important;
  overflow: visible !important;
  max-width: 820px !important;
  border: 1px solid var(--mb-border) !important;
}
.mb-calw-coach {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 26px 28px 0 !important;
}
.mb-calw-avatar {
  width: 60px !important; height: 60px !important;
  border-radius: 50% !important;
  background-size: cover !important;
  background-position: center !important;
  flex-shrink: 0 !important;
  box-shadow: 0 0 0 3px #fff, 0 0 0 5px var(--mb-accent) !important;
}
.mb-calw-avatar-ph {
  background: linear-gradient(135deg, var(--mb-accent), var(--mb-accent-dark)) !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  color: #fff !important; font-size: 24px !important; font-weight: 800 !important;
  font-family: var(--mb-font-display) !important;
}
.mb-calw-name {
  font-size: 18px !important;
  font-weight: 800 !important;
  color: #111018 !important;
  letter-spacing: -.4px !important;
  font-family: var(--mb-font-display) !important;
}
.mb-calw-title { font-size: 12px !important; color: var(--mb-muted) !important; margin-top: 3px !important; }
.mb-calw-services { padding: 20px 28px 0 !important; }
.mb-calw-services-label {
  font-size: 10px !important; font-weight: 800 !important; color: var(--mb-muted) !important;
  text-transform: uppercase !important; letter-spacing: .8px !important; margin-bottom: 12px !important;
}
.mb-calw-services-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 10px !important;
}
.mb-calw-svc-btn {
  display: block !important; width: 100% !important; text-align: left !important;
  padding: 14px 18px !important; border: 2px solid var(--mb-border) !important;
  border-radius: var(--mb-r-lg) !important; background: #fff !important; cursor: pointer !important;
  transition: all .2s !important; line-height: 1.5 !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-calw-svc-btn:hover {
  border-color: var(--mb-accent) !important;
  box-shadow: 0 6px 22px var(--mb-accent-glow) !important;
  transform: translateY(-2px) !important;
}
.mb-calw-svc-btn.active {
  border-color: var(--mb-accent) !important;
  background: var(--mb-accent-soft) !important;
}
.mb-calw-svc-name { font-size: 14px !important; font-weight: 700 !important; color: #111018 !important; }
.mb-calw-svc-btn.active .mb-calw-svc-name { color: var(--mb-accent) !important; }
.mb-calw-svc-meta { display: flex !important; gap: 6px !important; margin-top: 6px !important; flex-wrap: wrap !important; }
.mb-calw-svc-price { font-size: 12px !important; font-weight: 600 !important; color: var(--mb-muted) !important; }
.mb-calw-svc-addr { font-size: 11px !important; color: #16a34a !important; margin-top: 4px !important; display: flex !important; gap: 3px !important; }
.mb-calw-body {
  display: grid !important;
  grid-template-columns: 1.1fr 1fr !important;
  gap: 0 !important;
  padding: 24px 28px !important;
}
.mb-calw-left { padding-right: 24px !important; border-right: 1px solid var(--mb-border) !important; }
.mb-calw-right { padding-left: 24px !important; }
.mb-calw-month-nav {
  display: flex !important; align-items: center !important;
  justify-content: space-between !important; margin-bottom: 18px !important;
}
.mb-calw-prev, .mb-calw-next {
  width: 36px !important; height: 36px !important; border-radius: 11px !important;
  border: 1.5px solid var(--mb-border) !important; background: #fff !important;
  cursor: pointer !important; font-size: 18px !important; color: #111018 !important;
  display: flex !important; align-items: center !important; justify-content: center !important;
  transition: all .18s !important; padding: 0 !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-calw-prev:hover, .mb-calw-next:hover {
  background: var(--mb-accent) !important; border-color: var(--mb-accent) !important;
  color: #fff !important; box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-calw-month-label {
  font-size: 17px !important; font-weight: 800 !important; color: #111018 !important;
  letter-spacing: -.4px !important; font-family: var(--mb-font-display) !important;
}
.mb-calw-weekdays { display: grid !important; grid-template-columns: repeat(7,1fr) !important; margin-bottom: 8px !important; }
.mb-calw-weekdays span {
  text-align: center !important; font-size: 10px !important; font-weight: 700 !important;
  color: var(--mb-muted) !important; text-transform: uppercase !important; letter-spacing: .6px !important; padding: 4px 0 !important;
}
.mb-calw-days { display: grid !important; grid-template-columns: repeat(7,1fr) !important; gap: 4px !important; }
.mb-calw-day {
  aspect-ratio: 1 !important; display: flex !important; align-items: center !important; justify-content: center !important;
  border-radius: 10px !important; font-size: 13px !important; font-weight: 400 !important;
  color: #d0cce0 !important; cursor: default !important; transition: all .15s !important;
  background: transparent !important; border: none !important; position: relative !important;
}
.mb-calw-day.today { font-weight: 800 !important; color: var(--mb-accent) !important; }
.mb-calw-day.today::after {
  content: '' !important; position: absolute !important; bottom: 3px !important; left: 50% !important;
  transform: translateX(-50%) !important; width: 4px !important; height: 4px !important;
  border-radius: 50% !important; background: var(--mb-accent) !important;
}
.mb-calw-day.avail {
  color: #111018 !important; cursor: pointer !important; font-weight: 700 !important;
  background: var(--mb-bg) !important; border: 1.5px solid var(--mb-border) !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-calw-day.avail:hover {
  background: var(--mb-accent) !important; border-color: var(--mb-accent) !important;
  color: #fff !important; transform: scale(1.12) !important; z-index: 1 !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-calw-day.selected {
  background: var(--mb-accent) !important; border-color: var(--mb-accent) !important;
  color: #fff !important; font-weight: 800 !important; transform: scale(1.1) !important;
  z-index: 1 !important; box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-calw-day.selected::after { display: none !important; }
.mb-calw-day.past { opacity: .12 !important; pointer-events: none !important; }
.mb-calw-day.loading { animation: mbPulseLoad .9s ease infinite !important; background: var(--mb-bg) !important; border: none !important; color: transparent !important; }
@keyframes mbPulseLoad { 0%,100%{opacity:.3} 50%{opacity:.7} }
.mb-calw-slots-head {
  font-size: 11px !important; font-weight: 700 !important; color: var(--mb-muted) !important;
  text-transform: uppercase !important; letter-spacing: .7px !important; margin-bottom: 14px !important;
}
.mb-calw-slots { min-height: 200px !important; }
.mb-calw-slots-grid { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 8px !important; }
.mb-calw-slot {
  padding: 12px 4px !important; border: 1.5px solid var(--mb-border) !important;
  border-radius: 12px !important; background: #fff !important; cursor: pointer !important;
  font-size: 13px !important; font-weight: 700 !important; color: #111018 !important;
  text-align: center !important; transition: all .18s !important; display: block !important; width: 100% !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-calw-slot:hover {
  border-color: var(--mb-accent) !important; background: var(--mb-accent-soft) !important;
  color: var(--mb-accent) !important; transform: translateY(-2px) !important;
  box-shadow: 0 4px 14px var(--mb-accent-glow) !important;
}
.mb-calw-slot.selected {
  background: var(--mb-accent) !important; border-color: var(--mb-accent) !important;
  color: #fff !important; box-shadow: 0 4px 14px var(--mb-accent-glow) !important; transform: translateY(-1px) !important;
}
.mb-calw-form { padding: 0 28px 28px !important; border-top: 1px solid var(--mb-border) !important; margin-top: 4px !important; }
.mb-calw-form-header {
  display: flex !important; align-items: center !important; justify-content: space-between !important;
  gap: 14px !important; padding: 20px 0 18px !important;
}
.mb-calw-selected-info {
  flex: 1 !important; background: var(--mb-accent-soft) !important;
  border-left: 4px solid var(--mb-accent) !important; border-radius: 12px !important;
  padding: 12px 16px !important; min-width: 0 !important;
}
.mb-calw-selected-info-title {
  font-size: 14px !important; font-weight: 800 !important; color: var(--mb-accent) !important;
  white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important;
  font-family: var(--mb-font-display) !important;
}
.mb-calw-selected-info-sub {
  font-size: 12px !important; font-weight: 500 !important; color: var(--mb-muted) !important;
  margin-top: 3px !important; display: flex !important; gap: 12px !important; flex-wrap: wrap !important;
}
.mb-calw-form-back {
  flex-shrink: 0 !important; font-size: 12px !important; font-weight: 700 !important;
  color: var(--mb-muted) !important; background: #fff !important; border: 1.5px solid var(--mb-border) !important;
  cursor: pointer !important; padding: 10px 16px !important; border-radius: 10px !important;
  transition: all .18s !important; white-space: nowrap !important;
  box-shadow: var(--mb-shadow-sm) !important;
}
.mb-calw-form-back:hover { color: #111018 !important; border-color: #111018 !important; }
.mb-calw-error {
  background: #fff1f1 !important; color: #dc2626 !important; padding: 11px 16px !important;
  border-radius: 10px !important; font-size: 12px !important; font-weight: 600 !important;
  margin-top: 12px !important; border-left: 3px solid #dc2626 !important;
}

/* ══════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════ */
@media (max-width: 768px) {
  .mb-modal-shell  { max-width: 100% !important; border-radius: var(--mb-r-lg) !important; }
  .mb-modal-head   { padding: 12px 18px !important; }
  .mb-panel        { padding: 20px 18px !important; }
  .mb-widget-footer { padding: 12px 18px !important; }
  .mb-services-grid { grid-template-columns: 1fr 1fr !important; }
  .mb-calendar-wrap { grid-template-columns: 1fr !important; gap: 12px !important; }
  .mb-calw-body    { padding: 16px 18px !important; }
  .mb-calw-form    { padding: 0 18px 18px !important; }
  .mb-calw-coach   { padding: 18px 18px 0 !important; }
}

@media (max-width: 560px) {
  #mb-overlay { padding: 0 !important; align-items: flex-end !important; }
  .mb-modal-shell {
    border-radius: 24px 24px 0 0 !important;
    max-height: 94vh !important;
    box-shadow: 0 -24px 80px rgba(0,0,0,.5) !important;
  }
  .mb-modal-head {
    position: relative !important;
    padding-top: 22px !important;
  }
  .mb-modal-head::before {
    content: '' !important;
    position: absolute !important;
    top: 9px !important; left: 50% !important;
    transform: translateX(-50%) !important;
    width: 40px !important; height: 4px !important;
    background: var(--mb-border) !important;
    border-radius: 2px !important;
  }
  .mb-services-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .mb-slots-grid { grid-template-columns: repeat(3,1fr) !important; }
  .mb-slot-btn { padding: 10px 2px !important; font-size: 12px !important; }
  .mb-ps-lbl { display: none !important; }
  .mb-progress-step { padding: 4px 7px !important; }
  .mb-progress-line { width: 12px !important; }
  .mb-panel { padding: 16px !important; }
  .mb-panel-title { font-size: 20px !important; }
  .mb-form-fields > div[style*="grid"] { display: flex !important; flex-direction: column !important; gap: 12px !important; }
  .mb-widget-footer { padding: 12px 16px !important; }
  .mb-widget-next   { padding: 12px 22px !important; font-size: 13px !important; }
  .mb-open-btn { width: 100% !important; justify-content: center !important; border-radius: 16px !important; }
  .mb-calw-body { grid-template-columns: 1fr !important; padding: 14px 16px !important; }
  .mb-calw-left { padding-right: 0 !important; border-right: none !important; border-bottom: 1px solid var(--mb-border) !important; padding-bottom: 18px !important; }
  .mb-calw-right { padding-left: 0 !important; margin-top: 16px !important; }
  .mb-calw-coach { padding: 16px 16px 0 !important; }
  .mb-calw-avatar { width: 48px !important; height: 48px !important; }
  .mb-calw-slots-grid { grid-template-columns: repeat(4,1fr) !important; }
  .mb-calw-month-label { font-size: 15px !important; }
  .mb-calw-form { padding: 0 16px 18px !important; }
  .mb-calw-form-header { flex-direction: column !important; align-items: flex-start !important; }
  .mb-calw-selected-info { width: 100% !important; }
  .mb-coach-bar { display: none !important; }
}

@media (max-width: 380px) {
  .mb-calw-slots-grid { grid-template-columns: repeat(3,1fr) !important; }
  .mb-panel-title { font-size: 18px !important; }
  .mb-progress-step { display: none !important; }
  .mb-progress-step.active { display: flex !important; }
  .mb-progress-line { display: none !important; }
}

@media (max-width: 560px) {
  .mb-inp, .mb-calw-name, .mb-calw-email,
  .mb-calw-phone, .mb-calw-notes,
  .mb-f-name, .mb-f-email, .mb-f-phone, .mb-f-notes {
    font-size: 16px !important;
  }
}
