@charset "UTF-8";

/* The time grid uses the exact pixel geometry supplied by the agenda renderer. */
#panel-planning{padding-top:25px}
#panel-planning .section-heading{margin-bottom:22px;gap:20px}
#panel-planning .section-heading .eyebrow{margin-bottom:7px}
#panel-planning .section-heading h1{font-size:clamp(2.25rem,3.25vw,3rem);margin-bottom:8px}
#panel-planning .section-heading p:not(.eyebrow){max-width:670px;font-size:.79rem;line-height:1.55}
#panel-planning .planning-toolbar{padding-block:13px;gap:14px 22px;flex-wrap:wrap}
#panel-planning .week-nav{gap:13px;min-width:0}
#panel-planning .week-nav h2{font-size:.88rem;font-weight:600}
#panel-planning .planning-meta{padding:14px 0 12px}
#panel-planning .sync{margin-top:13px;margin-left:0;justify-content:space-between;flex-wrap:wrap;gap:8px 20px}
#panel-planning .sync .text-button{min-height:36px}
#panel-planning .section-footnote{margin-top:12px}
body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .header{min-height:94px}
body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .tabs{padding-top:8px;min-height:60px}
body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .tab{padding-bottom:17px}

.calendar-controls{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:12px 16px;min-width:0}
.view-switch{display:inline-flex;flex:none;padding:3px;gap:2px;border:1px solid var(--line);border-radius:6px;background:#eee8df}
.view-switch button{min-height:35px;padding:7px 14px;border:0;border-radius:3px;background:transparent;color:var(--muted);font-size:.74rem;font-weight:500;line-height:1.3}
.view-switch button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:0 1px 4px #44372e12;font-weight:600}
.view-switch button:hover:not([aria-pressed="true"]){color:var(--ink);background:#ffffff55}
.date-picker{display:flex;align-items:center;gap:9px;min-width:0;font-size:.72rem;font-weight:500;color:var(--muted)}
.date-picker input{width:151px;min-height:41px;padding:7px 10px;font-size:.76rem;border-radius:5px;background:var(--surface);color:var(--ink)}

.calendar-scroll{position:relative;display:block;width:100%;max-width:100%;min-height:450px;max-height:70vh;max-height:70svh;overflow:auto;overscroll-behavior:contain;border:1px solid #d6cdc0;border-radius:8px;background:var(--surface);scrollbar-width:thin;scrollbar-color:#b7a998 #eee8df;isolation:isolate}
.calendar-scroll:focus-visible{outline-offset:3px}
.calendar-canvas{--rail-width:56px;--day-count:7;--hour-height:72px;--calendar-height:792px;width:100%;min-width:calc(var(--rail-width) + 112px * var(--day-count));background:var(--surface)}
.calendar-canvas[data-view="day"]{--day-count:1;min-width:0}
.calendar-header,.calendar-body{display:grid;grid-template-columns:var(--rail-width) repeat(var(--day-count),minmax(0,1fr));width:100%}
.calendar-header{position:sticky;top:0;z-index:8;min-height:78px;background:var(--surface);box-shadow:0 1px 0 #d6cdc0}
.calendar-corner{position:sticky;left:0;z-index:3;display:flex;align-items:center;justify-content:center;padding:10px 4px;border-right:1px solid var(--line);background:#f3eee6;color:var(--muted);font-size:.58rem;font-weight:500;letter-spacing:.02em}
.calendar-day-heading{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;min-width:0;min-height:78px;margin:0;padding:8px 5px;border:0;border-right:1px solid var(--line);border-radius:0;background:var(--surface);color:var(--ink);text-align:center;line-height:1.2}
.calendar-day-heading:last-child{border-right:0}
.calendar-day-heading:hover{background:#f1ebe2}
.calendar-day-heading:focus-visible{position:relative;z-index:2;outline-offset:-4px}
.calendar-day-heading.is-closed{background:#f2eee7;color:#857a70}
.calendar-day-heading.is-selected{box-shadow:inset 0 -2px 0 var(--accent)}
.calendar-weekday{font-size:.62rem;text-transform:uppercase;letter-spacing:.055em;font-weight:500}
.calendar-date{display:flex;align-items:center;justify-content:center;min-width:27px;min-height:27px;padding:1px 4px;border-radius:50%;font-size:1rem;font-weight:600;font-variant-numeric:tabular-nums}
.is-today .calendar-date{background:var(--ink);color:#fffaf3}
.is-today .calendar-weekday{color:var(--ink);font-weight:600}
.calendar-day-meta{max-width:100%;font-size:.57rem;color:var(--muted);line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.calendar-body{position:relative}
.time-rail{position:sticky;left:0;z-index:5;height:var(--calendar-height);border-right:1px solid var(--line);background:#faf7f1;font-variant-numeric:tabular-nums}
.time-label{position:absolute;right:9px;display:block;color:var(--muted);font-size:.62rem;line-height:1;white-space:nowrap;transform:translateY(-.5em)}
.time-label:first-child{transform:translateY(5px)}
.time-label:last-child{transform:translateY(-1.25em)}
.calendar-lane{position:relative;height:var(--calendar-height);min-width:0;border-right:1px solid #e0d8cd;background-color:var(--surface);background-image:linear-gradient(to bottom,#dcd4c9 1px,transparent 1px),linear-gradient(to bottom,#eae4db 1px,transparent 1px),linear-gradient(to bottom,#f1ece5 1px,transparent 1px);background-size:100% var(--hour-height),100% calc(var(--hour-height) / 2),100% calc(var(--hour-height) / 4)}
.calendar-lane:last-child{border-right:0}
.calendar-unavailable{position:absolute;left:0;right:0;z-index:1;overflow:hidden;background:repeating-linear-gradient(135deg,#b3a4920d 0 1px,transparent 1px 7px),#ebe5dc99;border-block:1px solid #d8cec14d;pointer-events:none}
.calendar-unavailable.is-absence{background:repeating-linear-gradient(135deg,#a192a326 0 1px,transparent 1px 7px),#e5dce5bf;border-color:#cabdca7a}
.calendar-unavailable.is-absence .unavailable-label{color:#77657a}
.unavailable-label{display:block;padding:10px 8px;color:#85796c;font-size:.61rem;line-height:1.4;text-align:center;overflow-wrap:anywhere}
.calendar-event{--event-bg:#e5d7c9;--event-border:#9b7f66;--event-ink:#4d3a2a;position:absolute;left:4px;right:4px;z-index:3;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:1px;min-width:0;min-height:0;margin:0;padding:3px 7px;border:1px solid #ffffff7a;border-left:3px solid var(--event-border);border-radius:4px;background:var(--event-bg);color:var(--event-ink);text-align:left;font-family:'DM Sans',Arial,Helvetica,sans-serif;font-size:.71rem;line-height:1.2;overflow:hidden;box-shadow:0 1px 2px #44372e0d;transition:filter .15s,box-shadow .15s}
.calendar-event:hover{filter:brightness(.97);box-shadow:0 2px 7px #44372e24;z-index:4}
.calendar-event:focus-visible{z-index:6;outline:2px solid var(--ink);outline-offset:1px}
.calendar-event:active{filter:brightness(.94)}
.event-time{display:block;flex:none;font-size:.62rem;font-weight:600;line-height:1.2;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.event-name{display:block;min-width:0;flex:none;font-size:.73rem;font-weight:600;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.event-service{display:block;min-width:0;flex:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.65rem;line-height:1.2}
.calendar-event.is-short{flex-direction:row;align-items:center;gap:5px;padding:0 5px;border-left-width:3px}
.calendar-event.is-short .event-time{font-size:.6rem}
.calendar-event.is-short .event-name{flex:1;font-size:.65rem;line-height:1.1}
.calendar-event.is-short .event-service{display:none}
.event-tone-0{--event-bg:#e7d9cb;--event-border:#9d7e61;--event-ink:#4d3b2c}
.event-tone-1{--event-bg:#e4dce9;--event-border:#977c9e;--event-ink:#4e3c56}
.event-tone-2{--event-bg:#dce5d9;--event-border:#7c9674;--event-ink:#3c5136}
.event-tone-3{--event-bg:#eee2c8;--event-border:#ae9158;--event-ink:#5b4928}
.now-line{position:absolute;left:0;right:0;z-index:4;height:1px;border-top:1px solid #b15e4e;pointer-events:none}
.now-line:before{content:'';position:absolute;left:-3px;top:-4px;width:7px;height:7px;border-radius:50%;background:#b15e4e}

.calendar-legend{display:flex;align-items:center;flex-wrap:wrap;gap:8px 17px;margin:12px 0 0;font-size:.65rem;color:var(--muted)}
.legend-key{display:inline-flex;align-items:center;gap:6px;min-width:0}
.legend-swatch{display:inline-block;width:12px;height:12px;flex:0 0 12px;border-radius:3px;background:var(--event-bg,#e7d9cb);border:1px solid var(--event-border,#9d7e61)}
.legend-swatch.is-unavailable,.legend-swatch.is-closed{background:repeating-linear-gradient(135deg,#c1b4a766 0 1px,#ece6dd 1px 4px);border-color:#c9bdae}
.legend-swatch.is-absence{background:repeating-linear-gradient(135deg,#a192a34d 0 1px,#e5dce5 1px 4px);border-color:#bba9bf}
.legend-swatch.is-now{height:2px;flex-basis:12px;border:0;border-radius:0;background:#b15e4e}
.calendar-tip{margin-top:10px;max-width:780px;color:var(--muted);font-size:.69rem;line-height:1.65;text-wrap:pretty}
.calendar-legend .calendar-tip{margin-top:0;margin-left:auto}
.calendar-scroll>.loading-state,.calendar-scroll>.empty-state{padding:32px 24px}

.cancelled-history{margin-top:25px;padding-top:21px;border-top:1px solid var(--line)}
.cancelled-history h3,.cancelled-history summary{font-family:'DM Sans',Arial,Helvetica,sans-serif;font-size:.78rem;font-weight:600;line-height:1.5}
.cancelled-history summary{cursor:pointer;padding-block:5px}
.cancelled-history>p{margin-top:6px;font-size:.72rem;color:var(--muted)}
.cancelled-row{display:flex;align-items:center;justify-content:space-between;gap:12px 22px;width:100%;margin-top:10px;padding:13px 15px;border:1px solid var(--line);border-radius:5px;background:#f1ede6;color:var(--muted);font-size:.73rem;line-height:1.55;text-align:left;overflow-wrap:anywhere}
button.cancelled-row:hover{background:#eae2d7;border-color:#bcaa97}
.cancelled-row>div{min-width:0;overflow-wrap:anywhere}
.cancelled-row strong{font-weight:500;color:var(--ink)}
.cancelled-row button{flex:none;min-height:36px;padding:5px 0;border:0;background:transparent;color:var(--ink);font-size:.7rem;text-decoration:underline;text-underline-offset:4px}
.cancelled-row .event-time{margin-bottom:3px}

.event-dialog{width:min(480px,calc(100% - 32px))}
.event-dialog .dialog-heading{align-items:flex-start}
#event-detail{padding-top:21px}
.event-detail-time{font-size:clamp(1.8rem,4vw,2.5rem);font-weight:500;letter-spacing:-.055em;line-height:1.15;font-variant-numeric:tabular-nums}
.event-detail-date{margin-top:7px;color:var(--muted);font-size:.8rem;line-height:1.6;text-transform:capitalize}
.event-detail-service{margin-top:22px;font-size:1rem;font-weight:600;line-height:1.5;overflow-wrap:anywhere}
.event-detail-client{display:block;margin-top:18px;padding-top:18px;border-top:1px solid var(--line);font-size:.88rem;line-height:1.6;overflow-wrap:anywhere;text-underline-offset:4px}
.event-detail-client a{display:inline-block;margin-top:4px;font-size:.82rem;text-underline-offset:4px}
.event-facts{display:flex;flex-direction:column;gap:10px;margin:20px 0 0;padding:18px 0 0;border-top:1px solid var(--line);font-size:.75rem;line-height:1.55}
.event-facts>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:20px}
.event-facts dt{margin:0;color:var(--muted);font-weight:400}
.event-facts dd{margin:0;text-align:right;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.event-dialog .dialog-actions{padding-top:20px;border-top:1px solid var(--line);gap:10px;flex-wrap:wrap}
.event-dialog .dialog-actions .button{font-size:.77rem}

@media(min-width:1440px){
  #panel-planning .section-heading{align-items:center}
  .calendar-day-heading{min-height:80px}
  .calendar-event:not(.is-short){padding:3px 9px}
}
@media(max-width:1199px){
  .calendar-controls{margin-left:auto}
  #panel-planning .week-nav h2{font-size:.81rem}
  .calendar-scroll{max-height:70svh}
}
@media(max-width:899px){
  #panel-planning .planning-toolbar{align-items:center}
  .calendar-controls{gap:10px}
  .date-picker{gap:7px}
  #panel-planning .section-heading{margin-bottom:20px}
  #panel-planning .section-heading>.button{max-width:none}
}
@media(max-width:699px){
  body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .header{min-height:85px}
  body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .brand{flex-shrink:0}
  body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .brand>span{white-space:nowrap;font-size:1.65rem}
  body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .tabs{padding-top:5px;min-height:58px}
  #panel-planning{padding-top:21px}
  #panel-planning .section-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:8px 13px;margin-bottom:20px}
  #panel-planning .section-heading>div{display:contents}
  #panel-planning .section-heading h1{grid-column:1;grid-row:2;font-size:2.15rem;margin-bottom:0;line-height:1.05;overflow-wrap:normal}
  #panel-planning .section-heading .eyebrow{grid-column:1;grid-row:1;font-size:.57rem;letter-spacing:.12em;margin-bottom:0}
  #panel-planning .section-heading p:not(.eyebrow){grid-column:1/-1;grid-row:3;max-width:none;font-size:.73rem;line-height:1.6;margin-top:3px}
  #panel-planning .section-heading>.button{grid-column:2;grid-row:1/3;margin-top:1px;padding:11px 12px;min-height:44px;max-width:132px;font-size:.72rem;gap:7px;flex-shrink:0}
  #panel-planning .planning-toolbar{display:flex;flex-direction:column;align-items:stretch;padding-block:12px;gap:12px}
  #panel-planning .week-nav{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:9px;width:100%}
  #panel-planning .week-nav h2{font-size:.76rem;text-align:center}
  #panel-planning .week-nav .button-small{grid-column:auto;margin-top:0;min-height:38px;padding-inline:8px;font-size:.64rem}
  #panel-planning .week-nav .icon-button{min-width:33px;min-height:38px}
  .calendar-controls{width:100%;margin-left:0;justify-content:space-between;gap:8px}
  .view-switch button{min-height:36px;padding-inline:15px;font-size:.72rem}
  .date-picker{font-size:.65rem;gap:6px}
  .date-picker input{width:137px;min-height:42px;font-size:.72rem;padding:7px 8px}
  #panel-planning .planning-meta{gap:8px 14px;flex-wrap:wrap;padding:12px 0 10px}
  .calendar-scroll{min-height:0;max-height:65vh;max-height:65svh;border-radius:6px}
  .calendar-canvas{--rail-width:48px}
  .calendar-canvas[data-view="day"]{min-width:0}
  .calendar-canvas[data-view="week"]{min-width:calc(var(--rail-width) + 112px * var(--day-count))}
  .calendar-header{min-height:69px}
  .calendar-day-heading{min-height:69px;padding-block:7px;gap:2px}
  .calendar-corner{font-size:.54rem}
  .calendar-weekday{font-size:.6rem}
  .calendar-date{min-height:25px;min-width:25px;font-size:.95rem}
  .calendar-day-meta{font-size:.6rem}
  .time-label{right:7px;font-size:.6rem}
  .calendar-canvas[data-view="day"] .calendar-day-heading{display:grid;grid-template-columns:auto auto;justify-content:center;gap:2px 7px}
  .calendar-canvas[data-view="day"] .calendar-weekday{grid-column:1;font-size:.65rem;text-align:right}
  .calendar-canvas[data-view="day"] .calendar-date{grid-column:2;grid-row:1}
  .calendar-canvas[data-view="day"] .calendar-day-meta{grid-column:1/-1}
  .calendar-canvas[data-view="day"] .calendar-event{left:5px;right:5px;padding-inline:9px}
  .calendar-canvas[data-view="day"] .event-name{font-size:.8rem}
  .calendar-canvas[data-view="day"] .event-service{font-size:.71rem}
  .calendar-canvas[data-view="day"] .event-time{font-size:.67rem}
  .calendar-canvas[data-view="day"] .calendar-event.is-short{gap:9px;padding-inline:7px}
  .calendar-canvas[data-view="day"] .calendar-event.is-short .event-name{font-size:.72rem}
  .calendar-canvas[data-view="day"] .calendar-event.is-short .event-time{font-size:.62rem}
  .unavailable-label{font-size:.64rem}
  .calendar-legend{gap:7px 12px;font-size:.62rem}
  .calendar-tip{font-size:.66rem;line-height:1.6}
  .calendar-legend .calendar-tip{flex-basis:100%;margin:2px 0 0}
  #panel-planning .sync{margin-top:10px;gap:6px 10px}
  #panel-planning .sync-status{font-size:.64rem}
  .cancelled-history{margin-top:20px;padding-top:18px}
  .cancelled-row{padding:12px;gap:8px 12px;align-items:flex-start;font-size:.71rem}
  .cancelled-row button{font-size:.66rem}
  .event-dialog .dialog-actions .button{min-height:44px}
}
@media(max-width:379px){
  body:has(#workspace:not([hidden]) #panel-planning:not([hidden])) .brand>span{font-size:1.4rem}
  #panel-planning .section-heading{gap:10px}
  #panel-planning .section-heading h1{font-size:1.9rem}
  #panel-planning .section-heading>.button{max-width:112px;padding-inline:9px;font-size:.68rem}
  #panel-planning .section-heading p:not(.eyebrow){font-size:.71rem}
  #panel-planning .week-nav{grid-template-columns:auto minmax(0,1fr);gap:8px}
  #panel-planning .week-nav h2{text-align:right;font-size:.74rem}
  #panel-planning .week-nav .button-small{grid-column:1/-1;justify-self:start;min-height:34px}
  .calendar-controls{align-items:flex-end}
  .date-picker{flex-direction:column;align-items:flex-start;gap:4px}
  .date-picker input{width:130px}
  .view-switch button{padding-inline:11px;font-size:.68rem}
  .calendar-canvas{--rail-width:44px}
  .time-label{right:6px;font-size:.57rem}
  .calendar-corner{font-size:.5rem}
  .calendar-legend{font-size:.59rem;gap:6px 10px}
  .cancelled-row{flex-wrap:wrap}
  .cancelled-row button{min-height:34px}
  .event-facts{gap:9px;font-size:.72rem}
  .event-facts>div{gap:12px}
  .event-detail-time{font-size:1.9rem}
}
@media(prefers-reduced-motion:reduce){.calendar-event{transition:none}}