:root {
  color-scheme: light;
  --bg: #f4f6f8;
  --panel: #ffffff;
  --ink: #1c2630;
  --muted: #637282;
  --line: #d9e1e8;
  --line-strong: #c5d0da;
  --sidebar: #17212b;
  --sidebar-soft: #22303c;
  --sidebar-ink: #eef4f7;
  --accent: #1d6f8f;
  --accent-dark: #15566f;
  --soft: #edf7f8;
  --work: #f7f4ed;
  --shadow: 0 10px 24px rgba(28, 38, 48, 0.08);
  --surface: var(--panel);
  --surface-muted: #f8fafb;
  --text: var(--ink);
  --border: var(--line);
  --shadow-soft: 0 3px 10px rgba(28, 38, 48, 0.08);
  --accent-soft: #e8f4f5;
  --accent-strong: var(--accent-dark);
  --accent-ink: #ffffff;
  --accent-ink-muted: rgba(255, 255, 255, 0.82);
  --ink-inverse: #ffffff;
  --surface-raised: #ffffff;
  --surface-input: #ffffff;
  --tab-background: #eef4f5;
  --tab-border: #d5e2e5;
  --tab-text: var(--ink);
  --tab-hover-background: var(--panel);
  --tab-active-text: var(--accent-dark);
  --table-header-background: #f7f9fb;
  --focus-ring: var(--accent);
  --success-text: #247047;
}

/* Unified lead workspace */
.lead-workspace {
  min-width: 0;
  display: grid;
  gap: 16px;
}

.workspace-resolution {
  min-width: 0;
  grid-column: 1 / -1;
}

.workspace-resolution > details > .panel {
  margin-top: 12px;
}

.workspace-case-header {
  min-width: 0;
  padding: 18px 0 0;
  border-top: 3px solid var(--accent);
}

.workspace-case-title,
.workspace-section-heading,
.workspace-next-action,
.workspace-object-card > header,
.workspace-task-card > header {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.workspace-case-title h2,
.workspace-section-heading h2,
.workspace-section > h2,
.workspace-timeline-panel h2 {
  margin: 2px 0 0;
  font-size: 20px;
  line-height: 1.25;
  letter-spacing: 0;
}

.workspace-case-heading-line {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.workspace-case-heading-line h2 {
  min-width: 0;
  overflow-wrap: anywhere;
}

.workspace-lead-id-badge {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--ink);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
}

.workspace-case-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
  margin-top: 16px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.workspace-case-fact {
  min-width: 0;
  padding: 12px 14px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.workspace-case-fact:nth-child(3n) {
  border-right: 0;
}

.workspace-case-fact:nth-last-child(-n + 3) {
  border-bottom: 0;
}

.workspace-case-fact span,
.workspace-next-action span,
.workspace-task-card small,
.workspace-document-card small {
  display: block;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}

.workspace-case-fact strong {
  display: block;
  margin-top: 4px;
  overflow-wrap: anywhere;
  line-height: 1.35;
}

.workspace-next-action {
  position: sticky;
  z-index: 4;
  bottom: 8px;
  align-items: center;
  margin: 14px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
  box-shadow: var(--shadow-soft);
}

.workspace-next-action strong {
  display: block;
  margin-top: 3px;
  font-size: 16px;
  line-height: 1.3;
}

.workspace-origin-context {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 4px 12px;
  margin-top: 12px;
  color: var(--muted);
  font-size: 12px;
}

.workspace-origin-context strong {
  min-width: 0;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.workspace-timeline-panel {
  min-width: 0;
  overflow: hidden;
}

.workspace-timeline-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.workspace-timeline {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  min-width: 0;
  margin: 16px 0 0;
  padding: 0 2px 8px;
  list-style: none;
  overflow: visible;
  row-gap: 18px;
}

.workspace-timeline-step {
  position: relative;
  width: auto;
  min-width: 0;
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  grid-template-rows: 18px auto;
  column-gap: 7px;
  row-gap: 7px;
  align-items: start;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.3;
}

.workspace-timeline-label {
  position: relative;
  z-index: 1;
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
  padding-right: 12px;
  overflow-wrap: normal;
  word-break: normal;
}

.workspace-timeline-step::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 18px;
  right: 0;
  height: 2px;
  background: var(--line);
}

.workspace-timeline-step:last-child::after {
  display: none;
}

.workspace-timeline:not(.is-vertical) .workspace-timeline-step:nth-child(6n)::after {
  display: none;
}

.workspace-timeline-marker {
  position: relative;
  z-index: 1;
  width: 16px;
  height: 16px;
  border: 2px solid var(--line-strong);
  border-radius: 50%;
  background: var(--surface);
}

.workspace-timeline-step.is-completed {
  color: var(--ink);
}

.workspace-timeline-step.is-completed .workspace-timeline-marker,
.workspace-timeline-step.is-completed::after {
  border-color: #317a55;
  background: #317a55;
}

.workspace-timeline-step.is-completed .workspace-timeline-marker::before {
  content: "✓";
  position: absolute;
  inset: -2px;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}

.workspace-timeline-step.is-current {
  color: var(--ink);
  font-weight: 700;
}

.workspace-timeline-step.is-current .workspace-timeline-marker {
  border-color: var(--accent);
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
}

.workspace-path-exception {
  display: flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  max-width: 100%;
  margin-top: 14px;
  padding: 8px 10px;
  border: 1px solid var(--line-strong);
  border-left: 3px solid var(--accent);
  border-radius: 6px;
  background: var(--surface-muted);
}

.workspace-path-exception span {
  color: var(--muted);
  font-size: 12px;
}

.workspace-path-exception strong {
  overflow-wrap: normal;
  word-break: normal;
}

.workspace-path-exception.is-terminal {
  border-left-color: #b43a3a;
}

.workspace-timeline-demo {
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.workspace-timeline-demo > summary {
  width: fit-content;
  list-style: none;
  cursor: pointer;
}

.workspace-timeline-demo > summary::-webkit-details-marker {
  display: none;
}

.workspace-timeline-demo-body {
  width: min(420px, 100%);
  margin: 12px 0 0 auto;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.workspace-timeline.is-vertical {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  margin-top: 12px;
  padding-bottom: 0;
}

.workspace-timeline.is-vertical .workspace-timeline-step {
  width: auto;
  min-height: 42px;
  grid-template-columns: 18px minmax(0, 1fr);
  grid-template-rows: auto;
}

.workspace-timeline.is-vertical .workspace-timeline-label {
  grid-column: 2;
  grid-row: 1;
  padding-right: 0;
}

.workspace-timeline.is-vertical .workspace-timeline-step::after {
  top: 16px;
  right: auto;
  bottom: 0;
  left: 7px;
  width: 2px;
  height: auto;
}

.workspace-timeline.is-vertical .workspace-timeline-step:last-child {
  min-height: 20px;
}

.owner-control-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 8px;
  border: 1px solid #a76714;
  border-radius: 999px;
  background: #fff3d7;
  color: #70430d;
  font-size: 12px;
  font-weight: 800;
}

.owner-control-form {
  margin: 0;
}

.lead-header-actions {
  min-width: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.lead-header-actions > * {
  max-width: 100%;
}

.owner-control-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.owner-control-filter .button.current {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
}

.owner-control-filter .button span {
  margin-left: 4px;
  font-variant-numeric: tabular-nums;
}

.owner-control-counts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.owner-control-counts span {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  color: var(--muted);
  font-size: 13px;
}

.owner-control-counts strong {
  color: var(--ink);
  font-variant-numeric: tabular-nums;
}

.owner-control-card-badge {
  margin-top: 6px;
}

.controlled-archive-details {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-muted);
}

.controlled-archive-details div {
  display: grid;
  grid-template-columns: minmax(0, 92px) minmax(0, 1fr);
  gap: 8px;
}

.controlled-archive-details dt {
  color: var(--muted);
  font-size: 11px;
}

.controlled-archive-details dd {
  min-width: 0;
  margin: 0;
  font-size: 12px;
  overflow-wrap: anywhere;
}

.controlled-card-remove {
  flex: 0 0 auto;
}

.workspace-layout {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.workspace-layout > * {
  min-width: 0;
  grid-column: 1 / -1;
}

.workspace-section,
.workspace-layout > .client-base-block,
.workspace-layout > .lead-appointments,
.workspace-layout > .lead-assignment-workflow {
  scroll-margin-top: 16px;
  border-radius: 8px;
}

.workspace-flow-section {
  min-width: 0;
  border-top: 1px solid var(--line);
}

.workspace-flow-section > summary {
  min-height: 54px;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) max-content;
  align-items: center;
  gap: 10px;
  padding: 10px 2px;
  list-style: none;
  cursor: pointer;
}

.workspace-flow-section > summary::-webkit-details-marker {
  display: none;
}

.workspace-flow-section > summary strong {
  min-width: 0;
  font-size: 16px;
  overflow-wrap: normal;
}

.workspace-flow-section > summary small {
  color: var(--muted);
}

.workspace-flow-marker {
  width: 22px;
  height: 22px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 50%;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
}

.workspace-flow-section.is-completed .workspace-flow-marker {
  border-color: #317a55;
  background: #317a55;
  color: #fff;
}

.workspace-flow-section.is-current {
  border-top-color: var(--accent);
}

.workspace-flow-section.is-current .workspace-flow-marker {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
}

.workspace-flow-body {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  padding-bottom: 16px;
}

.workspace-flow-context {
  margin: 0;
  padding: 12px 14px;
  border-left: 3px solid var(--accent);
  background: var(--surface-muted);
  color: var(--ink);
}

.workspace-section-heading {
  align-items: center;
  margin-bottom: 14px;
}

.workspace-count {
  flex: 0 0 auto;
  color: var(--muted);
  font-weight: 700;
}

.workspace-role-instruction {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px 10px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border-left: 3px solid var(--success-text);
  background: var(--surface-muted);
}

.workspace-role-instruction strong {
  color: var(--success-text);
}

.workspace-role-instruction span {
  color: var(--ink);
}

.workspace-task-list,
.workspace-document-list {
  display: grid;
  gap: 0;
}

.workspace-task-card,
.workspace-object-card,
.workspace-document-card {
  min-width: 0;
  padding: 14px 0;
  border-top: 1px solid var(--line);
  background: transparent;
}

.workspace-task-card:first-child,
.workspace-object-card:first-of-type,
.workspace-document-card:first-child {
  border-top: 0;
}

.workspace-task-card p,
.workspace-object-card p,
.workspace-document-card p {
  margin: 7px 0 0;
  overflow-wrap: anywhere;
}

.workspace-task-card p > span {
  color: var(--muted);
}

.workspace-estimate-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.workspace-estimate-card {
  min-width: 0;
  padding: 16px;
}

.workspace-estimate-card + .workspace-estimate-card {
  border-left: 1px solid var(--line);
}

.workspace-estimate-card h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.workspace-money {
  display: block;
  font-size: 24px;
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
}

.workspace-document-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}

.workspace-document-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
  max-width: 420px;
}

.document-upload-trigger {
  margin-top: 14px;
}

.document-delivery-dialog {
  width: min(620px, calc(100vw - 32px));
  max-height: min(760px, calc(100dvh - 32px));
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0;
  background: var(--surface-raised);
  color: var(--ink);
  box-shadow: var(--shadow);
}

.document-delivery-dialog::backdrop {
  background: rgba(11, 16, 21, 0.62);
}

.document-delivery-dialog > header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
}

.document-delivery-dialog > header h3,
.document-delivery-dialog > header p {
  margin: 0;
}

.document-delivery-dialog > form,
.document-delivery-dialog > .channel-state {
  margin: 16px;
}

.channel-state {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.channel-state span {
  color: var(--muted);
  text-align: right;
}

body:has(.document-delivery-dialog[open]) {
  overflow: hidden;
}

.workspace-context-dialog {
  width: min(640px, calc(100vw - 32px));
  max-height: min(820px, calc(100dvh - 32px));
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  padding: 0;
  background: var(--surface-raised);
  color: var(--ink);
  box-shadow: var(--shadow);
}

.workspace-context-dialog::backdrop {
  background: rgba(11, 16, 21, 0.62);
}

.workspace-context-dialog > header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
}

.workspace-context-dialog > header h3,
.workspace-context-dialog > header p {
  margin: 0;
}

.workspace-context-dialog > .facts,
.workspace-context-dialog > form,
.workspace-context-dialog > .instruction-context-help {
  margin: 16px;
}

.workspace-checklist {
  display: grid;
  gap: 8px;
  min-width: 0;
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.workspace-blocker {
  display: grid;
  gap: 8px;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--warning-ink, #8a5a00);
  border-radius: 6px;
  background: var(--surface-muted);
}

.workspace-blocker p {
  margin: 0;
}

body:has(.workspace-context-dialog[open]) {
  overflow: hidden;
}

.tasks-page,
.work-time-report {
  display: grid;
  gap: 14px;
  min-width: 0;
}

.tasks-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.tasks-summary h2,
.my-task-card h2 {
  margin: 2px 0 0;
  font-size: 18px;
  letter-spacing: 0;
}

.task-current-session {
  display: grid;
  gap: 3px;
  min-width: 220px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--ink);
  text-decoration: none;
}

.task-current-session span,
.my-task-card small {
  color: var(--muted);
}

.my-task-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.my-task-card {
  min-width: 0;
  border-left: 3px solid var(--line-strong);
}

.my-task-card.priority-high,
.my-task-card.priority-urgent {
  border-left-color: #b43a3a;
}

.my-task-card > header,
.workspace-task-card > header,
.workspace-object-card > header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
}

.my-task-card-actions,
.task-quick-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 8px;
}

.my-task-card-actions {
  margin-top: 12px;
}

.task-quick-action {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 7px;
  margin: 0;
}

.task-pause-reason {
  min-width: 180px;
  margin: 0;
}

.task-pause-reason span {
  display: block;
  color: var(--muted);
  font-size: 11px;
}

.task-session-conflict {
  flex-basis: 100%;
}

.task-time-state {
  padding: 8px 10px;
  border-left: 3px solid var(--accent);
  background: var(--soft);
}

.completed-task-history summary,
.work-session-history summary {
  cursor: pointer;
  font-weight: 700;
}

.completed-task-list,
.work-session-history > div {
  display: grid;
  gap: 0;
  margin-top: 10px;
}

.completed-task-list a,
.work-session-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 9px 0;
  border-top: 1px solid var(--line);
  color: var(--ink);
  text-decoration: none;
}

.work-session-row {
  grid-template-columns: minmax(150px, 1fr) repeat(4, auto);
}

.report-filter-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  align-items: end;
}

.report-filter-grid label {
  min-width: 0;
  margin: 0;
}

.report-stat-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.report-stat-grid article {
  display: grid;
  gap: 4px;
}

.report-stat-grid span {
  color: var(--muted);
  font-size: 12px;
}

.report-stat-grid strong {
  font-size: 20px;
  font-variant-numeric: tabular-nums;
}

.work-time-table {
  width: 100%;
  border-collapse: collapse;
}

.work-time-table th,
.work-time-table td {
  padding: 9px 10px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}

.work-time-table th {
  color: var(--muted);
  font-size: 11px;
}

.workspace-editor {
  margin-top: 14px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.workspace-editor.compact {
  margin-top: 10px;
  padding-top: 8px;
}

.workspace-editor > summary {
  width: max-content;
  max-width: 100%;
  list-style: none;
  cursor: pointer;
}

.workspace-editor > summary::-webkit-details-marker {
  display: none;
}

.workspace-editor > .form,
.workspace-editor > form {
  margin-top: 12px;
}

.workspace-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.workspace-assignment-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.assignment-chip {
  min-width: 160px;
  max-width: 100%;
  display: grid;
  gap: 2px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-muted);
}

.assignment-chip strong,
.assignment-chip small {
  overflow-wrap: normal;
  word-break: normal;
}

.assignment-chip small,
.assignment-primary-badge {
  color: var(--muted);
  font-size: 11px;
}

.assignment-unavailable-badge {
  color: var(--danger);
  font-size: 11px;
  font-weight: 750;
}

.assignment-chip.is-unavailable {
  border-color: color-mix(in srgb, var(--danger) 45%, var(--line));
}

.assignment-primary-summary {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.assignment-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 800;
}

.assignment-primary-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.assignment-primary-copy span,
.assignment-primary-copy small,
.assignment-primary-meta dt {
  color: var(--muted);
  font-size: 12px;
}

.assignment-primary-copy strong {
  overflow-wrap: normal;
  word-break: normal;
}

.assignment-primary-meta {
  display: grid;
  grid-template-columns: repeat(2, minmax(110px, auto));
  gap: 12px;
  margin: 0;
}

.assignment-primary-meta div {
  display: grid;
  gap: 2px;
}

.assignment-primary-meta dd {
  margin: 0;
  font-weight: 750;
}

.assignment-primary-empty {
  margin: 8px 0;
  color: var(--muted);
}

.assignment-participant-summary {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.assignment-participant-summary h3 {
  margin: 0;
  font-size: 14px;
}

.assignment-edit-trigger {
  margin-top: 12px;
}

.assignment-dialog {
  width: min(780px, calc(100vw - 32px));
  max-width: none;
  max-height: min(88dvh, 920px);
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.assignment-dialog::backdrop {
  background: rgba(11, 16, 21, 0.62);
}

body:has(.assignment-dialog[open]) {
  overflow: hidden;
}

.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.workspace-assignment-form {
  display: grid;
  grid-template-rows: auto auto auto auto auto minmax(220px, 1fr) auto;
  max-height: min(88dvh, 920px);
  margin: 0;
}

.assignment-dialog-header,
.assignment-dialog-toolbar,
.assignment-role-filters,
.assignment-selected-chips,
.assignment-list-actions,
.assignment-dialog-footer {
  padding-inline: 18px;
}

.assignment-dialog-header {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding-top: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.assignment-dialog-header h2,
.assignment-dialog-header p {
  margin: 0;
}

.assignment-dialog-close {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  font-size: 24px;
  line-height: 1;
}

.assignment-dialog-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: end;
  padding-top: 14px;
}

.workspace-staff-search {
  min-width: 0;
  margin: 0;
}

.assignment-selection-status {
  display: grid;
  gap: 3px;
  text-align: right;
  font-size: 12px;
}

.assignment-selection-status span {
  color: var(--muted);
}

.assignment-role-filters {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-top: 12px;
  padding-bottom: 2px;
}

.assignment-role-filter {
  flex: 0 0 auto;
  min-height: 34px;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px 9px;
  background: var(--surface-muted);
  color: var(--ink);
  font: inherit;
  cursor: pointer;
}

.assignment-role-filter.is-active {
  border-color: var(--accent);
  background: var(--accent);
  color: var(--accent-ink);
}

.assignment-selected-chips {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
  min-height: 36px;
  max-height: 116px;
  overflow-y: auto;
  padding-top: 8px;
  padding-bottom: 4px;
}

.assignment-selected-chip {
  flex: 0 1 auto;
  max-width: 100%;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 6px 8px;
  background: var(--surface-muted);
  color: var(--ink);
  overflow-wrap: normal;
  white-space: normal;
  cursor: pointer;
}

.assignment-list-actions {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  padding-top: 6px;
  padding-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
}

.assignment-employee-list {
  min-height: 220px;
  overflow-y: auto;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 0 18px;
}

.assignment-dialog .assignment-employee-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto) auto;
  gap: 12px;
  align-items: center;
  min-width: 0;
  min-height: 58px;
  padding: 9px 0;
  border-bottom: 1px solid var(--line);
}

.assignment-dialog .assignment-employee-row[hidden] {
  display: none !important;
}

.assignment-case-role {
  min-width: 0;
  margin: 0;
  font-size: 11px;
  color: var(--muted);
}

.assignment-case-role select {
  min-width: 150px;
  margin-top: 3px;
}

.assignment-dialog .assignment-employee-row:last-child {
  border-bottom: 0;
}

.assignment-dialog .assignment-employee-row.is-primary {
  background: var(--soft);
}

.assignment-dialog .assignment-employee-row.is-unavailable {
  background: color-mix(in srgb, var(--danger) 6%, var(--panel));
}

.assignment-dialog .assignment-employee-select {
  display: grid;
  grid-template-columns: 20px minmax(180px, 1fr);
  gap: 10px;
  align-items: center;
  min-width: 0;
  color: var(--ink);
}

.assignment-dialog .assignment-employee-select input {
  width: 18px;
  height: 18px;
  margin: 0;
  padding: 0;
}

.assignment-employee-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.assignment-employee-copy strong,
.assignment-employee-copy small,
.assignment-employee-copy em {
  min-width: 0;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}

.assignment-employee-copy small {
  color: var(--muted);
}

.assignment-employee-copy em {
  color: var(--warning-ink, #8a5a00);
  font-size: 11px;
  font-style: normal;
}

.assignment-primary-action {
  display: inline-flex;
  gap: 5px;
  align-items: center;
  min-height: 34px;
  border: 0;
  padding: 5px 7px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  cursor: pointer;
}

.assignment-primary-action[aria-pressed="true"] {
  color: var(--accent-dark);
  font-weight: 800;
}

.assignment-no-results {
  padding: 20px 0;
}

.assignment-dialog-footer {
  position: sticky;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 12px;
  padding-bottom: 14px;
  background: var(--panel);
}

.assignment-save-reason {
  flex: 1 1 240px;
  align-self: center;
  color: var(--danger);
  font-size: 12px;
}

.entity-candidate-list {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}

.entity-candidate-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border-top: 1px solid var(--line);
}

.entity-candidate-card > div {
  display: grid;
  gap: 3px;
  min-width: 0;
}

.entity-candidate-card strong,
.entity-candidate-card span,
.entity-candidate-card small,
.entity-candidate-vehicles li {
  overflow-wrap: normal;
  word-break: normal;
}

.entity-candidate-card span,
.entity-candidate-card small {
  color: var(--muted);
}

.entity-candidate-card form {
  display: grid;
  gap: 7px;
  min-width: 150px;
}

.entity-candidate-vehicles {
  display: grid;
  gap: 2px;
  margin: 4px 0 0;
  padding-left: 18px;
  font-size: 12px;
}

.source-badge.is-pending {
  border-color: var(--line-strong);
}

.match-state {
  margin: 10px 0 0;
}

.confirmation-check {
  display: flex;
  flex-direction: row !important;
  gap: 8px;
  align-items: flex-start;
}

.confirmation-check input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin-top: 1px;
}

.workspace-delivery-history {
  margin-top: 14px;
}

@media (max-width: 1100px) {
  .workspace-timeline {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .workspace-timeline:not(.is-vertical) .workspace-timeline-step:nth-child(6n):not(:last-child)::after {
    display: block;
  }

  .workspace-timeline:not(.is-vertical) .workspace-timeline-step:nth-child(4n)::after {
    display: none;
  }

}

@media (max-width: 700px) {
  .lead-workspace {
    gap: 12px;
  }

  .workspace-case-header {
    padding-top: 12px;
  }

  .workspace-case-title,
  .workspace-section-heading,
  .workspace-next-action,
  .workspace-object-card > header,
  .workspace-task-card > header {
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-case-facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-case-fact:nth-child(3n) {
    border-right: 1px solid var(--line);
  }

  .workspace-case-fact {
    border-right: 0;
  }

  .workspace-case-fact:nth-last-child(-n + 3) {
    border-bottom: 1px solid var(--line);
  }

  .workspace-case-fact:last-child {
    border-bottom: 0;
  }

  .workspace-origin-context {
    grid-template-columns: minmax(0, 1fr);
    gap: 2px;
  }

  .workspace-origin-context strong + span {
    margin-top: 8px;
  }

  .workspace-flow-section > summary {
    grid-template-columns: 24px minmax(0, 1fr);
  }

  .workspace-flow-section > summary small {
    grid-column: 2;
  }

  .workspace-next-action {
    position: static;
  }

  .workspace-next-action .button {
    width: 100%;
  }

  .workspace-timeline {
    grid-template-columns: minmax(0, 1fr);
    min-width: 0;
    display: grid;
    overflow: visible;
  }

  .workspace-timeline-panel {
    overflow: visible;
  }

  .workspace-timeline-heading,
  .workspace-path-exception {
    align-items: stretch;
    flex-direction: column;
  }

  .workspace-timeline-demo-body {
    width: 100%;
    margin-left: 0;
  }

  .workspace-timeline-step {
    width: auto;
    min-height: 34px;
    grid-template-columns: 18px minmax(0, 1fr);
    grid-template-rows: auto;
  }

  .workspace-timeline-label {
    grid-column: 2;
    grid-row: 1;
    padding-right: 0;
  }

  .workspace-timeline-step::after {
    top: 16px;
    bottom: 0;
    left: 7px;
    right: auto;
    width: 2px;
    height: auto;
  }

  .workspace-timeline:not(.is-vertical) .workspace-timeline-step:not(:last-child)::after {
    display: block;
  }

  .workspace-timeline-step.is-future:not(:first-of-type) {
    min-height: 24px;
  }

  .workspace-estimate-grid,
  .workspace-form-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .assignment-primary-summary {
    grid-template-columns: 42px minmax(0, 1fr);
  }

  .assignment-primary-meta {
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .assignment-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }

  .workspace-assignment-form {
    height: 100dvh;
    max-height: 100dvh;
  }

  .assignment-dialog-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .assignment-selection-status {
    text-align: left;
  }

  .assignment-dialog-header,
  .assignment-dialog-toolbar,
  .assignment-role-filters,
  .assignment-selected-chips,
  .assignment-list-actions,
  .assignment-dialog-footer,
  .assignment-employee-list {
    padding-inline: 14px;
  }

  .assignment-dialog-footer .button {
    flex: 1 1 0;
  }

  body:has(.assignment-dialog[open]) .mobile-bottom-nav {
    visibility: hidden;
  }

  .entity-candidate-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .entity-candidate-card form {
    min-width: 0;
  }

  .entity-candidate-card .button {
    width: 100%;
  }

  .workspace-estimate-card + .workspace-estimate-card {
    border-top: 1px solid var(--line);
    border-left: 0;
  }

  .workspace-document-card {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-document-card > details {
    grid-column: auto;
  }

  .document-delivery-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }

  body:has(.document-delivery-dialog[open]) .mobile-bottom-nav {
    visibility: hidden;
  }

  .workspace-context-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }

  body:has(.workspace-context-dialog[open]) .mobile-bottom-nav {
    visibility: hidden;
  }

  .tasks-summary {
    align-items: stretch;
    flex-direction: column;
  }

  .task-current-session {
    width: 100%;
    min-width: 0;
  }

  .my-task-list,
  .report-stat-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .work-session-row {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (max-width: 420px) {
  .workspace-case-facts {
    grid-template-columns: minmax(0, 1fr);
  }

  .workspace-case-fact,
  .workspace-case-fact:nth-child(n) {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .workspace-case-fact:last-child {
    border-bottom: 0;
  }

  .assignment-dialog .assignment-employee-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 6px;
  }

  .assignment-case-role {
    grid-column: 1 / -1;
  }

  .assignment-primary-action span:last-child {
    display: none;
  }

  .my-task-list,
  .report-filter-grid,
  .report-stat-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .task-quick-actions,
  .task-quick-action,
  .my-task-card-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .task-quick-action .button,
  .my-task-card-actions > .button,
  .task-pause-reason {
    width: 100%;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #11161b;
  --panel: #1b2229;
  --ink: #edf2f4;
  --muted: #a7b2bc;
  --line: #343e47;
  --line-strong: #4a5661;
  --sidebar: #0b1015;
  --sidebar-soft: #1b252d;
  --sidebar-ink: #f2f6f7;
  --accent: #4aa6b8;
  --accent-dark: #8ed0da;
  --soft: #183035;
  --work: #24231f;
  --shadow: 0 12px 30px rgba(0, 0, 0, 0.34);
  --surface: var(--panel);
  --surface-muted: #151c22;
  --text: var(--ink);
  --border: var(--line);
  --shadow-soft: 0 4px 14px rgba(0, 0, 0, 0.28);
  --accent-soft: #18343a;
  --accent-strong: #9bd9e1;
  --accent-ink: #07191d;
  --accent-ink-muted: rgba(7, 25, 29, 0.76);
  --ink-inverse: #11161b;
  --surface-raised: #222b33;
  --surface-input: var(--panel);
  --tab-background: #151c22;
  --tab-border: var(--line);
  --tab-text: var(--ink);
  --tab-hover-background: var(--panel);
  --tab-active-text: var(--accent-dark);
  --table-header-background: #20282f;
  --focus-ring: #79c4d0;
  --success-text: #9ed6ad;
}

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;
}

body {
  margin: 0;
  overflow: hidden;
  background: var(--bg);
  color: var(--ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 14px;
}

a {
  color: inherit;
}

:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.app-shell {
  width: 100vw;
  height: 100vh;
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  background: var(--bg);
}

.environment-banner {
  flex: 0 0 auto;
  width: 100%;
  padding: 7px 14px;
  border-bottom: 1px solid #9f1239;
  background: #be123c;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
}

.sidebar {
  min-width: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 14px 12px;
  background: var(--sidebar);
  color: var(--sidebar-ink);
  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-brand {
  min-height: 44px;
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 10px;
}

.brand-mark {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 8px;
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 800;
}

.brand-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.brand-copy strong,
.sidebar-user span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.brand-copy span,
.sidebar-user small {
  color: #a8b5c0;
}

.sidebar-toggle {
  width: 36px;
  height: 36px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 8px;
  background: var(--sidebar-soft);
  color: var(--sidebar-ink);
  cursor: pointer;
}

.sidebar-nav {
  display: grid;
  gap: 6px;
}

.sidebar-nav a {
  position: relative;
  min-height: 40px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  border-radius: 8px;
  color: var(--sidebar-ink);
  text-decoration: none;
}

.sidebar-nav a.active {
  background: rgba(29, 111, 143, 0.26);
  box-shadow: inset 3px 0 0 var(--accent);
}

.sidebar-nav-group {
  min-width: 0;
}

.sidebar-nav-group > summary {
  min-height: 40px;
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  padding: 8px 9px;
  border-radius: 8px;
  color: var(--sidebar-ink);
  list-style: none;
  cursor: pointer;
}

.sidebar-nav-group > summary::-webkit-details-marker {
  display: none;
}

.sidebar-nav-group > summary.active {
  background: rgba(29, 111, 143, 0.16);
}

.sidebar-subnav {
  display: grid;
  gap: 3px;
  margin: 3px 0 2px 18px;
  padding-left: 8px;
  border-left: 1px solid rgba(255, 255, 255, 0.14);
}

.sidebar-nav a.sidebar-subnav-link {
  min-height: 34px;
  grid-template-columns: 22px minmax(0, 1fr) auto;
  padding-block: 6px;
  font-size: 13px;
}

.sidebar-nav span {
  display: grid;
  place-items: center;
}

.sidebar-nav strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-nav .crm-nav-badge {
  min-width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  padding: 0 6px;
  border-radius: 999px;
  background: #e8f4f5;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 800;
}

.sidebar-nav .crm-nav-badge[hidden] {
  display: none;
}

.sidebar-user {
  margin-top: auto;
  display: grid;
  gap: 2px;
  padding: 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
}

.sidebar-collapsed .app-shell {
  grid-template-columns: 64px minmax(0, 1fr);
}

.sidebar-collapsed .sidebar {
  padding-inline: 10px;
}

.sidebar-collapsed .sidebar-brand {
  grid-template-columns: 36px;
}

.sidebar-collapsed .brand-copy,
.sidebar-collapsed .sidebar-user,
.sidebar-collapsed .sidebar-nav strong,
.sidebar-collapsed .sidebar-subnav {
  display: none;
}

.sidebar-collapsed .sidebar-nav-group > summary {
  grid-template-columns: 28px;
  justify-content: center;
}

.sidebar-collapsed .sidebar-nav a {
  grid-template-columns: 28px;
  justify-content: center;
}

.sidebar-collapsed .crm-nav-badge {
  position: absolute;
  margin: -24px 0 0 24px;
}

.sidebar-collapsed .sidebar-toggle {
  margin-top: 8px;
}

.main-area {
  min-width: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.crm-toast-stack {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 80;
  display: grid;
  gap: 10px;
  width: min(360px, calc(100vw - 32px));
  pointer-events: none;
}

.crm-notification-controls {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.crm-notification-controls button,
.crm-toast-actions button {
  min-height: 32px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
}

.crm-notification-controls button {
  padding: 0 10px;
}

.crm-notification-controls button[aria-pressed="true"] {
  border-color: rgba(29, 111, 143, 0.35);
  background: rgba(29, 111, 143, 0.08);
  color: var(--accent-strong);
}

.crm-notification-controls button:disabled {
  cursor: not-allowed;
  opacity: 0.65;
}

.crm-toast {
  position: relative;
  display: grid;
  gap: 4px;
  padding: 12px 42px 12px 13px;
  border: 1px solid var(--line-strong);
  border-left: 4px solid var(--accent);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
  color: var(--ink);
  text-decoration: none;
  pointer-events: auto;
}

.crm-toast-clickable {
  cursor: pointer;
}

.crm-toast:focus-visible {
  outline: 3px solid rgba(29, 111, 143, 0.3);
  outline-offset: 2px;
}

.crm-toast strong {
  font-size: 14px;
  line-height: 1.2;
}

.crm-toast span {
  color: var(--muted);
  line-height: 1.35;
}

.crm-toast-close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 26px;
  height: 26px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg);
  color: var(--muted);
  cursor: pointer;
}

.crm-toast-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}

.crm-toast-actions button {
  padding: 0 11px;
}

.main-header {
  min-height: 78px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  background: rgba(244, 246, 248, 0.94);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
  position: sticky;
  top: 0;
  z-index: 10;
}

.main-header h1 {
  margin: 0 0 4px;
  font-size: 22px;
  line-height: 1.16;
}

.main-header p,
.screen-title p,
.column header p,
.muted,
.empty {
  margin: 0;
  color: var(--muted);
}

.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.global-entity-search {
  position: relative;
  flex: 1 1 520px;
  min-width: 260px;
  max-width: 680px;
}

.global-entity-search-field {
  min-width: 0;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-height: 42px;
  padding: 0 10px;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-input);
  box-shadow: 0 1px 2px rgba(28, 38, 48, 0.04);
}

.global-entity-search-field:focus-within {
  border-color: var(--focus-ring);
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--focus-ring) 22%, transparent);
}

.global-entity-search-field > span {
  color: var(--muted);
  font-size: 20px;
  line-height: 1;
}

.global-entity-search-field input {
  width: 100%;
  min-width: 0;
  height: 40px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--ink);
  font: inherit;
}

.global-entity-search-popover {
  position: absolute;
  z-index: 70;
  top: calc(100% + 7px);
  right: 0;
  left: 0;
  max-height: min(68vh, 620px);
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 7px;
  background: var(--surface-raised);
  box-shadow: 0 16px 36px rgba(20, 31, 40, 0.18);
}

.global-entity-search-status {
  margin: 0;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.global-entity-search-group + .global-entity-search-group {
  border-top: 1px solid var(--line);
}

.global-entity-search-group h3 {
  margin: 0;
  padding: 8px 12px 5px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
  text-transform: uppercase;
}

.global-entity-search-result {
  min-width: 0;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  min-height: 58px;
  padding: 8px 12px;
  border-top: 1px solid color-mix(in srgb, var(--line) 65%, transparent);
  color: var(--ink);
  text-decoration: none;
}

.global-entity-search-result:hover,
.global-entity-search-result.is-active {
  background: var(--accent-soft);
}

.global-entity-search-icon {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: var(--surface-muted);
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 900;
}

.global-entity-search-copy {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.global-entity-search-copy strong,
.global-entity-search-copy small,
.global-entity-search-copy > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.global-entity-search-copy strong {
  font-size: 13px;
}

.global-entity-search-copy small,
.global-entity-search-copy > span {
  color: var(--muted);
  font-size: 11px;
}

.global-entity-search-copy mark {
  padding: 0;
  background: #fff1a8;
  color: inherit;
}

.global-entity-search-badges {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  gap: 4px;
}

.global-entity-search-badges small {
  max-width: 120px;
  overflow: hidden;
  padding: 2px 6px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.appointments-search,
.tasks-search,
.site-chat-search {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto;
  gap: 8px;
  align-items: center;
}

.appointments-search {
  grid-column: 1 / -1;
}

.appointments-search input,
.tasks-search input,
.site-chat-search input {
  min-width: 0;
  width: 100%;
}

.tasks-search {
  margin-bottom: 12px;
}

.site-chat-search {
  margin: 10px 0;
}

.board-search-form {
  min-width: min(420px, 44vw);
  display: grid;
  grid-template-columns: minmax(180px, 1fr) auto auto;
  gap: 8px;
  align-items: center;
}

.board-context-toolbar {
  display: grid;
  gap: 12px;
  margin-bottom: 16px;
}

.board-metrics,
.board-date-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.board-metric {
  display: inline-flex;
  align-items: baseline;
  gap: 7px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
}

.board-metric strong { font-size: 18px; }
.board-metric span { color: var(--muted); font-size: 12px; }
.board-date-filters .current { background: var(--accent); color: var(--accent-ink); }
.board-filter-button { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.board-filter-button small { margin-top: 3px; color: var(--muted); font-size: 11px; font-weight: 400; }
.board-filter-button.current small { color: var(--accent-ink-muted); }
.board-filter-label-mobile { display: none; }
.board-filter-sheet-actions { display: flex; justify-content: flex-end; }
.board-filter-count {
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  margin-left: 6px;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--accent);
  color: var(--accent-ink);
  font-size: 11px;
}
.board-custom-filter { display: inline-flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.board-custom-filter label { color: var(--muted); font-size: 12px; }
.board-custom-filter input { min-height: 34px; }
.board-period-label { margin: 0; color: var(--muted); font-size: 13px; }
.board-filter-error { margin: 0; color: #a24f32; font-size: 13px; }
.lead-card-date-context { display: flex; flex-wrap: wrap; gap: 8px; color: var(--muted); font-size: 12px; }
.lead-age { font-weight: 600; }
.lead-card.lead-age-warning { border-color: #e4c47b; }
.lead-card.lead-age-old { border-color: #d89c78; }
.appointment-badge.appointment-past { background: #f4eadf; color: #8a542f; }
.appointment-badge.appointment-future { background: #e6f4e8; color: #2d6a3f; }
.appointment-attention { display: block; margin-top: 4px; color: #9a5b2d; font-size: 12px; }
.board-show-more { margin: 8px 0; }

.board-search-form input[type="search"] {
  min-width: 0;
  height: 38px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  font: inherit;
}

.user-pill {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  max-width: 320px;
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.auth-mode-pill {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  padding: 6px 9px;
  border: 1px solid #e5c566;
  border-radius: 8px;
  background: #fff8df;
  color: #7a5a00;
  white-space: nowrap;
}

.logout-form {
  margin: 0;
}

.shift-banner {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 16px;
  justify-content: space-between;
  padding: 12px 24px;
}

.shift-banner > div {
  display: grid;
  gap: 3px;
}

.shift-banner span {
  color: var(--muted);
  font-size: 13px;
}

.shift-banner-start { background: #fff9e8; }
.shift-banner-active { background: #eef8f1; }
.shift-banner-neutral { background: #f4f6f8; color: var(--muted); }

.logout-menu {
  position: relative;
}

.logout-menu summary {
  list-style: none;
}

.logout-menu summary::-webkit-details-marker {
  display: none;
}

.logout-menu-panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  display: grid;
  gap: 8px;
  padding: 12px;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  width: min(300px, calc(100vw - 32px));
  z-index: 30;
}

.logout-menu-panel p {
  color: var(--muted);
  font-size: 13px;
  margin: 0;
}

.logout-menu-panel form,
.logout-menu-panel .button {
  width: 100%;
}

.dev-impersonation-banner {
  position: sticky;
  top: 0;
  z-index: 45;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 72px;
  padding: 12px 20px;
  color: #fff;
  background: #8f1d24;
  border-bottom: 2px solid #5f1015;
  box-shadow: 0 8px 20px rgb(32 12 14 / 20%);
}

.dev-impersonation-banner > div {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.dev-impersonation-banner strong {
  font-size: 13px;
  text-transform: uppercase;
}

.dev-impersonation-banner span,
.dev-impersonation-banner small {
  overflow-wrap: anywhere;
}

.dev-impersonation-banner .button {
  min-height: 42px;
  color: #201416;
  background: #fff;
  border-color: #fff;
  white-space: nowrap;
}

.dev-role-console {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 28px;
  min-width: 0;
  width: min(100%, 1500px);
  max-width: 100%;
  margin: 0 auto;
}

.dev-role-intro,
.dev-fixture-section,
.dev-role-audit {
  display: grid;
  gap: 18px;
  min-width: 0;
}

.dev-role-intro {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--border);
}

.dev-role-intro h2,
.dev-fixture-section h2,
.dev-role-audit h2,
.dev-role-card h3 {
  margin: 0;
}

.dev-role-intro p,
.dev-fixture-section p,
.dev-role-user {
  margin: 5px 0 0;
  color: var(--muted);
}

.dev-role-kicker {
  display: inline-block;
  color: #a31f2b;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

[data-theme="dark"] .dev-role-kicker {
  color: #ff8d98;
}

.dev-role-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 12px;
}

.dev-role-card {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 16px;
  min-width: 0;
  padding: 18px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 8px;
}

.dev-role-card dl {
  display: grid;
  gap: 10px;
  margin: 0;
}

.dev-role-card dl div {
  display: grid;
  gap: 2px;
}

.dev-role-card dt {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.dev-role-card dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.dev-role-card form,
.dev-role-card .button {
  width: 100%;
}

.dev-fixture-section,
.dev-role-audit {
  padding-top: 4px;
}

.dev-fixture-section .section-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.dev-fixture-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dev-role-notice {
  margin: 0;
  padding: 12px 14px;
  border-radius: 6px;
  border: 1px solid;
}

.dev-role-notice.success {
  color: #195c35;
  background: #eaf7ef;
  border-color: #a8d8ba;
}

.dev-role-notice.error {
  color: #7b1d25;
  background: #fff0f1;
  border-color: #efb4b9;
}

[data-theme="dark"] .dev-role-notice.success {
  color: #b8edca;
  background: #143422;
  border-color: #2f6d47;
}

[data-theme="dark"] .dev-role-notice.error {
  color: #ffc5ca;
  background: #421b20;
  border-color: #80343c;
}

@media (max-width: 700px) {
  .dev-impersonation-banner {
    align-items: stretch;
    flex-direction: column;
    gap: 10px;
    min-height: 0;
    padding: 10px 12px;
    padding-top: calc(10px + env(safe-area-inset-top));
  }

  .dev-impersonation-banner form,
  .dev-impersonation-banner .button {
    width: 100%;
  }

  .dev-role-intro {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .dev-role-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .dev-fixture-section .section-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .dev-fixture-actions,
  .dev-fixture-actions form,
  .dev-fixture-actions .button,
  .dev-fixture-section .section-heading form,
  .dev-fixture-section .section-heading .button {
    width: 100%;
  }
}

.login-screen {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--bg);
}

.login-panel {
  width: min(420px, 100%);
  display: grid;
  gap: 18px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.login-brand {
  display: flex;
  gap: 12px;
  align-items: center;
}

.login-brand h1 {
  margin: 0 0 3px;
  font-size: 24px;
}

.login-brand p,
.login-note {
  margin: 0;
  color: var(--muted);
}

.login-error {
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #f0b4b4;
  border-radius: 8px;
  background: #fff0f0;
  color: #9c1f1f;
}

.login-form {
  display: grid;
  gap: 14px;
}

.auth-users-panel,
.auth-password-result {
  display: grid;
  gap: 14px;
}

.auth-users-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.auth-users-table th,
.auth-users-table td {
  padding: 9px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.auth-users-table small {
  display: block;
  margin-top: 2px;
  color: var(--muted);
}

.auth-inline-form {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 6px;
}

.auth-inline-form input[type="text"] {
  width: 150px;
  min-height: 34px;
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
}

.auth-credential-box {
  display: grid;
  gap: 10px;
  max-width: 420px;
}

.auth-credential-box input {
  width: 100%;
  margin-top: 5px;
}

.content-scroll {
  min-height: 0;
  flex: 1;
  overflow: auto;
  padding: 14px 18px 22px;
}

.board-scroll-area {
  min-height: 0;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0;
}

.board-workspace {
  display: grid;
  gap: 0;
  min-height: 100%;
}

.board-empty-search {
  margin: 14px 18px 0;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--muted);
}

.board-empty-search p {
  margin: 0;
}

.system-screen {
  height: clamp(420px, 52vh, 520px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
  padding: 14px 18px 18px;
  background: #f7f9fa;
  border-bottom: 1px solid var(--line-strong);
}

.screen-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.screen-title h2 {
  margin-bottom: 0;
}

h2 {
  margin: 0 0 10px;
  font-size: 18px;
  line-height: 1.2;
}

h3 {
  margin: 0;
  font-size: 15px;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.system-columns-grid {
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

.employee-screen {
  display: grid;
  gap: 12px;
  padding: 18px;
}

.employee-board {
  display: grid;
  gap: 18px;
  padding-bottom: 8px;
}

.employee-section {
  display: grid;
  gap: 10px;
}

.employee-columns {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(280px, 360px);
  align-items: start;
  gap: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 8px;
}

.column {
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  background: #eef3f5;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.system-column {
  height: 100%;
  min-height: 0;
}

.column.compact {
  height: 420px;
  background: var(--work);
}

.employee-column {
  width: 100%;
  min-width: 280px;
  max-width: 360px;
}

.column header {
  flex: 0 0 auto;
  min-height: 68px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
  padding: 11px;
  background: rgba(255, 255, 255, 0.78);
  border-bottom: 1px solid var(--line);
  position: sticky;
  top: 0;
  z-index: 2;
}

.column header p {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.25;
}

.count {
  min-width: 28px;
  height: 24px;
  display: grid;
  place-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--panel);
  color: var(--muted);
  border: 1px solid var(--line);
}

.column-body {
  min-height: 0;
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 10px;
}

.lead-card {
  max-width: 100%;
  min-width: 0;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  overflow: hidden;
}

.lead-card-title {
  display: -webkit-box;
  line-height: 1.25;
  max-width: 100%;
  overflow: hidden;
  overflow-wrap: anywhere;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.lead-card-meta,
.lead-card-comments {
  min-width: 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.lead-card-meta-item,
.lead-card-comments small {
  line-height: 1.25;
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
}

.lead-card-comments small {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.assignment-pills {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 4px;
  max-width: 100%;
  min-width: 0;
}

.assignment-chip {
  max-width: 100%;
  min-width: 0;
  padding: 3px 6px;
  border-radius: 999px;
  background: var(--soft);
  color: var(--accent-dark);
  font-size: 11px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.appointment-badges {
  display: grid;
  gap: 4px;
}

.appointment-badge,
.source-badge {
  max-width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  width: fit-content;
  min-height: 23px;
  padding: 3px 7px;
  border-radius: 999px;
  background: #eef7ed;
  color: #366246;
  border: 1px solid #cfe2ce;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lead-card-footer {
  min-width: 0;
  max-width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-top: auto;
}

.lead-card-open {
  flex: 0 0 auto;
  color: var(--accent-dark);
  font-weight: 700;
  text-decoration: none;
}

.status-badge {
  max-width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: #e9edf1;
  color: #43515e;
  font-size: 12px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.status-new {
  background: #e8f4ff;
  color: #1c5f8f;
}

.status-in_work {
  background: #e8f7ef;
  color: #247047;
}

.status-waiting_parts {
  background: #fff5da;
  color: #8a5d12;
}

.status-waiting_payment {
  background: #f0ecff;
  color: #5942a2;
}

.status-done {
  background: #e8f2eb;
  color: #366246;
}

.status-lost {
  background: #fdeeee;
  color: #9a3434;
}

.status-scheduled {
  background: #e8f4ff;
  color: #1c5f8f;
}

.status-arrived {
  background: #f0ecff;
  color: #5942a2;
}

.status-cancelled {
  background: #fdeeee;
  color: #9a3434;
}

.empty {
  padding: 12px 2px;
  font-size: 14px;
}

.button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--ink);
  padding: 8px 12px;
  font: inherit;
  text-decoration: none;
  cursor: pointer;
}

.button.primary {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--accent-ink);
}

.button.tiny {
  min-height: 28px;
  padding: 4px 8px;
  font-size: 12px;
}

.button.current {
  background: var(--soft);
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 700;
}

.narrow-content {
  padding: 20px;
}

.detail-content {
  padding: 20px;
  min-width: 0;
}

.archive-content {
  min-width: 0;
  padding: 16px;
}

.archive-workspace {
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 14px;
}

.waiting-client-content {
  padding: 16px;
}

.waiting-client-workspace {
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 14px;
}

.waiting-client-toolbar {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px;
}

.waiting-client-toolbar h2,
.waiting-client-toolbar p {
  margin: 0;
}

.waiting-client-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr)) auto;
  gap: 8px;
  align-items: end;
}

.waiting-client-filters label {
  min-width: 0;
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.waiting-client-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
  gap: 12px;
}

.waiting-client-card {
  min-width: 0;
  display: grid;
  align-content: start;
  gap: 12px;
}

.waiting-client-card > header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 10px;
}

.waiting-client-card h3,
.waiting-client-card .eyebrow {
  margin: 0;
}

.waiting-client-card-overdue {
  border-color: #c54b4b;
  box-shadow: inset 3px 0 0 #c54b4b;
}

.waiting-client-card-replied {
  border-color: #2d7d52;
  box-shadow: inset 3px 0 0 #2d7d52;
}

.waiting-client-overdue {
  background: #fdeeee;
  color: #8d2f2f;
}

.waiting-client-replied {
  background: #e8f7ef;
  color: #23613f;
}

.waiting-client-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: end;
}

.waiting-client-actions .waiting-reminder-form {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 6px;
}

.waiting-client-ai-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

.waiting-client-ai-actions .form-status {
  color: var(--muted);
  font-size: 13px;
}

.waiting-client-ai-actions .form-status.success {
  color: var(--success-text);
}

.waiting-client-ai-actions .form-status.error {
  color: #9a3434;
}

.duty-master-banner {
  padding: 9px 12px;
  border: 1px solid #2f7b91;
  border-radius: 8px;
  background: #e7f4f7;
  color: #174f61;
  font-weight: 800;
}

@media (max-width: 1180px) {
  .waiting-client-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .waiting-client-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .waiting-client-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .waiting-client-card > header,
  .waiting-client-actions,
  .waiting-client-actions .waiting-reminder-form {
    align-items: stretch;
    flex-direction: column;
  }

  .waiting-client-actions .button,
  .waiting-client-actions input,
  .waiting-client-actions form {
    width: 100%;
  }
}

.archive-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.archive-toolbar h2,
.archive-toolbar p {
  margin: 0;
}

.archive-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.panel.archive-panel {
  width: 100%;
  min-width: 0;
  padding: 0;
  overflow: hidden;
}

.archive-table-wrap {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: visible;
  overscroll-behavior-inline: contain;
  scrollbar-gutter: stable;
}

.archive-table {
  width: 100%;
  min-width: 0;
  table-layout: fixed;
  border-collapse: collapse;
}

.archive-table th,
.archive-table td {
  padding: 9px 7px;
  border-bottom: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}

.archive-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--table-header-background);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.archive-table td {
  min-width: 0;
  overflow-wrap: break-word;
}

.archive-leads-table {
  font-size: 12px;
}

.archive-col-id { width: 4.5%; }
.archive-col-lead { width: 9%; }
.archive-col-vehicle { width: 10%; }
.archive-col-client { width: 10%; }
.archive-col-phone { width: 11.5%; }
.archive-col-status { width: 8%; }
.archive-col-date { width: 11.5%; }
.archive-col-closer { width: 11%; }
.archive-col-comment { width: 17.5%; }
.archive-col-action { width: 7%; }

.archive-date-cell,
.archive-action-cell,
.archive-id-cell,
.archive-phone-cell {
  white-space: nowrap;
}

.archive-phone-cell {
  font-variant-numeric: tabular-nums;
}

.archive-closer-cell {
  overflow-wrap: normal;
  word-break: normal;
}

.archive-comment-cell span,
.archive-comment {
  display: block;
  white-space: pre-wrap;
  overflow-wrap: break-word;
}

.archive-comment summary {
  color: var(--ink);
  cursor: pointer;
  line-height: 1.4;
}

.archive-comment p {
  max-height: 14em;
  margin: 8px 0 0;
  overflow: auto;
  white-space: pre-wrap;
}

.archive-action-cell {
  position: sticky;
  right: 0;
  z-index: 1;
  background: var(--panel);
  box-shadow: -10px 0 14px -14px rgba(31, 42, 48, 0.7);
}

.panel.archive-empty {
  width: 100%;
}

.board-request-filter-band {
  display: grid;
  gap: 10px;
  padding: 10px 14px;
  border-block: 1px solid var(--line);
  background: var(--panel);
}

.board-request-filters {
  display: flex;
  align-items: end;
  gap: 8px;
  flex-wrap: wrap;
}

.board-request-filters label {
  min-width: min(190px, 100%);
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.board-unseen-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: var(--ink);
}

.lead-card-unseen-highlight {
  outline: 3px solid var(--accent);
  outline-offset: 2px;
  animation: lead-unseen-highlight 1.2s ease-in-out 2;
}

@keyframes lead-unseen-highlight {
  50% {
    outline-color: transparent;
  }
}

@media (max-width: 760px) {
  .board-request-filters,
  .board-unseen-notice {
    align-items: stretch;
    flex-direction: column;
  }

  .board-request-filters label,
  .board-request-filters .button,
  .board-unseen-notice .button {
    width: 100%;
  }
}

@media (max-width: 760px) {
  .archive-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .archive-filters {
    justify-content: flex-start;
  }

}

@media (max-width: 1100px) {
  .archive-table {
    min-width: 1000px;
  }
}

.appointments-content {
  padding: 18px;
  overflow: auto;
}

.appointments-workspace {
  min-width: 0;
  width: 100%;
  display: grid;
  gap: 14px;
}

.appointments-toolbar {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto auto;
  gap: 12px;
  align-items: center;
}

.appointments-toolbar-title {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.appointments-toolbar-title h2,
.appointments-toolbar-title p {
  margin: 0;
}

.appointments-toolbar-title p {
  color: var(--muted);
}

.appointments-date-nav,
.appointments-view-tabs,
.appointments-date-form,
.appointments-current-date {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.appointments-date-form input,
.appointments-list-filter input,
.appointments-list-filter select {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 7px 9px;
  background: var(--surface-input);
  color: var(--ink);
}

.appointments-view-tabs {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 3px;
  background: var(--surface-input);
}

.segmented-link {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border-radius: 6px;
  color: var(--muted);
  text-decoration: none;
}

.segmented-link.active {
  background: var(--ink);
  color: var(--ink-inverse);
}

.appointments-current-date {
  justify-content: flex-end;
}

.appointment-day-state {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 0 8px;
  border-radius: 999px;
  background: #eef3f5;
  color: var(--muted);
  font-size: 12px;
}

.appointment-day-state.state-today {
  background: #dff4e8;
  color: #12683a;
}

.appointment-day-state.state-future {
  background: #e8f1ff;
  color: #1f5fa8;
}

.appointment-day-state.state-past {
  background: #f3eee7;
  color: #73512a;
}

.appointments-board {
  min-width: 0;
}

.appointments-week {
  min-width: 0;
  display: grid;
  gap: 12px;
}

.appointments-week-header h2,
.appointments-week-header p {
  margin: 0;
}

.appointments-week-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(190px, 1fr));
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 8px;
  scrollbar-width: thin;
}

.appointments-week-day {
  min-width: 0;
  min-height: 420px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.appointments-week-day.is-selected {
  border-color: var(--accent);
  box-shadow: inset 0 3px 0 var(--accent);
}

.appointments-week-day > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
  padding: 10px;
  border-bottom: 1px solid var(--line);
}

.appointments-week-day > header div,
.appointments-week-day-body {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.appointments-week-day > header span {
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
}

.appointments-week-day-body {
  padding: 9px;
}

.appointments-columns {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(210px, 1fr));
  gap: 12px;
  align-items: start;
}

.appointment-slot-selector {
  min-width: 0;
  display: grid;
  gap: 12px;
  user-select: none;
}

.appointment-slot-selector > header,
.appointment-slot-selector > footer {
  min-width: 0;
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.appointment-slot-selector h2,
.appointment-slot-selector p {
  margin: 0;
}

.appointment-slot-selector > header p,
.appointment-slot-selector > footer p {
  color: var(--muted);
}

.appointment-slot-selector > header label {
  flex: 0 0 min(240px, 100%);
}

.appointment-slot-grid-wrap {
  min-width: 0;
  overflow-x: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.appointment-slot-grid {
  min-width: 820px;
  display: grid;
  grid-template-columns: 72px repeat(5, minmax(138px, 1fr));
  background: var(--line);
  gap: 1px;
}

.appointment-slot-corner,
.appointment-slot-column-head,
.appointment-slot-time {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  background: var(--surface-muted);
  color: var(--ink);
  font-size: 12px;
}

.appointment-slot-column-head {
  position: sticky;
  top: 0;
  z-index: 2;
  text-align: center;
}

.appointment-slot-time {
  justify-content: flex-start;
  font-weight: 700;
}

.appointment-slot-cell {
  width: 100%;
  min-width: 0;
  min-height: 36px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--surface);
  color: var(--ink);
  cursor: crosshair;
  touch-action: pan-y;
}

.appointment-slot-cell:hover:not(:disabled),
.appointment-slot-cell:focus-visible {
  background: var(--accent-soft);
  outline: 2px solid var(--focus-ring);
  outline-offset: -2px;
}

.appointment-slot-cell.is-selected {
  background: #d7f2e4;
  box-shadow: inset 0 0 0 1px #3b8f68;
}

.appointment-slot-cell.is-range-start {
  box-shadow: inset 3px 0 0 #247047, inset 0 0 0 1px #3b8f68;
}

.appointment-slot-cell.is-range-end {
  box-shadow: inset -3px 0 0 #247047, inset 0 0 0 1px #3b8f68;
}

.appointment-slot-cell:disabled,
.appointment-slot-cell.is-busy {
  background: #edf0f2;
  cursor: not-allowed;
}

.appointment-slot-cell:disabled::after {
  content: "Занято";
  color: var(--muted);
  font-size: 10px;
}

.appointment-column {
  height: clamp(520px, calc(100vh - 140px), 760px);
  background: #eef3f5;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}

.appointment-column-body {
  gap: 9px;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 4px;
}

.appointment-card {
  max-width: 100%;
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  overflow: visible;
  position: relative;
  z-index: 0;
}

.workshop-zone-board {
  min-width: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(210px, 1fr);
  gap: 10px;
  overflow-x: auto;
  padding-bottom: 6px;
  scroll-snap-type: x proximity;
}

.workshop-zone-lane {
  min-width: 0;
  min-height: 180px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
  scroll-snap-align: start;
}

.workshop-zone-lane > header {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
}

.workshop-zone-lane.is-drop-target {
  border-color: var(--accent);
  box-shadow: inset 0 0 0 2px var(--accent);
}

.workshop-zone-lane-body {
  min-height: 136px;
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 8px;
}

.workshop-job-card {
  min-width: 0;
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.workshop-job-card[draggable="true"] {
  cursor: grab;
}

.workshop-job-card.is-dragging {
  opacity: 0.48;
}

.workshop-job-card.is-saving {
  opacity: 0.7;
  pointer-events: none;
}

.workshop-job-card > header {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.workshop-job-card > header div {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.workshop-job-card small,
.workshop-job-window {
  color: var(--muted);
}

.workshop-job-window,
.workshop-job-description {
  margin: 0;
  overflow-wrap: anywhere;
}

.workshop-mobile-move {
  display: none;
  gap: 8px;
}

.appointment-card-top {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.appointment-card-top strong {
  min-width: 0;
  overflow-wrap: break-word;
  word-break: normal;
  line-height: 1.25;
}

.appointment-card p {
  min-width: 0;
  margin: 0;
  color: var(--ink);
  line-height: 1.3;
  overflow-wrap: break-word;
  word-break: normal;
}

.appointment-card p span {
  color: var(--muted);
}

.appointment-source-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.appointment-actions {
  width: 100%;
  min-width: 0;
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}

.appointment-actions a,
.appointment-actions button,
.appointment-actions input,
.appointment-actions textarea,
.appointment-actions form {
  pointer-events: auto;
}

.appointment-lead-actions {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
}

.appointment-lead-link,
.appointment-arrival-link {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  justify-content: center;
  text-align: center;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}

.unlink-lead-form {
  width: fit-content;
}

.appointment-unlinked-summary {
  min-width: 0;
  display: grid;
  gap: 8px;
}

.appointment-unlinked-summary > p {
  color: var(--muted);
  font-size: 13px;
}

.appointment-unlinked-badge {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.appointment-link-open {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  justify-content: center;
  white-space: normal;
  text-align: center;
  overflow-wrap: break-word;
  word-break: normal;
}

.appointment-link-dialog {
  width: min(680px, calc(100vw - 32px));
  max-width: none;
  max-height: min(820px, calc(100dvh - 32px));
  padding: 0;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--ink);
  box-shadow: var(--shadow);
  overflow: auto;
}

.appointment-link-dialog::backdrop {
  background: rgba(11, 16, 21, 0.62);
}

body:has(.appointment-link-dialog[open]) {
  overflow: hidden;
}

.appointment-link-dialog > header {
  position: sticky;
  z-index: 2;
  top: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
}

.appointment-link-dialog > header h2,
.appointment-link-dialog > header p {
  margin: 0;
}

.appointment-link-close {
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  padding: 0;
  font-size: 22px;
  line-height: 1;
}

.appointment-link-dialog > form {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 16px;
}

.appointment-link-context {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 6px 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-muted);
}

.appointment-link-context strong,
.appointment-link-context span {
  min-width: 0;
  overflow-wrap: break-word;
  word-break: normal;
}

.appointment-link-search-label,
.appointment-link-scenario-warning > label {
  display: grid;
  gap: 5px;
  color: var(--muted);
}

.appointment-link-results {
  min-width: 0;
  max-height: 260px;
  display: grid;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.appointment-link-results:empty {
  display: none;
}

.appointment-link-results > .empty,
.appointment-link-results > .form-error {
  padding: 12px;
}

.appointment-link-loading {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.appointment-link-loading[hidden] {
  display: none;
}

.appointment-entity-group {
  margin: 0;
  padding: 7px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.appointment-link-result {
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: var(--surface-raised);
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}

.appointment-link-result:last-child {
  border-bottom: 0;
}

.appointment-link-result:hover,
.appointment-link-result:focus-visible {
  background: var(--surface-muted);
}

.appointment-link-result:disabled {
  color: var(--muted);
  cursor: not-allowed;
  opacity: 0.7;
}

.appointment-link-result strong,
.appointment-link-result span,
.appointment-link-selection {
  min-width: 0;
  overflow-wrap: break-word;
  word-break: normal;
}

.appointment-link-result span,
.appointment-link-selection {
  color: var(--muted);
  font-size: 13px;
}

.appointment-link-scenario-warning {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--warning-ink, #8a5a00);
  border-radius: 6px;
  background: var(--surface-muted);
}

.appointment-link-scenario-warning[hidden] {
  display: none;
}

.appointment-link-create-lead {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-muted);
}

.appointment-link-create-lead[hidden],
.appointment-link-create-lead [hidden] {
  display: none;
}

.appointment-link-create-lead > p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.appointment-link-create-lead > label {
  display: grid;
  gap: 5px;
  color: var(--muted);
}

.appointment-link-footer {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 4px;
}

.appointment-link-error {
  margin: 0;
}

.appointment-extend-form {
  max-width: 460px;
}

.appointment-extend-form h3,
.appointment-extend-form p {
  margin: 0;
}

.appointments-week-note {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--muted);
}

.appointments-week-note strong {
  color: var(--ink);
}

.appointments-month,
.appointments-list {
  display: grid;
  gap: 12px;
}

.appointments-month-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}

.appointments-month-header h2 {
  margin: 0;
  text-align: center;
}

.appointments-month-weekdays,
.appointments-month-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
}

.appointments-month-weekdays span {
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}

.appointments-day-cell {
  min-height: 84px;
  display: grid;
  align-content: space-between;
  gap: 8px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
  color: var(--ink);
  text-decoration: none;
}

.appointments-day-cell.muted {
  opacity: 0.52;
}

.appointments-day-cell.today {
  border-color: #34a853;
  box-shadow: inset 0 0 0 1px #34a853;
}

.appointments-day-cell.selected {
  border-color: var(--ink);
  background: #f6f9fb;
}

.appointment-count-badge,
.appointment-count-empty {
  width: fit-content;
  min-width: 28px;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 0 8px;
  font-size: 12px;
}

.appointment-count-badge {
  background: var(--accent);
  color: var(--accent-ink);
}

.appointment-count-empty {
  background: #eef3f5;
  color: var(--muted);
}

.appointments-list-filter {
  display: flex;
  align-items: end;
  flex-wrap: wrap;
  gap: 10px;
}

.appointments-list-filter label {
  display: grid;
  gap: 5px;
  color: var(--muted);
}

.appointments-history-table td,
.appointments-history-table th {
  vertical-align: top;
}

.lead-shell {
  width: min(1180px, 100%);
  display: grid;
  gap: 14px;
}

.lead-detail-header {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  box-shadow: var(--shadow);
}

.lead-topline {
  display: grid;
  grid-template-columns: minmax(140px, auto) minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 0;
  background: transparent;
}

.lead-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: end;
}

.lead-topline h1 {
  margin: 0 0 4px;
  font-size: 24px;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

.back-link {
  color: var(--accent-dark);
  font-weight: 700;
  text-decoration: none;
}

.archive-badge {
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  background: #f1eef8;
  color: #5942a2;
  font-size: 12px;
  font-weight: 700;
}

.lead-detail-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 6px;
  border: 1px solid var(--tab-border);
  border-radius: 8px;
  background: var(--tab-background);
  scrollbar-width: thin;
}

.lead-tab-link {
  flex: 0 0 auto;
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--tab-text);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
}

.lead-tab-link:hover,
.lead-tab-link.active,
.lead-tab-link[aria-selected="true"] {
  background: var(--tab-hover-background);
  border-color: var(--accent);
  color: var(--tab-active-text);
  box-shadow: var(--shadow);
}

.lead-tab-link:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 2px;
}

.lead-tab-panel {
  width: min(1180px, 100%);
  display: grid;
  gap: 12px;
  scroll-margin-top: 18px;
}

.lead-tab-panel-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 12px;
}

.lead-tab-panel-heading h2 {
  margin: 0;
  font-size: 18px;
  line-height: 1.2;
}

.lead-tab-panel[hidden] {
  display: none;
}

.lead-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 14px;
  align-items: start;
}

.lead-summary-card {
  min-height: 170px;
}

.lead-summary-card h2 {
  margin-bottom: 10px;
}

.lead-detail-grid {
  width: min(1320px, 100%);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.lead-detail-column {
  min-width: 0;
  display: grid;
  gap: 14px;
}

.communications-section {
  scroll-margin-top: 18px;
}

.communications-grid {
  display: grid;
  grid-template-columns: minmax(320px, 1fr) minmax(320px, 1fr);
  gap: 14px;
  align-items: start;
}

.communications-column {
  min-width: 0;
  display: grid;
  gap: 14px;
}

.communications-chat-placeholder,
.communications-chat {
  min-height: 170px;
}

.messenger-chat-thread {
  max-height: 520px;
}

.messenger-message header strong {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 8px;
  background: var(--accent-soft);
  color: var(--accent-dark);
  font-size: 12px;
}

.message-status {
  display: block;
  margin-top: 8px;
  color: var(--muted);
}

.message-status.is-error,
.message-delivery-error {
  color: var(--danger);
}

.message-delivery-error {
  margin: 6px 0 0;
  font-size: 13px;
}

.message-delivery-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.message-delivery-actions form {
  margin: 0;
}

.message-delivery-actions .button {
  min-height: 36px;
}

.site-chat-content {
  display: block;
}

.site-chat-page {
  display: grid;
  gap: 16px;
}

.site-chat-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

.site-chat-head h2,
.site-chat-head p {
  margin: 0;
}

.site-chat-tabs {
  display: inline-flex;
  gap: 6px;
  padding: 4px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface-muted);
}

.site-chat-tab {
  padding: 8px 10px;
  border-radius: 6px;
  color: var(--muted);
  text-decoration: none;
  font-weight: 700;
}

.site-chat-tab.is-active {
  color: var(--text);
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.site-chat-admin-shell {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.site-chat-dialog-list-panel,
.site-chat-thread-panel {
  min-width: 0;
}

.site-chat-dialog-list-panel h2,
.site-chat-thread-panel h2 {
  margin-top: 0;
}

.site-chat-dialog-list {
  display: grid;
  gap: 8px;
}

.site-chat-dialog-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
  background: var(--surface);
}

.site-chat-dialog-item:hover,
.site-chat-dialog-item.is-active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.site-chat-dialog-item.closed {
  opacity: .72;
}

.site-chat-dialog-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--surface-muted);
  color: var(--muted);
  font-weight: 800;
}

.site-chat-dialog-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.site-chat-dialog-copy strong,
.site-chat-dialog-copy small,
.site-chat-dialog-copy span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.site-chat-thread-head,
.site-chat-actions,
.site-chat-admin-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.site-chat-thread-head {
  margin-bottom: 12px;
}

.site-chat-thread-head h2,
.site-chat-thread-head p {
  margin: 0;
}

.site-chat-thread {
  max-height: 420px;
  overflow: auto;
  padding-right: 4px;
}

.site-chat-message.message-system {
  opacity: .8;
}

.site-chat-reply-form {
  margin-top: 14px;
}

.site-chat-link-form {
  align-items: end;
}

.site-chat-link-form label {
  margin: 0;
}

.messengers-head {
  margin-bottom: 16px;
}

.messengers-head h2,
.messengers-head p {
  margin: 0;
}

.messengers-shell {
  display: grid;
  grid-template-columns: minmax(260px, 340px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
}

.messenger-dialog-list-panel,
.messenger-thread-panel {
  min-width: 0;
}

.messenger-dialog-list-panel h2,
.messenger-thread-panel h2 {
  margin-top: 0;
}

.messenger-dialog-list {
  display: grid;
  gap: 8px;
}

.messenger-dialog-item {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  color: inherit;
  text-decoration: none;
  background: var(--surface);
}

.messenger-dialog-item:hover,
.messenger-dialog-item.is-active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.messenger-dialog-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--surface-muted);
  color: var(--muted);
  font-weight: 800;
}

.messenger-dialog-copy {
  display: grid;
  gap: 2px;
  min-width: 0;
}

.messenger-dialog-copy strong,
.messenger-dialog-copy small,
.messenger-dialog-copy em {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.messenger-dialog-copy em {
  color: var(--muted);
  font-style: normal;
}

.messenger-thread-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}

.messenger-thread-head h2,
.messenger-thread-head p {
  margin: 0;
}

.messenger-direct-thread {
  max-height: 480px;
  overflow: auto;
  padding-right: 4px;
}

.messenger-reply-form {
  margin-top: 14px;
}

.messenger-reply-form.compact {
  margin-top: 10px;
}

.messenger-link-form {
  align-items: end;
  margin-top: 12px;
}

.site-chat-settings,
.site-chat-widget-tab {
  max-width: 760px;
}

.site-chat-widget-tab textarea {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

@media (max-width: 900px) {
  .site-chat-head,
  .site-chat-admin-shell {
    grid-template-columns: 1fr;
  }

  .site-chat-head {
    align-items: stretch;
  }

  .site-chat-tabs {
    width: 100%;
    overflow-x: auto;
  }
}

.media-placeholder {
  display: grid;
  gap: 4px;
  margin-top: 8px;
  padding: 9px 10px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: #f8fafb;
  color: var(--ink);
}

.media-placeholder small {
  color: var(--muted);
}

.messenger-attachments {
  display: grid;
  gap: 8px;
  margin-top: 8px;
}

.messenger-attachment-card {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 96px) minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.messenger-attachment-card:not(:has(.messenger-attachment-preview)) {
  grid-template-columns: minmax(0, 1fr);
}

.messenger-attachment-preview {
  display: block;
  width: 96px;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: 6px;
  background: var(--surface-raised);
}

.messenger-attachment-preview img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

.messenger-attachment-copy {
  min-width: 0;
  display: grid;
  justify-items: start;
  gap: 5px;
}

.messenger-attachment-copy strong {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.messenger-attachment-copy small,
.messenger-attachment-error {
  color: var(--muted);
}

.messenger-attachment-error {
  font-size: 13px;
}

.telegram-file-picker {
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.telegram-file-selection,
.telegram-upload-status {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.telegram-file-selection span,
.telegram-upload-status span {
  min-width: 0;
  flex: 1;
  overflow-wrap: anywhere;
}

.telegram-upload-status progress {
  width: min(180px, 40%);
}

.messenger-create-lead {
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.messenger-create-lead > summary {
  width: max-content;
  list-style: none;
  cursor: pointer;
}

.messenger-create-lead > summary::-webkit-details-marker {
  display: none;
}

.messenger-create-lead[open] > summary {
  margin-bottom: 10px;
}

.messenger-lead-link-controls {
  display: grid;
  gap: 10px;
}

.messenger-lead-linked-status {
  margin: 12px 0 0;
  color: var(--success-text);
  font-weight: 800;
}

.messenger-business-pause {
  display: grid;
  gap: 3px;
  margin: 10px 0;
  padding: 10px 12px;
  border: 1px solid #d59a32;
  border-radius: 8px;
  background: #fff7df;
  color: #6f4700;
}

:root[data-theme="dark"] .messenger-business-pause {
  border-color: #8f6b2d;
  background: #302819;
  color: #f4d795;
}

.messenger-business-pause span {
  font-size: 13px;
}

.messenger-message.message-unknown {
  border-style: dashed;
}

.lead-communications-lazy {
  display: grid;
  justify-items: start;
  gap: 8px;
  min-height: 80px;
  padding: 14px;
}

.lead-messenger-shell {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  padding: 0;
  overflow: hidden;
}

.lead-messenger-channel-head,
.lead-messenger-thread-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.lead-messenger-channel-head h2,
.lead-messenger-channel-head p,
.lead-messenger-thread-head strong,
.lead-messenger-thread-head span {
  margin: 0;
}

.lead-messenger-channel-head p,
.lead-messenger-thread-head span {
  color: var(--muted);
  font-size: 13px;
}

.lead-messenger-thread-head > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.segmented-control {
  flex: 0 0 auto;
  display: inline-flex;
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.segmented-control button {
  min-height: 32px;
  padding: 5px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.segmented-control button.active,
.segmented-control button[aria-selected="true"] {
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow);
}

.lead-channel-panel {
  min-height: 520px;
  display: grid;
  grid-template-rows: auto minmax(220px, 1fr) auto auto;
}

.lead-channel-panel[hidden] {
  display: none;
}

.lead-messenger-thread {
  height: clamp(300px, 48vh, 520px);
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 12px;
  background: var(--surface-muted);
}

.lead-messenger-thread .messenger-message header > span {
  display: grid;
  gap: 2px;
}

.lead-messenger-thread .messenger-message header small {
  color: var(--muted);
  font-size: 11px;
}

.lead-messenger-composer {
  position: sticky;
  bottom: 0;
  z-index: 2;
  margin: 0;
  padding: 12px 14px;
  border-top: 1px solid var(--line);
  background: var(--surface);
}

.lead-telegram-linker {
  display: grid;
  gap: 10px;
  padding: 14px;
  border-bottom: 1px solid var(--line);
}

.lead-telegram-linker h3,
.lead-telegram-linker p {
  margin: 0;
}

.lead-telegram-search {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.lead-telegram-results {
  display: grid;
  gap: 8px;
}

.lead-telegram-result {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface);
}

.lead-telegram-result > div:first-child,
.lead-telegram-result-actions {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.lead-telegram-result span,
.lead-telegram-result small {
  overflow-wrap: anywhere;
  color: var(--muted);
}

.lead-telegram-result-actions {
  justify-items: end;
}

.lead-telegram-relink-confirm {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
}

.lead-channel-max {
  place-items: center;
  padding: 24px;
}

@media (max-width: 480px) {
  .messenger-attachment-card {
    grid-template-columns: 72px minmax(0, 1fr);
  }

  .messenger-attachment-preview {
    width: 72px;
  }

  .lead-messenger-channel-head,
  .lead-messenger-thread-head,
  .lead-telegram-result {
    grid-template-columns: 1fr;
    align-items: stretch;
  }

  .lead-messenger-channel-head,
  .lead-messenger-thread-head {
    flex-direction: column;
  }

  .lead-channel-selector,
  .lead-channel-selector button,
  .lead-telegram-result-actions {
    width: 100%;
  }

  .lead-channel-selector button {
    flex: 1;
  }

  .lead-telegram-search {
    grid-template-columns: 1fr;
  }

  .lead-telegram-result-actions {
    justify-items: stretch;
  }
}

/* Mobile PWA full audit v3: brand fidelity, compact board controls and fixed chat detail. */
.brand-mark,
.mobile-header-brand,
.brand-mark-logo,
.mobile-more-account-mark {
  background: #ffffff;
}

.brand-mark,
.mobile-header-brand {
  overflow: hidden;
  border: 1px solid #e4e7eb;
}

.brand-mark-logo,
.mobile-more-account-mark {
  padding: 3px;
  border-radius: 7px;
  object-fit: contain;
}

.pwa-push-controls {
  display: grid;
  gap: 12px;
  padding: 14px 0 0;
  border-top: 1px solid var(--line);
}

.pwa-push-state,
.pwa-push-state > span {
  min-width: 0;
}

.pwa-push-state {
  display: grid;
  gap: 3px;
}

.pwa-push-state > span,
.pwa-push-controls .form-help {
  color: var(--muted);
}

.pwa-push-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pwa-push-actions [hidden] {
  display: none;
}

.pwa-push-controls[data-pwa-push-state="enabled"] .pwa-push-state > span {
  color: var(--success-text);
  font-weight: 800;
}

.pwa-push-controls[data-pwa-push-state="denied"] .pwa-push-state > span,
.pwa-push-controls[data-pwa-push-state="error"] .pwa-push-state > span {
  color: #a12622;
}

@media (max-width: 860px) {
  .appointment-slot-selector > header,
  .appointment-slot-selector > footer {
    align-items: stretch;
    flex-direction: column;
  }

  .appointment-slot-selector > header label,
  .appointment-slot-selector .form-actions,
  .appointment-slot-selector .button {
    width: 100%;
  }

  .appointment-slot-grid {
    min-width: 760px;
  }

  .appointment-slot-cell {
    min-height: 44px;
  }

  .workshop-zone-board {
    grid-auto-columns: minmax(82vw, 340px);
  }

  .workshop-job-card[draggable="true"] {
    cursor: default;
  }

  .workshop-mobile-move {
    display: grid;
  }

  .workshop-mobile-move label,
  .workshop-mobile-move select,
  .workshop-mobile-move .button {
    width: 100%;
  }

  .board-date-filters {
    gap: 8px;
    padding: 0 2px 3px;
    scroll-padding-inline: 2px;
  }

  .board-filter-button {
    min-height: 42px;
    justify-content: center;
    padding: 7px 13px;
  }

  .board-filter-label-full { display: none; }
  .board-filter-label-mobile { display: inline; }

  .board-advanced-filters > summary {
    justify-content: flex-start;
    gap: 3px;
  }

  .board-advanced-filters > summary::after {
    margin-left: auto;
  }

  .board-filter-sheet-actions .button {
    width: 100%;
    justify-content: center;
  }

  .board-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(56px, auto));
  }

  .board-metric {
    min-height: 56px;
    align-content: center;
  }

  .pwa-push-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .pwa-push-actions .button {
    width: 100%;
  }

  html.mobile-chat-detail-open,
  body.mobile-chat-detail-open {
    width: 100%;
    height: var(--bumwerk-visual-viewport-height, 100dvh);
    overflow: hidden;
    overscroll-behavior: none;
  }

  body.mobile-chat-detail-open .mobile-bottom-nav,
  :root.mobile-keyboard-open .mobile-bottom-nav {
    display: none;
  }

  body.mobile-chat-detail-open .content-scroll {
    overflow: hidden;
  }

  [data-mobile-conversation-shell].mobile-detail-open {
    position: fixed;
    z-index: 160;
    inset: 0;
    width: 100%;
    height: var(--bumwerk-visual-viewport-height, 100dvh);
    min-height: 0;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: var(--surface-raised);
    overflow: hidden;
  }

  [data-mobile-conversation-shell].mobile-detail-open > :is(
    .internal-chat-thread,
    .site-chat-thread-panel,
    .messenger-thread-panel
  ) {
    width: 100%;
    height: 100%;
    min-height: 0 !important;
    max-height: none;
    display: flex;
    flex-direction: column;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    overflow: hidden;
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(
    .internal-chat-thread-header,
    .site-chat-thread-head,
    .messenger-thread-head
  ) {
    flex: 0 0 auto;
    min-height: 58px;
    margin: 0;
    padding: max(8px, env(safe-area-inset-top)) 10px 8px;
    border-bottom: 1px solid var(--line);
    background: var(--surface-raised);
  }

  [data-mobile-conversation-shell].mobile-detail-open .mobile-conversation-back,
  [data-mobile-conversation-shell].mobile-detail-open .internal-chat-back {
    display: inline-flex;
    min-width: 44px;
    min-height: 44px;
    align-items: center;
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(
    .internal-chat-messages,
    .site-chat-thread,
    .messenger-direct-thread,
    .lead-messenger-thread
  ) {
    min-width: 0;
    min-height: 0;
    max-height: none;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
    padding: 12px 10px;
    scroll-padding-bottom: 16px;
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(
    .internal-chat-composer,
    .site-chat-reply-form,
    .messenger-reply-form,
    .lead-messenger-composer
  ) {
    position: static;
    min-width: 0;
    flex: 0 0 auto;
    margin: 0;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: var(--surface-raised);
    box-shadow: 0 -4px 14px rgba(15, 23, 42, 0.08);
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(
    .internal-chat-composer-row,
    .site-chat-actions,
    .messenger-reply-form .site-chat-actions,
    .lead-messenger-composer
  ) {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: 8px;
  }

  [data-mobile-conversation-shell].mobile-detail-open .internal-chat-composer-row {
    grid-template-columns: 44px minmax(0, 1fr) auto;
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(textarea, .internal-chat-composer textarea) {
    min-width: 0;
    width: 100%;
    min-height: 44px;
    max-height: 124px;
    margin: 0;
    resize: none;
  }

  [data-mobile-conversation-shell].mobile-detail-open :is(
    .internal-chat-media-picker,
    button[type="submit"]
  ) {
    min-width: 44px;
    min-height: 44px;
    flex: 0 0 auto;
  }

  [data-mobile-conversation-shell].mobile-detail-open .site-chat-admin-actions {
    flex: 0 0 auto;
    max-height: 96px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 6px 10px;
    border-top: 1px solid var(--line);
    background: var(--surface-muted);
  }

  [data-mobile-conversation-shell].mobile-detail-open .site-chat-admin-actions > form {
    flex: 0 0 auto;
  }
}

@media (max-width: 430px) {
  [data-mobile-conversation-shell].mobile-detail-open button[type="submit"] {
    max-width: 92px;
    padding-inline: 10px;
    white-space: nowrap;
  }
}

/* Marketing / IT queue */
.it-leads-workspace {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.it-leads-toolbar {
  align-items: end;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(280px, 1fr) auto;
}

.it-leads-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.it-leads-filters .button span {
  align-items: center;
  background: var(--surface-muted);
  border-radius: 999px;
  display: inline-flex;
  font-size: 11px;
  justify-content: center;
  min-width: 22px;
  padding: 2px 6px;
}

.it-leads-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  min-width: 0;
}

.it-leads-grid .lead-card {
  height: 100%;
}

.it-lead-card-facts {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
}

.it-lead-card-facts div {
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(110px, 0.42fr) minmax(0, 1fr);
}

.it-lead-card-facts dt {
  color: var(--muted);
  font-size: 12px;
}

.it-lead-card-facts dd {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

@media (max-width: 1280px) {
  .it-leads-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .it-leads-toolbar {
    align-items: stretch;
    grid-template-columns: minmax(0, 1fr);
  }

  .it-leads-filters {
    justify-content: flex-start;
    overflow-x: auto;
  }

  .it-leads-filters .button {
    flex: 0 0 auto;
  }

  .it-leads-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

.appointment-entity-picker {
  display: grid;
  gap: 8px;
}

.appointment-active-leads,
.appointment-create-lead-notice,
.appointment-service-scenario-warning {
  min-width: 0;
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.appointment-active-leads[hidden],
.appointment-create-lead-notice[hidden],
.appointment-service-scenario-warning[hidden],
.appointment-active-leads [hidden] {
  display: none;
}

.appointment-active-leads h3,
.appointment-active-leads p,
.appointment-create-lead-notice p,
.appointment-service-scenario-warning p {
  margin: 0;
}

[data-appointment-active-lead-list] {
  display: grid;
  gap: 6px;
}

.appointment-active-lead {
  width: 100%;
  min-width: 0;
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.appointment-active-lead:hover,
.appointment-active-lead:focus-visible {
  border-color: var(--accent);
}

.appointment-active-lead span,
.appointment-create-lead-notice p,
.appointment-service-scenario-warning p {
  color: var(--muted);
  overflow-wrap: anywhere;
}

.appointment-service-scenario-warning {
  border-color: var(--warning-ink, #8a5a00);
}

.appointment-client-vehicles,
.appointment-inline-vehicle {
  display: grid;
  gap: 10px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.appointment-client-vehicles[hidden],
.appointment-inline-vehicle[hidden] {
  display: none;
}

.appointment-client-vehicles h3,
.appointment-inline-vehicle h4 {
  margin: 0;
  font-size: 14px;
}

.appointment-inline-vehicle {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--surface);
}

.appointment-inline-vehicle h4,
.appointment-inline-vehicle .form-error,
.appointment-inline-vehicle .form-actions {
  grid-column: 1 / -1;
}

.appointment-entity-results {
  display: grid;
  gap: 6px;
  max-height: 280px;
  overflow-y: auto;
}

.appointment-entity-result {
  display: grid;
  gap: 2px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}

.appointment-entity-result:hover,
.appointment-entity-result:focus-visible {
  border-color: var(--accent);
}

.appointment-entity-result span,
.appointment-entity-selection {
  color: var(--muted);
  overflow-wrap: anywhere;
}

@media (max-width: 600px) {
  .appointment-inline-vehicle {
    grid-template-columns: minmax(0, 1fr);
  }

  .appointment-inline-vehicle h4,
  .appointment-inline-vehicle .form-error,
  .appointment-inline-vehicle .form-actions {
    grid-column: auto;
  }
}

.internal-calls-page,
.internal-call-card {
  display: grid;
  gap: 12px;
}

.internal-call-card {
  padding: 14px 0;
  border-top: 1px solid var(--border);
}

.internal-call-card .form-actions {
  flex-wrap: wrap;
}

/* Practical instructions */
.instructions-content,
.instruction-reader-content {
  min-width: 0;
}

.instructions-page,
.instruction-reader,
.instruction-manage-page,
.instruction-manage-detail {
  min-width: 0;
  display: grid;
  gap: 18px;
}

.instruction-library-summary {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--line);
}

.instruction-library-summary > div {
  min-width: 0;
  padding: 14px 16px;
  background: var(--surface-raised);
}

.instruction-library-summary strong,
.instruction-library-summary span {
  display: block;
}

.instruction-library-summary strong {
  font-size: 22px;
  line-height: 1.2;
}

.instruction-library-summary span {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.instruction-search {
  display: grid;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  gap: 10px;
  align-items: end;
}

.instruction-search label,
.instruction-editor-grid label {
  min-width: 0;
}

.instruction-category-section,
.instruction-list-section,
.instruction-role-preview {
  min-width: 0;
}

.instruction-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 8px;
}

.instruction-category-card {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
  color: var(--ink);
  text-decoration: none;
}

.instruction-category-card:hover,
.instruction-category-card.is-active {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.instruction-category-card strong {
  min-width: 0;
  overflow-wrap: break-word;
}

.instruction-category-card span {
  flex: 0 0 auto;
  color: var(--muted);
}

.instruction-card-grid,
.instruction-admin-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 12px;
}

.instruction-card,
.instruction-admin-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
}

.instruction-card > .button,
.instruction-admin-card > .button {
  margin-top: auto;
}

.instruction-card-head,
.instruction-admin-card,
.instruction-admin-heading {
  min-width: 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.instruction-card-head > div,
.instruction-admin-card > div,
.instruction-admin-heading > div {
  min-width: 0;
}

.instruction-card h2,
.instruction-admin-card h2,
.instruction-admin-heading h2 {
  margin: 4px 0 0;
  font-size: 18px;
  line-height: 1.3;
  overflow-wrap: break-word;
}

.instruction-category {
  display: inline-block;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.instruction-card-meta {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
  color: var(--muted);
  font-size: 12px;
}

.instruction-required-mark {
  color: #9a3d32;
  font-weight: 700;
}

.instruction-reader {
  width: min(900px, 100%);
  margin-inline: auto;
  padding-bottom: max(20px, env(safe-area-inset-bottom));
}

.instruction-reader-header h1 {
  max-width: 760px;
  margin: 8px 0;
  font-size: 36px;
  line-height: 1.15;
  letter-spacing: 0;
  overflow-wrap: break-word;
}

.instruction-related-link {
  display: inline-flex;
  margin-top: 14px;
}

.instruction-document {
  min-width: 0;
  overflow-wrap: break-word;
  font-size: 16px;
  line-height: 1.65;
}

.instruction-document h3,
.instruction-document h4 {
  margin: 24px 0 10px;
  line-height: 1.3;
  letter-spacing: 0;
}

.instruction-document h3:first-child,
.instruction-document h4:first-child {
  margin-top: 0;
}

.instruction-document p,
.instruction-document ol,
.instruction-document ul {
  margin: 0 0 14px;
}

.instruction-document li {
  margin: 0 0 9px;
  padding-left: 4px;
}

.instruction-warning,
.instruction-owner-note {
  padding: 12px 14px;
  border-left: 4px solid #b65042;
  background: #fff5f2;
  color: #6e3029;
}

[data-theme="dark"] .instruction-warning,
[data-theme="dark"] .instruction-owner-note {
  background: #392724;
  color: #ffd8d2;
}

.instruction-checklist > div {
  display: grid;
  gap: 8px;
}

.instruction-check-item {
  min-width: 0;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.instruction-check-item input {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
}

.instruction-ack-form {
  position: sticky;
  z-index: 5;
  bottom: max(10px, env(safe-area-inset-bottom));
}

.instruction-ack-form {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-color: var(--accent);
  box-shadow: var(--shadow);
}

.instruction-acknowledged {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid #9bcab2;
  border-radius: 8px;
  background: #edf8f1;
  color: #245c3d;
}

[data-theme="dark"] .instruction-acknowledged {
  border-color: #3d7057;
  background: #20352a;
  color: #c7efd8;
}

.instruction-context-help {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 6px 12px;
  align-items: center;
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid #c9dbe0;
  border-radius: 6px;
  background: #f0f7f8;
}

[data-theme="dark"] .instruction-context-help {
  border-color: #39535b;
  background: #203037;
}

.instruction-context-help > span,
.instruction-context-help > details {
  grid-column: 1;
}

.instruction-context-help > .button {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.instruction-context-help summary {
  cursor: pointer;
  color: var(--accent-dark);
  font-weight: 700;
}

.instruction-context-help ol {
  margin: 8px 0 0;
  padding-left: 20px;
}

.instruction-context-help.is-empty {
  display: block;
  border-style: dashed;
}

.instruction-editor-form {
  min-width: 0;
  display: grid;
  gap: 14px;
}

.instruction-draft-preview {
  min-width: 0;
  padding: 12px;
  border: 1px dashed var(--line-strong);
  border-radius: 6px;
}

.instruction-draft-preview > .instruction-document {
  margin-top: 14px;
}

.instruction-editor-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.instruction-field-wide {
  grid-column: 1 / -1;
}

.instruction-target-field {
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.instruction-target-field > summary {
  cursor: pointer;
  font-weight: 700;
}

.instruction-choice-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 14px;
  margin-top: 12px;
}

.instruction-mandatory {
  align-self: end;
  min-height: 44px;
}

.instruction-publish-form,
.instruction-archive-form,
.instruction-role-preview-form form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}

.instruction-version-history {
  display: grid;
  gap: 10px;
}

.instruction-version-row {
  min-width: 0;
  padding: 12px 0;
  border-top: 1px solid var(--line);
}

.instruction-version-row > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.instruction-version-row span {
  color: var(--muted);
}

.instruction-version-row details {
  margin-top: 10px;
}

@media (max-width: 768px) {
  .instruction-library-summary,
  .instruction-editor-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .instruction-field-wide {
    grid-column: auto;
  }

  .instruction-search,
  .instruction-card-grid,
  .instruction-admin-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .instruction-search .button,
  .instruction-ack-form .button {
    width: 100%;
  }

  .instruction-ack-form,
  .instruction-admin-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .instruction-context-help {
    grid-template-columns: minmax(0, 1fr);
  }

  .instruction-context-help > span,
  .instruction-context-help > details,
  .instruction-context-help > .button {
    grid-column: 1;
    grid-row: auto;
  }

  .instruction-reader-header h1 {
    font-size: 28px;
  }
}

@media (max-width: 430px) {
  .instructions-page,
  .instruction-reader,
  .instruction-manage-page,
  .instruction-manage-detail {
    gap: 12px;
  }

  .instruction-library-summary > div,
  .instruction-card,
  .instruction-document,
  .instruction-checklist,
  .instruction-reader-header {
    padding: 12px;
  }

  .instruction-category-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .instruction-document {
    font-size: 16px;
    line-height: 1.6;
  }

  .instruction-ack-form {
    bottom: calc(70px + env(safe-area-inset-bottom));
  }
}

.lead-history-grid,
.lead-work-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 14px;
  align-items: start;
}

.lead-workflow-stack {
  width: min(1120px, 100%);
  display: grid;
  gap: 14px;
}

.lead-workflow-stack-v2 {
  grid-template-columns: minmax(0, 1fr);
}

.lead-workflow-section,
.lead-workflow-stack > .panel {
  width: 100%;
}

.lead-assignment-workflow {
  display: block;
}

.lead-close-summary {
  margin-bottom: 14px;
}

.client-summary-card {
  width: min(1320px, 100%);
}

.client-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.client-summary-grid div {
  min-width: 0;
  display: grid;
  gap: 5px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}

.client-summary-grid strong {
  min-width: 0;
  font-size: 18px;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.lazy-block {
  display: grid;
  gap: 14px;
}

.lazy-block-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.lazy-block-header h2,
.lazy-block-header p {
  margin: 0;
}

.lazy-block-header p {
  margin-top: 5px;
  color: var(--muted);
}

.lazy-block-actions {
  flex: 0 0 auto;
}

.lazy-result {
  min-width: 0;
}

.lazy-refresh-summary {
  margin: 0 0 10px;
}

.lazy-result-list {
  display: grid;
  gap: 10px;
}

.lazy-result-item {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.lazy-result-item strong,
.lazy-result-item p,
.lazy-result-item span,
.lazy-result-item small,
.lazy-result-item time {
  margin: 0;
  overflow-wrap: anywhere;
}

.lazy-result-item time,
.lazy-result-item span,
.lazy-result-item small {
  color: var(--muted);
  font-size: 12px;
}

.lazy-result-item p {
  line-height: 1.45;
  white-space: pre-wrap;
}

.loading,
.error {
  margin: 0;
  padding: 10px;
  border-radius: 8px;
  border: 1px solid var(--line);
}

.loading {
  color: var(--muted);
  background: #f8fafb;
}

.error {
  color: #9a3434;
  background: #fdeeee;
  border-color: #f1caca;
}

.panel {
  width: min(920px, 100%);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 22px;
  box-shadow: var(--shadow);
}

.panel h1 {
  margin: 0 0 16px;
  font-size: 24px;
}

.settings-content {
  background: var(--bg);
}

.settings-page {
  width: min(960px, 100%);
  display: grid;
  gap: 16px;
}

.settings-card {
  display: grid;
  gap: 16px;
}

.settings-card-heading {
  display: grid;
  gap: 6px;
}

.settings-card h2,
.settings-card p {
  margin: 0;
}

.settings-card p,
.settings-control-row span {
  color: var(--muted);
}

.settings-control-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-width: 0;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--soft);
}

.settings-control-row > div:first-child {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.settings-control-row strong {
  font-size: 15px;
}

.settings-control-row span {
  font-size: 13px;
  line-height: 1.4;
}

.settings-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.theme-choice {
  flex: 0 0 auto;
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(92px, 1fr));
  gap: 3px;
  padding: 3px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.theme-choice button {
  min-width: 92px;
  min-height: 38px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--muted);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}

.theme-choice button[aria-pressed="true"] {
  background: var(--accent);
  color: var(--accent-ink);
  box-shadow: var(--shadow-soft);
}

.theme-choice button:focus-visible {
  outline: 3px solid var(--focus-ring);
  outline-offset: 1px;
}

.form {
  display: grid;
  gap: 14px;
  margin-top: 18px;
}

.form label {
  display: grid;
  gap: 6px;
  color: var(--muted);
}

input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px 11px;
  background: var(--surface-input);
  color: var(--ink);
  font: inherit;
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: var(--ink);
  box-shadow: 0 0 0 1000px var(--surface-input) inset;
  caret-color: var(--ink);
}

:where(button, input, textarea, select):disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.facts {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 10px 16px;
  margin: 18px 0 22px;
}

.compact-facts {
  grid-template-columns: 128px minmax(0, 1fr);
  margin: 12px 0 0;
}

.facts dt {
  color: var(--muted);
}

.facts dd {
  margin: 0;
  overflow-wrap: anywhere;
}

.plain-list {
  display: grid;
  gap: 4px;
  margin: 0;
  padding-left: 18px;
}

.inline-form {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.assign {
  border-top: 1px solid var(--line);
  padding-top: 16px;
  margin-top: 16px;
}

.assignment-choice-list {
  display: grid;
  gap: 8px;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--border);
}

.assignment-choice {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.assignment-choice input {
  margin: 0;
}

.assignment-choice span {
  overflow-wrap: anywhere;
}

.close-panel {
  border-color: #e5c4c4;
}

.close-form {
  margin-top: 12px;
}

.danger,
.danger-link {
  border-color: #d99b9b;
  color: #8e3030;
  background: #fff6f6;
}

.appointment-close-fieldset {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.appointment-close-fieldset legend {
  padding: 0 6px;
  color: var(--muted);
  font-weight: 700;
}

.radio-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.lead-appointment-list {
  display: grid;
  gap: 10px;
}

.lead-appointments-workflow {
  display: grid;
  gap: 14px;
}

.lead-active-appointment {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.lead-active-appointment-head {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 12px;
}

.lead-active-appointment-head h3,
.lead-active-appointment-head p,
.lead-appointment-history h3 {
  margin: 0;
}

.lead-edit-appointment-form,
.appointment-danger-form,
.lead-client-link-form {
  margin-top: 4px;
}

.lead-appointment-item {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.lead-appointment-item p {
  margin: 0;
  overflow-wrap: anywhere;
}

.lead-appointment-item span {
  color: var(--muted);
}

.lead-appointment-form {
  border-top: 1px solid var(--line);
  padding-top: 14px;
}

.empty-state {
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px dashed var(--line-strong);
  border-radius: 8px;
  background: #fbfcfc;
  color: var(--muted);
}

.empty-state strong {
  color: var(--ink);
}

.empty-state p {
  margin: 0;
}

.vehicle-client-summary {
  display: grid;
  gap: 6px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
}

.vehicle-client-summary h3 {
  margin: 0;
  font-size: 14px;
}

.call-list,
.timeline {
  display: grid;
  gap: 10px;
  margin: 0;
  padding: 0;
}

.panel-heading-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.panel-heading-row h2 {
  margin: 0;
}

.inline-action-form {
  margin: 0;
}

.call-item,
.timeline li {
  display: grid;
  gap: 5px;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
}

.call-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.call-audio-badge {
  width: fit-content;
  min-height: 22px;
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e9f4f5;
  color: var(--accent-dark);
  font-size: 12px;
  font-weight: 700;
}

.call-item strong,
.timeline strong {
  overflow-wrap: anywhere;
}

.call-item span,
.call-item small,
.timeline time,
.timeline span {
  color: var(--muted);
  font-size: 12px;
}

.call-item p,
.timeline p {
  margin: 0;
  overflow-wrap: anywhere;
}

.call-audio-player {
  display: block;
  width: 100%;
  max-width: 420px;
  height: 34px;
}

.call-recording-recovery {
  display: grid;
  gap: 6px;
  margin-top: 5px;
  padding-top: 9px;
  border-top: 1px solid var(--line);
}

.call-recording-recovery-status {
  color: var(--ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
}

.call-recording-recovery-meta,
.call-recording-recovery-result {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  white-space: normal;
}

.call-recording-recovery-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  align-items: center;
}

.call-recording-recovery-actions .button {
  min-height: 34px;
  max-width: 100%;
  white-space: normal;
}

.call-recording-recovery-error {
  margin: 0;
  font-size: 12px;
}

.call-transcript {
  display: grid;
  gap: 6px;
  margin-top: 6px;
  padding: 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.call-transcript-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.call-transcript-heading strong {
  font-size: 13px;
}

.call-transcript-status {
  color: var(--muted);
  font-size: 12px;
}

.call-transcript-text,
.call-transcript-error,
.call-transcript-note {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.call-transcript-error {
  color: #9a3434;
}

.timeline {
  list-style: none;
}

.checkbox-row {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  color: var(--ink);
}

.checkbox-row input {
  width: auto;
}

.assignments ul {
  margin: 0;
  padding-left: 20px;
  display: grid;
  gap: 8px;
}

.messages {
  display: grid;
  gap: 10px;
}

.chat-thread {
  max-height: 360px;
  overflow: auto;
  padding-right: 2px;
}

.message {
  width: min(86%, 520px);
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fbfcfc;
  padding: 10px;
}

.message-incoming {
  justify-self: start;
}

.message-outgoing {
  justify-self: end;
  background: var(--soft);
  border-color: #b9d8dd;
}

.message header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
  color: var(--ink);
}

.message header span,
.message-meta {
  color: var(--muted);
  font-size: 13px;
  overflow-wrap: anywhere;
}

.message p {
  margin-top: 6px;
  color: var(--ink);
  overflow-wrap: anywhere;
}

.message-form {
  margin-top: 14px;
}

.message-form .button {
  width: auto;
}

.status-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 16px 0;
  border-top: 1px solid var(--line);
}

.schedule-workspace {
  display: grid;
  gap: 16px;
}

.schedule-summary-strip {
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 8px;
  color: #075985;
  padding: 10px 12px;
}

.schedule-summary-page {
  display: grid;
  gap: 16px;
}

.schedule-summary-header {
  align-items: end;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.schedule-summary-header h2 { margin: 0 0 4px; }
.schedule-summary-header p { color: var(--muted); margin: 0 0 6px; }
.schedule-summary-date-nav { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; }
.schedule-summary-date-nav form { align-items: center; display: flex; gap: 8px; }
.schedule-summary-cards { display: grid; gap: 10px; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.schedule-summary-attention p { margin: 6px 0; }
.schedule-summary-scroll { overflow-x: auto; }
.schedule-summary-table table { border-collapse: collapse; min-width: 900px; width: 100%; }
.schedule-summary-table th, .schedule-summary-table td { border-bottom: 1px solid var(--line); padding: 8px; text-align: left; white-space: nowrap; }

.schedule-toolbar {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.schedule-toolbar h2 {
  font-size: 22px;
  margin: 0 0 4px;
}

.schedule-toolbar p,
.schedule-import-note {
  color: var(--muted);
  margin: 0;
}

.schedule-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.schedule-legend {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.schedule-legend-title {
  margin-right: 4px;
}

.schedule-legend-item {
  align-items: center;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  display: inline-flex;
  font-size: 13px;
  gap: 7px;
  min-height: 32px;
  padding: 5px 9px;
}

.schedule-legend-item b {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 12px;
  height: 22px;
  justify-content: center;
  width: 22px;
}

.schedule-edit-panel {
  align-items: end;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1fr) minmax(0, 2fr);
  padding: 12px;
}

.schedule-edit-panel h2 {
  font-size: 18px;
  margin: 0 0 4px;
}

.schedule-edit-panel-heading {
  min-width: 0;
}

.schedule-selection-count {
  color: var(--ink) !important;
  font-weight: 700;
}

.schedule-field {
  display: grid;
  gap: 4px;
  min-width: 150px;
}

.schedule-field span {
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}

.schedule-inline-error {
  background: #fef2f2;
  border: 1px solid #fca5a5;
  border-radius: 6px;
  color: #991b1b;
  margin: 0;
  padding: 8px 10px;
}

.schedule-edit-badge {
  align-items: center;
  background: #ecfdf5;
  border: 1px solid #86efac;
  border-radius: 999px;
  color: #166534;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  min-height: 34px;
  padding: 6px 10px;
}

.schedule-edit-hint {
  background: #f0f9ff;
  border: 1px solid #bae6fd;
  border-radius: 8px;
  color: #075985;
  margin: 0;
  padding: 10px 12px;
}

.schedule-edit-panel p {
  color: var(--muted);
  margin: 0;
}

.schedule-edit-panel form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.schedule-edit-panel input[type="text"] {
  min-width: 180px;
  width: 220px;
}

.checkbox-inline {
  align-items: center;
  display: inline-flex;
  gap: 6px;
  white-space: nowrap;
}

.schedule-table-shell {
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow: auto;
  position: relative;
}

.schedule-table {
  border-collapse: separate;
  border-spacing: 0;
  min-width: 1040px;
  width: 100%;
}

.schedule-table th,
.schedule-table td {
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  text-align: center;
}

.schedule-table tr:last-child th,
.schedule-table tr:last-child td {
  border-bottom: 0;
}

.schedule-employee-col {
  background: var(--surface-raised);
  left: 0;
  min-width: 280px;
  width: 280px;
  padding: 10px 12px;
  position: sticky;
  text-align: left;
  z-index: 2;
}

thead .schedule-employee-col {
  z-index: 4;
}

.schedule-employee-col strong,
.schedule-employee-col small {
  display: block;
}

.schedule-employee-col small {
  color: var(--muted);
  margin-top: 3px;
}

.schedule-employee-main {
  align-items: center;
  display: flex;
  gap: 8px;
  min-width: 0;
}

.schedule-row-tools {
  align-items: center;
  display: inline-flex;
  flex: 0 0 auto;
  gap: 4px;
}

.schedule-row-handle,
.schedule-row-move {
  align-items: center;
  background: #f8fafc;
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  cursor: pointer;
  display: inline-flex;
  font-size: 12px;
  font-weight: 700;
  height: 24px;
  justify-content: center;
  line-height: 1;
  padding: 0;
  width: 24px;
}

.schedule-row-handle {
  cursor: grab;
}

.schedule-row-handle:active {
  cursor: grabbing;
}

.schedule-row-move:disabled {
  cursor: default;
  opacity: 0.35;
}

.schedule-table-shell.is-saving {
  opacity: 0.82;
}

.schedule-table tr.is-reordering {
  opacity: 0.58;
}

.schedule-table tr.drop-before > *,
.schedule-table tr.drop-after > * {
  position: relative;
}

.schedule-table tr.drop-before > * {
  box-shadow: inset 0 3px 0 #2563eb;
}

.schedule-table tr.drop-after > * {
  box-shadow: inset 0 -3px 0 #2563eb;
}

.schedule-day-link {
  color: inherit;
  display: block;
  text-decoration: none;
}

.schedule-day-link:hover span {
  text-decoration: underline;
}

.schedule-day-head {
  background: #f8fafc;
  height: 54px;
  min-width: 36px;
  padding: 5px 3px;
  position: sticky;
  top: 0;
  z-index: 3;
}

thead .schedule-day-head {
  background: #f8fafc;
}

.schedule-day-select {
  background: transparent;
  border: 0;
  color: var(--muted);
  cursor: pointer;
  display: block;
  font-size: 10px;
  margin: 3px auto 0;
  padding: 0;
  white-space: nowrap;
}

.schedule-day-select:hover {
  color: var(--accent);
  text-decoration: underline;
}

.schedule-day-head span,
.schedule-day-head small {
  display: block;
}

.schedule-day-head small {
  color: var(--muted);
  font-size: 11px;
  margin-top: 2px;
}

.schedule-day-head.weekend,
.schedule-cell.weekend {
  background-image: linear-gradient(135deg, rgba(15, 23, 42, 0.035), rgba(15, 23, 42, 0));
}

.schedule-day-head.today,
.schedule-cell.today {
  box-shadow: inset 0 0 0 2px #2563eb;
}

.schedule-cell {
  height: 42px;
  min-width: 36px;
  padding: 0;
  position: relative;
}

.schedule-cell span,
.schedule-legend-item b {
  background: #e5e7eb;
  color: #111827;
}

.schedule-cell span {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  font-size: 13px;
  font-weight: 700;
  height: 25px;
  justify-content: center;
  width: 25px;
}

.schedule-cell.editable {
  height: 54px;
  min-width: 48px;
}

.schedule-cell.selected {
  background: #ccfbf1;
  box-shadow: inset 0 0 0 3px #0f766e;
}

.schedule-cell.selected::after {
  color: #0f766e;
  content: "✓";
  font-size: 11px;
  font-weight: 800;
  position: absolute;
  right: 3px;
  top: 2px;
}

.schedule-cell-status {
  position: relative;
  z-index: 2;
}

.schedule-cell-question {
  background: #fef3c7 !important;
  border: 1px dashed #f59e0b;
  border-radius: 999px;
  color: #92400e !important;
  font-size: 10px !important;
  height: 17px !important;
  line-height: 15px;
  position: absolute;
  right: 2px;
  top: 2px;
  width: 17px !important;
  z-index: 3;
}

.schedule-cell-selector {
  cursor: pointer;
  inset: 0;
  position: absolute;
  z-index: 1;
}

.schedule-cell-selector input {
  cursor: pointer;
  height: 16px;
  opacity: 0.01;
  position: absolute;
  right: 4px;
  top: 4px;
  width: 16px;
}

.schedule-cell-selector span {
  height: 1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  width: 1px;
}

.schedule-cell-edit {
  position: relative;
  z-index: 2;
}

.schedule-cell-edit summary {
  cursor: pointer;
  display: inline-flex;
  list-style: none;
}

.schedule-cell-edit summary::-webkit-details-marker {
  display: none;
}

.schedule-cell-edit[open] {
  z-index: 20;
}

.schedule-cell-edit-form {
  background: var(--surface-raised);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
  display: grid;
  gap: 8px;
  left: 50%;
  min-width: 210px;
  padding: 10px;
  position: absolute;
  top: 32px;
  transform: translateX(-50%);
}

.schedule-cell-edit-form input[type="text"],
.schedule-cell-edit-form select {
  width: 100%;
}

.schedule-cell.question span,
.schedule-legend-item.status-question b {
  outline: 2px dashed #f59e0b;
  outline-offset: 2px;
}

.schedule-cell.status-work span,
.schedule-legend-item.status-work b {
  background: #dcfce7;
  color: #166534;
}

.schedule-cell.status-off span,
.schedule-legend-item.status-off b {
  background: #e5e7eb;
  color: #374151;
}

.schedule-cell.status-unavailable span,
.schedule-legend-item.status-unavailable b {
  background: #fee2e2;
  color: #991b1b;
}

.schedule-cell.status-leave span,
.schedule-legend-item.status-leave b {
  background: #dbeafe;
  color: #1d4ed8;
}

.schedule-cell.status-maybe span,
.schedule-legend-item.status-maybe b {
  background: #fef3c7;
  color: #92400e;
}

.schedule-total-col {
  background: var(--surface-raised);
  font-weight: 700;
  min-width: 42px;
  padding: 8px;
}

.schedule-row-select {
  margin-top: 7px;
  white-space: normal;
}

.inline-form-error {
  margin: 0 0 8px;
}

.schedule-day-workspace {
  gap: 18px;
}

.schedule-day-groups {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
}

.schedule-day-group h3 {
  align-items: center;
  display: flex;
  font-size: 18px;
  justify-content: space-between;
  margin: 0 0 12px;
}

.schedule-day-group h3 span {
  color: var(--muted);
  font-size: 14px;
}

.schedule-day-worker-list {
  display: grid;
  gap: 8px;
}

.schedule-day-worker-card {
  align-items: center;
  background: var(--surface-raised);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 10px;
  padding: 10px;
}

.schedule-day-worker-card strong,
.schedule-day-worker-card em,
.schedule-day-worker-card small {
  display: block;
}

.schedule-day-worker-card em,
.schedule-day-worker-card small {
  color: var(--muted);
  font-style: normal;
  margin-top: 2px;
}

.schedule-day-code {
  align-items: center;
  border-radius: 999px;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  height: 28px;
  justify-content: center;
  width: 28px;
}

.schedule-day-code.status-work {
  background: #dcfce7;
  color: #166534;
}

.schedule-day-code.status-off {
  background: #e5e7eb;
  color: #374151;
}

.schedule-day-code.status-unavailable {
  background: #fee2e2;
  color: #991b1b;
}

.schedule-day-code.status-leave {
  background: #dbeafe;
  color: #1d4ed8;
}

.schedule-day-code.status-maybe {
  background: #fef3c7;
  color: #92400e;
}

.schedule-day-question {
  color: #f59e0b;
  margin-left: 5px;
}

.schedule-day-edit-panel h3 {
  font-size: 18px;
  margin: 0 0 12px;
}

.schedule-day-edit-list {
  display: grid;
  gap: 8px;
}

.schedule-day-edit-row {
  align-items: center;
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(160px, 1fr) 150px auto minmax(160px, 1fr) auto;
}

.schedule-permissions-form {
  display: grid;
  gap: 10px;
}

.schedule-permission-row {
  align-items: center;
  background: var(--surface-raised);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: flex;
  gap: 10px;
  padding: 10px 12px;
}

.schedule-permission-row span,
.schedule-permission-row small {
  display: block;
}

.schedule-permission-row small {
  color: var(--muted);
  margin-top: 2px;
}

.attendance-page,
.attendance-history-page {
  display: grid;
  gap: 18px;
  max-width: 1480px;
}

.schedule-section-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 2px;
}

.schedule-section-tab {
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  padding: 7px 11px;
  text-decoration: none;
}

.schedule-section-tab.active,
.schedule-section-tab:hover {
  background: var(--soft);
  color: var(--accent);
}

.attendance-toolbar,
.attendance-history-heading {
  align-items: center;
  display: flex;
  gap: 16px;
  justify-content: space-between;
}

.attendance-date-label {
  color: var(--ink);
  font-size: 24px;
  font-weight: 750;
  line-height: 1.2;
}

.attendance-toolbar-actions,
.attendance-footer-actions,
.attendance-date-form {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.attendance-date-form label {
  color: var(--muted);
  font-size: 12px;
}

.attendance-date-form input {
  min-height: 38px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  font: inherit;
  padding: 7px 9px;
}

.attendance-summary-grid {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.attendance-summary-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-left: 4px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 4px;
  min-height: 84px;
  padding: 13px;
}

.attendance-summary-card strong {
  font-size: 25px;
  line-height: 1;
}

.attendance-summary-card span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.25;
}

.attendance-summary-good { border-left-color: #4a9b6e; }
.attendance-summary-danger { border-left-color: #d26a5f; }
.attendance-summary-info { border-left-color: #5d8fc5; }
.attendance-summary-warning { border-left-color: #c69a3a; }
.attendance-summary-muted { border-left-color: #8b96a3; }

.attendance-active-shifts {
  background: #f4f6f8;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--muted);
  padding: 11px 13px;
}

.attendance-group {
  display: grid;
  gap: 10px;
}

.attendance-group-heading {
  align-items: center;
  display: flex;
  gap: 8px;
}

.attendance-group-heading h2,
.attendance-history-heading h2 {
  font-size: 18px;
  margin: 0;
}

.attendance-group-heading span {
  background: var(--soft);
  border-radius: 999px;
  color: var(--muted);
  font-size: 12px;
  padding: 3px 8px;
}

.attendance-table-wrap {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  overflow-x: auto;
}

.attendance-table {
  border-collapse: collapse;
  min-width: 900px;
  width: 100%;
}

.attendance-table th,
.attendance-table td {
  border-bottom: 1px solid var(--line);
  padding: 12px;
  text-align: left;
  vertical-align: middle;
}

.attendance-table th {
  background: var(--table-header-background);
  color: var(--muted);
  font-size: 12px;
  font-weight: 650;
  white-space: nowrap;
}

.attendance-table tr:last-child td { border-bottom: 0; }
.attendance-plan-label { color: var(--ink); font-size: 13px; }
.attendance-question-badge { color: #a46d00; font-size: 11px; margin-left: 4px; white-space: nowrap; }
.attendance-fact-present { color: #31774f; font-weight: 650; }
.attendance-fact-empty { color: var(--muted); }
.attendance-action-form,
.attendance-clear-form { align-items: end; display: flex; flex-wrap: wrap; gap: 6px; }
.attendance-action-form label { color: var(--muted); display: grid; font-size: 11px; gap: 3px; }
.attendance-action-form input,
.attendance-action-form select,
.attendance-clear-form input { border: 1px solid var(--line); border-radius: 7px; min-height: 28px; padding: 3px 6px; }
.attendance-action-comment { min-width: 130px; }
.attendance-action-disabled { color: var(--muted); font-size: 12px; }
.attendance-more-actions { margin-top: 7px; }
.attendance-more-actions summary { color: var(--muted); cursor: pointer; font-size: 12px; }
.attendance-more-actions[open] { display: grid; gap: 8px; }
.attendance-action-secondary { border-top: 1px solid var(--line); padding-top: 7px; }
.attendance-comment-cell { max-width: 220px; overflow-wrap: anywhere; }
.attendance-comment-cell details summary { cursor: pointer; color: var(--muted); }

.attendance-history-list {
  display: grid;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.attendance-history-item {
  align-items: center;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  grid-template-columns: 120px minmax(120px, 1fr) minmax(130px, 1fr) minmax(160px, 1fr) 180px;
  padding: 12px 14px;
}

.attendance-history-item span { color: var(--muted); font-size: 13px; }
.attendance-history-item time { color: var(--muted); font-size: 12px; text-align: right; }
.attendance-empty-state { background: var(--panel); border: 1px dashed var(--line); border-radius: 8px; color: var(--muted); padding: 28px; text-align: center; }

@media (max-width: 980px) {
  .attendance-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .attendance-history-item { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .attendance-history-item time { text-align: left; }
  .schedule-day-edit-row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 860px) {
  .shift-banner {
    align-items: stretch;
    flex-direction: column;
    padding: 12px 16px;
  }

  .attendance-toolbar,
  .attendance-history-heading { align-items: stretch; flex-direction: column; }
  .attendance-toolbar-actions { justify-content: flex-start; }
  .attendance-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  body {
    overflow: hidden;
  }

  .app-shell {
    min-height: 100vh;
    height: 100vh;
    grid-template-columns: 1fr;
    grid-template-rows: auto minmax(0, 1fr);
  }

  .sidebar {
    height: auto;
    min-height: 64px;
    gap: 8px;
    padding: 10px 12px;
    position: sticky;
    top: 0;
    z-index: 20;
  }

  .sidebar-nav {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: thin;
  }

  .sidebar-nav a {
    flex: 0 0 auto;
    grid-template-columns: 24px auto auto;
    min-height: 38px;
  }

  .sidebar-user {
    display: none;
  }

  .sidebar-collapsed .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar-collapsed .sidebar-brand {
    grid-template-columns: 36px minmax(0, 1fr) 36px;
  }

  .sidebar-collapsed .brand-copy,
  .sidebar-collapsed .sidebar-nav strong {
    display: block;
  }

  .sidebar-collapsed .sidebar-nav a {
    grid-template-columns: 24px auto auto;
  }

  .sidebar-collapsed .crm-nav-badge {
    position: static;
    margin: 0;
  }

  .sidebar-collapsed .sidebar-toggle {
    margin-top: 0;
  }

  .main-area {
    height: auto;
    min-height: 0;
    overflow: hidden;
  }

  .main-header,
  .header-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .global-entity-search {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  .global-entity-search-field {
    min-height: 40px;
  }

  .global-entity-search-popover {
    max-height: min(62svh, 520px);
  }

  .global-entity-search-result {
    grid-template-columns: 32px minmax(0, 1fr);
  }

  .global-entity-search-badges {
    display: none;
  }

  .appointments-search,
  .tasks-search,
  .site-chat-search {
    grid-template-columns: minmax(0, 1fr) 44px;
  }

  .appointments-search .button,
  .tasks-search .button,
  .site-chat-search .button {
    min-width: 44px;
    padding-inline: 8px;
  }

  .board-search-form {
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .board-search-form a.button {
    grid-column: 1 / -1;
  }

  .content-scroll {
    overflow: auto;
    padding: 12px;
  }

  .crm-toast-stack {
    top: 56px;
    right: 10px;
    left: 10px;
    width: auto;
  }

  .crm-notification-controls {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .settings-control-row {
    align-items: stretch;
    flex-direction: column;
  }

  .theme-choice {
    width: 100%;
  }

  .board-scroll-area {
    padding: 0;
  }

  .system-screen {
    height: auto;
    min-height: 420px;
    padding: 12px;
  }

  .system-columns-grid {
    grid-template-columns: 1fr;
  }

  .system-column {
    height: 340px;
  }

  .employee-columns {
    grid-auto-columns: minmax(280px, 86vw);
  }

  .employee-column {
    min-width: 280px;
    max-width: 86vw;
  }

  .employee-screen {
    padding: 12px;
  }

  .client-summary-grid {
    grid-template-columns: 1fr;
  }

  .lazy-block-header {
    display: grid;
  }

  .lazy-block-actions {
    width: 100%;
  }

  .lazy-block-actions .button {
    width: 100%;
  }

  .facts {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .lead-topline {
    grid-template-columns: 1fr;
    align-items: start;
  }

  .lead-detail-header {
    top: 0;
    padding: 10px;
  }

  .lead-overview-grid {
    grid-template-columns: 1fr;
  }

  .lead-detail-grid {
    grid-template-columns: 1fr;
  }

  .lead-detail-tabs {
    gap: 6px;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .lead-tab-link {
    flex: 0 0 auto;
  }

  .communications-grid {
    grid-template-columns: 1fr;
  }

  .messengers-shell {
    grid-template-columns: 1fr;
  }

  .site-chat-thread-head,
  .messenger-thread-head {
    align-items: stretch;
    flex-direction: column;
  }

  .site-chat-thread-head .button,
  .messenger-thread-head .button {
    width: 100%;
  }

  .lead-history-grid,
  .lead-work-grid {
    grid-template-columns: 1fr;
  }

  .appointments-columns {
    grid-template-columns: minmax(0, 1fr);
  }

  .appointments-toolbar {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .appointments-date-nav,
  .appointments-view-tabs,
  .appointments-date-form,
  .appointments-current-date {
    width: 100%;
  }

  .appointments-current-date {
    justify-content: flex-start;
  }

  .appointment-column {
    height: 460px;
  }

  .schedule-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .schedule-summary-header { align-items: stretch; flex-direction: column; }
  .schedule-summary-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .schedule-toolbar-actions {
    justify-content: flex-start;
  }

  .schedule-employee-col {
    min-width: 170px;
  }

  .schedule-edit-panel {
    align-items: stretch;
    grid-template-columns: 1fr;
  }

  .schedule-edit-panel form {
    justify-content: flex-start;
  }

  .appointment-link-dialog {
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    border-radius: 0;
  }

  .appointment-link-dialog > form {
    padding-bottom: max(16px, env(safe-area-inset-bottom));
  }

  .appointment-link-footer {
    align-items: stretch;
    flex-direction: column-reverse;
  }

  .appointment-link-footer .button {
    width: 100%;
  }

  .archive-toolbar {
    align-items: stretch;
    flex-direction: column;
  }

  .archive-filters {
    justify-content: flex-start;
  }
}

.internal-chat-media-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 240px));
  gap: 6px;
  margin-bottom: 7px;
}

.internal-chat-media-image {
  min-width: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: zoom-in;
}

.internal-chat-media-image img,
.internal-chat-media-video {
  display: block;
  width: 100%;
  max-height: 360px;
  border-radius: 5px;
  object-fit: contain;
  background: #101820;
}

.internal-chat-media-picker {
  width: 42px;
  height: 42px;
  align-self: center;
  display: grid;
  place-items: center;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 22px;
}

.internal-chat-media-picker input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.internal-chat-composer-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: end;
  gap: 10px;
}

.internal-chat-media-selection {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  max-width: 100%;
  padding: 0;
}

.internal-chat-media-selected-item {
  position: relative;
  min-width: 150px;
  max-width: 220px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 7px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f7fafb;
}

.internal-chat-media-selected-item img,
.internal-chat-video-file {
  width: 52px;
  height: 42px;
  display: grid;
  place-items: center;
  object-fit: cover;
  border-radius: 4px;
  background: #dfe9ec;
  font-size: 11px;
}

.internal-chat-media-selected-item > span:not(.internal-chat-video-file) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 11px;
}

.internal-chat-media-selected-item button {
  border: 0;
  background: transparent;
  cursor: pointer;
}

.internal-chat-upload-progress {
  display: grid;
  grid-template-columns: auto minmax(100px, 1fr);
  align-items: center;
  gap: 10px;
  padding: 2px 0;
  font-size: 12px;
}

.internal-chat-upload-progress progress {
  width: 100%;
}

.internal-chat-reply-preview[hidden],
.internal-chat-media-selection[hidden],
.internal-chat-upload-progress[hidden],
.internal-chat-inline-error[hidden] {
  display: none;
}

.internal-chat-receipt {
  color: #74838b;
  font-weight: 800;
  letter-spacing: -2px;
}

.internal-chat-receipt.is-read {
  color: #087f8c;
}

button.internal-chat-reply-quote {
  width: 100%;
  border: 0;
  border-left: 3px solid var(--accent);
  text-align: left;
  cursor: pointer;
}

.internal-chat-message.is-highlighted {
  outline: 3px solid rgba(29, 111, 143, 0.34);
}

.internal-chat-media-modal {
  max-width: min(1100px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  padding: 36px 12px 12px;
  border: 0;
  background: #101820;
}

.internal-chat-media-modal::backdrop {
  background: rgba(3, 8, 12, 0.85);
}

.internal-chat-media-modal img {
  display: block;
  max-width: calc(100vw - 48px);
  max-height: calc(100vh - 72px);
  object-fit: contain;
}

.internal-chat-media-modal button {
  position: absolute;
  top: 6px;
  right: 8px;
  border: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-size: 26px;
}

@media (max-width: 860px) {
  .internal-chat-media-grid {
    grid-template-columns: 1fr;
  }

  .internal-chat-composer-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
  }

  .internal-chat-media-picker {
    width: 38px;
    height: 38px;
  }
}

.internal-chat-content {
  min-height: 0;
  overflow: hidden;
  padding: 0;
}

.internal-chat-shell {
  height: 100%;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
  background: var(--surface-raised);
  border-top: 1px solid var(--line);
}

.internal-chat-embedded {
  height: clamp(520px, 68vh, 760px);
  grid-template-columns: minmax(0, 1fr);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
}

.lead-chat-empty {
  width: 100%;
  display: grid;
  gap: 10px;
}

.lead-chat-empty h3,
.lead-chat-empty p {
  margin: 0;
}

.internal-chat-kind {
  display: inline-flex;
  margin-left: 6px;
  padding: 2px 5px;
  border-radius: 4px;
  background: #e4eef0;
  color: var(--accent-dark);
  font-size: 10px;
  line-height: 1.2;
  vertical-align: middle;
}

.lead-chat-participants .internal-chat-group-panel {
  width: min(380px, 88vw);
}

.lead-chat-assigned {
  color: var(--accent-dark) !important;
}

.lead-chat-add-participant {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
}

.lead-chat-read-only {
  margin: 0;
  padding: 12px 16px;
  border-top: 1px solid var(--line);
  background: #f8fafb;
  color: var(--muted);
}

.internal-chat-list,
.internal-chat-thread {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.internal-chat-list {
  border-right: 1px solid var(--line);
  background: #f8fafb;
}

.internal-chat-list-header,
.internal-chat-thread-header {
  min-height: 72px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
}

.internal-chat-list-header {
  justify-content: space-between;
  align-items: flex-start;
}

.internal-chat-list-header h2 {
  margin: 0;
  font-size: 20px;
}

.internal-chat-list-header small,
.internal-chat-thread-header small,
.internal-chat-conversation-copy small,
.internal-chat-user-option small,
.internal-chat-member-option small,
.internal-chat-group-panel small {
  display: block;
  color: var(--muted);
}

.internal-chat-list-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 6px;
}

.internal-chat-list-actions .button {
  min-height: 34px;
  padding: 6px 9px;
  font-size: 12px;
}

.internal-chat-search {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr);
  align-items: center;
  margin: 10px 12px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-input);
}

.internal-chat-search input {
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
}

.internal-chat-conversations,
.internal-chat-user-list,
.internal-chat-member-list {
  min-height: 0;
  overflow-y: auto;
}

.internal-chat-conversation {
  min-height: 68px;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #e8edf0;
  color: var(--ink);
  text-decoration: none;
}

.internal-chat-conversation:hover,
.internal-chat-conversation.is-active {
  background: #eaf3f5;
}

.internal-chat-avatar {
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #dcecef;
  color: var(--accent-dark);
  font-weight: 800;
}

.internal-chat-conversation-copy {
  min-width: 0;
}

.internal-chat-conversation-copy strong,
.internal-chat-conversation-copy small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.internal-chat-conversation-meta {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  color: var(--muted);
  font-size: 11px;
}

.internal-chat-unread {
  min-width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  padding: 0 5px;
  border-radius: 10px;
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: 800;
}

.internal-chat-empty,
.internal-chat-list-empty {
  height: 100%;
  display: grid;
  place-items: center;
  padding: 24px;
  color: var(--muted);
  text-align: center;
}

.internal-chat-thread-header > div {
  min-width: 0;
  display: grid;
}

.internal-chat-back {
  display: none;
  color: var(--accent-dark);
  text-decoration: none;
  font-size: 22px;
}

.internal-chat-group-manage {
  position: relative;
  margin-left: auto;
}

.internal-chat-group-manage summary {
  cursor: pointer;
  color: var(--accent-dark);
}

.internal-chat-group-panel {
  position: absolute;
  z-index: 5;
  top: 32px;
  right: 0;
  width: min(340px, 80vw);
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface-raised);
  box-shadow: 0 12px 30px rgba(25, 40, 50, 0.18);
}

.internal-chat-group-panel ul {
  max-height: 200px;
  overflow-y: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.internal-chat-group-panel li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
}

.internal-chat-group-panel li button {
  border: 0;
  background: transparent;
  cursor: pointer;
}

.internal-chat-messages {
  min-height: 0;
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-block: 18px;
  padding-inline: max(16px, calc((100% - 1120px) / 2));
  background: #eef3f4;
}

.internal-chat-message {
  width: fit-content;
  max-width: min(72%, 720px);
  align-self: flex-start;
  padding: 9px 11px 6px;
  border: 1px solid #d9e1e4;
  border-radius: 6px;
  background: var(--surface-raised);
  overflow-wrap: anywhere;
}

.internal-chat-message.is-own {
  align-self: flex-end;
  background: #dff0eb;
  border-color: #c4dfd7;
}

.internal-chat-message-sender {
  display: block;
  margin-bottom: 3px;
  color: var(--accent-dark);
  font-size: 12px;
}

.internal-chat-message-body {
  white-space: pre-wrap;
}

.internal-chat-message-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  color: var(--muted);
  font-size: 11px;
}

.internal-chat-reply-button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--accent-dark);
  cursor: pointer;
  font-size: 11px;
}

.internal-chat-reply-quote,
.internal-chat-reply-preview {
  display: grid;
  gap: 2px;
  padding: 7px 9px;
  border-left: 3px solid var(--accent);
  background: rgba(255, 255, 255, 0.55);
  font-size: 12px;
}

.internal-chat-reply-quote span,
.internal-chat-reply-preview span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.internal-chat-reply-preview {
  position: relative;
  margin: 0;
  padding-right: 34px;
}

.internal-chat-reply-preview button {
  position: absolute;
  top: 4px;
  right: 4px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.internal-chat-composer {
  display: grid;
  grid-template-columns: minmax(0, 1120px);
  justify-content: center;
  gap: 8px;
  padding: 10px max(14px, calc((100% - 1120px) / 2)) 14px;
  border-top: 1px solid var(--line);
  background: var(--surface-raised);
}

.internal-chat-composer textarea {
  min-width: 0;
  width: 100%;
  min-height: 48px;
  max-height: 140px;
  resize: none;
}

.internal-chat-composer-row > .button[type="submit"] {
  width: auto;
  min-width: 104px;
  align-self: end;
}

.internal-chat-inline-error {
  margin: 0;
  color: #a12622;
  font-size: 13px;
}

.internal-chat-new-messages {
  position: absolute;
  right: 24px;
  bottom: 82px;
  z-index: 2;
  border: 0;
  border-radius: 16px;
  padding: 7px 12px;
  background: var(--accent);
  color: var(--accent-ink);
  cursor: pointer;
}

.internal-chat-thread {
  position: relative;
}

.internal-chat-dialog {
  width: min(480px, calc(100vw - 24px));
  max-height: min(680px, calc(100vh - 24px));
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.internal-chat-dialog::backdrop {
  background: rgba(13, 27, 36, 0.52);
}

.internal-chat-dialog form {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.internal-chat-dialog header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.internal-chat-dialog header h3 {
  margin: 0;
}

.internal-chat-dialog header button {
  border: 0;
  background: transparent;
  cursor: pointer;
  font-size: 22px;
}

.internal-chat-user-option {
  width: 100%;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: var(--surface-raised);
  text-align: left;
  cursor: pointer;
}

.internal-chat-member-option {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 4px;
  border-bottom: 1px solid var(--line);
}

.internal-chat-load-older {
  align-self: center;
}

@media (max-width: 860px) {
  .internal-chat-shell {
    grid-template-columns: 1fr;
  }

  .internal-chat-thread,
  .internal-chat-shell.has-selected-conversation .internal-chat-list {
    display: none;
  }

  .internal-chat-shell.has-selected-conversation .internal-chat-thread {
    display: flex;
  }

  .internal-chat-embedded .internal-chat-thread {
    display: flex;
  }

  .internal-chat-embedded {
    height: min(680px, calc(100dvh - 170px));
    min-height: 480px;
  }

  .internal-chat-embedded .internal-chat-thread-header {
    flex-wrap: wrap;
  }

  .lead-chat-participants {
    margin-left: 0;
  }

  .lead-chat-add-participant {
    grid-template-columns: minmax(0, 1fr);
  }

  .internal-chat-back {
    display: inline-flex;
  }

  .internal-chat-message {
    max-width: 88%;
  }

  .internal-chat-composer {
    grid-template-columns: minmax(0, 1fr);
    padding-inline: 10px;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }

  .internal-chat-media-selection {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    overflow-x: visible;
  }

  .internal-chat-media-selected-item {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
}

@media (max-width: 480px) {
  .internal-chat-messages {
    padding-inline: 10px;
  }

  .internal-chat-message {
    max-width: 92%;
  }

  .internal-chat-composer-row {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 7px;
  }

  .internal-chat-composer-row > .button[type="submit"] {
    min-width: 0;
    padding-inline: 10px;
  }
}

:root[data-theme="dark"] .main-header {
  background: rgba(17, 22, 27, 0.94);
}

:root[data-theme="dark"] .global-entity-search-copy mark {
  background: #675b1e;
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] dialog {
  border-color: var(--line);
  background: var(--panel);
  color: var(--ink);
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: #7f8b96;
}

:root[data-theme="dark"] option {
  background: var(--panel);
  color: var(--ink);
}

:root[data-theme="dark"] :is(
  .system-screen,
  .loading,
  .archive-table th,
  .lead-active-appointment,
  .lead-appointment-item,
  .call-item,
  .timeline li,
  .lazy-result-item,
  .media-placeholder,
  .attendance-active-shifts,
  .schedule-edit-panel,
  .schedule-legend-item,
  .schedule-row-handle,
  .schedule-row-move,
  .internal-chat-list,
  .lead-chat-read-only
) {
  background: var(--surface-muted);
}

:root[data-theme="dark"] :is(
  .appointments-date-form input,
  .appointments-list-filter input,
  .appointments-list-filter select,
  .appointments-view-tabs,
  .appointments-week-note,
  .appointments-day-cell,
  .schedule-employee-col,
  .schedule-total-col,
  .schedule-cell-edit-form,
  .schedule-day-worker-card,
  .schedule-permission-row,
  .call-transcript,
  .internal-chat-shell,
  .internal-chat-list-header,
  .internal-chat-thread-header,
  .internal-chat-search,
  .internal-chat-group-panel,
  .internal-chat-composer,
  .internal-chat-dialog,
  .internal-chat-user-option
) {
  background: var(--panel);
  color: var(--ink);
}

:root[data-theme="dark"] :is(.column, .appointment-column) {
  background: #151d23;
}

:root[data-theme="dark"] .column header {
  background: rgba(27, 34, 41, 0.92);
}

:root[data-theme="dark"] .internal-chat-conversation {
  border-bottom-color: var(--line);
}

:root[data-theme="dark"] :is(.internal-chat-conversation:hover, .internal-chat-conversation.is-active) {
  background: var(--accent-soft);
}

:root[data-theme="dark"] .internal-chat-avatar {
  background: #24434a;
}

:root[data-theme="dark"] .internal-chat-messages {
  background: #10171c;
}

:root[data-theme="dark"] .internal-chat-message {
  border-color: var(--line);
  background: #222b33;
}

:root[data-theme="dark"] .internal-chat-message.is-own {
  border-color: #37635c;
  background: #21413b;
}

:root[data-theme="dark"] .owner-control-badge {
  border-color: #c38b39;
  background: #3b2c16;
  color: #ffd98e;
}

:root[data-theme="dark"] :is(.internal-chat-reply-quote, .internal-chat-reply-preview) {
  background: rgba(255, 255, 255, 0.06);
}

:root[data-theme="dark"] :is(.empty-state, .vehicle-client-summary, .message) {
  background: #171e24;
}

:root[data-theme="dark"] :is(.message-outgoing, .settings-control-row) {
  border-color: var(--line);
  background: var(--soft);
}

:root[data-theme="dark"] :is(.shift-banner-start, .auth-mode-pill, .status-waiting_parts) {
  border-color: #66552a;
  background: #332b18;
  color: #e7c86e;
}

:root[data-theme="dark"] .shift-banner-active {
  background: #172d23;
}

:root[data-theme="dark"] .shift-banner-neutral {
  background: var(--surface-muted);
}

:root[data-theme="dark"] :is(.danger, .danger-link, .error, .login-error, .status-lost, .status-cancelled) {
  border-color: #714343;
  background: #321d20;
  color: #f2a7a7;
}

:root[data-theme="dark"] :is(.status-new, .status-scheduled, .appointment-day-state.state-future) {
  background: #172d42;
  color: #9bcaf1;
}

:root[data-theme="dark"] :is(.status-in_work, .status-done, .appointment-day-state.state-today, .appointment-badge, .source-badge) {
  border-color: #345a45;
  background: #193124;
  color: #9ad3ae;
}

:root[data-theme="dark"] :is(.status-arrived, .status-waiting_payment) {
  background: #2a2343;
  color: #c8b8ff;
}

:root[data-theme="dark"] :is(.status-badge, .appointment-day-state, .appointment-count-empty) {
  background: #29323a;
  color: #c3ccd3;
}

:root[data-theme="dark"] .appointments-day-cell.selected {
  background: #202a31;
}

:root[data-theme="dark"] :is(.schedule-day-head, thead .schedule-day-head) {
  background: #171e24;
}

:root[data-theme="dark"] .schedule-cell.selected {
  background: #143d39;
}

:root[data-theme="dark"] .schedule-summary-strip,
:root[data-theme="dark"] .schedule-edit-hint {
  border-color: #315d79;
  background: #142b3a;
  color: #9ed5f4;
}

:root[data-theme="dark"] .schedule-inline-error {
  border-color: #734242;
  background: #351e21;
  color: #f1a5a5;
}

:root[data-theme="dark"] .schedule-edit-badge {
  border-color: #37644b;
  background: #193326;
  color: #a1dbb6;
}

:root[data-theme="dark"] .appointment-slot-cell.is-selected {
  background: #173e31;
  box-shadow: inset 0 0 0 1px #56a77e;
}

:root[data-theme="dark"] .appointment-slot-cell.is-range-start {
  box-shadow: inset 3px 0 0 #78c69c, inset 0 0 0 1px #56a77e;
}

:root[data-theme="dark"] .appointment-slot-cell.is-range-end {
  box-shadow: inset -3px 0 0 #78c69c, inset 0 0 0 1px #56a77e;
}

:root[data-theme="dark"] .appointment-slot-cell:disabled,
:root[data-theme="dark"] .appointment-slot-cell.is-busy {
  background: #252d33;
}

:root[data-theme="dark"] :is(.crm-notification-controls button[aria-pressed="true"], .site-chat-dialog-item:hover, .site-chat-dialog-item.is-active, .messenger-dialog-item:hover, .messenger-dialog-item.is-active) {
  border-color: #397887;
  background: var(--accent-soft);
  color: var(--accent-strong);
}

.regulations-page,
.regulation-admin-page,
.regulation-detail-page {
  width: min(1120px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 16px;
}

.regulations-page > *,
.regulation-admin-page > *,
.regulation-detail-page > *,
.regulation-owner-review,
.regulation-review-list,
.regulation-review-card,
.regulation-enforcement,
.regulation-mode-form,
.regulation-mode-form label {
  min-width: 0;
}

.regulation-card,
.regulation-admin-card,
.regulation-version-history,
.regulation-change-summary {
  border: 1px solid var(--border);
  background: var(--surface);
}

.regulation-body {
  max-width: 78ch;
  color: var(--text);
  line-height: 1.68;
  overflow-wrap: anywhere;
  white-space: normal;
}

.regulation-card .regulation-body,
.regulation-required-body {
  margin-top: 14px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-muted);
}

.regulation-required-screen {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  display: grid;
  place-items: start center;
  padding: 32px 20px;
  background: var(--bg);
}

.regulation-required-card {
  width: min(780px, 100%);
  display: grid;
  gap: 16px;
}

.regulation-required-progress {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  color: var(--muted);
}

.regulation-required-progress strong {
  color: var(--text);
  text-align: right;
}

.regulation-required-body {
  max-width: none;
  max-height: min(52vh, 560px);
  overflow: auto;
}

.regulation-change-summary {
  padding: 14px;
  border-radius: 6px;
  background: var(--accent-soft);
}

.regulation-change-summary p {
  margin: 6px 0 0;
}

.regulation-ack-form,
.regulation-required-logout,
.regulation-publish-form {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}

.regulation-card .regulation-ack-form,
.regulation-confirmed {
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.regulation-confirmed {
  color: var(--success-text);
  font-weight: 700;
}

.regulation-owner-empty {
  display: grid;
  justify-items: start;
  gap: 12px;
}

.regulation-admin-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.regulation-mode-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}

.regulation-mode-stats > div {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-muted);
}

.regulation-mode-stats strong,
.regulation-mode-stats span {
  display: block;
}

.regulation-mode-stats strong {
  color: var(--text);
  font-size: 20px;
}

.regulation-mode-stats span,
.regulation-pilot-candidate small {
  color: var(--muted);
}

.regulation-mode-form,
.regulation-review-form {
  display: grid;
  gap: 14px;
}

.regulation-mode-form input[type="text"],
.regulation-mode-form input:not([type]) {
  min-width: 0;
  width: 100%;
}

.regulation-mode-form fieldset {
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--border);
  border-radius: 6px;
}

.regulation-mode-options {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

.regulation-mode-options label,
.regulation-pilot-candidate {
  cursor: pointer;
}

.regulation-pilot-grid,
.regulation-review-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.regulation-pilot-candidate {
  min-width: 0;
  display: grid;
  grid-template-columns: auto 36px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-muted);
}

.regulation-pilot-candidate strong,
.regulation-pilot-candidate small {
  display: block;
  overflow-wrap: anywhere;
}

.regulation-pilot-avatar {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-weight: 800;
}

.regulation-emergency-form {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.regulation-pilot-compliance .table-scroll {
  max-width: 100%;
  overflow-x: auto;
}

.regulation-owner-review {
  display: grid;
  gap: 12px;
}

.regulation-review-card,
.regulation-review-form {
  min-width: 0;
}

.regulation-review-card .regulation-body {
  max-height: 420px;
  overflow: auto;
  margin-top: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--surface-muted);
}

.regulation-readiness-list {
  margin: 12px 0;
  padding-left: 22px;
  color: var(--text);
}

.success-text {
  color: var(--success-text);
  font-weight: 700;
}

.regulation-editor-form {
  display: grid;
  gap: 14px;
}

.regulation-editor-form textarea[name="body_text"] {
  min-height: 320px;
  resize: vertical;
  font: inherit;
  line-height: 1.55;
}

.regulation-targets {
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 6px;
}

.regulation-target-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding-top: 10px;
}

.regulation-version-history {
  margin-top: 10px;
  padding: 12px;
  border-radius: 6px;
}

.regulation-version-history summary {
  cursor: pointer;
  font-weight: 700;
}

@media (max-width: 760px) {
  .regulation-admin-list,
  .regulation-target-grid,
  .regulation-pilot-grid,
  .regulation-review-list {
    grid-template-columns: 1fr;
  }

  .regulation-mode-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .regulation-required-screen {
    padding: 12px;
  }

  .regulation-required-progress,
  .regulation-ack-form {
    align-items: stretch;
    flex-direction: column;
  }

  .regulation-required-progress strong {
    text-align: left;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

.customer-journey-page {
  display: grid;
  gap: 16px;
}

.journey-breadcrumbs {
  display: flex;
  justify-content: flex-start;
}

.journey-hero {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
}

.journey-hero h1 {
  margin: 4px 0;
}

.journey-status {
  display: grid;
  gap: 6px;
  min-width: 240px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.journey-status span {
  color: var(--muted);
  font-size: 0.9rem;
}

.journey-summary {
  display: grid;
  gap: 14px;
}

.journey-summary-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.journey-summary-heading h2 {
  margin: 4px 0 0;
}

.journey-not-started {
  margin: 0;
  padding: 8px 10px;
  border: 1px solid var(--border);
  color: var(--muted);
}

.journey-summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.journey-summary-item {
  display: grid;
  gap: 5px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid var(--border);
  background: var(--surface-muted);
}

.journey-summary-item span {
  color: var(--muted);
  font-size: 0.82rem;
}

.journey-summary-item strong {
  overflow-wrap: anywhere;
}

.lead-card-journey-status {
  display: grid;
  gap: 3px;
  margin-top: 10px;
  padding: 8px 10px;
  border-left: 3px solid var(--accent);
  background: var(--surface-muted);
}

.lead-card-journey-status span {
  color: var(--muted);
  font-size: 0.78rem;
}

.journey-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.journey-grid > .panel:last-child {
  grid-column: 1 / -1;
}

.journey-form {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}

.journey-form h3,
.journey-form label {
  margin: 0;
}

.journey-form input,
.journey-form select,
.journey-form textarea {
  width: 100%;
}

.journey-task-card {
  display: grid;
  gap: 6px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border);
}

.journey-task-card header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.journey-task-card p,
.journey-history p {
  margin: 0;
}

.journey-history {
  display: grid;
  gap: 10px;
}

.journey-history time {
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

@media (max-width: 900px) {
  .journey-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journey-grid {
    grid-template-columns: 1fr;
  }

  .journey-grid > .panel:last-child {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .journey-summary-heading {
    display: grid;
  }

  .journey-summary-grid {
    grid-template-columns: 1fr;
  }

  .journey-hero {
    display: grid;
  }

  .journey-status {
    min-width: 0;
  }

  .journey-task-card header {
    align-items: flex-start;
    flex-direction: column;
  }
}

.mobile-bottom-nav {
  display: none;
}

.pwa-notice {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 120;
  width: min(420px, calc(100vw - 36px));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px 16px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--surface-raised);
  color: var(--ink);
  box-shadow: 0 16px 40px rgba(15, 23, 42, 0.2);
}

.pwa-notice p {
  margin: 4px 0 0;
  color: var(--muted);
  line-height: 1.35;
}

.pwa-notice-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pwa-notice-close {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--muted);
  font-size: 22px;
  cursor: pointer;
}

.pwa-notice-close:hover {
  background: var(--surface-muted);
  color: var(--ink);
}

@media (max-width: 860px) {
  html,
  body {
    overflow-x: hidden;
  }

  .app-shell {
    min-height: 100dvh;
    height: 100dvh;
  }

  .content-scroll {
    min-width: 0;
    max-width: 100vw;
    padding-bottom: calc(88px + env(safe-area-inset-bottom));
  }

  .content-scroll > * {
    min-width: 0;
    max-width: 100%;
  }

  .content-scroll :is(input, textarea, select) {
    max-width: 100%;
  }

  .content-scroll :is(.archive-table-wrap, .schedule-table-shell, .schedule-summary-table, .appointments-history-table) {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  .content-scroll :is(.button, button, input, textarea, select, summary) {
    min-height: 44px;
  }

  .mobile-bottom-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    align-items: stretch;
    min-height: 64px;
    padding: 5px 6px max(5px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface-raised) 94%, transparent);
    box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.12);
    backdrop-filter: blur(12px);
  }

  .mobile-bottom-link,
  .mobile-more-summary,
  .mobile-bottom-spacer {
    min-width: 44px;
    min-height: 52px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 2px;
    padding: 5px 2px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--muted);
    font: inherit;
    font-size: 10px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
  }

  .mobile-bottom-link strong,
  .mobile-more-summary strong {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 10px;
    font-weight: 800;
  }

  .mobile-bottom-icon {
    min-height: 22px;
    display: grid;
    place-items: center;
    font-size: 19px;
    line-height: 1;
  }

  .mobile-bottom-link.is-active,
  .mobile-more-summary.is-active,
  .mobile-bottom-link:hover,
  .mobile-more-summary:hover {
    background: var(--accent-soft);
    color: var(--accent-strong);
  }

  .mobile-bottom-badge {
    position: absolute;
    min-width: 18px;
    height: 18px;
    display: inline-grid;
    place-items: center;
    margin: -28px 0 0 24px;
    padding: 0 4px;
    border-radius: 999px;
    background: #c2410c;
    color: #fff;
    font-size: 10px;
    font-weight: 800;
  }

  .mobile-bottom-badge[hidden] {
    display: none;
  }

  .mobile-more {
    position: relative;
    min-width: 0;
  }

  .mobile-more > summary {
    list-style: none;
  }

  .mobile-more > summary::-webkit-details-marker {
    display: none;
  }

  .mobile-more-panel {
    position: absolute;
    right: 0;
    bottom: calc(100% + 8px);
    width: min(300px, calc(100vw - 16px));
    max-height: min(68vh, 520px);
    display: grid;
    gap: 3px;
    overflow-y: auto;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--surface-raised);
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.22);
  }

  .mobile-more-panel .mobile-bottom-link,
  .mobile-more-logout button {
    width: 100%;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: 13px;
    text-align: left;
  }

  .mobile-more-panel .mobile-bottom-link strong,
  .mobile-more-logout strong {
    font-size: 13px;
  }

  .mobile-more-logout {
    margin: 0;
  }

  .mobile-more-logout button {
    border: 0;
    background: transparent;
    color: var(--ink);
    font: inherit;
    cursor: pointer;
  }

  .mobile-more-empty {
    margin: 8px;
    color: var(--muted);
  }

  .pwa-notice {
    right: 10px;
    bottom: calc(78px + env(safe-area-inset-bottom));
    left: 10px;
    width: auto;
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (max-width: 860px) and (max-height: 520px) {
  .content-scroll {
    padding-bottom: 16px;
  }

  .pwa-notice {
    bottom: 10px;
  }
}

/* Mobile workbench: the bottom bar is the only primary navigation. */
.mobile-header-brand {
  display: none;
}

.mobile-more-account {
  display: none;
}

.lead-card-next-step {
  display: grid;
  gap: 2px;
  padding: 7px 8px;
  border-left: 3px solid var(--accent);
  background: var(--accent-soft);
}

.lead-card-next-step span {
  color: var(--muted);
  font-size: 11px;
}

.lead-card-next-step strong {
  overflow-wrap: break-word;
}

.board-advanced-filters > summary {
  list-style: none;
}

.board-advanced-filters > summary::-webkit-details-marker {
  display: none;
}

.board-advanced-filter-content {
  display: grid;
  gap: 10px;
}

.board-request-filter-band h3 {
  margin: 0;
  font-size: 14px;
}

@media (min-width: 861px) {
  .board-advanced-filters > summary {
    display: none;
  }

  .board-advanced-filter-content {
    padding-top: 2px;
  }

  .board-advanced-filters:not([open]) > .board-advanced-filter-content {
    display: grid;
  }
}

@media (max-width: 860px) {
  .app-shell {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
  }

  .sidebar {
    display: none;
  }

  .main-area {
    min-width: 0;
  }

  .main-header {
    min-height: 56px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 7px;
    padding: 8px 12px;
  }

  .main-header-heading {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .mobile-header-brand {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: var(--accent);
    color: var(--accent-ink);
    font-size: 15px;
    font-weight: 900;
  }

  .main-header-heading > div {
    min-width: 0;
  }

  .main-header h1 {
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 18px;
  }

  .main-header p {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 11px;
  }

  .header-actions {
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: stretch;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 6px;
  }

  .header-actions .user-pill,
  .header-actions .auth-mode-pill,
  .header-actions .logout-form,
  .header-actions .logout-menu {
    display: none;
  }

  .board-search-form {
    min-width: 0;
    flex: 1 1 auto;
    width: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 44px;
    gap: 6px;
  }

  .board-search-form button[type="submit"] {
    width: 44px;
    padding: 0;
    font-size: 0;
  }

  .board-search-form button[type="submit"] > span:first-child {
    font-size: 19px;
    line-height: 1;
  }

  .board-search-form .button-label {
    display: none;
  }

  .board-search-form .board-clear-search {
    width: 44px;
    padding: 0;
    display: grid;
    place-items: center;
    font-size: 0;
  }

  .board-search-form .board-clear-search::before {
    content: "x";
    font-size: 18px;
    line-height: 1;
  }

  .board-new-lead {
    min-width: 44px;
    min-height: 44px;
    padding-inline: 11px;
    white-space: nowrap;
  }

  .content-scroll {
    padding: 10px 10px calc(84px + env(safe-area-inset-bottom));
  }

  .board-scroll-area {
    padding: 0;
  }

  .board-context-toolbar {
    gap: 9px;
    margin: 0;
    padding: 10px 10px 0;
  }

  .board-date-filters {
    min-width: 0;
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 6px;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  .board-date-filters::-webkit-scrollbar {
    display: none;
  }

  .board-filter-button {
    min-height: 36px;
    flex: 0 0 auto;
    padding: 6px 11px;
    border-radius: 999px;
    font-size: 12px;
    white-space: nowrap;
  }

  .board-filter-button small {
    display: none;
  }

  .board-advanced-filters {
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-raised);
  }

  .board-advanced-filters > summary {
    min-height: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 11px;
    color: var(--ink);
    font-weight: 800;
    cursor: pointer;
  }

  .board-advanced-filters > summary::after {
    content: "+";
    color: var(--accent-strong);
    font-size: 18px;
  }

  .board-advanced-filters[open] > summary::after {
    content: "-";
  }

  .board-advanced-filter-content {
    padding: 0 10px 10px;
  }

  .board-custom-filter,
  .board-request-filters {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
  }

  .board-custom-filter label,
  .board-request-filters label {
    min-width: 0;
  }

  .board-request-filter-band {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 9px 0 0;
    border: 0;
    border-top: 1px solid var(--line);
    background: transparent;
  }

  .board-period-label {
    margin: 0;
    font-size: 12px;
  }

  .board-metrics {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .board-metric {
    min-width: 0;
    min-height: 52px;
    display: grid;
    align-content: center;
    gap: 2px;
    padding: 7px 9px;
  }

  .board-metric strong {
    font-size: 16px;
  }

  .board-metric span {
    overflow-wrap: break-word;
    font-size: 11px;
    line-height: 1.15;
  }

  .system-screen {
    min-height: 0;
    height: auto;
    padding: 10px;
  }

  .system-column {
    height: auto;
    min-height: 220px;
  }

  .employee-screen {
    padding: 10px;
  }

  .employee-columns {
    grid-auto-flow: row;
    grid-auto-columns: auto;
    grid-template-columns: minmax(0, 1fr);
    overflow: visible;
  }

  .employee-column {
    width: 100%;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 220px;
  }

  .column-body {
    overflow: visible;
  }

  .lead-card {
    padding: 11px;
    gap: 7px;
  }

  .lead-card-title,
  .lead-card-meta-item,
  .lead-card-comments small,
  .assignment-chip,
  .status-badge,
  .appointment-badge {
    overflow-wrap: break-word;
    word-break: normal;
  }

  .lead-card-title {
    -webkit-line-clamp: 3;
  }

  .lead-card-footer {
    align-items: flex-start;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .lead-detail-shell {
    width: 100%;
    gap: 10px;
  }

  .lead-detail-header {
    position: sticky;
    top: 0;
    z-index: 12;
    padding: 8px;
    border-radius: 8px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, 0.12);
  }

  .lead-topline {
    grid-template-columns: 44px minmax(0, 1fr) auto;
    gap: 7px;
  }

  .lead-topline .back-link {
    width: 44px;
    min-height: 44px;
    display: grid;
    place-items: center;
    overflow: hidden;
    font-size: 0;
  }

  .lead-topline .back-link::before {
    content: "←";
    font-size: 22px;
  }

  .lead-topline h1 {
    min-width: 0;
    font-size: 18px;
  }

  .lead-topline .status-badge,
  .lead-topline .archive-badge {
    max-width: 110px;
    font-size: 11px;
  }

  .lead-detail-tabs {
    gap: 5px;
    margin: 0;
    padding: 4px;
    border-radius: 7px;
    scrollbar-width: none;
  }

  .lead-detail-tabs::-webkit-scrollbar {
    display: none;
  }

  .lead-tab-link {
    min-height: 40px;
    padding: 7px 10px;
    font-size: 12px;
    white-space: nowrap;
  }

  .lead-tab-panel {
    width: 100%;
    gap: 10px;
  }

  .lead-tab-panel-heading {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .journey-hero,
  .journey-summary,
  .journey-grid > .panel,
  .lead-workflow-section {
    border-radius: 8px;
  }

  .journey-hero {
    gap: 10px;
    padding: 11px;
  }

  .journey-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
  }

  .journey-summary-item {
    min-height: 62px;
    padding: 8px;
  }

  .journey-summary-item span {
    font-size: 11px;
  }

  .journey-summary-item strong {
    font-size: 13px;
    overflow-wrap: break-word;
  }

  .journey-grid {
    gap: 10px;
  }

  .journey-task-card header {
    align-items: flex-start;
    flex-direction: column;
    gap: 6px;
  }

  .mobile-bottom-nav {
    display: grid;
    min-height: 66px;
    padding: 5px 6px max(5px, env(safe-area-inset-bottom));
  }

  .mobile-bottom-link strong,
  .mobile-more-summary strong {
    max-width: 100%;
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
    font-size: 9px;
    line-height: 1.1;
  }

  .mobile-bottom-link,
  .mobile-more-summary {
    min-height: 54px;
    padding: 4px 1px;
  }

  .mobile-more-account {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 9px;
    margin-bottom: 3px;
    border-bottom: 1px solid var(--line);
  }

  .mobile-more-account-mark {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
    display: grid;
    place-items: center;
    border-radius: 7px;
    background: var(--accent);
    color: var(--accent-ink);
    font-weight: 900;
  }

  .mobile-more-account > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
  }

  .mobile-more-account strong,
  .mobile-more-account small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-more-account small {
    color: var(--muted);
  }

  .mobile-more-panel {
    width: min(320px, calc(100vw - 12px));
    max-height: min(70vh, 560px);
    padding: 7px;
  }

  .pwa-notice {
    bottom: calc(80px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 380px) {
  .board-new-lead {
    padding-inline: 8px;
    font-size: 12px;
  }

  .mobile-bottom-link strong,
  .mobile-more-summary strong {
    font-size: 8px;
  }
}

/* Mobile UX hotfix: keep dense work surfaces inside the viewport. */
.brand-logo {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

.brand-mark-logo,
.mobile-more-account-mark {
  background: #ffffff;
}

.brand-logo-sidebar,
.brand-logo-header,
.brand-logo-more {
  width: 28px;
  height: 28px;
}

.brand-logo-login {
  width: min(220px, 42vw);
  height: 58px;
}

:root[data-theme="dark"] .brand-logo {
  filter: none;
}

.archive-content,
.archive-workspace,
.site-chat-content,
.messengers-content,
.internal-chat-content {
  min-width: 0;
  max-width: 100%;
}

@media (max-width: 860px) {
  html,
  body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .app-shell,
  .main-area,
  .content-scroll,
  .board-workspace,
  .board-context-toolbar,
  .system-screen,
  .employee-screen,
  .lead-detail-shell,
  .customer-journey-page,
  .site-chat-page,
  .messengers-shell,
  .internal-chat-shell {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .content-scroll {
    overflow-x: hidden;
  }

  .main-header-heading {
    min-width: 0;
  }

  .main-header-heading > div,
  .header-actions,
  .board-search-form,
  .board-context-toolbar,
  .site-chat-head > div,
  .site-chat-thread-head > div,
  .messenger-thread-head > div {
    min-width: 0;
  }

  .header-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
  }

  .board-search-form,
  .board-new-lead {
    grid-column: 1;
    width: 100%;
    min-width: 0;
  }

  .board-new-lead {
    justify-content: center;
  }

  .main-header h1,
  .main-header p,
  .site-chat-head p,
  .site-chat-thread-head h2,
  .site-chat-thread-head p,
  .messenger-thread-head h2,
  .messenger-thread-head p {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .board-context-toolbar {
    display: grid;
    gap: 8px;
    padding-inline: 8px;
  }

  .board-date-filters {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .board-date-filters::-webkit-scrollbar,
  .site-chat-tabs::-webkit-scrollbar,
  .lead-detail-tabs::-webkit-scrollbar {
    display: none;
  }

  .board-filter-button {
    flex: 0 0 auto;
    max-width: none;
    white-space: nowrap;
  }

  .board-advanced-filters {
    width: 100%;
    min-width: 0;
  }

  .board-advanced-filter-content,
  .board-custom-filter,
  .board-request-filter-band,
  .board-request-filters {
    min-width: 0;
  }

  .board-metrics {
    width: 100%;
    min-width: 0;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-rows: minmax(54px, auto);
    gap: 6px;
    align-items: stretch;
  }

  .board-metric {
    min-width: 0;
    width: auto;
    overflow: hidden;
  }

  .board-metric span {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .lead-card,
  .lead-card-title,
  .lead-card-meta,
  .lead-card-footer,
  .lead-card-comments,
  .assignment-chip,
  .status-badge,
  .appointment-badge {
    min-width: 0;
    max-width: 100%;
  }

  .lead-card-title,
  .lead-card-meta-item,
  .lead-card-comments small,
  .assignment-chip,
  .status-badge,
  .appointment-badge {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .lead-detail-header {
    max-width: 100%;
  }

  .lead-detail-tabs {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
  }

  .lead-tab-link {
    flex: 0 0 auto;
    max-width: none;
  }

  .lead-tab-panel,
  .lead-work-grid,
  .lead-history-grid,
  .journey-grid,
  .journey-grid > .panel,
  .journey-form,
  .journey-task-card,
  .lead-appointment-form,
  .lead-edit-appointment-form {
    min-width: 0;
    max-width: 100%;
  }

  .journey-summary-grid {
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .journey-summary-item,
  .journey-summary-item strong,
  .journey-task-card p,
  .journey-history p {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .lead-detail-shell {
    padding-bottom: 8px;
  }

  .internal-chat-shell,
  .site-chat-admin-shell,
  .messengers-shell {
    overflow: hidden;
  }

  .internal-chat-list,
  .internal-chat-thread,
  .site-chat-dialog-list-panel,
  .site-chat-thread-panel,
  .messenger-dialog-list-panel,
  .messenger-thread-panel {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
  }

  .internal-chat-list-header,
  .internal-chat-thread-header {
    min-width: 0;
    flex-wrap: wrap;
    padding: 10px;
  }

  .internal-chat-list-header > div:first-child,
  .internal-chat-thread-header > div {
    min-width: 0;
    max-width: 100%;
  }

  .internal-chat-list-actions {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .internal-chat-list-actions .button,
  .internal-chat-search,
  .internal-chat-conversation {
    min-width: 0;
    max-width: 100%;
  }

  .internal-chat-list-actions .button {
    width: 100%;
    white-space: normal;
  }

  .internal-chat-search {
    width: auto;
    margin-inline: 10px;
  }

  .internal-chat-conversation {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    gap: 8px;
    padding-inline: 10px;
  }

  .internal-chat-conversation-copy,
  .internal-chat-conversation-copy strong,
  .internal-chat-conversation-copy small,
  .internal-chat-conversation-meta {
    min-width: 0;
  }

  .internal-chat-conversation-copy strong,
  .internal-chat-conversation-copy small {
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .internal-chat-conversation-meta {
    max-width: 64px;
    overflow-wrap: anywhere;
    text-align: right;
  }

  .internal-chat-message {
    max-width: 92%;
    overflow-wrap: anywhere;
  }

  .site-chat-head {
    min-width: 0;
    align-items: stretch;
    gap: 10px;
  }

  .site-chat-tabs {
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
  }

  .site-chat-tab {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .site-chat-dialog-copy,
  .site-chat-dialog-copy strong,
  .site-chat-dialog-copy small,
  .site-chat-dialog-copy span,
  .site-chat-thread,
  .site-chat-message p {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .site-chat-thread-head,
  .site-chat-actions,
  .site-chat-admin-actions,
  .messenger-thread-head,
  .messenger-link-form {
    min-width: 0;
    width: 100%;
    align-items: stretch;
  }

  .site-chat-actions,
  .site-chat-admin-actions,
  .messenger-link-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .site-chat-actions .button,
  .site-chat-admin-actions .button,
  .messenger-thread-head .button,
  .messenger-link-form .button,
  .messenger-link-form input {
    width: 100%;
    min-width: 0;
  }

  .messenger-dialog-copy,
  .messenger-dialog-copy strong,
  .messenger-dialog-copy small,
  .messenger-dialog-copy em,
  .messenger-message p {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .messenger-dialog-item {
    min-width: 0;
    grid-template-columns: 34px minmax(0, 1fr);
  }

  .messenger-reply-form .site-chat-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .auth-users-panel .table-wrap {
    width: 100%;
    max-width: 100%;
    overflow: visible;
  }

  .auth-users-table,
  .auth-users-table tbody,
  .auth-users-table tr,
  .auth-users-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .auth-users-table {
    border-collapse: separate;
  }

  .auth-users-table thead {
    display: none;
  }

  .auth-users-table tbody {
    display: grid;
    gap: 10px;
  }

  .auth-users-table tr {
    padding: 11px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-raised);
  }

  .auth-users-table td {
    display: grid;
    grid-template-columns: minmax(82px, 0.34fr) minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 7px 0;
    border-bottom: 1px solid var(--line);
    overflow-wrap: anywhere;
  }

  .auth-users-table td:last-child {
    border-bottom: 0;
  }

  .auth-users-table td::before {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
  }

  .auth-users-table td:nth-child(1)::before { content: "ID"; }
  .auth-users-table td:nth-child(2)::before { content: "Сотрудник"; }
  .auth-users-table td:nth-child(3)::before { content: "Роль"; }
  .auth-users-table td:nth-child(4)::before { content: "Логин"; }
  .auth-users-table td:nth-child(5)::before { content: "Email"; }
  .auth-users-table td:nth-child(6)::before { content: "Вход"; }
  .auth-users-table td:nth-child(7)::before { content: "Пароль"; }
  .auth-users-table td:nth-child(8)::before { content: "Последний вход"; }
  .auth-users-table td:nth-child(9)::before { content: "Действия"; }

  .auth-users-table td > *,
  .auth-inline-form,
  .auth-inline-form input,
  .auth-inline-form select,
  .auth-inline-form .button {
    min-width: 0;
    max-width: 100%;
  }

  .auth-inline-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    margin: 0 0 8px;
  }

  .auth-inline-form:last-child {
    margin-bottom: 0;
  }

  .auth-inline-form input,
  .auth-inline-form select,
  .auth-inline-form .button {
    width: 100%;
  }

  .archive-toolbar,
  .archive-filters {
    min-width: 0;
    align-items: stretch;
  }

  .archive-toolbar {
    display: grid;
    gap: 10px;
  }

  .archive-toolbar h2,
  .archive-toolbar p,
  .archive-table td,
  .archive-table th {
    overflow-wrap: anywhere;
  }

  .archive-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
  }

  .archive-filters .button {
    min-width: 0;
    width: 100%;
    padding-inline: 7px;
    white-space: normal;
  }

  .archive-table-wrap {
    overflow: visible;
  }

  .archive-table,
  .archive-table tbody,
  .archive-table tr,
  .archive-table td {
    display: block;
    width: 100%;
    min-width: 0;
  }

  .archive-table {
    table-layout: auto;
  }

  .archive-table thead,
  .archive-table colgroup {
    display: none;
  }

  .archive-table tbody {
    display: grid;
    gap: 10px;
  }

  .archive-table tr {
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--surface-raised);
  }

  .archive-table td {
    display: grid;
    grid-template-columns: minmax(76px, 0.32fr) minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    padding: 6px 0;
    border-bottom: 1px solid var(--line);
    white-space: normal;
  }

  .archive-table td:last-child {
    border-bottom: 0;
  }

  .archive-table td::before {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
  }

  .archive-table td:nth-child(1)::before { content: "ID"; }
  .archive-table td:nth-child(2)::before { content: "Лид"; }
  .archive-table td:nth-child(3)::before { content: "Авто"; }
  .archive-table td:nth-child(4)::before { content: "Клиент"; }
  .archive-table td:nth-child(5)::before { content: "Телефон"; }
  .archive-table td:nth-child(6)::before { content: "Статус"; }
  .archive-table td:nth-child(7)::before { content: "Закрыт"; }
  .archive-table td:nth-child(8)::before { content: "Закрыл"; }
  .archive-table td:nth-child(9)::before { content: "Комментарий"; }
  .archive-table td:nth-child(10)::before { content: "Действие"; }

  .archive-action-cell {
    position: static;
    box-shadow: none;
  }

  .archive-action-cell .lead-card-open {
    width: 100%;
    text-align: center;
  }
}

@media (max-width: 430px) {
  .login-screen {
    padding: 12px;
  }

  .login-panel {
    width: 100%;
    max-width: 100%;
    padding: 18px 14px;
  }

  .login-brand {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  .login-brand > div {
    min-width: 0;
    max-width: 100%;
  }

  .login-brand h1 {
    font-size: 20px;
    overflow-wrap: anywhere;
  }

  .brand-logo-login {
    width: min(220px, 100%);
    height: auto;
  }

  .login-form input,
  .login-form button {
    max-width: 100%;
  }

  .internal-chat-list-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  .archive-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .journey-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Mobile conversation screens use an explicit list/detail state and keep the composer above the keyboard. */
.mobile-conversation-back {
  display: none;
  color: var(--accent-dark);
  font-weight: 800;
  text-decoration: none;
  touch-action: manipulation;
}

.site-chat-dialog-item,
.messenger-dialog-item,
.internal-chat-conversation {
  position: relative;
  z-index: 1;
  touch-action: manipulation;
}

@media (max-width: 860px) {
  .site-chat-admin-shell,
  .messengers-shell {
    min-width: 0;
    max-width: 100%;
  }

  .site-chat-admin-shell:not(.has-selected-conversation) .site-chat-thread-panel,
  .messengers-shell:not(.has-selected-conversation) .messenger-thread-panel,
  .site-chat-admin-shell.mobile-list-only .site-chat-thread-panel,
  .messengers-shell.mobile-list-only .messenger-thread-panel {
    display: none;
  }

  .site-chat-admin-shell.has-selected-conversation:not(.mobile-list-only) .site-chat-dialog-list-panel,
  .messengers-shell.has-selected-conversation:not(.mobile-list-only) .messenger-dialog-list-panel {
    display: none;
  }

  .site-chat-admin-shell.has-selected-conversation:not(.mobile-list-only) .site-chat-thread-panel,
  .messengers-shell.has-selected-conversation:not(.mobile-list-only) .messenger-thread-panel {
    min-height: max(420px, calc(var(--bumwerk-visual-viewport-height, 100dvh) - 168px));
    max-height: none;
    display: flex;
    flex-direction: column;
  }

  .site-chat-admin-shell.has-selected-conversation:not(.mobile-list-only) .mobile-conversation-back,
  .messengers-shell.has-selected-conversation:not(.mobile-list-only) .mobile-conversation-back {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    flex: 0 0 auto;
  }

  .site-chat-thread,
  .messenger-direct-thread {
    min-width: 0;
    min-height: 180px;
    flex: 1 1 auto;
    max-height: none;
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(96px + env(safe-area-inset-bottom));
  }

  .site-chat-reply-form,
  .messenger-reply-form {
    min-width: 0;
    flex: 0 0 auto;
    padding-bottom: env(safe-area-inset-bottom);
  }

  .site-chat-reply-form textarea,
  .messenger-reply-form textarea {
    width: 100%;
    min-width: 0;
    max-width: 100%;
    resize: vertical;
  }

  .internal-chat-shell {
    height: min(760px, calc(var(--bumwerk-visual-viewport-height, 100dvh) - 154px));
    min-height: 420px;
  }

  .internal-chat-shell.has-selected-conversation .internal-chat-thread {
    min-height: 0;
  }

  .internal-chat-messages {
    scroll-padding-bottom: calc(104px + env(safe-area-inset-bottom));
    padding-bottom: calc(18px + env(safe-area-inset-bottom));
  }

  .internal-chat-composer {
    position: sticky;
    bottom: 0;
    z-index: 4;
    padding-bottom: calc(10px + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 14px rgba(15, 23, 42, 0.08);
  }

  .internal-chat-composer textarea {
    min-height: 44px;
    max-height: 112px;
  }

  .internal-chat-composer-row > .button[type="submit"] {
    min-width: 78px;
    white-space: nowrap;
  }
}

@media (max-width: 480px) {
  .site-chat-admin-shell.has-selected-conversation:not(.mobile-list-only) .site-chat-thread-panel,
  .messengers-shell.has-selected-conversation:not(.mobile-list-only) .messenger-thread-panel {
    min-height: max(390px, calc(var(--bumwerk-visual-viewport-height, 100dvh) - 148px));
  }

  .internal-chat-composer-row {
    grid-template-columns: 38px minmax(0, 1fr) 78px;
    gap: 6px;
  }

  .internal-chat-composer-row > .button[type="submit"] {
    padding-inline: 7px;
  }
}

/* Final cascade for the v3 compact board and brand tile. */
@media (max-width: 860px) {
  .mobile-header-brand {
    overflow: hidden;
    border: 1px solid #e4e7eb;
    background: #ffffff;
  }

  .board-date-filters {
    gap: 8px;
    padding: 0 2px 3px;
  }

  .board-filter-button {
    min-height: 42px;
    justify-content: center;
    padding: 7px 13px;
  }

  .board-filter-label-full { display: none; }
  .board-filter-label-mobile { display: inline; }

  .board-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(56px, auto));
  }

  .board-metric {
    min-height: 56px;
    align-content: center;
  }
}

/* Lead time report, live header timer, owner control and staff access cards. */
.work-time-report-content,
.lead-time-report,
.lead-time-summary,
.lead-stage-report {
  width: 100%;
  min-width: 0;
}

.lead-time-report {
  display: grid;
  gap: 16px;
}

.lead-time-report-heading,
.lead-time-summary-heading,
.lead-stage-session > header,
.auth-user-card > header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}

.lead-time-report-heading h2,
.lead-time-summary-heading h3,
.auth-user-card h3 {
  margin: 2px 0 0;
  letter-spacing: 0;
}

.lead-time-report-heading p,
.lead-time-summary-heading p,
.auth-user-card header p {
  margin: 3px 0 0;
}

.lead-report-search {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(360px, auto) auto;
  gap: 12px;
  align-items: end;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.lead-report-query,
.lead-report-query input {
  width: 100%;
  min-width: 0;
}

.lead-report-scope {
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin: 0;
  padding: 0;
  border: 0;
}

.lead-report-scope legend {
  width: 100%;
  color: var(--muted);
  font-size: 12px;
}

.lead-report-scope label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0;
  white-space: nowrap;
}

.lead-report-results {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.lead-report-result {
  min-width: 0;
  display: grid;
  gap: 4px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--ink);
  text-decoration: none;
}

.lead-report-result.is-selected {
  border-color: var(--accent);
  box-shadow: inset 3px 0 0 var(--accent);
}

.lead-report-result strong,
.lead-report-result span,
.lead-report-result small {
  min-width: 0;
  overflow-wrap: break-word;
}

.lead-report-result span,
.lead-report-result small {
  color: var(--muted);
}

.lead-report-welcome,
.lead-time-summary {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.lead-report-welcome h3,
.lead-report-welcome p {
  margin: 0;
}

.lead-report-welcome p {
  margin-top: 5px;
  color: var(--muted);
}

.lead-time-summary {
  display: grid;
  gap: 14px;
}

.lead-time-facts,
.lead-time-totals,
.lead-stage-math,
.lead-stage-session dl,
.auth-user-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 0;
}

.lead-time-facts > div,
.lead-time-totals > div,
.lead-stage-math > div,
.lead-stage-session dl > div,
.auth-user-facts > div {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.lead-time-facts dt,
.lead-stage-math dt,
.lead-stage-session dt,
.auth-user-facts dt,
.lead-time-totals span {
  color: var(--muted);
  font-size: 12px;
}

.lead-time-facts dd,
.lead-stage-math dd,
.lead-stage-session dd,
.auth-user-facts dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: break-word;
}

.lead-time-totals strong {
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}

.lead-stage-report {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.lead-stage-report-head,
.lead-stage-row > summary {
  display: grid;
  grid-template-columns: minmax(170px, 1.35fr) repeat(5, minmax(92px, 0.8fr)) minmax(130px, 1fr);
  gap: 10px;
  align-items: center;
}

.lead-stage-report-head {
  position: sticky;
  z-index: 2;
  top: 0;
  padding: 9px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--surface-muted);
  color: var(--muted);
  font-size: 11px;
  font-weight: 800;
}

.lead-stage-row {
  border-bottom: 1px solid var(--line);
}

.lead-stage-row:last-child {
  border-bottom: 0;
}

.lead-stage-row > summary {
  min-width: 0;
  padding: 12px;
  cursor: pointer;
  list-style-position: inside;
}

.lead-stage-row > summary > * {
  min-width: 0;
  overflow-wrap: break-word;
}

.lead-stage-detail {
  display: grid;
  gap: 12px;
  padding: 12px;
  border-top: 1px solid var(--line);
  background: var(--surface-muted);
}

.lead-stage-session {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.lead-stage-session p,
.lead-stage-advanced {
  margin: 0;
}

.lead-session-pauses {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.lead-session-pauses li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 8px;
  padding-top: 6px;
  border-top: 1px solid var(--line);
}

.lead-heading-copy,
.lead-header-state,
.lead-header-responsible,
.lead-header-timer,
.owner-control-header {
  min-width: 0;
}

.lead-header-state,
.owner-control-header,
.lead-header-timer,
.lead-header-timer-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.lead-stage-badge {
  display: inline-flex;
  min-height: 26px;
  align-items: center;
  padding: 4px 8px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  background: var(--surface-muted);
  color: var(--ink);
  font-size: 12px;
  font-weight: 700;
}

.lead-header-responsible {
  display: grid;
  gap: 2px;
  margin: 0;
}

.lead-header-responsible span,
.lead-live-timer-label {
  color: var(--muted);
  font-size: 11px;
}

.lead-header-timer {
  padding: 7px 9px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-muted);
}

.lead-header-timer-main,
.lead-header-timer-main > span {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.lead-header-timer [data-live-duration] {
  font-variant-numeric: tabular-nums;
}

.lead-timer-action,
.lead-timer-complete,
.lead-active-workers {
  max-width: 100%;
}

.lead-timer-action > summary,
.lead-timer-complete > summary,
.lead-active-workers > summary {
  cursor: pointer;
  list-style: none;
}

.lead-timer-action > form,
.lead-handoff-form,
.lead-active-workers > div {
  display: grid;
  gap: 9px;
  min-width: min(420px, calc(100vw - 48px));
  margin-top: 10px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}

.lead-timer-action label,
.lead-handoff-form label {
  min-width: 0;
  margin: 0;
}

.lead-active-workers p {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
}

.lead-timer-conflict {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.workspace-resolution {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: flex-start;
}

.workspace-resolution-action {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}

.workspace-resolution-action[open] {
  flex-basis: 100%;
}

.workspace-resolution-action > .panel {
  margin-top: 10px;
}

.auth-users-panel {
  min-width: 0;
}

.auth-user-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.auth-user-card {
  min-width: 0;
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--surface-raised);
}

.auth-user-card header > div,
.auth-user-card header h3,
.auth-user-card header p {
  min-width: 0;
  overflow-wrap: break-word;
}

.auth-state {
  display: inline-flex;
  flex: 0 0 auto;
  min-height: 26px;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.auth-state.is-enabled {
  background: #dff3e6;
  color: #195d34;
}

.auth-state.is-disabled {
  background: #f5e3e3;
  color: #842c2c;
}

.auth-user-facts {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.auth-user-management > summary {
  cursor: pointer;
  list-style: none;
}

.auth-user-management-body {
  display: grid;
  gap: 10px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}

.auth-user-current-role {
  display: grid;
  gap: 3px;
}

.auth-user-current-role small,
.auth-management-form small {
  color: var(--muted);
}

.auth-management-form {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  align-items: end;
  margin: 0;
}

.auth-management-form label,
.auth-management-form input,
.auth-management-form select {
  min-width: 0;
  width: 100%;
}

.auth-management-form small {
  grid-column: 1 / -1;
}

:root[data-theme="dark"] .auth-state.is-enabled {
  background: #173b2a;
  color: #b8e8ca;
}

:root[data-theme="dark"] .auth-state.is-disabled {
  background: #4a2428;
  color: #f1c2c5;
}

@media (min-width: 861px) and (max-width: 1100px) {
  .main-header {
    align-items: stretch;
    flex-direction: column;
  }

  .main-header-heading {
    min-width: 0;
  }

  .header-actions {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .board-search-form {
    min-width: 0;
    flex: 1 1 420px;
  }

  .board-new-lead {
    flex: 0 0 auto;
  }
}

@media (max-width: 1100px) {
  .lead-report-search {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .lead-report-scope {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .lead-report-results {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lead-stage-report-head {
    display: none;
  }

  .lead-stage-row > summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lead-stage-row > summary > strong {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .lead-topline {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  .lead-topline .back-link {
    grid-column: 1 / -1;
  }

  .lead-header-state {
    justify-content: flex-end;
  }

  .lead-header-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }

  .lead-header-timer,
  .owner-control-header {
    width: 100%;
  }

  .lead-report-search,
  .lead-report-results,
  .auth-user-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .lead-report-scope {
    grid-column: auto;
    grid-row: auto;
  }

  .lead-time-facts,
  .lead-time-totals,
  .lead-stage-math,
  .lead-stage-session dl {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lead-stage-row > summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .lead-session-pauses li {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .lead-session-pauses small {
    grid-column: 1 / -1;
  }

  .auth-management-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .auth-management-form small {
    grid-column: auto;
  }
}

@media (max-width: 430px) {
  .lead-topline {
    grid-template-columns: minmax(0, 1fr);
  }

  .lead-header-state {
    justify-content: flex-start;
  }

  .lead-report-search,
  .lead-time-summary,
  .lead-report-welcome,
  .auth-user-card {
    padding: 12px;
  }

  .lead-report-scope {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .lead-time-facts,
  .lead-time-totals,
  .lead-stage-math,
  .lead-stage-session dl,
  .auth-user-facts,
  .lead-stage-row > summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .lead-timer-action > form,
  .lead-handoff-form,
  .lead-active-workers > div {
    min-width: 0;
    width: 100%;
  }

  .owner-control-header .button,
  .lead-header-timer-actions .button {
    min-height: 40px;
  }
}

/* Final schedule overrides stay after legacy responsive rules. */
.schedule-table-shell {
  max-width: 100%;
  overflow: auto;
  overscroll-behavior-inline: contain;
}

.schedule-table {
  min-width: 100%;
  table-layout: fixed;
  width: max-content;
}

.schedule-employee-track,
.schedule-employee-col {
  min-width: 320px;
  width: 320px;
}

.schedule-employee-col {
  max-width: 320px;
}

.schedule-day-track,
.schedule-day-head,
.schedule-cell {
  min-width: 52px;
  width: 52px;
}

.schedule-total-track,
.schedule-total-col {
  min-width: 48px;
  width: 48px;
}

.schedule-employee-main {
  align-items: flex-start;
}

.schedule-employee-copy {
  flex: 1 1 auto;
  min-width: 0;
}

.schedule-employee-copy strong,
.schedule-employee-copy small {
  overflow-wrap: anywhere;
  white-space: normal;
}

.schedule-employee-actions {
  display: grid;
  margin-top: 8px;
}

.schedule-row-select {
  justify-content: center;
  width: 100%;
}

.schedule-cell.editable {
  cursor: pointer;
  touch-action: pan-x pan-y;
  user-select: none;
  -webkit-user-select: none;
}

.schedule-cell.editable:hover {
  background-color: color-mix(in srgb, var(--accent) 10%, transparent);
}

.schedule-cell-selector,
.schedule-cell-selector input,
.schedule-cell-selector span {
  pointer-events: none;
}

.schedule-cell.selected {
  background: #ccfbf1;
  box-shadow: inset 0 0 0 3px #0f766e;
}

.schedule-cell.selected.today {
  box-shadow:
    inset 0 0 0 3px #0f766e,
    inset 0 0 0 5px rgba(37, 99, 235, 0.45);
}

.schedule-cell[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
}

.schedule-edit-panel form {
  display: grid;
  gap: 10px;
  grid-template-columns: minmax(140px, 0.55fr) auto minmax(220px, 1fr) minmax(220px, 1fr);
  justify-content: stretch;
  min-width: 0;
}

.schedule-edit-panel input[type="text"] {
  min-width: 0;
  width: 100%;
}

.schedule-bulk-status {
  grid-column: 1;
}

.schedule-bulk-question {
  align-self: end;
  grid-column: 2;
  min-height: 38px;
}

.schedule-bulk-note {
  grid-column: 3;
}

.schedule-bulk-reason {
  grid-column: 4;
}

.schedule-inline-error,
.schedule-bulk-actions {
  grid-column: 1 / -1;
}

.schedule-bulk-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

:root[data-theme="dark"] .schedule-cell.editable:hover {
  background-color: rgba(55, 150, 170, 0.16);
}

:root[data-theme="dark"] .schedule-cell.selected {
  background: #143d39;
  box-shadow: inset 0 0 0 3px #49b9ad;
}

:root[data-theme="dark"] .schedule-cell.selected.today {
  box-shadow:
    inset 0 0 0 3px #49b9ad,
    inset 0 0 0 5px rgba(96, 165, 250, 0.48);
}

@media (max-width: 1280px) {
  .schedule-edit-panel {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 860px) {
  .schedule-employee-track,
  .schedule-employee-col {
    min-width: 250px;
    width: 250px;
  }

  .schedule-employee-col {
    max-width: 250px;
  }

  .schedule-edit-panel form {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }

  .schedule-bulk-status {
    grid-column: 1;
  }

  .schedule-bulk-question {
    grid-column: 2;
  }

  .schedule-bulk-note,
  .schedule-bulk-reason,
  .schedule-inline-error,
  .schedule-bulk-actions {
    grid-column: 1 / -1;
  }

  .schedule-bulk-actions {
    justify-content: stretch;
  }

  .schedule-bulk-actions .button {
    flex: 1 1 180px;
  }
}

@media (max-width: 430px) {
  .schedule-employee-track,
  .schedule-employee-col {
    min-width: 220px;
    width: 220px;
  }

  .schedule-employee-col {
    max-width: 220px;
  }

  .schedule-edit-panel form {
    grid-template-columns: minmax(0, 1fr);
  }

  .schedule-bulk-status,
  .schedule-bulk-question,
  .schedule-bulk-note,
  .schedule-bulk-reason,
  .schedule-inline-error,
  .schedule-bulk-actions {
    grid-column: 1;
  }

  .schedule-bulk-actions {
    display: grid;
  }
}