:root {
  --cream: #f5efe3;
  --sand: #e3d7c4;
  --ink: #24211d;
  --muted: #655d53;
  --charcoal: #232323;
  --charcoal-soft: #2d2d2d;
  --accent: #b4432d;
  --accent-dark: #8f3321;
  --gold: #b68b3f;
  --line: rgba(36, 33, 29, 0.12);
  --success-bg: #eef6ee;
  --success-text: #215a2a;
  --error-bg: #f9e8e4;
  --error-text: #8a2f21;
  --max: 1120px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: "Source Sans 3", Arial, sans-serif;
  color: var(--ink);
  background: var(--cream);
}

a {
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
}

.container {
  width: min(var(--max), calc(100% - 2rem));
  margin: 0 auto;
}

.topbar {
  background: var(--charcoal);
  color: #f7f2ea;
  font-size: 0.95rem;
}

.topbar .container {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 0;
  flex-wrap: wrap;
}

.topbar a {
  text-decoration: none;
  font-weight: 700;
}

.nav {
  background: #fff;
  border-bottom: 1px solid var(--line);
}

.nav .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
  flex-wrap: wrap;
}

.brand {
  text-decoration: none;
}

.brand-title {
  margin: 0;
  font-family: "Oswald", Arial, sans-serif;
  font-size: 2rem;
  line-height: 1;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.brand-subtitle {
  margin-top: 0.2rem;
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.nav-links {
  display: flex;
  gap: 1.2rem;
  align-items: center;
  flex-wrap: wrap;
}

.nav-links a,
.nav-links button {
  text-decoration: none;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 0.92rem;
  letter-spacing: 0.04em;
}

.button,
.button-outline,
.button-secondary,
.link-button {
  display: inline-block;
  padding: 0.92rem 1.4rem;
  text-decoration: none;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border: 0;
  cursor: pointer;
}

.button {
  background: var(--accent);
  color: #fff;
}

.button:hover,
.button:focus-visible {
  background: var(--accent-dark);
}

.button-outline {
  border: 1px solid rgba(255, 255, 255, 0.55);
  color: #fff;
}

.button-secondary {
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
}

.button-secondary:hover,
.button-secondary:focus-visible {
  background: #faf8f4;
}

.link-button {
  padding-left: 0;
  padding-right: 0;
  background: transparent;
  color: var(--accent);
}

.page-hero,
.staff-hero {
  padding: 4.5rem 0;
  border-bottom: 1px solid var(--line);
  background:
    linear-gradient(rgba(20, 18, 15, 0.58), rgba(20, 18, 15, 0.64)),
    url("../old-site/newhack6.jpg") center center / cover no-repeat;
  color: #fff;
}

.page-hero h1,
.staff-hero h1,
h2,
h3 {
  margin: 0;
  font-family: "Oswald", Arial, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1;
}

.page-hero h1,
.staff-hero h1 {
  font-size: clamp(2.8rem, 5vw, 4.5rem);
  margin-bottom: 1rem;
}

.page-hero p,
.staff-hero p {
  max-width: 44rem;
  margin: 0;
  line-height: 1.75;
  color: rgba(255, 255, 255, 0.9);
  font-size: 1.08rem;
}

.section {
  padding: 4rem 0;
}

.panel {
  background: #fff;
  border: 1px solid var(--line);
  padding: 1.5rem;
}

/* Independent rows flow beside the callout, then reclaim the form width. */
.scheduler-booking form { display: flow-root; }
.scheduler-booking .form-card > h2 { margin-bottom: 1.25rem; }
.scheduler-booking .scheduler-review {
  float: right;
  width: 18rem;
  margin: 0 0 1.25rem 1.5rem;
  padding: 1.15rem;
  background: #f5f5f4;
  border-radius: 4px;
}
.scheduler-review .intro-copy { margin: .85rem 0; line-height: 1.55; }
.scheduler-review .callout { padding: 0; border: 0; background: transparent; line-height: 1.55; }
.scheduler-review a { display: inline-block; padding-block: .35rem; }
.scheduler-booking .scheduler-form-row { margin-bottom: 1rem; }
.scheduler-booking .form-actions,
.scheduler-booking .status-message { clear: both; }
@media (max-width: 960px) {
  .scheduler-booking .scheduler-review { float: none; width: auto; margin: 0 0 1.5rem; }
}

.columns-2 {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
  gap: 1.5rem;
}

.intro-copy,
.panel p,
.panel li {
  color: var(--muted);
  line-height: 1.75;
}

.eyebrow {
  display: inline-block;
  margin-bottom: 0.8rem;
  color: var(--accent);
  font-size: 0.86rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.callout {
  margin-top: 1rem;
  padding: 1rem 1.15rem;
  border-left: 4px solid var(--gold);
  background: #faf8f4;
  color: var(--ink);
  line-height: 1.65;
}

.form-card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 1.75rem;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem 1.2rem;
}

.field {
  display: grid;
  gap: 0.45rem;
}

.field--full {
  grid-column: 1 / -1;
}

.field label {
  font-weight: 700;
  color: var(--ink);
}

.field label .required-mark {
  color: var(--accent);
  margin-left: 0.2rem;
}

.field small {
  color: var(--muted);
  line-height: 1.5;
}

.field-error {
  display: none;
  color: var(--error-text);
  font-size: 0.92rem;
  line-height: 1.4;
}

.field-error.is-visible {
  display: block;
}

.field input.is-invalid,
.field select.is-invalid,
.field textarea.is-invalid {
  border-color: rgba(138, 47, 33, 0.6);
  background: #fff8f6;
}

.field input,
.field select,
.field textarea {
  width: 100%;
  padding: 0.9rem 0.95rem;
  border: 1px solid rgba(36, 33, 29, 0.18);
  background: #fff;
  color: var(--ink);
  font: inherit;
}

.field textarea {
  min-height: 150px;
  resize: vertical;
}

.checkbox-row {
  display: flex;
  align-items: center;
  gap: 0.7rem;
}

.checkbox-row input {
  width: auto;
}

.form-actions {
  display: flex;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-top: 1.4rem;
}

.status-message {
  display: none;
  margin-top: 1rem;
  padding: 0.95rem 1rem;
  border: 1px solid transparent;
  line-height: 1.6;
}

.status-message.is-visible {
  display: block;
}

.status-message.is-success {
  background: var(--success-bg);
  border-color: rgba(33, 90, 42, 0.18);
  color: var(--success-text);
}

.status-message.is-error {
  background: var(--error-bg);
  border-color: rgba(138, 47, 33, 0.18);
  color: var(--error-text);
}

.steps-list,
.contact-list,
.detail-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.95rem;
}

.steps-list li,
.detail-list li {
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  background: #fff;
}

.steps-list strong,
.detail-list strong,
.contact-list strong {
  display: block;
  margin-bottom: 0.2rem;
  color: var(--ink);
  font-size: 0.88rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.footer {
  background: #fff;
  border-top: 1px solid var(--line);
  padding: 1.5rem 0;
  color: var(--muted);
  font-size: 0.95rem;
}

.footer .container {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
  align-items: center;
}

.login-shell {
  min-height: calc(100vh - 180px);
  display: grid;
  place-items: center;
  padding: 3rem 0;
}

.login-card {
  width: min(520px, calc(100% - 2rem));
  background: #fff;
  border: 1px solid var(--line);
  padding: 2rem;
}

.staff-shell {
  padding: 2rem 0 4rem;
}

.staff-topbar {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 1.5rem;
}

.summary-card {
  background: #fff;
  border: 1px solid var(--line);
  padding: 1.2rem 1.3rem;
}

.summary-card strong {
  display: block;
  margin-bottom: 0.35rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.82rem;
}

.summary-card span {
  font-family: "Oswald", Arial, sans-serif;
  font-size: 2.1rem;
  line-height: 1;
}

.dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 0.8fr);
  gap: 1.5rem;
}

.toolbar {
  display: flex;
  gap: 0.9rem;
  flex-wrap: wrap;
  margin-bottom: 1rem;
}

.toolbar input,
.toolbar select {
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(36, 33, 29, 0.18);
  background: #fff;
  font: inherit;
}

.toolbar input {
  flex: 1 1 240px;
}

.request-list {
  display: grid;
  gap: 0.85rem;
}

.request-card {
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  background: #fff;
  cursor: pointer;
}

.request-card.is-active {
  border-color: rgba(180, 67, 45, 0.5);
  box-shadow: inset 0 0 0 1px rgba(180, 67, 45, 0.18);
}

.request-card-header,
.request-card-meta {
  display: flex;
  justify-content: space-between;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.request-card-header {
  margin-bottom: 0.6rem;
}

.request-card-title {
  font-family: "Oswald", Arial, sans-serif;
  font-size: 1.25rem;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.request-card-copy,
.request-card-meta,
.detail-copy {
  color: var(--muted);
  line-height: 1.65;
}

.badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.badge-new {
  background: #f9efe6;
  color: #97503d;
}

.badge-contacted {
  background: #eeeaf8;
  color: #59408c;
}

.badge-scheduled {
  background: #e9f3eb;
  color: #2c6a37;
}

.badge-closed {
  background: #ececec;
  color: #5a5a5a;
}

.detail-panel {
  min-height: 420px;
}

.detail-panel h2 {
  font-size: 2rem;
  margin-bottom: 1rem;
}

.detail-section + .detail-section {
  margin-top: 1.3rem;
}

.detail-grid {
  display: grid;
  gap: 0.8rem;
}

.detail-panel textarea,
.detail-panel select,
.detail-panel input {
  width: 100%;
  padding: 0.85rem 0.95rem;
  border: 1px solid rgba(36, 33, 29, 0.18);
  background: #fff;
  font: inherit;
}

.empty-state {
  padding: 1rem 0;
  color: var(--muted);
  line-height: 1.7;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 960px) {
  .columns-2,
  .dashboard-grid,
  .summary-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .form-grid {
    grid-template-columns: 1fr;
  }

  .nav .container,
  .topbar .container,
  .footer .container {
    justify-content: center;
    text-align: center;
  }

  .nav-links {
    justify-content: center;
  }
}

/* Scheduler Core public pages remain separate from the existing request workflow. */
.scheduler-notice { margin: 1rem 0; padding: 1rem; border-left: 4px solid var(--gold); background: #faf8f4; color: var(--ink); line-height: 1.6; }
.scheduler-shell { min-height: calc(100vh - 210px); padding: 4rem 0; }
.scheduler-shell > .container { max-width: 760px; }
.time-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.65rem; }
.time-option { text-align: left; padding: 0.8rem; background: #fff; border: 1px solid var(--line); color: var(--ink); cursor: pointer; font: inherit; }
.time-option strong, .time-option span { display: block; }
.time-option span { margin-top: 0.2rem; color: var(--muted); font-size: 0.82rem; }
.time-option:hover, .time-option:focus-visible, .time-option.is-selected { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.time-option.is-limited { background: #fff9ef; }
.scheduler-empty { margin: 0; padding: 1rem; border: 1px dashed var(--line); color: var(--muted); line-height: 1.6; }
.confirmation-card h1, .manage-card h1 { font-size: clamp(2.35rem, 6vw, 3.8rem); margin-bottom: 1rem; }
.confirmation-details { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 1.5rem 0; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.confirmation-details div { padding: 1rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.confirmation-details dt { margin-bottom: 0.25rem; color: var(--muted); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.confirmation-details dd { margin: 0; font-weight: 700; }
.manage-actions { display: flex; gap: 0.8rem; flex-wrap: wrap; }
.button-danger { padding: 0.92rem 1.4rem; border: 1px solid rgba(138,47,33,.32); background: #fff6f3; color: var(--error-text); font: inherit; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; cursor: pointer; }
.reschedule-box { display: grid; gap: .8rem; margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.reschedule-box select { padding: .9rem .95rem; border: 1px solid rgba(36,33,29,.18); background: #fff; font: inherit; }
.button:disabled { cursor: not-allowed; opacity: .6; }
@media (max-width: 640px) { .time-options, .confirmation-details { grid-template-columns: 1fr; } .scheduler-shell { padding: 2rem 0; } }
/* Core-only staff dashboard. */
.schedule-toolbar, .core-section-heading, .appointment-card-header, .appointment-actions, .dialog-heading { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }
.schedule-toolbar { margin-bottom: 1.25rem; padding: 1rem; border: 1px solid var(--line); background: #fff; }
.schedule-toolbar input { padding: .78rem; border: 1px solid var(--line); font: inherit; }.date-picker-label { font-weight: 700; }
.core-dashboard { display: grid; gap: 1.5rem; }.core-section, .history-section { padding: 1.4rem; border: 1px solid var(--line); background: #fff; }.core-section-heading { justify-content: space-between; }.core-section-heading h2 { font-size: 2rem; }
.count-chip { min-width: 2rem; padding: .3rem .65rem; border-radius: 999px; background: var(--charcoal); color: #fff; text-align: center; font-weight: 700; }.section-note { margin: .8rem 0 1rem; color: var(--muted); line-height: 1.55; }.core-card-list { display: grid; gap: .8rem; }
.core-appointment-card { padding: 1rem; border: 1px solid var(--line); background: #faf8f4; }.appointment-card-header { justify-content: space-between; margin-bottom: .55rem; }.appointment-time { color: var(--accent-dark); font-family: "Oswald", Arial, sans-serif; font-size: 1.4rem; letter-spacing: .04em; }.core-appointment-card h3 { font-size: 1.45rem; margin-bottom: .85rem; }
.appointment-details { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; margin: 0; }.appointment-details div, .appointment-phone { display: grid; gap: .15rem; min-width: 0; }.appointment-details dt, .appointment-details span, .appointment-phone span { color: var(--muted); font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }.appointment-details dd { margin: 0; overflow-wrap: anywhere; }.appointment-actions { margin-top: 1rem; }
.badge-pending { background: #f9efe6; color: #97503d; }.badge-scheduled { background: #e9f3eb; color: #2c6a37; }.badge-cancelled,.badge-completed,.badge-closed { background: #ececec; color: #555; }.badge-overbooked { background: #fff1d7; color: #714b08; }
.history-section summary { cursor: pointer; font-family: "Oswald", Arial, sans-serif; font-size: 1.35rem; text-transform: uppercase; }.history-section .core-card-list { margin-top: 1rem; opacity: .75; }
.staff-dialog { width: min(620px, calc(100% - 2rem)); border: 1px solid var(--line); padding: 1.5rem; color: var(--ink); background: #fff; }.staff-dialog::backdrop { background: rgba(20,18,15,.6); }.dialog-heading { justify-content: space-between; }.dialog-heading h2 { font-size: 2rem; }.dialog-close { border: 0; background: transparent; color: var(--muted); font: inherit; cursor: pointer; }.staff-dialog .field { margin-top: 1rem; }.staff-dialog .time-options { margin-top: .5rem; }.staff-dialog .time-option:disabled { cursor: not-allowed; opacity: .5; }
@media (max-width: 760px) { .schedule-toolbar { align-items: stretch; }.schedule-toolbar > * { flex: 1 1 42%; }.date-picker-label { display: none; }.appointment-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }.appointment-actions > * { flex: 1 1 auto; text-align: center; }.core-section, .history-section { padding: 1rem; } }
/* Staff schedule scanability pass. */
.schedule-toolbar { justify-content: space-between; align-items: center; padding: 1.1rem 1.25rem; background: #fffdfa; }
.schedule-date-context { display: grid; gap: .1rem; min-width: 13rem; }.schedule-date-label { color: var(--muted); font-size: .74rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.schedule-date-context strong { font-family: "Oswald", Arial, sans-serif; font-size: 1.5rem; letter-spacing: .025em; text-transform: uppercase; }.schedule-date-actions { display: flex; align-items: center; gap: .55rem; flex-wrap: wrap; }.schedule-date-actions .button-secondary { padding: .7rem .85rem; font-size: .8rem; }
.core-section { padding: 1.5rem; box-shadow: 0 8px 24px rgba(36, 33, 29, .035); }.core-section--pending { border-top: 4px solid var(--accent); }.core-section--scheduled { border-top: 4px solid #5b8160; }.core-section-heading h2 { font-size: clamp(1.8rem, 3vw, 2.25rem); }.core-section--pending .count-chip { background: var(--accent); }.core-section--scheduled .count-chip { background: #416747; }.section-note { max-width: 48rem; }
.core-card-list { gap: .65rem; }.core-appointment-card { padding: 1rem 1.1rem; background: #fff; border-left: 4px solid transparent; }.core-appointment-card--pending { border-left-color: var(--accent); }.core-appointment-card--scheduled { border-left-color: #5b8160; }.appointment-card-header { margin-bottom: .35rem; }.appointment-time { font-size: 1.55rem; }.core-appointment-card h3 { font-size: 1.6rem; margin-bottom: .65rem; }
.appointment-details { grid-template-columns: minmax(9rem, 1.4fr) minmax(8rem, 1fr) minmax(8rem, 1fr); gap: .7rem 1rem; }.appointment-phone { grid-column: 1; }.appointment-notes { grid-column: 2 / -1; }.appointment-notes dd { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.appointment-actions { gap: .55rem; margin-top: .9rem; padding-top: .85rem; border-top: 1px solid var(--line); }.appointment-actions .button, .appointment-actions .button-secondary, .appointment-actions .button-danger { padding: .65rem .85rem; font-size: .79rem; }.action-confirm { order: -2; }.action-change { order: -1; }.action-call { margin-left: auto; }.action-cancel { opacity: .82; }
.history-section { background: transparent; border-style: dashed; }.history-section summary { color: var(--muted); font-size: 1.1rem; }.history-section .core-appointment-card { background: #faf8f4; }.badge-overbooked { border: 1px solid rgba(113, 75, 8, .24); }
@media (max-width: 760px) { .schedule-toolbar { align-items: stretch; }.schedule-date-context { min-width: 0; }.schedule-date-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.schedule-date-actions input { min-width: 0; width: 100%; }.schedule-date-actions .date-picker-label { display: block; grid-column: 1 / -1; }.appointment-details { grid-template-columns: repeat(2, minmax(0, 1fr)); }.appointment-phone, .appointment-notes { grid-column: auto; }.appointment-notes { grid-column: 1 / -1; }.appointment-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.appointment-actions > * { width: 100%; }.action-call { margin-left: 0; } }
/* Public scheduler accessibility and narrow-screen safeguards. */
.time-option[aria-pressed="true"] { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.time-option:focus-visible, .button:focus-visible, .button-secondary:focus-visible { outline: 3px solid rgba(180, 67, 45, .38); outline-offset: 3px; }
@media (max-width: 430px) { .form-actions > .button, .form-actions > .button-secondary { width: 100%; text-align: center; } .time-option { min-height: 4.6rem; } }
/* Cross-date staff inbox. */
.core-section--needs-action { border-top: 4px solid var(--gold); background: #fffdfa; }
.core-section--needs-action .count-chip { background: var(--accent-dark); font-size: 1.05rem; }
.core-appointment-card--inbox { border-left-color: var(--gold); }
.appointment-request-context { margin: .25rem 0 .8rem; color: var(--muted); font-weight: 700; line-height: 1.45; }
@media (max-width: 760px) { .core-section--needs-action { padding: 1rem; } .core-appointment-card--inbox .appointment-details { grid-template-columns: 1fr; } }
.staff-nav{display:flex;gap:1rem;font-weight:700}.staff-nav a{padding:.5rem}.customer-search,.customer-detail,.customer-results{background:#fff;border:1px solid var(--line);padding:1rem}.customer-search>div{display:flex;gap:.7rem;margin-top:.5rem}.customer-search input{flex:1;min-width:0;padding:.8rem}.customer-layout{display:grid;grid-template-columns:minmax(240px,.7fr) minmax(0,1.3fr);gap:1rem;margin-top:1rem}.customer-results,.vehicle-list{display:grid;gap:.7rem}.result-card,.vehicle-card{padding:1rem;border:1px solid var(--line);background:#fff;text-align:left}.result-card{cursor:pointer}.result-card strong,.result-card span,.vehicle-card strong,.vehicle-card span,.vehicle-card small{display:block}.customer-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1rem 0}.customer-form h2{grid-column:1/-1}.customer-form label{display:grid;gap:.3rem;font-weight:700}.customer-form input{width:100%;padding:.75rem}@media(max-width:760px){.customer-layout,.customer-form{grid-template-columns:1fr}.customer-search>div{display:grid;grid-template-columns:1fr}.staff-nav{width:100%;justify-content:center}}
/* Customers workspace polish. */
.customer-workspace{max-width:1180px}.staff-nav{display:flex!important;align-items:center;gap:1rem}.staff-nav a{white-space:nowrap}.customer-search{margin:0 0 1.5rem;padding:1.35rem;border-radius:4px;background:#fffdfa;box-shadow:0 8px 24px rgba(36,33,29,.04)}.customer-search label{display:block;font-family:"Oswald",Arial,sans-serif;font-size:1.25rem;letter-spacing:.03em;text-transform:uppercase}.customer-search input{min-height:3rem;border-radius:3px}.customer-search .button{min-height:3rem;border-radius:3px}.customer-layout{grid-template-columns:minmax(300px,.75fr) minmax(0,1.35fr);align-items:start}.customer-layout>section{min-width:0}.customer-results,.customer-detail{border-radius:4px;box-shadow:0 8px 24px rgba(36,33,29,.04)}.customer-layout h2{font-size:1.7rem;margin:0 0 .8rem}.result-card{display:grid;gap:.25rem;width:100%;border-radius:3px;font:inherit;transition:border-color .15s,background .15s}.result-card:hover,.result-card:focus-visible{border-color:var(--accent);background:#fff8f5;outline:3px solid rgba(180,67,45,.2);outline-offset:2px}.result-card strong{font-family:"Oswald",Arial,sans-serif;font-size:1.25rem;letter-spacing:.02em}.result-card span{color:var(--muted);overflow-wrap:anywhere}.customer-detail{padding:1.4rem}.customer-form{padding:1.15rem;margin:1rem 0;border:1px solid var(--line);border-radius:3px;background:#fffdfa}.customer-form label{font-size:.9rem}.customer-form input,.customer-form textarea{min-height:2.8rem;border:1px solid rgba(36,33,29,.2);border-radius:3px;font:inherit;padding:.7rem .8rem}.customer-form textarea{min-height:7rem;resize:vertical}.customer-form .form-actions{grid-column:1/-1;margin-top:.25rem}.vehicle-list{margin-top:.8rem}.vehicle-card{display:grid;grid-template-columns:1fr auto;gap:.45rem 1rem;border-left:4px solid var(--gold);border-radius:3px}.vehicle-card strong{font-family:"Oswald",Arial,sans-serif;font-size:1.3rem}.vehicle-card span{color:var(--muted)}.vehicle-card small{grid-column:1/-1;display:grid;gap:.25rem;color:var(--muted);line-height:1.5}.vehicle-card .button-secondary{grid-column:2;grid-row:1/3;align-self:center;border-radius:3px}.customer-detail>.form-actions{padding-top:1rem;margin-top:1rem;border-top:1px solid var(--line)}@media(max-width:760px){.staff-nav{gap:.65rem}.customer-layout{gap:1rem}.customer-search{padding:1rem}.customer-detail{padding:1rem}.vehicle-card{grid-template-columns:1fr}.vehicle-card .button-secondary{grid-column:auto;grid-row:auto;width:100%;text-align:center}.customer-form{padding:1rem}.customer-form .button{width:100%;text-align:center}}@media(max-width:430px){.staff-topbar .button{width:100%;text-align:center}.customer-search .button{width:100%;text-align:center}.customer-layout{margin-top:.75rem}}
/* New Appointment workspace. Scoped so public booking, Customers, and dashboard layouts are unchanged. */
.appointment-topbar { border-bottom: 1px solid var(--line); background: #fffdfa; }
.appointment-topbar .container { display: flex; justify-content: flex-end; padding-top: .6rem; padding-bottom: .6rem; }
.appointment-topbar .staff-nav { gap: .8rem; }
.appointment-topbar .staff-nav a { border: 1px solid transparent; border-radius: 3px; color: var(--ink); text-decoration: none; }
.appointment-topbar .staff-nav a:hover, .appointment-topbar .staff-nav a:focus-visible, .appointment-topbar .staff-nav .is-current { border-color: var(--line); background: #fff; color: var(--accent-dark); }
.appointment-workspace { max-width: 1100px; padding-top: 2.5rem; padding-bottom: 4rem; }
.appointment-page-heading { max-width: 46rem; margin-bottom: 1.75rem; }
.appointment-page-heading h1 { margin: .35rem 0 .55rem; font-size: clamp(2.45rem, 5vw, 4rem); }
.appointment-page-heading p { margin: 0; color: var(--muted); font-size: 1.05rem; line-height: 1.65; }
.appointment-section { min-width: 0; margin-top: 1rem; padding: 1.45rem; border: 1px solid var(--line); border-radius: 4px; background: #fffdfa; box-shadow: 0 8px 24px rgba(36, 33, 29, .04); }
.appointment-section--customer { margin-top: 0; }
.appointment-section-heading { display: flex; align-items: baseline; gap: .7rem; margin-bottom: 1rem; }
.appointment-section-heading > span { color: var(--accent); font-family: "Oswald", Arial, sans-serif; font-size: .95rem; font-weight: 700; letter-spacing: .08em; }
.appointment-section-heading h2 { margin: 0; font-size: 1.7rem; }
.appointment-field-label { display: block; margin-bottom: .45rem; color: var(--ink); font-size: .88rem; font-weight: 700; letter-spacing: .03em; }
.appointment-create input, .appointment-create select, .appointment-create textarea { box-sizing: border-box; width: 100%; min-height: 3rem; padding: .78rem .9rem; border: 1px solid rgba(36, 33, 29, .2); border-radius: 3px; background: #fff; color: var(--ink); font: inherit; }
.appointment-create textarea { min-height: 7rem; resize: vertical; line-height: 1.5; }
.appointment-create input:focus, .appointment-create select:focus, .appointment-create textarea:focus { border-color: var(--accent); outline: 3px solid rgba(180, 67, 45, .16); outline-offset: 1px; }
.appointment-search-results { display: grid; gap: .55rem; margin-top: .8rem; }
.appointment-search-results button { width: 100%; padding: .85rem 1rem; border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--ink); cursor: pointer; font: inherit; font-weight: 700; text-align: left; }
.appointment-search-results button:hover, .appointment-search-results button:focus-visible { border-color: var(--accent); background: #fff8f5; outline: 3px solid rgba(180, 67, 45, .16); outline-offset: 1px; }
.appointment-selected-customer:not(:empty) { margin-top: .85rem; padding: .9rem 1rem; border-left: 4px solid var(--gold); background: #fff; font-weight: 700; line-height: 1.5; }
.appointment-help { margin: .75rem 0 0; color: var(--muted); font-size: .9rem; }
.appointment-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.appointment-timing-grid { display: grid; grid-template-columns: minmax(15rem, .55fr) minmax(0, 1.45fr); gap: 1.25rem; align-items: start; }
.appointment-time-slots { display: flex; flex-wrap: wrap; gap: .6rem; }
.appointment-time-slots button { min-width: 6.5rem; min-height: 2.9rem; padding: .7rem .9rem; border: 1px solid var(--line); border-radius: 3px; background: #fff; color: var(--ink); cursor: pointer; font: inherit; font-weight: 700; }
.appointment-time-slots button:hover, .appointment-time-slots button:focus-visible { border-color: var(--accent); outline: 3px solid rgba(180, 67, 45, .16); outline-offset: 1px; }
.appointment-time-slots button.is-selected { border-color: var(--accent-dark); background: var(--accent); color: #fff; }
.appointment-time-slots button.full { border-color: #d5a34d; background: #fff1d7; color: #714b08; }
.appointment-time-slots button.full::after { content: " Full"; font-size: .78em; }
.appointment-override { display: flex; gap: .7rem; align-items: flex-start; margin-top: 1rem; padding: .9rem 1rem; border: 1px solid #e3bc71; background: #fff8e8; color: #714b08; line-height: 1.45; }
.appointment-override[hidden] { display: none; }
.appointment-override input { flex: 0 0 auto; width: 1.1rem; min-height: 1.1rem; margin-top: .18rem; padding: 0; }
.appointment-override strong { display: block; }
.appointment-section--review { padding: 0; overflow: hidden; }
.appointment-create [data-review] { margin: 0; padding: 1.45rem; border: 0; background: #f8f3e9; }
.appointment-create [data-review] h2 { margin: 0 0 1rem; font-size: 1.7rem; }
.appointment-review-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem 1.25rem; margin: 0; }
.appointment-review-list div { min-width: 0; padding: .2rem 0 .65rem; border-bottom: 1px solid rgba(36, 33, 29, .11); }
.appointment-review-list dt { color: var(--muted); font-size: .75rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.appointment-review-list dd { margin: .22rem 0 0; overflow-wrap: anywhere; }
.appointment-create-action { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-top: 1.25rem; padding: 1.25rem 0; }
.appointment-create-action .button { min-height: 3.25rem; padding: .9rem 1.35rem; border-radius: 3px; }
.appointment-create-action .button:disabled { cursor: not-allowed; opacity: .5; }
.appointment-create-action [data-status] { margin: 0; color: var(--muted); font-weight: 700; }
@media (max-width: 760px) { .appointment-topbar .container { justify-content: center; }.appointment-workspace { padding-top: 1.5rem; }.appointment-field-grid, .appointment-timing-grid, .appointment-review-list { grid-template-columns: 1fr; }.appointment-section { padding: 1.1rem; }.appointment-time-slots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.appointment-time-slots button { width: 100%; min-width: 0; }.appointment-create-action { display: grid; grid-template-columns: 1fr; }.appointment-create-action .button { width: 100%; text-align: center; } }
@media (max-width: 430px) { .appointment-topbar .staff-nav { width: 100%; justify-content: center; gap: .25rem; }.appointment-topbar .staff-nav a { padding: .45rem .35rem; font-size: .83rem; }.appointment-page-heading h1 { font-size: 2.55rem; }.appointment-time-slots { grid-template-columns: 1fr; }.appointment-override { padding: .8rem; } }

/* Staff dashboard operational order, collapsible sections, and narrow-screen controls. */
.core-collapsible{min-width:0;overflow:clip}.core-section--viewing-schedule{border-top:4px solid var(--charcoal);background:#fffdfa}.core-section-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;padding:0;border:0;background:transparent;color:inherit;text-align:left;cursor:pointer;font:inherit}.core-section-title-group{display:grid;min-width:0;gap:.2rem}.core-section-toggle .eyebrow{margin:0}.core-section-title{font-family:"Oswald",Arial,sans-serif;font-size:clamp(1.8rem,3vw,2.25rem);letter-spacing:.03em;line-height:1;text-transform:uppercase;overflow-wrap:anywhere}.core-section-toggle-meta{display:inline-flex;align-items:center;gap:.65rem;flex-shrink:0}.schedule-summary{color:var(--muted);font-weight:700;text-align:right}.collapse-indicator{width:.72rem;height:.72rem;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg) translateY(-.18rem)}.core-collapsible.is-collapsed .collapse-indicator{transform:rotate(-45deg) translate(-.12rem,.12rem)}.core-section-toggle:focus-visible{outline:3px solid rgba(180,67,45,.38);outline-offset:5px}.core-section-content{min-width:0;padding-top:1rem}.core-collapsible.is-collapsed{padding-bottom:1.15rem}.core-section--viewing-schedule .schedule-toolbar{margin:0;border-color:rgba(36,33,29,.14)}.core-section--viewing-schedule .schedule-date-actions{margin-left:auto}.core-dashboard,.core-section,.core-card-list,.core-appointment-card,.appointment-card-header,.appointment-details,.appointment-actions{min-width:0}.core-appointment-card h3,.appointment-card-header,.appointment-request-context,.appointment-phone,.appointment-actions{overflow-wrap:anywhere}
/* These rules intentionally follow the desktop Customers polish. */
.customer-workspace,.customer-layout,.customer-layout>section,.customer-results,.customer-detail,.vehicle-list,.vehicle-card,.vehicle-actions{min-width:0}.customer-search label,.result-card,.vehicle-card,.vehicle-card small,.vehicle-actions,.customer-detail{overflow-wrap:anywhere}.vehicle-actions{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center}
@media(max-width:760px){.staff-shell .staff-topbar .staff-nav{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:.5rem}.staff-shell .staff-topbar .staff-nav a{min-width:0;padding:.7rem .45rem;white-space:normal;overflow-wrap:anywhere;text-align:center}.core-section-toggle{align-items:flex-start}.core-section-toggle-meta{align-items:flex-start}.schedule-summary{max-width:9.5rem;font-size:.86rem;line-height:1.25}.core-section--viewing-schedule .schedule-toolbar{display:grid;gap:1rem;padding:1rem}.core-section--viewing-schedule .schedule-date-context{padding-bottom:.8rem;border-bottom:1px solid var(--line)}.core-section--viewing-schedule .schedule-date-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin:0}.core-section--viewing-schedule [data-date-previous]{grid-column:1;grid-row:1}.core-section--viewing-schedule [data-date-today]{grid-column:2;grid-row:1}.core-section--viewing-schedule [data-date-next]{grid-column:3;grid-row:1}.core-section--viewing-schedule .schedule-date-actions .button-secondary{min-width:0;min-height:2.9rem;padding:.65rem .35rem;white-space:normal}.core-section--viewing-schedule .date-picker-label{display:block;grid-column:1/-1;grid-row:2;margin-top:.25rem}.core-section--viewing-schedule .schedule-date-actions input{grid-column:1/-1;grid-row:3;min-width:0;min-height:3rem;width:100%}.customer-layout,.customer-form{grid-template-columns:minmax(0,1fr)}.vehicle-actions,.customer-detail>.form-actions{display:grid;grid-template-columns:minmax(0,1fr)}.vehicle-actions>*,.customer-detail>.form-actions>*{width:100%;min-width:0;white-space:normal;text-align:center}}
@media(max-width:430px){.staff-shell .staff-topbar .staff-nav{grid-template-columns:minmax(0,1fr)}.core-section{padding:1rem}.core-section-title{font-size:1.65rem}.core-section-toggle-meta{gap:.45rem}.count-chip{min-width:2.1rem}.schedule-summary{display:none}.core-section--viewing-schedule .schedule-date-context strong{font-size:1.35rem}.appointment-details,.appointment-actions{grid-template-columns:minmax(0,1fr)}}

/* Compact operational staff schedule. */
.staff-schedule-page{padding:1rem 0 3rem}.staff-schedule-workspace{max-width:1240px;padding-top:0;padding-bottom:0}.compact-staff-header{margin-bottom:1rem}.compact-staff-header h1{font-size:clamp(2rem,4vw,3.15rem)}
.compact-needs-action,.schedule-control-panel,.schedule-day-group{border:1px solid var(--line);background:#fff}.compact-needs-action{margin-bottom:.8rem;padding:.85rem 1rem;border-top:4px solid var(--gold)}
.compact-section-toggle{display:flex;width:100%;align-items:center;justify-content:space-between;gap:1rem;padding:0;border:0;background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.compact-section-toggle:focus-visible,.appointment-summary-toggle:focus-visible,.schedule-view-switch button:focus-visible{outline:3px solid rgba(180,67,45,.38);outline-offset:3px}.compact-section-title{display:grid;gap:.1rem}.compact-section-title .eyebrow{margin:0}.compact-section-title strong{font-family:"Oswald",Arial,sans-serif;font-size:1.55rem;letter-spacing:.03em;text-transform:uppercase}.compact-section-meta{display:flex;align-items:center;gap:.7rem}.compact-section-indicator,.appointment-row-indicator{display:block;width:.62rem;height:.62rem;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg)}.compact-section-toggle[aria-expanded="false"] .compact-section-indicator,.appointment-summary-toggle[aria-expanded="false"] .appointment-row-indicator{transform:rotate(-45deg)}.compact-needs-action [data-needs-content]{padding-top:.7rem}
.schedule-control-panel{display:grid;grid-template-columns:auto minmax(12rem,.7fr) minmax(28rem,1.5fr);align-items:center;gap:1rem;margin-bottom:.8rem;padding:.8rem 1rem;background:#fffdfa}.schedule-view-switch{display:inline-flex;overflow:hidden;border:1px solid var(--line);border-radius:3px}.schedule-view-switch button{min-height:2.75rem;padding:.55rem .85rem;border:0;border-right:1px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-weight:700;cursor:pointer}.schedule-view-switch button:last-child{border-right:0}.schedule-view-switch button.is-current{background:var(--charcoal);color:#fff}.schedule-range-context{display:grid;gap:.05rem;min-width:0}.schedule-range-context span{color:var(--muted);font-size:.7rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.schedule-range-context strong{font-family:"Oswald",Arial,sans-serif;font-size:1.25rem;line-height:1.15;text-transform:uppercase}.schedule-control-panel .schedule-date-actions{display:flex;justify-content:flex-end;gap:.4rem;min-width:0}.schedule-control-panel .schedule-date-actions .button-secondary{min-height:2.75rem;padding:.55rem .7rem;font-size:.75rem}.schedule-control-panel input{min-width:8.6rem;min-height:2.75rem;padding:.55rem;border:1px solid var(--line);background:#fff;font:inherit}.schedule-control-panel .date-picker-label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
.compact-core-dashboard,.schedule-groups{display:grid;gap:.8rem}.schedule-day-group{min-width:0}.schedule-day-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.75rem 1rem;border-bottom:1px solid var(--line);background:#faf8f4}.schedule-day-kicker{display:none}.schedule-day-title{margin:0;font-size:1.45rem}.schedule-day-meta{display:flex;gap:.8rem;color:var(--muted);font-size:.82rem}.schedule-day-meta strong{color:var(--ink)}.compact-schedule-list{display:block}.compact-schedule-list .scheduler-empty{margin:.75rem;border:0}
.core-appointment-row{min-width:0;border-bottom:1px solid var(--line);border-left:4px solid transparent;background:#fff}.core-appointment-row:last-child{border-bottom:0}.core-appointment-row--pending{border-left-color:var(--gold)}.core-appointment-row--scheduled{border-left-color:#5b8160}.core-appointment-row--cancelled,.core-appointment-row--completed{opacity:.78}.appointment-summary-toggle{display:grid;width:100%;grid-template-columns:minmax(0,1fr) 1rem;align-items:center;gap:.75rem;min-height:3.8rem;padding:.65rem .9rem;border:0;background:transparent;color:var(--ink);font:inherit;text-align:left;cursor:pointer}.appointment-summary{display:grid;grid-template-columns:6.2rem minmax(9rem,1.15fr) minmax(10rem,1.3fr) minmax(9rem,1fr) auto auto auto;align-items:center;gap:.5rem .8rem;min-width:0}.appointment-summary>*{min-width:0;overflow-wrap:anywhere}.appointment-summary-time{color:var(--accent-dark);font-family:"Oswald",Arial,sans-serif;font-size:1.2rem;letter-spacing:.03em}.appointment-summary-customer{font-weight:700}.appointment-summary-vehicle,.appointment-summary-service,.appointment-summary-mileage{color:var(--muted);font-size:.9rem}.appointment-summary .badge{justify-self:start;white-space:nowrap}.core-appointment-row.is-expanded{background:#fffdfa}.appointment-summary-toggle[aria-expanded="true"]{border-bottom:1px solid var(--line)}.compact-appointment-details{padding:.9rem 1rem 1rem}.compact-appointment-details .appointment-details{grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem 1rem}.compact-appointment-details .appointment-notes{grid-column:1/-1}.compact-appointment-details .appointment-notes dd{display:block;overflow:visible;-webkit-line-clamp:unset}.compact-appointment-details .appointment-actions{margin-top:.8rem}.compact-appointment-details .appointment-actions>*{min-height:2.75rem}.compact-history{border-top:1px dashed var(--line);background:#faf8f4}.compact-history>summary{padding:.65rem 1rem;color:var(--muted);font-weight:700;cursor:pointer}.compact-history .core-appointment-row{background:#faf8f4}
.compact-needs-action .appointment-summary{grid-template-columns:6.2rem minmax(9rem,1.15fr) minmax(10rem,1.3fr) minmax(9rem,1fr) auto auto}.schedule-groups.view-three,.schedule-groups.view-week{gap:1rem}
@media(max-width:980px){.schedule-control-panel{grid-template-columns:auto 1fr}.schedule-control-panel .schedule-date-actions{grid-column:1/-1;justify-content:flex-start}.appointment-summary{grid-template-columns:5.6rem minmax(9rem,1fr) minmax(10rem,1.2fr) minmax(8rem,1fr) auto}.appointment-summary-mileage{display:none}.compact-needs-action .appointment-summary{grid-template-columns:5.6rem minmax(9rem,1fr) minmax(10rem,1.2fr) minmax(8rem,1fr) auto}}
@media(max-width:760px){.staff-schedule-page{padding:.75rem 0 2rem}.compact-staff-header{gap:.65rem;margin-bottom:.75rem}.schedule-control-panel{grid-template-columns:1fr;gap:.75rem;padding:.75rem}.schedule-view-switch{width:100%}.schedule-view-switch button{flex:1}.schedule-range-context{padding:.15rem .2rem}.schedule-control-panel .schedule-date-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:.45rem}.schedule-control-panel [data-date-previous]{grid-column:1}.schedule-control-panel [data-date-today]{grid-column:2}.schedule-control-panel [data-date-next]{grid-column:3}.schedule-control-panel input{grid-column:1/-1;width:100%;min-width:0}.schedule-day-heading{align-items:flex-start;padding:.7rem .8rem}.schedule-day-title{font-size:1.25rem}.schedule-day-meta{display:grid;gap:.12rem;text-align:right}.appointment-summary-toggle{min-height:5rem;padding:.6rem .7rem}.appointment-summary{grid-template-columns:4.8rem minmax(0,1fr) auto;gap:.2rem .65rem}.appointment-summary-time{grid-column:1;grid-row:1/3;align-self:start}.appointment-summary-customer{grid-column:2;grid-row:1}.appointment-summary .badge{grid-column:3;grid-row:1}.appointment-summary-vehicle{grid-column:2/4;grid-row:2}.appointment-summary-service{grid-column:2/4;grid-row:3}.appointment-summary-mileage{display:none}.appointment-summary .badge-overbooked{grid-column:2/4;grid-row:4}.compact-appointment-details .appointment-details{grid-template-columns:repeat(2,minmax(0,1fr))}.compact-needs-action .appointment-summary{grid-template-columns:4.8rem minmax(0,1fr) auto}.compact-needs-action .appointment-summary-time{grid-row:1/3}.compact-needs-action .appointment-summary-service{grid-row:3}.compact-appointment-details .appointment-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.compact-appointment-details .appointment-actions>*{width:100%;margin:0;text-align:center}}
@media(max-width:430px){.compact-staff-header h1{font-size:1.8rem;white-space:nowrap}.staff-schedule-page .staff-topbar .staff-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.staff-schedule-page .staff-topbar .staff-nav a{min-height:2.8rem}.staff-schedule-page .staff-topbar .staff-nav a:last-child{grid-column:1/-1}.compact-needs-action{padding:.75rem}.compact-section-title strong{font-size:1.35rem}.schedule-control-panel .schedule-date-actions .button-secondary{min-height:3rem;padding:.55rem .3rem;font-size:.7rem}.schedule-day-heading{display:grid;gap:.35rem}.schedule-day-meta{display:flex;text-align:left}.appointment-summary-toggle{min-height:5.25rem}.appointment-summary{grid-template-columns:4.45rem minmax(0,1fr) auto}.appointment-summary-time{font-size:1.05rem}.appointment-summary-vehicle,.appointment-summary-service{font-size:.82rem}.compact-appointment-details{padding:.8rem}.compact-appointment-details .appointment-details,.compact-appointment-details .appointment-actions{grid-template-columns:minmax(0,1fr)}}

/* Compact staff application header and schedule access. */
.staff-operation-header{border-bottom:3px solid var(--accent);background:var(--charcoal);color:#fff}.staff-operation-header .container{display:grid;grid-template-columns:minmax(16rem,1fr) auto auto;align-items:center;gap:1rem;min-height:4rem;padding:.45rem 0}.staff-operation-brand{display:flex;min-width:0;align-items:baseline;gap:.65rem;color:#fff;text-decoration:none}.staff-operation-brand span{font-family:"Oswald",Arial,sans-serif;font-size:1.15rem;font-weight:600;letter-spacing:.045em;line-height:1;text-transform:uppercase}.staff-operation-brand strong{color:#e6b06c;font-size:.76rem;letter-spacing:.11em;text-transform:uppercase;white-space:nowrap}.staff-operation-nav{display:flex;align-items:center;gap:.2rem}.staff-operation-nav a,.staff-operation-signout{display:inline-flex;min-height:2.75rem;align-items:center;justify-content:center;padding:.55rem .7rem;border:1px solid transparent;background:transparent;color:#fff;font:inherit;font-size:.78rem;font-weight:700;letter-spacing:.025em;text-align:center;text-decoration:none;text-transform:uppercase;cursor:pointer}.staff-operation-nav a:hover,.staff-operation-nav a:focus-visible,.staff-operation-signout:hover,.staff-operation-signout:focus-visible{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.08);outline:0}.staff-operation-signout{border-color:rgba(255,255,255,.35)}
.staff-schedule-page{padding:.65rem 0 3rem}.compact-needs-action{margin-bottom:.55rem;padding:.55rem .75rem;border-top-width:3px}.compact-section-title strong{font-size:1.3rem}.compact-needs-action [data-needs-content]{padding-top:.45rem}.needs-zero-summary{display:none;color:var(--muted);font-size:.88rem;font-weight:700}.compact-needs-action.is-zero .needs-zero-summary{display:inline}.compact-needs-action.is-zero .compact-section-toggle{min-height:2.65rem}.compact-needs-action.is-zero{padding-block:.25rem}.schedule-control-panel{grid-template-columns:auto minmax(11rem,1fr) auto;gap:.65rem;margin-bottom:.55rem;padding:.4rem .55rem;border-width:1px 0;background:transparent}.schedule-control-panel .schedule-date-actions{gap:.25rem}.schedule-control-panel .schedule-date-actions .button-secondary,.schedule-view-switch button,.schedule-control-panel input{min-height:2.75rem}.schedule-range-context strong{font-size:1.1rem}.schedule-range-context span{display:none}
@media(max-width:980px){.staff-operation-header .container{grid-template-columns:1fr auto}.staff-operation-nav{grid-column:1/-1;grid-row:2;justify-content:flex-start}.staff-operation-signout{grid-column:2;grid-row:1}.schedule-control-panel{grid-template-columns:auto 1fr}.schedule-control-panel .schedule-date-actions{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:760px){.staff-operation-header .container{gap:.35rem .65rem;padding:.45rem 0 .55rem}.staff-operation-brand{display:grid;gap:.15rem}.staff-operation-brand span{font-size:1rem}.staff-operation-brand strong{font-size:.67rem}.staff-operation-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:.35rem}.staff-operation-nav a,.staff-operation-signout{min-height:2.75rem;padding:.45rem .3rem;font-size:.7rem}.staff-schedule-page{padding:.5rem 0 2rem}.compact-needs-action{margin-bottom:.5rem}.compact-section-title strong{font-size:1.2rem}.needs-zero-summary{font-size:.78rem}.schedule-control-panel{gap:.5rem;margin-bottom:.5rem;padding:.5rem 0}.schedule-range-context{padding:0}.schedule-control-panel .schedule-date-actions{gap:.35rem}.schedule-control-panel .schedule-date-actions .button-secondary{min-height:2.75rem}.schedule-control-panel input{min-height:2.75rem}}
@media(max-width:430px){.staff-operation-header .container{width:min(var(--max),calc(100% - 1rem))}.staff-operation-brand span{font-size:.92rem}.staff-operation-brand strong{font-size:.62rem}.staff-operation-signout{padding-inline:.5rem}.staff-operation-nav a{font-size:.66rem}.compact-needs-action{padding-inline:.55rem}.compact-section-meta{gap:.45rem}.schedule-range-context strong{font-size:1rem}.schedule-control-panel .schedule-date-actions .button-secondary{font-size:.68rem}}

/* Compact operational header for staff appointment creation. */
.appointment-operation-header .container{grid-template-columns:minmax(16rem,1fr) auto}.appointment-operation-header .staff-operation-nav{grid-column:2;grid-row:1}.appointment-operation-header .staff-operation-nav .is-current{border-color:rgba(255,255,255,.42);background:rgba(255,255,255,.1);color:#fff}.appointment-workspace{padding-top:.75rem}.appointment-page-heading{display:flex;max-width:none;align-items:baseline;gap:1rem;margin-bottom:.7rem;padding:.15rem 0}.appointment-page-heading h1{flex:0 0 auto;margin:0;font-size:clamp(1.8rem,3vw,2.35rem);line-height:1.1}.appointment-page-heading p{margin:0;font-size:.95rem;line-height:1.4}
@media(max-width:980px){.appointment-operation-header .container{grid-template-columns:minmax(0,1fr)}.appointment-operation-header .staff-operation-nav{grid-column:1;grid-row:2}}
@media(max-width:760px){.appointment-workspace{padding-top:.55rem}.appointment-page-heading{display:grid;gap:.15rem;margin-bottom:.55rem}.appointment-page-heading h1{font-size:1.75rem}.appointment-page-heading p{font-size:.88rem}.appointment-operation-header .staff-operation-nav{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:430px){.appointment-operation-header .staff-operation-nav{gap:.25rem}.appointment-operation-header .staff-operation-nav a{min-width:0;padding-inline:.2rem;font-size:.65rem;white-space:normal}.appointment-page-heading h1{font-size:1.65rem}}
