/* MUS booking. Styles are isolated from the portfolio. */
/* Optical centering: asymmetric padding lowers pill/input text by 1px without
   changing total padding; fixed-size circles use 2px top padding for the same shift. */
#contact-dropdown {text-align:left;padding:20px;max-width:calc(100vw - 24px);overflow-y:auto;}
#contact-dropdown > p {white-space:normal;font-size:24px;line-height:1.18;margin:0 0 24px;padding:0 16px;max-width:450px;}
#mus-booking {--ink:#000;--paper:#f2f2f2;--button-bg:#fff;--button-hover:#f0f0f0;font-size:24px;line-height:1.18;}
#mus-booking * {box-sizing:border-box;}
#mus-booking [hidden] {display:none!important;}
#mus-booking button,#mus-booking input {font:inherit;}
#mus-booking button {cursor:pointer;}
#mus-booking button:focus-visible,#mus-booking input:focus-visible,#mus-booking a:focus-visible {outline:2px solid currentColor;outline-offset:4px;}
#mus-booking button:disabled {opacity:.4;cursor:default;}
.mus-start {display:flex;align-items:flex-start;gap:10px;}
#mus-booking .mus-pill {border:1px solid currentColor;border-radius:30px;background:var(--button-bg);color:var(--ink);padding:9px 16px 7px;white-space:nowrap;text-decoration:none;}
.mus-panel {position:relative;background:var(--ink);color:var(--paper);border-radius:20px;padding:12px 16px 22px;width:242px;max-width:100%;}
.mus-panel.is-details {width:458px;}
.mus-columns {display:grid;grid-template-columns:1fr;gap:20px;}
.is-details .mus-columns {grid-template-columns:1fr 1fr;}
#mus-booking .mus-heading {font-size:24px;line-height:1.16;font-weight:400;margin:0 0 26px;white-space:normal;}
.mus-close {position:absolute;right:8px;top:7px;border:0;background:transparent;color:var(--paper);font-size:18px!important;line-height:1;padding:3px;}
.mus-calendar-nav {display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-size:11px;text-transform:uppercase;}
.mus-calendar-nav button {background:none;color:inherit;border:0;padding:5px;font-size:16px!important;}
.mus-weekdays,.mus-days {display:grid;grid-template-columns:repeat(7,1fr);text-align:center;gap:1px;}
.mus-weekdays {font-size:9px;opacity:.65;margin-bottom:5px;}
#mus-booking .mus-day {font-size:11px;border:0;border-radius:50%;width:28px;height:28px;padding:2px 0 0;color:var(--paper);background:transparent;}
#mus-booking [aria-pressed=true] {background:var(--paper);color:var(--ink);}
.mus-times {display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px;margin:16px 0 20px;}
#mus-booking .mus-time {border:0;border-radius:50%;width:36px;height:36px;padding:2px 0 0;background:transparent;color:var(--paper);font-size:11px;}
#mus-booking .mus-time[aria-pressed=true] {background:var(--paper);color:var(--ink);}
#mus-booking .mus-action {display:block;margin:0 auto;border:1px solid var(--paper);border-radius:24px;background:transparent;color:var(--paper);font-size:11px;padding:11px 12px 9px;text-transform:uppercase;}
#mus-booking .mus-details {padding-top:78px;}
#mus-booking .mus-back {display:none;}
#mus-booking .mus-details h3 {font-size:24px;font-weight:400;margin:0 0 24px;}
#mus-booking .mus-details p {font-size:11px;line-height:1.8;white-space:normal;margin:0 0 10px;}
#mus-booking .mus-details label {display:block;font-size:10px;margin:8px 0 4px;}
#mus-booking .mus-details input {width:100%;min-width:0;background:var(--paper);color:var(--ink);border:0;border-radius:24px;padding:10px 12px 8px;font-size:12px;}
#mus-booking .mus-details .mus-action {margin-top:20px;}
#mus-booking .mus-note {font-size:10px;line-height:1.5;white-space:normal;margin:16px 0 0;max-width:458px;}
#mus-booking .mus-success {font-size:24px;max-width:470px;padding:0 16px;}
#mus-booking .mus-success p {white-space:normal;}
#mus-booking .mus-success button {margin-top:16px;font-size:12px;}
.mus-timezone {font-size:9px;opacity:.7;margin:0 0 10px;}
#mus-booking #mus-privacy-link {color:black; text-decoration:none;}
@media(max-width:540px){#contact-dropdown{min-width: 260px;padding:12px;max-height:90dvh;}#contact-dropdown > p{font-size:21px;}#mus-booking{font-size:20px;}.mus-panel{width:242px;}.mus-panel.is-details{width:100%;}.is-details .mus-columns{grid-template-columns:1fr;}#mus-booking .mus-details{padding-top:0;border-top:1px solid #555;padding-bottom:4px;}#mus-booking .mus-details h3{margin:16px 0;}.mus-days,.mus-weekdays{justify-items:center;}.mus-close{font-size:24px!important;}.mus-calendar-nav button{padding:8px;}}

/* Preserve the original contact surface from style.css (including both dark modes).
   Only the booking card itself uses an opaque black background. */
#mus-booking .mus-pill:hover {background:var(--button-hover);color:var(--ink);text-decoration:none;}
.mus-start:has(.mus-panel.is-details:not([hidden])) > .mus-phone {display:none;}
#mus-booking .mus-day[aria-pressed="true"],
#mus-booking .mus-time[aria-pressed="true"] {background:var(--paper);color:var(--ink);}
@media (hover:hover) {
  #mus-booking .mus-day:not(:disabled):hover,
  #mus-booking .mus-time:not(:disabled):hover,
  #mus-booking .mus-action:not(:disabled):hover {background:var(--button-hover);color:var(--ink);}
}
@media (prefers-color-scheme:dark) {
  #mus-booking {--button-bg:#f2f2f2;}
}
.dark-mode #mus-booking {--button-bg:#f2f2f2;}
@media (max-width:800px) {
  #mus-booking .is-details .mus-selection {display:none;}
  #mus-booking .is-details .mus-columns {grid-template-columns:1fr;}
  #mus-booking .mus-details {padding-top:0;border-top:0;}
  #mus-booking .mus-back {display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-4px 0 12px -8px;padding:0;border:0;background:transparent;color:inherit;font-size:24px;line-height:1;}
  /* Prevent focus zoom on mobile browsers while keeping manual zoom available. */
  #mus-booking .mus-details input {font-size:16px;}
  #contact-dropdown:has(.mus-panel:not([hidden])) {width:calc(100vw - 24px);box-sizing:border-box;}
  .mus-panel, .mus-panel.is-details {width:100%;}
  .mus-start {flex-direction:column;align-items:flex-start;}
  .mus-start:has(.mus-panel:not([hidden])) > .mus-phone {display:none;}
}

#mus-booking .mus-status, #mus-booking .mus-form-status {font-size:11px;line-height:1.5;white-space:normal;overflow-wrap:anywhere;}
#mus-booking .mus-status {margin:0 0 12px;}
#mus-booking .mus-fallback {display:block;font-size:10px;color:inherit;text-decoration:underline;margin-top:16px;}
#mus-booking .mus-details a {color:inherit;text-decoration:underline;}
#mus-booking .mus-details details {font-size:11px;line-height:1.5;margin:12px 0;}
#mus-booking .mus-details details p {white-space:pre-line;max-height:180px;overflow-y:auto;}
#mus-booking .mus-details input[type=checkbox] {width:auto;display:inline;vertical-align:middle;accent-color:#fff;}
#mus-booking .mus-success #mus-confirmed-summary, #mus-booking .mus-success a {font-size:13px;line-height:1.6;}
#mus-booking .mus-success a {color:inherit;text-decoration:underline;}
#mus-captcha-image {width:100%;height:auto;border-radius:8px;margin-top:12px;}
#mus-booking #mus-captcha-reload {margin:6px 0;}
#mus-booking .mus-day, #mus-booking .mus-time {touch-action:manipulation;}
