/* Additive Whatts-inspired staff shell. Public entry and client portal never
   receive these classes or styles. */
/* Client calendar is the sole requested client visual change. */
.client-calendar-grid { gap: 1px; border: 1px solid var(--line); background: var(--line); }
.client-calendar-grid > b { background: #10151d; color: var(--muted); padding: .7rem .35rem; }
.client-calendar-grid .client-day { border: 0; background: #080c12; color: var(--ink); min-height: 94px; }
.client-calendar-grid .client-day--event { box-shadow: inset 2px 0 var(--accent); background: var(--accent-soft); }
.client-calendar-controls > b { color: var(--ink); text-transform: uppercase; font-family: Impact, "Arial Narrow", sans-serif; letter-spacing: .04em; }
/* The rollout controller applies this class only after a staff session passes
   the preview gate. It deliberately leaves public and client chrome alone. */
body.approved-staff-active .prototype-bar {
  min-height: 30px;
  padding-block: .3rem;
  background: #d5d7dc;
  border-bottom: 1px solid var(--accent);
  color: #a21657;
}
body.approved-staff-active .prototype-bar b { color: #790839; }
body:not(.entry-locked):not(.client-authenticated) .app-shell.approved-staff-shell {
  width: min(1440px, calc(100% - 28px));
  display: grid;
  grid-template-columns: 232px minmax(0, 1fr);
  gap: 0;
  min-height: 100vh;
  background: #080c12;
  border-inline: 1px solid var(--line);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar {
  display: flex;
  position: sticky;
  top: 0;
  flex-direction: column;
  min-width: 0;
  height: 100vh;
  padding: 1rem .75rem;
  background: #080c12;
  border-right: 1px solid var(--line);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .brand {
  gap: .6rem;
  margin: 0 0 1.5rem;
  padding: .35rem .2rem;
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .brand img { width: 36px; height: 36px; }
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .brand strong {
  font-family: Impact, "Arial Narrow", sans-serif;
  font-size: 1.1rem;
  letter-spacing: .09em;
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .brand small { font-size: 8px; }
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__eyebrow,
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__note {
  color: var(--muted);
  font: 700 9px/1.25 var(--mono, ui-monospace, monospace);
  letter-spacing: .12em;
  text-transform: uppercase;
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__eyebrow { margin: 0 .4rem .65rem; }
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__note {
  margin: auto .4rem .25rem;
  padding-top: 1rem;
  border-top: 1px solid var(--line);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .primary-nav:has(.approved-nav-group) {
  display: grid;
  gap: .9rem;
  overflow: visible;
  border: 0;
  background: transparent;
}
body:not(.entry-locked):not(.client-authenticated) .approved-nav-group {
  display: grid;
  min-width: 0;
  gap: .1rem;
}
body:not(.entry-locked):not(.client-authenticated) .approved-nav-group__label {
  display: block;
  padding: .25rem .45rem .4rem;
  color: var(--muted);
  font: 700 8px/1 var(--mono, ui-monospace, monospace);
  letter-spacing: .09em;
  text-transform: uppercase;
}
body:not(.entry-locked):not(.client-authenticated) .approved-nav-group .nav-button {
  width: 100%;
  min-height: 36px;
  padding: .5rem .7rem;
  border: 0;
  border-left: 2px solid transparent;
  color: var(--muted);
  font-size: .8rem;
  text-align: left;
}
body:not(.entry-locked):not(.client-authenticated) .approved-nav-group .nav-button[aria-current="page"] {
  border-left-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--ink);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main {
  min-width: 0;
  padding: 0 clamp(1rem, 2.2vw, 2rem);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main .masthead {
  grid-template-columns: 1fr auto;
  min-height: 64px;
  padding: .65rem 0;
  border-bottom: 1px solid var(--line);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main .identity { display: block; text-align: left; }
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main .identity span {
  font-family: Impact, "Arial Narrow", sans-serif;
  letter-spacing: .04em;
}
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) .approved-staff-main .page-head h1,
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) .approved-staff-main .page-head h2 {
  font-family: Impact, "Arial Narrow", sans-serif;
  font-weight: 400;
  letter-spacing: .055em;
  text-transform: uppercase;
}
/* Staff matter previews retain their existing dialogs and behavior; only the
   approved staff-shell tint changes from the legacy gold treatment to pink. */
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace .lifecycle-icon,
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace .lifecycle-glyph {
  color: var(--accent);
}
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace .lifecycle-icon:hover {
  background: color-mix(in srgb, var(--panel) 88%, var(--accent));
  color: color-mix(in srgb, var(--accent) 78%, #fff);
}
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace .lifecycle-source-icon {
  filter: brightness(0) saturate(100%) invert(42%) sepia(87%) saturate(3090%) hue-rotate(306deg) brightness(102%) contrast(101%);
}
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main .command-row { padding: .8rem 0; }
body:not(.entry-locked):not(.client-authenticated) .approved-staff-main footer { padding-bottom: 1.25rem; }

/* The existing linked-ticket and transcript controls remain their original
   elements; this only gives them a durable, full-width row in a matter head. */
body:not(.entry-locked):not(.client-authenticated) #workspace > .page-head.approved-matter-header {
  align-items: start;
}
body:not(.entry-locked):not(.client-authenticated) .approved-matter-header > .actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(680px, 100%);
}
body:not(.entry-locked):not(.client-authenticated) .approved-matter-records {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: 1fr;
  gap: .45rem;
  align-items: stretch;
  padding: .45rem;
  border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--line));
  background: linear-gradient(90deg, var(--accent-soft), #0c0e13 34%);
}
body:not(.entry-locked):not(.client-authenticated) .approved-matter-records__label {
  display: grid;
  place-items: center;
  min-width: 0;
  padding: .45rem .55rem;
  color: var(--accent);
  border-bottom: 1px solid var(--line);
  font: 800 9px/1.15 var(--mono, ui-monospace, monospace);
  letter-spacing: .09em;
  text-align: center;
  text-transform: uppercase;
}
body:not(.entry-locked):not(.client-authenticated) .approved-matter-records .button,
body:not(.entry-locked):not(.client-authenticated) .approved-matter-records > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  text-align: center;
  text-decoration: none;
}
/* Override the legacy compact-toolbar flex rule only in the enabled staff
   shell. Closed records retain two ordinary actions, then one full-row
   transcript action beneath them. */
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace > .page-head.approved-matter-header > :first-child {
  min-width: 0;
}
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace > .page-head.approved-matter-header > .actions.matter-header-actions {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  width: min(350px, 100%);
  max-width: 100%;
}
body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace > .page-head.approved-matter-header > .actions.matter-header-actions > .approved-matter-records {
  grid-column: 1 / -1 !important;
}
@media (max-width: 900px) {
  body:not(.entry-locked):not(.client-authenticated) .app-shell.approved-staff-shell { grid-template-columns: 190px minmax(0, 1fr); }
}
@media (max-width: 640px) {
  body:not(.entry-locked):not(.client-authenticated) .app-shell.approved-staff-shell { display: block; width: min(100% - 20px, 1180px); border-inline: 0; }
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar { position: static; height: auto; margin: 0 -10px; padding: .6rem 10px; border-right: 0; border-bottom: 1px solid var(--line); }
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .brand,
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__eyebrow,
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar__note { display: none; }
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-sidebar .primary-nav:has(.approved-nav-group) { display: flex; gap: .3rem; overflow-x: auto; }
  body:not(.entry-locked):not(.client-authenticated) .approved-nav-group { display: flex; gap: 0; }
  body:not(.entry-locked):not(.client-authenticated) .approved-nav-group__label { display: none; }
  body:not(.entry-locked):not(.client-authenticated) .approved-nav-group .nav-button { width: auto; white-space: nowrap; }
  body:not(.entry-locked):not(.client-authenticated) .approved-staff-main { padding: 0; }
  body:not(.entry-locked):not(.client-authenticated) .approved-matter-header > .actions { grid-template-columns: 1fr; width: 100%; }
  body.approved-staff-active:not(.entry-locked):not(.client-authenticated) #workspace > .page-head.approved-matter-header > .actions.matter-header-actions { grid-template-columns: 1fr; width: 100%; }
}