.calendar-nonworking-band { position:absolute; left:0; right:0; background:rgba(75,85,90,.085); pointer-events:none; z-index:0; }
.desktop-calendar-zoom { display:flex; gap:3px; align-items:center; }
.desktop-calendar-zoom button { background:#fff; color:#34483c; border:1px solid #d7ddd8; border-radius:8px; min-height:38px; padding:7px 12px; }
@media (max-width:760px) { .desktop-calendar-zoom { display:none; } }
@media (min-width:761px) {
  .ops-calendar-page .ops-time-column { background-size:100% var(--calendar-hour-height,72px),100% calc(var(--calendar-hour-height,72px) / 2),100% calc(var(--calendar-hour-height,72px) / 4); }
  .calendar-zoom-compact .ops-time-labels > .quarter { visibility:hidden; }
}
/* Desktop only: do not change the reviewed phone calendar. */
@media (min-width:761px) {
  .ops-calendar-page .ops-day-grid { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; -webkit-font-smoothing:antialiased; }
  .ops-calendar-page .ops-time-labels > div,
  .ops-calendar-page .ops-time-labels > div.hour { font-weight:400; color:#7b8086; }
  .ops-calendar-page .ops-time-labels > div.quarter { font-weight:400; color:#8b9096; }
  /* A crisp separator, not a shadow; preserve the keyboard focus outline. */
  .ops-calendar-page .ops-day-grid .ops-event.overlapping-appointment:not(:focus-visible) { outline:1px solid #fff; outline-offset:0; }
  /* Key colors by stylist, not column position, to match the Square reference. */
  .ops-calendar-page .ops-staff-column { --desktop-stylist-color:#65737d; }
  .ops-calendar-page .ops-staff-column[data-stylist="fernanda"] { --desktop-stylist-color:#96bd0b; }
  .ops-calendar-page .ops-staff-column[data-stylist="yasmin"] { --desktop-stylist-color:#39834d; }
  .ops-calendar-page .ops-staff-column[data-stylist="sophia"],
  .ops-calendar-page .ops-staff-column[data-stylist="leandro"] { --desktop-stylist-color:#c35c0d; }
  .ops-calendar-page .ops-staff-column[data-stylist="vinicius"] { --desktop-stylist-color:#006aff; }
  .ops-calendar-page .ops-staff-column[data-stylist="luiza"] { --desktop-stylist-color:#16abae; }
  .ops-calendar-page .ops-staff-column[data-stylist="alejandra"] { --desktop-stylist-color:#8f2bb0; }
  .ops-calendar-page .ops-staff-heading .ops-avatar { background:var(--desktop-stylist-color); }
  .ops-calendar-page .ops-day-grid .ops-event.upcoming { background:var(--desktop-stylist-color); }
  .ops-calendar-page .ops-day-grid .ops-event.completed {
    background:color-mix(in srgb,var(--desktop-stylist-color) 18%,white);
    color:var(--desktop-stylist-color);
  }
  .ops-calendar-page .ops-day-grid .ops-block-event,
  .ops-calendar-page .ops-day-grid .ops-note-event { background:#ececee; color:var(--desktop-stylist-color); box-shadow:none; }
  .ops-calendar-page .ops-event,
  .ops-calendar-page .ops-event:hover,
  .ops-calendar-page .ops-week-event { border-left-width:0; box-shadow:none; }
  .ops-calendar-page .ops-day-grid .ops-event {
    left:var(--desktop-event-left)!important;
    width:var(--desktop-event-width)!important;
    min-width:0;
  }
  .ops-calendar-page .ops-day-grid .ops-event.canceled,
  .ops-calendar-page .ops-day-grid .ops-event.canceled:hover,
  .ops-calendar-page .ops-day-grid .ops-event.canceled:focus-visible { z-index:1; }
  .ops-calendar-page .ops-day-grid .ops-event:not(.canceled) { z-index:2; }
  .ops-calendar-page .ops-day-grid .ops-event:not(.canceled):hover { z-index:8; }
  .ops-calendar-page .ops-day-grid .ops-event:not(.canceled):focus-visible { z-index:9; }
  /* An underlying cancellation no longer makes a full-width visit compact. */
  .ops-calendar-page .ops-event.desktop-roomy.compact strong { margin-top:5px; font-size:16px; line-height:1.2; }
  .ops-calendar-page .ops-event.desktop-roomy.compact .ops-event-time { font-size:14px; line-height:1.15; }
  .ops-calendar-page .ops-event.desktop-roomy.compact .ops-event-service,
  .ops-calendar-page .ops-event.desktop-roomy.compact>em { display:block; }
  .ops-calendar-page .ops-event.desktop-roomy.compact .ops-event-markers { display:flex; }
  /* Keep the larger type, but soften its weight for easier scanning. */
  .ops-calendar-page .ops-event strong,
  .ops-calendar-page .ops-week-event strong { font-weight:600; }
  .ops-calendar-page .ops-day-grid .ops-event>strong,
  .ops-calendar-page .ops-day-grid .ops-event>.ops-event-time { flex-shrink:0; }
  .ops-calendar-page .ops-event .ops-event-time,
  .ops-calendar-page .ops-day-grid .ops-event>.ops-event-service,
  .ops-calendar-page .ops-event .ops-event-service-list b,
  .ops-calendar-page .ops-event .ops-event-service-list small,
  .ops-calendar-page .ops-week-event time,
  .ops-calendar-page .ops-week-event>span { font-weight:400; }
  .ops-calendar-page .ops-event em { font-weight:600; }
  /* Match the phone's active/inactive text treatment, without changing colors. */
  .ops-calendar-page .ops-day-grid .ops-event.upcoming { color:#fff; }
  .ops-calendar-page .ops-event.upcoming .ops-event-visit-position { color:#17242a; }
  /* A narrow badge rail reserves real space instead of covering the visit text. */
  .ops-calendar-page .ops-event:has(>.ops-event-markers) { padding-right:28px; }
  .ops-calendar-page .ops-event.compact:not(.desktop-roomy):not(.reward-ready):not(.new-client) { padding-right:6px; }
  .ops-calendar-page .ops-event .ops-event-markers {
    flex-direction:column;
    align-items:flex-end;
    width:20px;
    max-height:calc(100% - 8px);
    overflow:hidden;
  }
  .ops-calendar-page .ops-event .ops-event-markers>span { flex-shrink:0; color:#17242a; }
  .ops-calendar-page .ops-event .ops-event-markers .ops-loyalty-reward-marker { color:#815b00; }
  .ops-calendar-page .ops-event .ops-event-markers .ops-new-client-marker { min-width:18px; padding:0 1px; font-size:7px; color:#2f6840; }
  .ops-calendar-page .ops-event .ops-event-time { max-width:100%; overflow:hidden; text-overflow:ellipsis; }
  /* The full discount and its history remain in the appointment detail panel. */
  .ops-calendar-page .ops-event .ops-event-markers .ops-rebooking-badge { display:none!important; }
}
.desktop-calendar-visibility { position: relative; }
.desktop-calendar-visibility > summary { cursor: pointer; padding: 12px 16px; border: 1px solid #d7ddd8; border-radius: 10px; background: #fff; font-weight: 600; }
.desktop-calendar-visibility-panel { position: absolute; right: 0; top: calc(100% + 8px); z-index: 100; width: 280px; padding: 18px; border: 1px solid #d7ddd8; border-radius: 12px; background: #fff; box-shadow: 0 8px 24px #0002; display: grid; gap: 14px; }
.desktop-calendar-visibility-panel label { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.desktop-calendar-visibility-panel input { width: 18px; height: 18px; accent-color: #285b43; }
.desktop-calendar-visibility-panel small { color: #68736b; line-height: 1.4; }
@media (max-width: 760px) { .desktop-calendar-visibility { display: none; } }

/* Preserve the date button's geometry and hit area; desktop only. */
@media (min-width: 761px) {
  #date-picker-button > span:last-child:not([id]) { opacity: 0; }
}