/* Keep the calendar compact without changing other business screens. */
html body>main:has(>#business-dashboard.active [data-biz-view="calendar"]:not([hidden])){padding:8px}
html body>main>#business-dashboard.active:has([data-biz-view="calendar"]:not([hidden])){width:100%;max-width:680px;flex:0 0 auto;min-height:0;padding:8px;margin-inline:auto;align-self:center}
html body main #business-dashboard:has([data-biz-view="calendar"]:not([hidden])) :is(.biz-shell,.biz-body){width:100%;min-height:0;flex:0 0 auto;padding:0;margin:0}
html body main #business-dashboard [data-biz-view="calendar"]:not([hidden]){flex:0 0 auto;min-height:0;width:100%}
html body main #business-dashboard [data-biz-view="calendar"]>.biz-box:has(#biz-live-calendar){flex:0 0 auto;width:100%;min-height:0;padding:8px;margin:6px 0 0}
html body main #biz-live-calendar{flex:0 0 auto;min-height:0;width:100%}
html body main #biz-live-calendar .bc-month{flex:0 0 auto;gap:3px 2px}
html body main #biz-live-calendar[data-view="month"] .bc-month{grid-template-rows:24px!important;grid-auto-rows:clamp(48px,7dvh,60px)}
html body main #biz-live-calendar .bc-date{min-height:44px;font-size:17px}
html body main #biz-live-calendar .bc-tabs{gap:5px;margin-bottom:6px}
html body main #biz-live-calendar .bc-tabs>button{min-height:44px;padding:4px;font-size:14px}
html body main #biz-live-calendar .bc-navigation{grid-template-columns:44px minmax(0,1fr) 44px;font-size:16px;margin:0}
html body main #biz-live-calendar .bc-weekday{font-size:12px}
html body main #biz-live-calendar .bc-zone{font-size:12px;margin:6px 0}
html body main #business-dashboard:has([data-biz-view="calendar"]:not([hidden])) .biz-calendar-home{top:0;right:0}

html body main #biz-live-calendar button.bc-appointment{display:block;width:100%;text-align:center;border:0;border-left:3px solid #23783d;background:#f3f7f4;padding:12px;cursor:pointer}
html body main #biz-live-calendar button.bc-appointment:focus-visible{outline:2px solid #172d71;outline-offset:2px}

/* Seven visible appointments; further appointments scroll inside the day. */
html body main #biz-live-calendar .bc-agenda{--bc-agenda-height:calc(100dvh - 230px);display:grid;grid-auto-flow:row;gap:4px;align-content:start;max-height:var(--bc-agenda-height);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
html body main #biz-live-calendar .bc-agenda:has(>.dense){grid-auto-rows:calc((var(--bc-agenda-height) - 24px)/7)}
html body main #biz-live-calendar .bc-agenda button.bc-appointment{box-sizing:border-box;min-width:0;margin:0}
html body main #biz-live-calendar .bc-agenda button.bc-appointment.dense{min-height:44px;height:100%;padding:3px 6px;overflow:hidden}
html body main #biz-live-calendar .dense .bc-summary{display:grid;grid-template-columns:auto minmax(0,1fr);gap:2px 6px;align-items:center;font-size:12px;line-height:1.15}
html body main #biz-live-calendar .dense .bc-summary>span:last-child{grid-column:1/-1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html body main #biz-live-calendar .dense .job-status-color{padding:2px 5px;font-size:11px;line-height:1.2;white-space:nowrap}
html body main #biz-live-calendar .dense .bc-summary>strong{font-size:12px;white-space:nowrap}

#biz-calendar-today{display:none}
html body main #business-dashboard:has([data-biz-view="calendar"]:not([hidden]) #biz-live-calendar[data-today-only="true"]) #biz-calendar-today{display:block;position:absolute;top:0;left:50%;transform:translateX(-50%);width:auto;min-height:44px;margin:0;padding:4px 12px;border:1px solid #172d71;border-radius:8px;background:#172d71;color:#fff;font:inherit;font-size:14px;font-weight:700;z-index:1}
html body main #biz-live-calendar[data-today-only="true"] .bc-tabs{display:none}