/* BuzOps V3 scheduling and appointment-services product page. */

.scheduling-hero-console {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 1.35rem;
  background: var(--bz-white);
  box-shadow: 0 2rem 5.5rem rgba(0,0,0,.34);
  color: var(--bz-ink-900);
  transform: perspective(1400px) rotateY(-3.5deg) rotateX(1deg);
  transform-origin: center;
}

.scheduling-hero-console__bar {
  display: flex;
  min-height: 3rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid var(--bz-border);
  background: #fbfdfe;
  padding-inline: 1rem;
}

.scheduling-hero-console__brand {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--bz-ink-900);
  font-family: var(--bz-font-display);
  font-size: .7rem;
  font-weight: 700;
}

.scheduling-hero-console__brand::before {
  width: .65rem;
  height: .65rem;
  border-radius: .2rem;
  background: var(--bz-orange-500);
  box-shadow: 0 0 0 .22rem var(--bz-orange-50);
  content: "";
}

.scheduling-hero-console__body {
  display: grid;
  grid-template-columns: 3.4rem minmax(0,1fr);
  min-height: 34rem;
}

.scheduling-hero-console__rail {
  display: grid;
  align-content: start;
  gap: .5rem;
  border-right: 1px solid var(--bz-border);
  background: #fbfdfe;
  padding: 1rem .65rem;
}

.scheduling-hero-console__rail span {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: .62rem;
  color: var(--bz-ink-400);
  font-size: .62rem;
  font-weight: 700;
}

.scheduling-hero-console__rail span[aria-current="page"] {
  background: var(--bz-orange-50);
  color: var(--bz-orange-700);
}

.scheduling-hero-console__canvas {
  min-width: 0;
  background: var(--bz-canvas);
  padding: 1rem;
}

.scheduling-console-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .8rem;
}

.scheduling-console-head strong {
  display: block;
  color: var(--bz-ink-950);
  font-family: var(--bz-font-display);
  font-size: .88rem;
}

.scheduling-console-head small {
  display: block;
  margin-top: .15rem;
  color: var(--bz-ink-500);
  font-size: .54rem;
}

.scheduling-console-controls {
  display: flex;
  align-items: center;
  gap: .4rem;
}

.scheduling-calendar-wrap {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--bz-border);
  border-radius: .85rem;
  background: var(--bz-white);
  box-shadow: var(--bz-shadow-xs);
}

.scheduling-calendar {
  display: grid;
  min-width: 38rem;
  grid-template-columns: 3.7rem repeat(5,minmax(0,1fr));
}

.scheduling-calendar > div {
  min-height: 3.5rem;
  border-right: 1px solid var(--bz-border);
  border-bottom: 1px solid var(--bz-border);
  background: var(--bz-white);
  padding: .42rem;
}

.scheduling-calendar > div:nth-child(6n) { border-right:0; }

.scheduling-calendar__head {
  min-height: 2.4rem!important;
  background: #fbfdfe!important;
  color: var(--bz-ink-500);
  font-size: .48rem;
  font-weight: 700;
  text-align: center;
}

.scheduling-calendar__head strong {
  display: block;
  color: var(--bz-ink-800);
  font-size: .55rem;
}

.scheduling-calendar__time {
  color: var(--bz-ink-400);
  font-size: .47rem;
}

.scheduling-calendar__event {
  border: 1px solid var(--event-border,var(--bz-cyan-200))!important;
  border-radius: .5rem;
  background: var(--event-soft,var(--bz-cyan-50))!important;
  color: var(--event-ink,var(--bz-cyan-800));
  font-size: .46rem;
  font-weight: 600;
  line-height: 1.35;
}

.scheduling-calendar__event small {
  display: block;
  margin-top: .12rem;
  color: inherit;
  font-size: .4rem;
  font-weight: 500;
  opacity: .78;
}

.scheduling-hero-float {
  position: absolute;
  z-index: 3;
  width: min(13rem,42%);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: .95rem;
  background: rgba(255,255,255,.97);
  box-shadow: 0 1.2rem 3rem rgba(0,0,0,.24);
  color: var(--bz-ink-900);
  padding: .85rem;
  backdrop-filter: blur(14px);
}

.scheduling-hero-float--service {
  top: -.4rem;
  right: -.9rem;
}

.scheduling-hero-float--booking {
  bottom: -.4rem;
  left: -.8rem;
}

.scheduling-hero-visual-stage {
  position: relative;
  min-width: 0;
  padding: 1rem .65rem 1.8rem 1rem;
}

.scheduling-hero-float__head {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .55rem;
}

.scheduling-hero-float__icon {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: .62rem;
  background: var(--float-soft,var(--bz-orange-50));
  color: var(--float-ink,var(--bz-orange-700));
  font-size: .58rem;
  font-weight: 700;
}

.scheduling-hero-float strong {
  display: block;
  color: var(--bz-ink-900);
  font-size: .65rem;
}

.scheduling-hero-float small {
  display: block;
  margin-top: .1rem;
  color: var(--bz-ink-500);
  font-size: .48rem;
}

.scheduling-hero-float__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  border-top: 1px solid var(--bz-border);
  padding-top: .5rem;
}

.scheduling-hero-float__row span {
  color: var(--bz-ink-500);
  font-size: .5rem;
}

.scheduling-service-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: .65rem;
}

.scheduling-service-card {
  min-height: 10.5rem;
  border: 1px solid var(--bz-border);
  border-radius: .82rem;
  background: var(--bz-white);
  padding: .85rem;
}

.scheduling-service-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .65rem;
  margin-bottom: .7rem;
}

.scheduling-service-card__icon {
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border-radius: .62rem;
  background: var(--service-soft,var(--bz-cyan-50));
  color: var(--service-ink,var(--bz-cyan-700));
  font-size: .55rem;
  font-weight: 700;
}

.scheduling-service-card strong {
  display: block;
  color: var(--bz-ink-900);
  font-size: .65rem;
}

.scheduling-service-card p {
  margin: .28rem 0 .7rem;
  color: var(--bz-ink-500);
  font-size: .52rem;
  line-height: 1.45;
}

.scheduling-service-facts {
  display: grid;
  gap: .4rem;
}

.scheduling-service-fact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .6rem;
  border-top: 1px solid var(--bz-border);
  padding-top: .4rem;
}

.scheduling-service-fact span,
.scheduling-service-fact strong {
  font-size: .48rem;
}

.scheduling-service-fact span { color:var(--bz-ink-500); }
.scheduling-service-fact strong { color:var(--bz-ink-800); }

.scheduling-availability-layout {
  display: grid;
  grid-template-columns: minmax(12rem,.72fr) minmax(0,1.28fr);
  gap: .7rem;
}

.scheduling-staff-list,
.scheduling-availability-board {
  border: 1px solid var(--bz-border);
  border-radius: .82rem;
  background: var(--bz-white);
  padding: .8rem;
}

.scheduling-panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  margin-bottom: .7rem;
}

.scheduling-panel-title strong {
  color: var(--bz-ink-900);
  font-size: .64rem;
}

.scheduling-staff-item {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: .55rem;
  border-bottom: 1px solid var(--bz-border);
  padding-block: .58rem;
}

.scheduling-staff-item:last-child { border-bottom:0; }

.scheduling-staff-avatar {
  display: grid;
  width: 1.9rem;
  height: 1.9rem;
  place-items: center;
  border-radius: 50%;
  background: var(--avatar-soft,var(--bz-cyan-50));
  color: var(--avatar-ink,var(--bz-cyan-700));
  font-size: .52rem;
  font-weight: 700;
}

.scheduling-staff-item strong {
  display: block;
  color: var(--bz-ink-800);
  font-size: .56rem;
}

.scheduling-staff-item small {
  display: block;
  margin-top: .1rem;
  color: var(--bz-ink-500);
  font-size: .46rem;
}

.scheduling-availability-grid {
  display: grid;
  grid-template-columns: 4.3rem repeat(5,minmax(0,1fr));
  min-width: 34rem;
  border: 1px solid var(--bz-border);
  border-radius: .72rem;
  overflow: hidden;
}

.scheduling-availability-grid > div {
  min-height: 2.6rem;
  display: grid;
  place-items: center;
  border-right: 1px solid var(--bz-border);
  border-bottom: 1px solid var(--bz-border);
  background: var(--bz-white);
  color: var(--bz-ink-500);
  font-size: .46rem;
  padding: .3rem;
}

.scheduling-availability-grid > div:nth-child(6n) { border-right:0; }
.scheduling-availability-grid__head { background:#fbfdfe!important; font-weight:700; color:var(--bz-ink-700)!important; }
.scheduling-availability-grid__open { background:var(--bz-success-soft)!important; color:#087a59!important; font-weight:700; }
.scheduling-availability-grid__busy { background:var(--bz-orange-50)!important; color:var(--bz-orange-700)!important; font-weight:700; }
.scheduling-availability-grid__off { background:var(--bz-ink-50)!important; color:var(--bz-ink-300)!important; }

.scheduling-booking-layout {
  display: grid;
  grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr);
  gap: .7rem;
}

.scheduling-booking-steps,
.scheduling-booking-summary {
  border: 1px solid var(--bz-border);
  border-radius: .82rem;
  background: var(--bz-white);
  padding: .85rem;
}

.scheduling-booking-steps {
  display: grid;
  gap: .55rem;
}

.scheduling-booking-step {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: .55rem;
  align-items: start;
}

.scheduling-booking-step__index {
  display: grid;
  width: 1.55rem;
  height: 1.55rem;
  place-items: center;
  border-radius: .5rem;
  background: var(--step-soft,var(--bz-cyan-50));
  color: var(--step-ink,var(--bz-cyan-700));
  font-size: .5rem;
  font-weight: 700;
}

.scheduling-booking-step strong {
  display:block;
  color:var(--bz-ink-800);
  font-size:.56rem;
}

.scheduling-booking-step small {
  display:block;
  margin-top:.1rem;
  color:var(--bz-ink-500);
  font-size:.46rem;
}

.scheduling-booking-summary__service {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: .65rem;
  border: 1px solid var(--bz-border);
  border-radius: .72rem;
  background: #fcfdfe;
  padding: .7rem;
  margin-bottom: .7rem;
}

.scheduling-booking-summary__service strong {
  display:block;
  color:var(--bz-ink-800);
  font-size:.58rem;
}

.scheduling-booking-summary__service small {
  display:block;
  margin-top:.1rem;
  color:var(--bz-ink-500);
  font-size:.47rem;
}

.scheduling-time-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: .45rem;
}

.scheduling-time-slot {
  min-height: 2.4rem;
  display: grid;
  place-items: center;
  border: 1px solid var(--bz-border);
  border-radius: .65rem;
  background: var(--bz-white);
  color: var(--bz-ink-600);
  font-size: .52rem;
  font-weight: 600;
}

.scheduling-time-slot--selected {
  border-color: var(--bz-cyan-600);
  background: var(--bz-cyan-50);
  color: var(--bz-cyan-800);
}

.scheduling-capacity-layout {
  display: grid;
  grid-template-columns: minmax(0,1.15fr) minmax(12rem,.85fr);
  gap: .7rem;
}

.scheduling-class-roster,
.scheduling-capacity-card {
  border: 1px solid var(--bz-border);
  border-radius: .82rem;
  background: var(--bz-white);
  padding: .8rem;
}

.scheduling-roster-row {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: .55rem;
  border-bottom: 1px solid var(--bz-border);
  padding-block: .55rem;
}

.scheduling-roster-row:last-child { border-bottom:0; }

.scheduling-roster-row strong {
  display:block;
  color:var(--bz-ink-800);
  font-size:.56rem;
}

.scheduling-roster-row small {
  display:block;
  margin-top:.1rem;
  color:var(--bz-ink-500);
  font-size:.46rem;
}

.scheduling-capacity-gauge {
  display: grid;
  width: 7.5rem;
  height: 7.5rem;
  margin: .7rem auto 1rem;
  place-items: center;
  border: .7rem solid var(--bz-cyan-100);
  border-top-color: var(--bz-cyan-600);
  border-right-color: var(--bz-cyan-500);
  border-bottom-color: var(--bz-orange-400);
  border-radius: 50%;
  color: var(--bz-ink-950);
  font-family: var(--bz-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  transform: rotate(18deg);
}

.scheduling-capacity-gauge span { transform:rotate(-18deg); text-align:center; }
.scheduling-capacity-gauge small { display:block; margin-top:.15rem; color:var(--bz-ink-500); font-family:var(--bz-font-body); font-size:.44rem; font-weight:400; }

.scheduling-capacity-facts {
  display:grid;
  gap:.48rem;
}

.scheduling-capacity-fact {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.6rem;
  border-top:1px solid var(--bz-border);
  padding-top:.48rem;
}

.scheduling-capacity-fact span,
.scheduling-capacity-fact strong { font-size:.5rem; }
.scheduling-capacity-fact span { color:var(--bz-ink-500); }
.scheduling-capacity-fact strong { color:var(--bz-ink-800); }

.scheduling-delivery-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.scheduling-delivery-card {
  min-height:100%;
  border:1px solid var(--bz-border);
  border-radius:var(--bz-radius-lg);
  background:var(--bz-white);
  box-shadow:var(--bz-shadow-xs);
  padding:1.3rem;
}

.scheduling-delivery-card__icon {
  display:grid;
  width:2.55rem;
  height:2.55rem;
  margin-bottom:1rem;
  place-items:center;
  border-radius:.78rem;
  background:var(--delivery-soft,var(--bz-cyan-50));
  color:var(--delivery-ink,var(--bz-cyan-700));
  font-family:var(--bz-font-display);
  font-size:.68rem;
  font-weight:700;
}

.scheduling-delivery-card h3 { margin-bottom:.45rem; font-size:1.05rem; }
.scheduling-delivery-card p { margin:0; font-size:.78rem; }

.scheduling-flow {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:.75rem;
}

.scheduling-flow-step {
  position:relative;
  min-height:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--bz-radius-lg);
  background:rgba(255,255,255,.055);
  padding:1.2rem;
  backdrop-filter:blur(10px);
}

.scheduling-flow-step:not(:last-child)::after {
  position:absolute;
  top:1.85rem;
  right:-.65rem;
  color:var(--bz-cyan-200);
  content:"→";
  font-size:.75rem;
}

.scheduling-flow-step__index {
  display:grid;
  width:2.15rem;
  height:2.15rem;
  margin-bottom:.9rem;
  place-items:center;
  border-radius:.68rem;
  background:rgba(123,207,225,.14);
  color:var(--bz-cyan-200);
  font-family:var(--bz-font-display);
  font-size:.64rem;
  font-weight:700;
}

.scheduling-flow-step:nth-child(2) .scheduling-flow-step__index,
.scheduling-flow-step:nth-child(5) .scheduling-flow-step__index {
  background:rgba(255,160,77,.14);
  color:var(--bz-orange-200);
}

.scheduling-flow-step h3 { margin-bottom:.4rem; color:var(--bz-white); font-size:1rem; }
.scheduling-flow-step p { margin:0; color:#aebccd; font-size:.74rem; }

.scheduling-model-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1rem;
}

.scheduling-model-card {
  min-height:100%;
  border:1px solid var(--bz-border);
  border-radius:var(--bz-radius-lg);
  background:var(--bz-white);
  box-shadow:var(--bz-shadow-xs);
  padding:1.3rem;
}

.scheduling-model-card__icon {
  display:grid;
  width:2.55rem;
  height:2.55rem;
  margin-bottom:1rem;
  place-items:center;
  border-radius:.78rem;
  background:var(--model-soft,var(--bz-cyan-50));
  color:var(--model-ink,var(--bz-cyan-700));
  font-family:var(--bz-font-display);
  font-size:.68rem;
  font-weight:700;
}

.scheduling-model-card h3 { margin-bottom:.45rem; font-size:1.05rem; }
.scheduling-model-card p { margin:0; font-size:.78rem; }

@media(max-width:72rem){
  .scheduling-delivery-grid,.scheduling-model-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scheduling-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
  .scheduling-flow-step:not(:last-child)::after{display:none}
}

@media(max-width:64rem){
  .scheduling-hero-console{transform:none}
  .scheduling-hero-float--service{right:0}
  .scheduling-hero-float--booking{left:0}
}

@media(max-width:48rem){
  .scheduling-hero-console__body{grid-template-columns:2.8rem minmax(0,1fr)}
  .scheduling-hero-console__rail{padding-inline:.4rem}
  .scheduling-hero-float{display:none}
  .scheduling-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .scheduling-availability-layout,.scheduling-booking-layout,.scheduling-capacity-layout{grid-template-columns:1fr}
  .scheduling-availability-board{overflow-x:auto}
  .scheduling-flow{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:36rem){
  .scheduling-hero-visual-stage{padding-inline:0}
  .scheduling-hero-console__body{display:block;min-height:0}
  .scheduling-hero-console__rail{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid var(--bz-border);padding:.55rem}
  .scheduling-hero-console__canvas{padding:.75rem}
  .scheduling-console-head{display:block}
  .scheduling-console-controls{margin-top:.5rem}
  .scheduling-service-grid,.scheduling-delivery-grid,.scheduling-flow,.scheduling-model-grid{grid-template-columns:1fr}
  .scheduling-time-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(prefers-reduced-motion:reduce){.scheduling-hero-console{transform:none!important}}
