/* Shared calendar slot/card contract for Planning, Actuals, My Schedule and My Time. */

.rs-calendar-card {
  --shift-accent: var(--rst-op-planned-accent);
  --shift-bg: var(--rst-op-planned-bg);
  --shift-card-bg: var(--rst-op-planned-card-bg);
  --shift-border: var(--rst-op-planned-border);
  position: relative;
  min-width: var(--rst-calendar-card-min-width,0);
  min-height: 0;
  border: 1px solid var(--shift-border);
  border-radius: var(--rst-ui-radius-sm);
  background: var(--shift-card-bg,var(--shift-bg));
  color: var(--rst-ui-text);
  box-shadow: none;
  overflow: hidden;
  transition: border-color var(--rst-motion-ui) var(--rst-motion-smooth),background var(--rst-motion-ui) var(--rst-motion-smooth),opacity var(--rst-motion-ui) var(--rst-motion-smooth),transform var(--rst-motion-ui) var(--rst-motion-smooth);
}

.rs-calendar-card--available { --shift-accent: var(--rst-op-available-accent); --shift-bg: var(--rst-op-available-bg); --shift-card-bg: var(--rst-op-available-bg); --shift-border: var(--rst-op-available-border); }
.rs-calendar-card--planned { --shift-accent: var(--rst-op-planned-accent); --shift-bg: var(--rst-op-planned-bg); --shift-card-bg: var(--rst-op-planned-card-bg); --shift-border: var(--rst-op-planned-border); }
.rs-calendar-card--actual { --shift-accent: var(--rst-op-actual-accent); --shift-bg: var(--rst-op-actual-bg); --shift-card-bg: var(--rst-op-actual-card-bg); --shift-border: var(--rst-op-actual-border); }
.rs-calendar-card--live { --shift-accent: var(--rst-op-live-accent); --shift-bg: var(--rst-op-live-bg); --shift-card-bg: var(--rst-op-live-card-bg); --shift-border: var(--rst-op-live-border); }
.rs-calendar-card--warning { --shift-accent: var(--rst-op-partial-accent); --shift-bg: var(--rst-op-partial-bg); --shift-card-bg: var(--rst-op-partial-card-bg); --shift-border: var(--rst-op-partial-border); }
.rs-calendar-card--pending { --shift-accent: var(--rst-op-pending-accent); --shift-bg: var(--rst-op-pending-bg); --shift-card-bg: var(--rst-op-pending-card-bg); --shift-border: var(--rst-op-pending-border); }
.rs-calendar-card--absence { --shift-accent: var(--rst-op-absence-accent); --shift-bg: var(--rst-op-absence-bg); --shift-card-bg: var(--rst-op-absence-card-bg); --shift-border: var(--rst-op-absence-border); }
.rs-calendar-card--empty { --shift-accent: var(--rst-op-empty-accent); --shift-bg: var(--rst-op-empty-bg); --shift-card-bg: var(--rst-op-empty-bg); --shift-border: var(--rst-op-empty-border); opacity: .68; }

.rs-calendar-card:is(.rs-calendar-card--pending,.is-pending) { opacity: .74; border-style: dashed; }
.rs-calendar-card.rs-calendar-card--available :is(strong,small) { color: var(--rst-op-available-accent); }
.rs-calendar-card:is(.rs-calendar-card--actual,.rs-calendar-card--live) small { color: var(--rst-ui-muted); }
.rs-calendar-card:is(:hover,:focus-visible,:focus-within) { border-color: var(--shift-accent); }
.rs-calendar-card.has-conflict {
  --shift-border: var(--rst-op-conflict-border);
  box-shadow: inset 0 0 0 1px var(--rst-op-conflict-border);
}
.rs-calendar-card.has-conflict::after {
  content: '';
  position: absolute;
  inset: 0;
  border: 1px solid var(--rst-op-conflict-border);
  pointer-events: none;
}

.rs-calendar-card--density-weekly {
  display: grid;
  align-content: center;
  grid-template-rows: 18px 17px auto;
  gap: 2px;
  padding: 4px 6px;
  border-radius: var(--rst-ui-radius-sm);
}

.rs-calendar-card--density-weekly.has-conflict {
  padding-bottom: 14px;
}

.rs-calendar-card--density-icon-weekly,
.rs-calendar-card--density-icon-compact,
.rs-calendar-card--density-icon-dense {
  display: grid;
  align-items: center;
  text-align: left;
}

.rs-calendar-card--density-icon-weekly {
  min-height: 46px;
  grid-template-columns: 30px minmax(0,1fr);
  gap: 10px;
  padding: 7px 10px;
  border-radius: var(--rst-ui-radius-sm);
}

.rs-calendar-card--density-icon-compact {
  min-height: 48px;
  grid-template-columns: 24px minmax(0,1fr);
  gap: 6px;
  padding: 6px 7px;
  border-radius: var(--rst-ui-radius-xxs);
}

.rs-calendar-card--density-icon-dense {
  grid-template-columns: 20px minmax(0,1fr);
  gap: 5px;
  padding: 5px 6px;
  border-radius: var(--rst-ui-radius-xxs);
}

.rs-calendar-card--density-icon-weekly .rs-calendar-card-icon {
  width: 28px;
  height: 28px;
}

.rs-calendar-card--density-icon-compact .rs-calendar-card-icon {
  width: 22px;
  height: 22px;
  border-radius: var(--rst-ui-radius-xs);
}

.rs-calendar-card--density-icon-dense .rs-calendar-card-icon {
  width: 18px;
  height: 18px;
  border-radius: var(--rst-ui-radius-xs);
}

.rs-calendar-card--density-icon-weekly .rs-calendar-card-copy strong {
  font-size: clamp(13px,.9vw,15px);
  line-height: 1.05;
}

.rs-calendar-card--density-icon-weekly .rs-calendar-card-copy small {
  font-size: clamp(9px,.62vw,10.5px);
  line-height: 1.1;
  font-weight: var(--rst-fw-bold);
}

.rs-calendar-card--density-icon-compact .rs-calendar-card-copy strong {
  font-size: clamp(10.6px,.64vw,12px);
  line-height: 1.05;
}

.rs-calendar-card--density-icon-compact .rs-calendar-card-copy small {
  display: block;
  font-size: 8.6px;
  line-height: 1.05;
  font-weight: var(--rst-fw-bold);
}

.rs-calendar-card--density-icon-dense .rs-calendar-card-copy {
  gap: 1px;
}

.rs-calendar-card--density-icon-dense .rs-calendar-card-copy strong {
  font-size: clamp(10.8px,.64vw,12.3px);
  line-height: 13px;
}

.rs-calendar-card--density-icon-dense .rs-calendar-card-copy small {
  font-size: 8.7px;
  line-height: 10px;
}

.rs-calendar-card--density-icon-dense .rs-calendar-card-copy :is(em,b) {
  font-size: clamp(8.8px,.52vw,10px);
  line-height: 10px;
}

.rs-calendar-slot {
  position: relative;
  min-width: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  color: var(--rst-ui-text);
}
.rs-calendar-slot--availability-available { background: var(--rst-op-available-bg); }
.rs-calendar-slot--availability-partial { background: var(--rst-op-partial-bg); }
.rs-calendar-slot--availability-unavailable,
.rs-calendar-slot--availability-unknown { background: transparent; }
.rs-calendar-slot--conflict { background: var(--rst-calendar-slot-conflict-bg); }
.rs-calendar-slot--availability-available.rs-calendar-slot--conflict,
.rs-calendar-slot--availability-partial.rs-calendar-slot--conflict,
.rs-calendar-slot--availability-unavailable.rs-calendar-slot--conflict,
.rs-calendar-slot--availability-unknown.rs-calendar-slot--conflict { background: var(--rst-calendar-slot-conflict-bg); }

.rs-calendar-slot-add { display: grid; }


/* Shared simple calendar layout for calendars without employee rows (for example My Time). */
.rs-calendar-simple {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--rst-calendar-board-bg);
}

.rs-calendar-simple__scroll {
  min-width: 0;
  min-height: 0;
  overflow: auto;
  scrollbar-gutter: stable;
  background: var(--rst-calendar-board-bg);
}

.rs-calendar-simple__weekdays,
.rs-calendar-simple__grid {
  display: grid;
  grid-template-columns: repeat(7,minmax(var(--rst-calendar-simple-day-min,132px),1fr));
  min-width: calc(7 * var(--rst-calendar-simple-day-min,132px));
}

.rs-calendar-simple__weekdays {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--rst-calendar-header-bg);
}

.rs-calendar-simple__weekdays > span {
  min-height: 46px;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--rst-ui-divider-soft);
  border-bottom: 1px solid var(--rst-ui-divider);
  color: var(--rst-ui-text-heading);
  font-size: 11px;
  font-weight: var(--rst-fw-display);
  letter-spacing: .08em;
  text-transform: uppercase;
}

.rs-calendar-simple__weekdays > span:nth-child(7n),
.rs-calendar-day:nth-child(7n) { border-right: 0; }

.rs-calendar-simple__grid {
  grid-auto-rows: minmax(var(--rst-calendar-simple-day-h,116px),auto);
}

.rs-calendar-day {
  min-width: 0;
  min-height: var(--rst-calendar-simple-day-h,116px);
  padding: 7px;
  display: grid;
  grid-template-rows: auto minmax(0,1fr);
  gap: 6px;
  border-right: 1px solid var(--rst-ui-divider-soft);
  border-bottom: 1px solid var(--rst-ui-divider);
  background: var(--rst-calendar-cell-bg);
}

.rs-calendar-day.day-alt { background: var(--rst-calendar-cell-alt-bg); }
.rs-calendar-day.is-outside { opacity: .42; }

.rs-calendar-day__head {
  min-height: 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.rs-calendar-day__head strong {
  color: var(--rst-ui-text);
  font-size: 13px;
  font-weight: var(--rst-fw-display);
  line-height: 1;
}

.rs-calendar-day__total {
  min-height: 18px;
  padding: 3px 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--rst-ui-radius-pill);
  background: var(--rst-state-neutral-bg);
  color: var(--rst-ui-muted);
  font-size: 10px;
  font-weight: var(--rst-fw-bold);
  line-height: 1;
  white-space: nowrap;
}

.rs-calendar-day.is-live .rs-calendar-day__total {
  background: var(--rst-op-live-bg);
  color: var(--rst-op-live-accent);
}

.rs-calendar-day__slots {
  min-height: 0;
  display: grid;
  gap: 6px;
}

.rs-calendar-day__slots--services {
  grid-template-columns: repeat(2,minmax(var(--rst-calendar-card-min-width,68px),1fr));
  align-content: start;
}

/* Shared icon-led calendar card content. Module files may tune density only. */
.rs-calendar-card-icon {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 1px solid var(--shift-border);
  border-radius: var(--rst-ui-radius-sm);
  background: color-mix(in srgb,var(--shift-card-bg) 84%,var(--shift-accent) 16%);
  color: var(--shift-accent);
}

.rs-calendar-card-icon svg {
  width: 13px;
  height: 13px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rs-calendar-card-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.rs-calendar-card-copy :is(strong,small,em,b) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-style: normal;
}

.rs-calendar-card-copy strong {
  color: var(--rst-ui-text);
  font-weight: var(--rst-fw-bold);
}

.rs-calendar-card-copy small {
  color: var(--rst-ui-muted);
  font-weight: var(--rst-fw-medium);
}

.rs-calendar-card-copy :is(em,b) {
  color: var(--shift-accent);
  font-weight: var(--rst-fw-bold);
}