.day-head{padding:10px 7px}.workers{display:grid;gap:3px;margin-top:7px}.worker{display:block;background:#f2ebe7;border-radius:7px;padding:3px 4px;color:var(--ink);font-size:9px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.worker-off{color:var(--muted);font-weight:500}.event{min-height:34px;padding:5px 7px;font-size:10px}.cell,.time{height:84px}
.month-board{display:grid;grid-template-columns:165px repeat(7,minmax(120px,1fr));min-width:1020px}.month-corner,.month-day{position:sticky;top:0;z-index:3;background:#fff;border-bottom:1px solid var(--line);padding:13px;text-align:center}.month-corner{left:0;z-index:4;text-align:left;color:var(--muted);font-size:11px}.month-day strong,.month-day span{display:block}.month-day span{font-size:10px;color:var(--muted)}.month-day.today{color:var(--red)}.employee-name{position:sticky;left:0;z-index:2;display:flex;align-items:center;gap:8px;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px}.employee-name span{display:grid;place-items:center;flex:0 0 34px;height:34px;border-radius:50%;background:#f0d7d2;color:#963b34;font-size:10px;font-weight:700}.employee-name strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.month-cell{min-height:92px;border:0;border-right:1px solid #eee7e2;border-bottom:1px solid #eee7e2;padding:9px;background:#fff;color:var(--ink);text-align:left;cursor:pointer;font:11px/1.3 Montserrat}.month-cell.off{background:repeating-linear-gradient(135deg,#faf7f5,#faf7f5 8px,#f5f0ed 8px,#f5f0ed 16px);color:var(--muted)}.month-cell>span,.month-cell>strong,.month-cell>small{display:block}.month-cell>span{font-size:9px;color:var(--green);font-weight:700}.month-cell>strong{margin-top:8px;font-size:21px}.month-cell>small{color:var(--muted);margin-top:2px}.month-cell:hover{box-shadow:inset 0 0 0 2px var(--red)}
.day-board{display:grid;grid-template-columns:86px repeat(var(--staff-count),minmax(210px,1fr));min-width:calc(86px + var(--staff-count)*210px)}.day-corner,.staff-head{position:sticky;top:0;z-index:3;background:#fff;border-bottom:1px solid var(--line);min-height:70px;padding:10px}.day-corner{left:0;z-index:4}.day-corner strong,.day-corner span{display:block}.day-corner span{font-size:10px;color:var(--muted);margin-top:5px}.staff-head{display:flex;align-items:center;justify-content:center;gap:9px;text-align:left;border-right:1px solid var(--line)}.staff-head>span{display:grid;place-items:center;flex:0 0 38px;width:38px;height:38px;aspect-ratio:1;border-radius:50%;background:#f0d7d2;color:#963b34;font-size:10px;font-weight:700}.staff-head strong,.staff-head small{display:block}.staff-head strong{font-size:11px}.staff-head small{font-size:9px;color:var(--green);margin-top:3px}.day-time{position:sticky;left:0;z-index:2;height:92px;background:#fff;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:9px;color:var(--muted);font-size:11px;text-align:right}.staff-cell{position:relative;height:92px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:#fff;cursor:pointer}.staff-cell.off{background:repeating-linear-gradient(135deg,#faf7f5,#faf7f5 8px,#f5f0ed 8px,#f5f0ed 16px)}.day-event{position:absolute;inset:4px;z-index:1;border:0;border-radius:11px;padding:8px 10px;text-align:left;color:var(--ink);font:11px/1.25 Montserrat;cursor:pointer}.day-event.client{background:var(--rose);border-left:4px solid var(--red)}.day-event.block{background:#e9e5e2;border-left:4px solid #91847e}.day-event.outside{background:#fff;border:2px solid var(--red)}.day-event>span,.day-event>strong,.day-event>small{display:block}.day-event>span{font-size:10px;color:var(--muted)}.day-event>strong{margin-top:4px}.day-event>small{margin-top:4px;color:var(--muted)}.empty-day{grid-column:2/-1;min-height:180px;display:grid;place-items:center;color:var(--muted)}
.day-event{overflow:hidden}.day-event.compact{padding:5px 8px;white-space:nowrap}.day-event.compact>strong{display:inline;margin-left:6px}.day-event.compact>small{display:none}.day-event.compact>.event-service{display:inline;margin:0 0 0 6px;color:var(--muted)}
.day-event.attention::after{content:"!";position:absolute;right:6px;top:6px;background:var(--red);color:#fff;border-radius:50%;width:17px;height:17px;text-align:center;line-height:17px;font-weight:700;font-size:11px}
.day-event.retroactive::after{content:"↺";position:absolute;left:6px;bottom:6px;background:var(--amber);color:#fff;border-radius:50%;width:17px;height:17px;text-align:center;line-height:17px;font-weight:700;font-size:11px}
.modal-card{max-height:calc(100vh - 40px);overflow:auto}
.employee-name>span,.staff-head>span{overflow:hidden;border-radius:50%}.employee-name span img,.staff-head>span img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}.booking-master-card{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:14px;background:#fff1cf;color:#5d4510}.booking-master-photo{display:grid;place-items:center;flex:0 0 58px;height:58px;border-radius:50%;overflow:hidden;background:#ead8bf}.booking-master-photo img{width:100%;height:100%;object-fit:cover}.booking-master-details{display:flex;min-width:0;flex-direction:column;gap:4px}.booking-master-details strong{font-size:16px;color:#4b3610}.booking-master-details span{font-size:14px}.booking-master-details b{font-size:14px;font-weight:700;color:#4b3610}.avatar-fallback{display:grid;width:100%;height:100%;place-items:center}
.day-corner{border-top-left-radius:17px;box-shadow:inset 1px 1px 0 var(--line)}.staff-head>span.staff-avatar{position:relative;min-width:38px;max-width:38px;min-height:38px;max-height:38px;padding:0;clip-path:circle(50%)}.staff-head>span.staff-avatar img{position:absolute;inset:0;border-radius:0;clip-path:circle(50%)}.staff-avatar.editable::after{content:"✎";position:absolute;right:0;bottom:0;display:grid;place-items:center;width:14px;height:14px;border-radius:50%;background:var(--ink);color:#fff;font-size:8px}
.calendar-wrap{border:0;outline:1px solid var(--line);outline-offset:-1px}.day-corner{box-shadow:none}
.calendar-frame{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff}.calendar-frame>.calendar-wrap{border:0;outline:0;border-radius:0}
.current-time-label,.current-time-segment{position:absolute;z-index:5;pointer-events:none;transform:translateY(-50%)}.current-time-label{right:4px;padding:2px 5px;border-radius:7px;background:#c43d34;color:#fff;font:700 9px/1 Montserrat,sans-serif;white-space:nowrap}.current-time-segment{left:0;right:0;height:2px;background:#c43d34}.current-time-segment::before{content:"";position:absolute;left:-4px;top:50%;width:8px;height:8px;border-radius:50%;background:#c43d34;transform:translateY(-50%)}
.elapsed-time-shade{position:absolute;z-index:0;top:0;left:0;right:0;background:#3c2f2c0a;pointer-events:none}
.client-lookup{display:grid;gap:9px;padding:15px;border:1px solid var(--line);border-radius:14px;background:#fff}.client-lookup>p{margin:0;color:var(--muted);font-size:12px;line-height:1.45}.client-search-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.client-search-row input{min-width:0}.selected-client,.new-client{display:grid;gap:7px;padding:12px;border-radius:11px;background:#f8f3ef}.selected-client span,.new-client>span{color:var(--muted);font-size:12px}.link-button{justify-self:start;padding:0;border:0;background:transparent;color:var(--red);font:600 12px Montserrat;cursor:pointer}.new-client label{margin-top:3px}.new-client>button{justify-self:start}

/* Extra booking actions must remain inside the desktop dialog. */
@media (min-width:721px){
  .modal-actions{flex-wrap:wrap}
  .modal-actions>button{flex:1 1 160px;min-width:0;max-width:100%;min-height:44px;white-space:normal;overflow-wrap:anywhere}
}

.booking-detail-line{white-space:pre-wrap;overflow-wrap:anywhere}
.filters label[hidden]{display:none}
body[data-calendar-view="list"] .calendar-mobile-toolbar,body[data-calendar-view="list"] .calendar-help,body[data-calendar-view="list"] #mobile-date-strip,body[data-calendar-view="list"] .date-controls,body[data-calendar-view="list"] .summary-disclosure{display:none}
body[data-calendar-view="list"] .calendar-wrap{max-height:none;overflow:visible}
.booking-list{display:grid;gap:5px;min-width:0;padding:8px}
.booking-list-item{display:grid;width:100%;min-height:72px;gap:2px;padding:8px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);text-align:left;font:500 14px/1.3 Montserrat,sans-serif;cursor:pointer;overflow-wrap:anywhere}
.booking-list-head,.booking-list-actors{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 10px;min-width:0}
.booking-list-head>strong{font-size:16px;line-height:1.25}
.booking-list-time{color:#963b34;font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.booking-list-detail{color:var(--ink);font-size:14px}
.booking-list-actors{color:var(--ink);font-size:13px}
.booking-list-actors b{font-weight:650}
.booking-list-activity{color:var(--muted);font-variant-numeric:tabular-nums}
.booking-list-marker{padding:1px 5px;border-radius:5px;background:#f1e7e1;color:#5b4039;font-size:12px;font-weight:600}
.booking-list-item.is-block{background:#eee9e5}
.booking-list-item.needs-attention{border-left:5px solid #a66a19;background:#fff9ec}
.booking-list-item:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.booking-list-empty{padding:24px 16px;color:var(--muted);font-size:16px}
.booking-list-more{justify-self:center;min-height:44px;padding:10px 22px;margin:8px}

/* Booking details share one structure; each state chooses its own main action. */
.modal-card:has(.booking-summary)>.close{min-width:44px;min-height:44px;right:4px;top:4px}
.modal-card:has(.booking-summary) h2{padding-right:36px;font-size:clamp(20px,5vw,25px);line-height:1.25;margin-bottom:16px}
.booking-summary{display:grid;gap:8px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:#fff}
.booking-summary-person{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-bottom:8px;border-bottom:1px solid var(--line);font-size:18px;line-height:1.3}
.booking-summary-row{display:grid;grid-template-columns:100px minmax(0,1fr);gap:8px;align-items:start;font-size:16px;line-height:1.4}
.booking-summary-row>span{color:var(--muted)}
.booking-summary-row>strong{font-weight:500;overflow-wrap:anywhere}
.booking-summary-channel{margin:4px 0 0!important;padding-top:10px;border-top:1px solid var(--line);color:#745017!important;font-size:16px}
.booking-summary-warning{margin:12px 0 0;padding:12px 14px;font-size:16px;line-height:1.45}
.booking-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px}
.booking-action-grid>button{min-height:48px;min-width:0;border:0;border-radius:12px;padding:10px 12px;font:600 16px/1.3 Montserrat,sans-serif;cursor:pointer;white-space:normal;overflow-wrap:anywhere}
.booking-action-grid>.primary,.booking-action-grid>.booking-action-wide,.booking-action-grid>.booking-action-link{grid-column:1/-1}
.booking-action-grid>.primary{background:#c43d34;color:#fff}
.booking-action-grid>.booking-action-wide{background:#fff;border:1px solid #b7a7a0}
.booking-action-grid>.booking-action-link{background:transparent;color:#8b302a;text-decoration:underline;text-underline-offset:3px}
.booking-action-grid>button:focus-visible,.modal-card:has(.booking-summary)>.close:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
@media(max-width:360px){.booking-summary-row{grid-template-columns:88px minmax(0,1fr)}}
.booking-colour-options{margin:0;border:1px solid #776a65;border-radius:12px;padding:12px;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}
.booking-colour-options legend{font-weight:600;padding:0 4px}
.booking-colour-options label{display:flex;align-items:center;gap:8px;min-height:44px;font-size:16px;cursor:pointer}
.booking-colour-options input{width:20px;min-height:20px;height:20px;margin:0;accent-color:#c43d34}
.booking-colour-swatch{display:inline-block;flex:none;width:20px;height:20px;border:1px solid #776a65;border-radius:50%;background:var(--booking-colour,#fae5e2)}
[data-colour="rose"],[data-booking-color="rose"]{--booking-colour:#fae5e2}
[data-colour="peach"],[data-booking-color="peach"]{--booking-colour:#f7dfca}
[data-colour="yellow"],[data-booking-color="yellow"]{--booking-colour:#f5ebbe}
[data-colour="green"],[data-booking-color="green"]{--booking-colour:#d9ecd9}
[data-colour="blue"],[data-booking-color="blue"]{--booking-colour:#dce9f5}
[data-colour="lavender"],[data-booking-color="lavender"]{--booking-colour:#e9dff2}
.day-event[data-booking-color]:not(.attention):not(.outside){background:var(--booking-colour);color:#3c2f2c}
.day-event[data-booking-color].attention,.day-event[data-booking-color].outside{box-shadow:inset -6px 0 var(--booking-colour)}
#booking-metadata-form textarea{width:100%;min-height:112px;resize:vertical;font:inherit;font-size:16px;color:#3c2f2c;background:#fff;border:1px solid #776a65;border-radius:10px;padding:12px}
#booking-metadata-form :is(textarea,input,button):focus-visible{outline:3px solid #3c2f2c;outline-offset:3px}
#booking-metadata-form [data-metadata-error]{color:#8b302a;white-space:pre-wrap}

#booking-metadata-form>label{font-size:16px}
.modal-card:has(#booking-metadata-form)>.close{min-width:44px;min-height:44px;right:4px;top:4px}
.modal-card:has(#booking-metadata-form) h2{padding-right:32px}

/* A text badge marks a first visit without replacing booking status colours. */
.booking-new-badge{display:inline-block;padding:1px 4px;border:1px solid #c8dfce;border-radius:4px;background:#e4f0e7;color:#315b41;font:600 10px/12px Montserrat,sans-serif;white-space:nowrap;vertical-align:middle}
.day-event>.booking-new-badge{position:absolute;top:3px;right:3px;margin:0;z-index:1;pointer-events:none}
.day-event:has(>.booking-new-badge)>.event-time{display:block;padding-right:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* The attention "!" circle sits at right:6px/top:6px (see .day-event.attention::after
   above) — without this, a card that is both a first visit and flagged for
   attention renders the New badge directly on top of it, hiding the flag. */
.day-event.attention>.booking-new-badge{right:27px}
.day-event.attention:has(>.booking-new-badge)>.event-time{padding-right:56px}

.day-event>.booking-markers{position:absolute;top:0;right:0;z-index:4;display:inline-flex;margin:0;pointer-events:none}
.booking-markers>.booking-origin{display:none}
.day-event:has(>.booking-markers>.origin-client)::before{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:#3c5b56;pointer-events:none}
.booking-markers>.booking-no-bot{display:block;width:9px;height:12px;clip-path:polygon(0 0,100% 0,100% 100%,50% 78%,0 100%);background:#805318}
.day-event:has(>.booking-markers>.booking-no-bot)>.event-time{display:block;padding-right:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day-event.compact>.event-time{display:none!important}
.day-event.compact>strong{display:block;margin:3px 0 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.day-event.micro>strong{margin-top:0;font-size:10px;line-height:12px}
.day-event:has(>.booking-markers>.booking-no-bot)>.booking-new-badge{right:18px}
.day-event.attention:has(>.booking-markers>.booking-no-bot)::after{right:18px}
.day-event.attention:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.booking-new-badge{right:43px}
.day-event:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.event-time,.day-event.attention:has(>.booking-markers>.booking-no-bot)>.event-time{padding-right:48px}
.day-event.attention:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.event-time{padding-right:74px}

@media (max-width:720px){
  .day-event.attention::after{top:auto;bottom:5px;right:4px;width:10px;height:10px;font-size:8px;line-height:10px}
  .day-event.compact.attention>strong{padding-right:13px}
  .day-event>.booking-new-badge{top:3px;right:3px;padding:0 3px;font-size:8px;line-height:10px}
  .day-event:has(>.booking-new-badge)>.event-time{padding-right:24px}
  .day-event.attention>.booking-new-badge{right:3px}
  .day-event.attention:has(>.booking-new-badge)>.event-time{padding-right:24px}
  .day-event:has(>.booking-markers>.booking-no-bot)>.booking-new-badge{right:16px}
  .day-event.attention:has(>.booking-markers>.booking-no-bot)::after{right:4px}
  .day-event.attention:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.booking-new-badge{right:16px}
  .day-event:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.event-time,.day-event.attention:has(>.booking-markers>.booking-no-bot)>.event-time{padding-right:35px}
  .day-event.attention:has(>.booking-new-badge):has(>.booking-markers>.booking-no-bot)>.event-time{padding-right:35px}
}

/* Calendar feedback remains inside the visual viewport, above open dialogs. */
#toast.toast {bottom:auto;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10000;width:max-content;max-width:calc(100vw - 32px);border-radius:16px;padding:12px 12px 12px 18px;box-shadow:0 8px 36px #20161455;font-size:16px;line-height:1.5;overflow:auto;overflow-wrap:anywhere;gap:12px;align-items:center;}
#toast.toast.show {display:flex;}
#toast button {flex:none;width:44px;height:44px;border:1px solid #ffffff66;border-radius:10px;color:#fff;background:transparent;font:24px/1 sans-serif;cursor:pointer;}
#toast button:focus-visible {outline:3px solid white;outline-offset:2px;}
.move-options {display:flex;flex-wrap:wrap;gap:8px;max-height:180px;overflow:auto;}
.move-options button {min-height:44px;}
