/* Matrix Insight — booking calendar */

.mi-booking{margin:0 auto}
.mi-booking-intro{color:var(--mi-muted);font-size:17px;max-width:720px;margin:0 0 28px}

.mi-booking-grid{
  display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.85fr) minmax(0,1.1fr);
  gap:20px;align-items:start
}
.mi-booking-panel{
  background:#fff;border:1px solid var(--mi-line);border-radius:var(--mi-radius);
  padding:22px;box-shadow:var(--mi-shadow-sm)
}
.mi-booking-step{
  display:flex;align-items:center;gap:10px;font-weight:800;color:var(--mi-navy);
  font-size:16px;margin-bottom:18px
}
.mi-booking-step span{
  width:28px;height:28px;flex:0 0 28px;border-radius:50%;background:var(--mi-blue);
  color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px
}

/* ---- Calendar ---- */
.mi-cal-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.mi-cal-title{font-size:16px;color:var(--mi-navy);font-weight:800}
.mi-cal-nav{
  width:36px;height:36px;border:1px solid var(--mi-line);border-radius:9px;background:#fff;
  color:var(--mi-navy);font-size:20px;line-height:1;cursor:pointer
}
.mi-cal-nav:hover:not(:disabled){border-color:var(--mi-blue);color:var(--mi-blue)}
.mi-cal-nav:disabled{opacity:.35;cursor:not-allowed}

.mi-cal-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px}
.mi-cal-weekdays span{
  text-align:center;font-size:11px;font-weight:800;color:var(--mi-muted);
  text-transform:uppercase;letter-spacing:.06em;padding:4px 0
}
.mi-cal-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;min-height:230px}
.mi-cal-loading{grid-column:1/-1;text-align:center;color:var(--mi-muted);padding:40px 0;font-size:14px}
.mi-cal-empty{display:block}
.mi-cal-day{
  aspect-ratio:1;min-height:38px;border:1px solid transparent;border-radius:9px;
  background:#f4f8fd;color:var(--mi-navy);font-weight:700;font-size:14px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:background .16s ease,color .16s ease,transform .16s ease
}
.mi-cal-day.is-free{background:#e7f1ff;color:var(--mi-blue);border-color:#cfe2fb}
.mi-cal-day.is-free:hover{background:var(--mi-blue);color:#fff;transform:translateY(-1px)}
.mi-cal-day.is-selected{background:var(--mi-blue);color:#fff;border-color:var(--mi-blue);box-shadow:0 4px 12px rgba(18,104,232,.35)}
.mi-cal-day.is-disabled{background:transparent;color:#b9c6d6;cursor:not-allowed;border-color:transparent}
.mi-cal-day.is-today{box-shadow:inset 0 0 0 2px #b9d4fb}
.mi-cal-day.is-today.is-selected{box-shadow:0 4px 12px rgba(18,104,232,.35)}

.mi-cal-legend{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  margin:16px 0 0;font-size:12px;color:var(--mi-muted)
}
.mi-legend-dot{width:11px;height:11px;border-radius:4px;display:inline-block}
.mi-legend-dot.is-free{background:#e7f1ff;border:1px solid #cfe2fb;margin-left:2px}
.mi-legend-dot.is-busy{background:#f1f4f8;border:1px solid #e2e9f1;margin-left:14px}

/* ---- Time slots ---- */
.mi-booking-daylabel{font-size:14px;font-weight:700;color:var(--mi-navy);margin:0 0 14px}
.mi-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:330px;overflow-y:auto}
.mi-slots-msg{grid-column:1/-1;color:var(--mi-muted);font-size:14px;margin:0;padding:18px 0;text-align:center}
.mi-slot{
  padding:12px 8px;border:1px solid var(--mi-line);border-radius:9px;background:#fff;
  color:var(--mi-navy);font-weight:700;font-size:14px;cursor:pointer;
  transition:border-color .16s ease,background .16s ease,color .16s ease
}
.mi-slot:hover{border-color:var(--mi-blue);color:var(--mi-blue)}
.mi-slot.is-selected{background:var(--mi-blue);border-color:var(--mi-blue);color:#fff}

/* ---- Form ---- */
.mi-booking-selection{
  background:#eaf3ff;border:1px solid #cfe2fb;border-radius:10px;
  padding:13px 16px;margin-bottom:18px
}
.mi-booking-selection-label{
  display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:800;color:var(--mi-blue);margin-bottom:4px
}
.mi-booking-selection strong{color:var(--mi-navy);font-size:15px}

.mi-booking-form label{display:block;margin:0 0 14px}
.mi-booking-form label > span{
  display:block;font-size:13px;font-weight:700;color:var(--mi-navy);margin-bottom:6px
}
.mi-booking-form input,.mi-booking-form select,.mi-booking-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--mi-line);border-radius:9px;
  font:inherit;background:#fff;color:var(--mi-text)
}
.mi-booking-form input:focus,.mi-booking-form select:focus,.mi-booking-form textarea:focus{
  outline:none;border-color:var(--mi-blue);box-shadow:0 0 0 3px rgba(18,104,232,.14)
}
.mi-booking-form textarea{resize:vertical;min-height:96px}
.mi-booking-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.mi-booking-row label{margin-bottom:14px}
.mi-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}

.mi-booking-submit{
  width:100%;padding:15px 20px;border:0;border-radius:9px;background:var(--mi-blue);
  color:#fff;font-weight:800;font-size:16px;cursor:pointer;
  transition:background .18s ease,transform .18s ease
}
.mi-booking-submit:hover:not(:disabled){background:var(--mi-blue-dark);transform:translateY(-1px)}
.mi-booking-submit:disabled{background:#b8cde8;cursor:not-allowed}
.mi-booking-note{font-size:12px;color:var(--mi-muted);margin:12px 0 0;text-align:center}

.mi-booking-alert{
  background:#fdecec;border:1px solid #f5c2c2;color:#a32626;border-radius:9px;
  padding:12px 14px;font-size:14px;margin-bottom:14px
}

.mi-booking-success{text-align:center;padding:14px 0}
.mi-booking-check{
  width:60px;height:60px;border-radius:50%;background:#e4f6ea;color:#2c7a3f;
  display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:800;
  margin:0 auto 18px
}
.mi-booking-success h3{margin:0 0 10px;font-size:22px}
.mi-booking-success p{margin:0 0 8px;color:var(--mi-muted);font-size:15px}
.mi-booking-success p[data-mi-success-summary]{color:var(--mi-navy);font-weight:700;font-size:16px}

/* ---- Responsive ---- */
@media(max-width:1024px){
  .mi-booking-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .mi-booking-form-panel{grid-column:1/-1}
}
@media(max-width:640px){
  .mi-booking-grid{grid-template-columns:1fr;gap:16px}
  .mi-booking-panel{padding:18px}
  .mi-slots{grid-template-columns:repeat(3,minmax(0,1fr));max-height:none}
  .mi-booking-row{grid-template-columns:1fr}
  .mi-cal-day{min-height:40px;font-size:15px}
}
