@import './utilities-width.css';
html {
  -webkit-tap-highlight-color: transparent;
}
.scroll-smooth {
  scroll-behavior: smooth;
}
.scroll-instant {
  scroll-behavior: auto;
}
.copy-selection-fallback { position: fixed; top: 0; left: 0; opacity: 0; pointer-events: none; }
.chart-destroyed { display: none; }
.map-overlay-marker { position: absolute; transform: translate(-50%, -50%); }
body {
  min-width: 0;
}
small,
.small {
  font-size: var(--font-size-xs);
}
[dir="rtl"] .text-nowrap {
  white-space: normal;
}
.network-banner {
  position: fixed;
  top: var(--network-banner-offset, var(--app-navbar-height, 56px));
  left: 0;
  right: 0;
  z-index: var(--z-max);
  padding: var(--space-3) var(--space-4);
  text-align: center;
  font-weight: var(--font-weight-medium);
  transform: translateY(-100%);
  transition: transform var(--dur-fast) var(--ease-out);
}
.network-banner:not(.show) {
  pointer-events: none;
}
.network-banner.show {
  transform: translateY(0);
}
.network-banner.offline {
  background: var(--network-offline-gradient);
  color: var(--color-text-inverse, var(--color-white));
}
.network-banner.online {
  background: var(--network-online-gradient);
  color: var(--color-text-inverse, var(--color-white));
}
.network-banner .banner-content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
}
.network-banner .banner-text {
  font-size: var(--font-size-sm);
}
.network-banner .reconnect-status {
  font-size: var(--font-size-xs);
}
.prose {
  font-size: var(--font-size-sm);
  line-height: var(--line-height-relaxed);
  color: var(--color-text-primary);
  max-width: 72ch;
  margin-inline: auto;
  overflow-wrap: break-word;
  word-break: break-word;
  hyphens: auto;
}
@media (width >= 768px) {
  .prose {
    font-size: var(--font-size-base);
  }
}
.prose h1,
.prose h2,
.prose h3,
.prose h4 {
  font-family: var(--font-family-display);
  color: var(--color-text-primary);
  margin-top: var(--space-6);
  margin-bottom: var(--space-3);
  line-height: var(--line-height-snug);
}
.prose h1 { font-size: clamp(1.75rem, 4.2vw, 2.4rem); }
.prose h2 { font-size: clamp(1.4rem, 3.5vw, 1.9rem); }
.prose h3 { font-size: clamp(1.15rem, 3vw, 1.5rem); }
.prose h4 { font-size: var(--font-size-lg); }
.prose p,
.prose ul,
.prose ol {
  margin-bottom: var(--space-3);
}
.prose ul,
.prose ol {
  padding-left: var(--space-5);
}
.prose li + li {
  margin-top: var(--space-1);
}
.prose a {
  text-decoration: underline;
  text-underline-offset: 2px;
}
.status-shell {
  display: grid;
  place-items: center;
  padding: var(--space-6) 0;
  min-height: min(70vh, 720px);
}
command-palette .input-group > :is(.input-group-text, .form-control),
command-palette #cmdInput {
  min-height: max(48px, var(--touch-target-min));
}
@media (width >= 768px) and (width < 1366px) {
}
@media (width >= 1366px) and (width < 1920px) {
}
@media (width >= 1920px) {
}
logout-handler {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
forbidden-page {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
}
logout-handler .status-shell {
  flex: 1;
  min-height: 0;
  width: 100%;
}
logout-handler .status-grid {
  grid-template-columns: minmax(0, 1fr);
}
.status-card {
  --status-accent: var(--color-brand-primary);
  --status-accent-rgb: var(--color-brand-primary-rgb);
  position: relative;
  background: linear-gradient(160deg, rgba(var(--color-white-rgb), 0.92) 0%, rgba(var(--color-white-rgb), 0.72) 100%);
  border: 1px solid rgba(var(--status-accent-rgb), 0.22);
  border-top: var(--space-1) solid var(--status-accent);
  border-radius: var(--radius-3xl);
  padding: var(--space-6);
  box-shadow: var(--shadow-2xl);
  overflow: hidden;
  width: 100%;
  max-width: calc(var(--space-16) * 15 + var(--space-4));
}
.status-card::after {
  content: "";
  position: absolute;
  inset: -40% 30% auto -40%;
  height: calc(var(--space-16) * 3 + var(--space-12));
  background: radial-gradient(circle, rgba(var(--status-accent-rgb), 0.12), transparent 70%);
  pointer-events: none;
}
.status-card--success {
  --status-accent: var(--color-success);
  --status-accent-rgb: var(--color-success-rgb);
}
.status-card--warning {
  --status-accent: var(--color-warning);
  --status-accent-rgb: var(--color-warning-rgb);
}
.status-card--danger {
  --status-accent: var(--color-danger);
  --status-accent-rgb: var(--color-danger-rgb);
}

.notification-row {
  border-block-end: 1px solid var(--color-border-light);
}

.notification-row:not([class*="notification-priority--"]) {
  border-inline-start: 1px solid var(--color-border-light);
}
.notification-priority,
.notification-row[class*="notification-priority--"] {
  border-inline-start: 4px solid var(--notification-priority-color, var(--color-border-light));
}
.notification-priority--urgent { --notification-priority-color: var(--color-danger); }
.notification-priority--important { --notification-priority-color: var(--color-warning); }
.notification-priority--warning { --notification-priority-color: var(--color-brand-primary-700); }
.notification-priority--info { --notification-priority-color: var(--color-grey-500); }
.notification-row.notification-priority {
  border-block-end-color: var(--color-border-light);
}
.status-grid {
  display: grid;
  gap: var(--space-5);
  align-items: start;
  min-width: 0;
}
.status-panel {
  display: grid;
  gap: var(--space-3);
  min-width: 0;
}
.status-kicker {
  text-transform: uppercase;
  letter-spacing: var(--tracking-widest);
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}
.status-stamp {
  font-family: var(--font-family-display);
  font-size: clamp(2.5rem, 10vw, 4.5rem);
  line-height: 1;
  letter-spacing: var(--tracking-tighter);
  color: var(--status-accent);
}
.status-title {
  font-size: clamp(1.4rem, 4.5vw, 2rem);
  margin: 0;
  overflow-wrap: break-word;
  text-wrap: balance;
}
.status-message {
  color: var(--color-text-secondary);
  margin: 0;
  overflow-wrap: break-word;
}
.status-icon {
  width: var(--space-14);
  height: var(--space-14);
  border-radius: var(--radius-2xl);
  background: rgba(var(--status-accent-rgb), 0.12);
  color: var(--status-accent);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: var(--shadow-sm);
}
.status-icon i {
  font-size: var(--font-size-3xl);
}
.status-icon .spinner-border {
  width: 2.1rem;
  height: 2.1rem;
}
.status-steps {
  display: grid;
  gap: var(--space-2);
  list-style: none;
  margin: 0;
  padding: 0;
}
.status-step {
  position: relative;
  padding-left: var(--space-6);
  color: var(--color-text-secondary);
  overflow-wrap: break-word;
}
.status-step::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35rem;
  width: var(--icon-size-xs);
  height: var(--icon-size-xs);
  border-radius: var(--radius-full);
  background: var(--color-border-strong);
  box-shadow: 0 0 0 var(--space-1) rgba(var(--status-accent-rgb), 0.08);
}
.status-step.is-active {
  color: var(--color-text-primary);
  font-weight: var(--font-weight-semibold);
}
.status-step.is-active::before {
  background: var(--status-accent);
  box-shadow: 0 0 0 var(--space-1-5) rgba(var(--status-accent-rgb), 0.18);
}
.status-details {
  display: grid;
  gap: var(--space-2);
}
.status-detail {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-2);
  padding: var(--space-2) 0;
  border-bottom: 1px dashed var(--color-border-light);
}
.status-detail:last-child {
  border-bottom: 0;
}
.status-detail-label {
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
  color: var(--color-text-muted);
}
.status-detail-value {
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
}
.status-suggestions {
  display: grid;
  gap: var(--space-2);
  grid-template-columns: 1fr;
}
.status-tile {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-xl);
  border: 1px solid var(--color-border-light);
  background: var(--color-surface-elevated);
  color: inherit;
  text-decoration: none;
  min-height: var(--space-14);
  transition: transform var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-fast) var(--ease-out),
              border-color var(--dur-fast) var(--ease-out);
}
.status-tile i {
  font-size: var(--font-size-xl);
  color: var(--status-accent);
}
.status-tile:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
  border-color: rgba(var(--status-accent-rgb), 0.3);
}
.status-tile span {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: break-word;
}
.status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-3);
}
.status-actions .btn {
  width: 100%;
  justify-content: center;
  white-space: normal;
  text-align: center;
}
.status-action-placeholder {
  pointer-events: none;
  visibility: hidden;
}
.stack-4 { display: grid; gap: var(--space-4); grid-template-columns: minmax(0, 1fr); }
.stack-8 { display: grid; gap: var(--space-8); grid-template-columns: minmax(0, 1fr); }
.stack-16 { display: grid; gap: var(--space-16); grid-template-columns: minmax(0, 1fr); }
.cluster {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-3);
}
.grid-auto-fit {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--space-4);
}
.pos-relative { position: relative; }
.chart-area { position: relative; width: 100%; min-height: calc(var(--space-16) * 3 + var(--space-12)); }
.chart-area canvas { display: block; width: 100%; height: 100%; }
status-doughnut { display: block; width: 100%; height: 100%; }
.chart-all-main { height: clamp(280px, 40vw, 460px); min-height: clamp(280px, 40vw, 460px); }
@media (width >= 1366px) and (width < 1920px) {
  .chart-area { min-height: calc(var(--space-16) * 1.5); }
}
@media (width >= 1920px) {
  .chart-area { min-height: calc(var(--space-16) * 3 + var(--space-12)); }
}
.text-xxs { font-size: 0.65em; }
.fs-08r { font-size: var(--font-size-sm); }
.route-error { min-height: 50vh; }
.input-responsive {
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
}
.full-width-mobile {
  width: 100%;
}
.flex-fill-mobile {
  flex: 1 1 100%;
}
.maxh-400 { max-height: calc(var(--space-16) * 6 + var(--space-4)); }
.minw-140 { min-width: calc(var(--space-16) * 2 + var(--space-12)); }
.minw-180 { min-width: calc(var(--space-16) * 2 + var(--space-20)); }
.minw-200 { min-width: calc(var(--space-16) * 3 + var(--space-2)); }
.minw-240 { min-width: calc(var(--space-16) * 3 + var(--space-16)); }
.minw-260 { min-width: calc(var(--space-16) * 4 + var(--space-1)); }
a:not(.btn):not(.nav-link):not(.badge):not(.dropdown-item):not(.skip-link):not(.shared-hero-tab) {
  color: var(--color-text-link);
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-position: 0 100%;
  background-repeat: no-repeat;
  background-size: 0 1px;
  transition: background-size var(--dur-fast) var(--ease-out);
}
a:not(.btn):not(.nav-link):not(.badge):not(.dropdown-item):not(.skip-link):not(.shared-hero-tab):hover {
  color: var(--color-text-link-hover);
  background-size: 100% 1px;
}
app-shell > main {
  flex: 1;
  display: flex;
  flex-direction: column;
}
system-settings-page .settings-raw-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: end;
  justify-content: space-between;
  margin-bottom: var(--space-3);
}
system-settings-page .settings-raw-inline {
  padding-top: 0;
}
system-settings-page .settings-raw-inline + .settings-raw-inline {
  margin-top: var(--space-3);
}
system-settings-page .settings-raw-inline-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
system-settings-page .settings-raw-inline-header h3 {
  letter-spacing: var(--tracking-wider);
}
system-settings-page .settings-raw-inline-body {
  display: grid;
  gap: var(--space-3);
}
system-settings-page .settings-raw-inline-host:not(:empty) {
  margin-top: var(--space-4);
}
system-settings-page .settings-raw-inline-host:empty {
    display: none;
}
system-settings-page .settings-raw-field {
    flex: 1 1 16rem;
    min-width: min(100%, 16rem);
}
system-settings-page .settings-inline-editor {
  display: grid;
  gap: var(--space-3);
}
system-settings-page .settings-editor-toolbar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
}
system-settings-page .settings-editor-toolbar .btn {
  width: 100%;
}
system-settings-page .settings-editor-table :is(.form-control, .form-select) {
  min-height: var(--touch-target-min);
}
system-settings-page .settings-transition-matrix {
  overflow-x: auto;
}
system-settings-page .settings-workflow-matrix {
  min-width: 760px;
}
system-settings-page .settings-workflow-matrix th,
system-settings-page .settings-workflow-matrix td {
  vertical-align: top;
}
system-settings-page .settings-workflow-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.35rem 0.75rem;
}
system-settings-page .settings-workflow-action {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  min-height: var(--touch-target-min);
}
system-settings-page .settings-workflow-action .form-check-input {
  margin-top: 0;
  flex: 0 0 auto;
}
system-settings-page .jobs-transition-table th,
system-settings-page .jobs-transition-table td {
  text-align: center;
  vertical-align: middle;
}
system-settings-page .jobs-transition-table th:first-child,
system-settings-page .jobs-transition-table td:first-child {
  text-align: left;
}
system-settings-page .jobs-transition-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--touch-target-min);
  margin: 0;
}
system-settings-page .jobs-transition-toggle .form-check-input {
  margin: 0;
}
@media (width >= 768px) and (width < 1366px) {
  system-settings-page .settings-editor-toolbar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  system-settings-page .settings-editor-toolbar .btn {
    width: auto;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  system-settings-page .settings-editor-toolbar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  system-settings-page .settings-editor-toolbar .btn {
    width: auto;
  }
}
@media (width >= 1920px) {
  system-settings-page .settings-editor-toolbar {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  system-settings-page .settings-editor-toolbar .btn {
    width: auto;
  }
}
system-settings-page .settings-raw-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  align-items: center;
  justify-content: flex-end;
}
system-settings-page .settings-raw-summary {
  font-weight: 600;
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}
system-settings-page .settings-raw-table-wrapper {
  width: 100%;
}
system-settings-page .settings-raw-table {
  width: 100%;
  margin-bottom: 0;
}
system-settings-page .settings-raw-table td {
  vertical-align: top;
}
system-settings-page .settings-raw-value {
  min-width: 260px;
}
system-settings-page .settings-raw-input {
  width: 100%;
}
system-settings-page .settings-raw-row-dirty {
  background: rgba(var(--app-palette-yellow-rgb), 0.08);
}
system-settings-page .settings-raw-error {
  margin-top: var(--space-1);
}
system-settings-page .settings-raw-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1);
}
system-settings-page .settings-raw-title {
  line-height: 1.2;
}
@media (width >= 1366px) and (width < 1920px) {
  system-settings-page .settings-raw-table {
    min-width: 720px;
  }
}
@media (width >= 1920px) {
  system-settings-page .settings-raw-table {
    min-width: 860px;
  }
}
.impersonation-bar {
  position: relative;
  z-index: var(--z-overlay);
}
.contact-value {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  min-width: 0;
}

.contact-value__text {
  min-width: 0;
  overflow-wrap: break-word;
}

.contact-shortcuts,
.map-shortcuts {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-1-5);
  vertical-align: middle;
}

.contact-shortcut,
.map-shortcut {
  align-items: center;
  color: var(--color-text-muted);
  display: inline-flex;
  justify-content: center;
  background: var(--color-surface);
  border-color: var(--color-border);
}

.map-shortcut {
  min-block-size: max(44px, var(--touch-target-min, 44px));
  min-inline-size: max(44px, var(--touch-target-min, 44px));
  padding-block: 0.5rem;
  touch-action: manipulation;
}

.map-shortcut--labeled {
  justify-content: center;
  line-height: 1.25;
  min-inline-size: min(100%, 9rem);
  white-space: normal;
}

.contact-shortcut--call {
  color: var(--bs-primary);
  border-color: rgba(var(--app-palette-blue-rgb), 0.35);
  background: rgba(var(--app-palette-blue-rgb), 0.08);
}

.contact-shortcut--whatsapp {
  color: var(--app-palette-teal);
  border-color: rgba(var(--app-palette-teal-rgb), 0.35);
  background: rgba(var(--app-palette-teal-rgb), 0.08);
}

.contact-shortcut:hover,
.contact-shortcut:focus-visible,
.map-shortcut:hover,
.map-shortcut:focus-visible {
  color: var(--color-primary-700);
  border-color: rgba(var(--color-primary-rgb), 0.45);
  background: rgba(var(--color-primary-rgb), 0.08);
}

.contact-shortcut--whatsapp:hover,
.contact-shortcut--whatsapp:focus-visible {
  color: var(--app-palette-teal);
  border-color: rgba(var(--app-palette-teal-rgb), 0.45);
  background: rgba(var(--app-palette-teal-rgb), 0.08);
}

.map-shortcut__icon {
  display: block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  object-fit: contain;
}

.map-shortcut__icon--waze {
  width: 0.78rem;
  height: 0.78rem;
}
.display-font {
  font-family: var(--font-family-display);
  letter-spacing: var(--tracking-tight);
}
metric-card,
.metric-card {
  display: block;
  --metric-accent: var(--color-brand-primary);
  --metric-accent-soft: rgba(var(--color-brand-primary-rgb), 0.12);
}
metric-card {
  cursor: pointer;
}
metric-card .metric-card {
  height: 100%;
  min-height: var(--height-xs);
  background: linear-gradient(160deg, var(--color-surface-elevated) 0%, var(--color-surface-soft) 100%);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-2xl);
  padding: var(--space-5);
  display: grid;
  gap: var(--space-3);
  position: relative;
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition:
    transform var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out);
}
metric-card:focus-visible .metric-card {
  box-shadow: var(--focus-ring), var(--shadow-lg);
}
.metric-card[data-status="pending"] {
  --metric-accent: var(--color-warning);
  --metric-accent-soft: var(--color-warning-soft);
}
.metric-card[data-status="outstanding"] {
  --metric-accent: var(--color-brand-primary);
  --metric-accent-soft: rgba(var(--color-brand-primary-rgb), 0.14);
}
.metric-card[data-status="partial_completed"] {
  --metric-accent: var(--color-info-700);
  --metric-accent-soft: var(--color-info-soft);
}
.metric-card[data-status="completed"] {
  --metric-accent: var(--color-success);
  --metric-accent-soft: var(--color-success-soft);
}
.metric-card[data-status="on_hold"] {
  --metric-accent: var(--color-grey-500);
  --metric-accent-soft: var(--metric-neutral-soft);
}
.metric-card[data-status="insufficient_info"] {
  --metric-accent: var(--color-info-700);
  --metric-accent-soft: var(--color-info-soft);
}
.metric-card[data-status="cancelled"] {
  --metric-accent: var(--color-danger);
  --metric-accent-soft: var(--color-danger-soft);
}
.metric-card__icon {
  width: var(--icon-size-xl);
  height: var(--icon-size-xl);
  display: grid;
  place-items: center;
  border-radius: var(--radius-full);
  background: var(--metric-accent-soft);
  color: var(--metric-accent);
  font-size: var(--font-size-xl);
}
.metric-card__meta {
  display: grid;
  gap: var(--space-1);
}
.metric-label {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-secondary);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wider);
}
.metric-value {
  font-family: var(--font-family-display);
  font-size: var(--font-size-3xl);
  font-weight: var(--font-weight-bold);
  letter-spacing: var(--tracking-tight);
  line-height: 1.15;
  color: var(--color-text-primary);
  font-variant-numeric: tabular-nums;
}
.metric-card__spark {
  position: absolute;
  inset: auto 0 0 0;
  height: var(--space-1);
  background: linear-gradient(90deg, var(--metric-accent), transparent);
  opacity: 0.6;
}
.tag-input-container {
  min-height: var(--touch-target-min);
}
.tag-input-container .tag-input-field {
  min-width: var(--width-filter-sm);
  outline: none;
  color: var(--color-text-primary);
  caret-color: var(--color-text-primary);
}
.tag-input-container .tag-input-field::placeholder {
  color: var(--color-text-muted);
}
.password-strength-label {
  min-width: var(--width-col-xs);
  display: inline-flex;
  justify-content: flex-end;
}
.text-primary {
  color: var(--color-brand-primary-700);
}
@media (width < 768px) {
    .table-responsive-cards {
      --table-card-gap: calc(var(--space-2) * var(--density-scale));
      --table-card-padding: calc(var(--space-3) * var(--density-scale));
      border: 0;
      background: transparent;
      overflow-x: visible;
    overflow-y: visible;
  }
  .table-responsive-cards.virtual-table {
    overflow-y: auto;
  }
  .table-responsive-cards .table {
    display: block;
    width: 100%;
    border: 0;
  }
  .table-responsive-cards thead {
    display: none;
  }
  .table-responsive-cards tbody {
    display: flex;
    flex-direction: column;
    gap: var(--table-card-gap);
  }
  .table-responsive-cards tbody tr {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--table-card-padding);
    border: 1px solid var(--color-border-light);
    border-radius: var(--radius-xl);
    background: var(--color-surface-elevated);
    box-shadow: var(--shadow-sm);
    position: relative;
    transition: transform var(--dur-fast) var(--ease-out),
                box-shadow var(--dur-fast) var(--ease-out);
  }
  .table-responsive-cards tbody tr.table-card-full {
    display: block;
    text-align: center;
  }
  .table-responsive-cards td,
  .table-responsive-cards th {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: calc(var(--space-2) * var(--density-scale));
    padding: calc(var(--space-1) * var(--density-scale)) 0;
    border: 0;
    border-bottom: 1px solid var(--color-border-light, rgba(var(--color-black-rgb), 0.05));
    text-align: left;
    word-break: break-word;
    overflow-wrap: break-word;
    min-width: 0;
  }
  .table-responsive-cards td > *,
  .table-responsive-cards th > * {
    min-width: 0;
    max-width: 100%;
  }
  .table-responsive-cards td > .table-cell-value {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
  }
  [dir="rtl"] .table-responsive-cards td {
    flex-direction: row-reverse;
    text-align: right;
  }
  .table-responsive-cards td[data-label]::before {
    display: none;
  }
  .table-responsive-cards .table-card-label {
    display: inline-flex;
    align-items: center;
    font-size: var(--font-size-2xs);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wider);
    color: var(--color-text-secondary);
    font-weight: var(--font-weight-semibold);
    flex: 0 0 100%;
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  .table-responsive-cards td[data-card-title="true"] {
    justify-content: flex-start;
    font-weight: var(--font-weight-semibold);
  }
  .table-responsive-cards td[data-card-title="true"] .table-card-label,
  .table-responsive-cards td[data-label="Select"] .table-card-label,
  .table-responsive-cards td.actions-cell .table-card-label,
  .table-responsive-cards td[data-label="Actions"] .table-card-label {
    display: none;
  }
  .table-responsive-cards td[data-label="Select"] {
    justify-content: flex-end;
  }
  .table-responsive-cards td:last-child,
  .table-responsive-cards th:last-child {
    border-bottom: none;
  }
  .table-responsive-cards td.actions-cell,
  .table-responsive-cards td[data-label="Actions"] {
    justify-content: flex-end;
    padding-top: var(--space-3);
    margin-top: var(--space-2);
    border-top: 1px solid var(--color-border-light, rgba(var(--color-black-rgb), 0.08));
    border-bottom: none;
  }
  .table-responsive-cards td.actions-cell::before,
  .table-responsive-cards td[data-label="Actions"]::before {
    display: none;
  }
  .table-responsive-cards tbody tr:active {
    transform: scale(0.98);
  }
  .table-responsive-cards tbody tr:focus-within {
    box-shadow: var(--shadow-md);
    border-color: rgba(var(--color-brand-primary-rgb), 0.25);
  }
  .table-responsive-cards .hide-mobile {
    display: none;
  }
  .table-responsive-cards .virtual-spacer {
    display: block;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    margin-bottom: 0;
  }
  .table-responsive-cards .virtual-spacer td {
    padding: 0;
  }
  .input-group {
    flex-wrap: nowrap;
  }
  .input-group.has-validation {
    flex-wrap: wrap;
  }
  .input-group.has-validation > .invalid-feedback {
    flex: 0 0 100%;
    width: 100%;
  }
  .input-group .input-group-text {
    flex-shrink: 0;
  }
  .minw-140,
  .minw-180 {
    min-width: 100%;
    max-width: 100%;
  }
}
.table th[data-sortable] {
  cursor: pointer;
  user-select: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.table th[data-sortable]:hover {
  color: var(--color-brand-primary);
}
.mw-250px {
  max-width: var(--width-max-sm);
}
.mw-300px {
  max-width: 100%;
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}
.mw-xs {
  max-width: 100%;
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}
.mw-500px {
  max-width: 100%;
  width: 100%;
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}
.mw-sm {
  max-width: 100%;
  width: 100%;
  padding-left: var(--space-3);
  padding-right: var(--space-3);
}
@media (width >= 768px) {
  .mw-300px {
    max-width: var(--width-max-md);
    padding-left: 0;
    padding-right: 0;
  }
  .mw-xs {
    max-width: var(--container-xs);
    padding-left: 0;
    padding-right: 0;
  }
  .mw-500px {
    max-width: var(--width-max-lg);
  }
  .mw-sm {
    max-width: var(--container-sm);
  }
}
.job-code-cell,
.user-email-cell {
  min-width: var(--width-filter-sm);
}
.job-code-cell {
  overflow-wrap: break-word;
  word-break: break-word;
  white-space: normal;
}
@media (width < 768px) {
  .job-code-cell,
  .user-email-cell {
    min-width: var(--width-col-3xs);
  }
  .job-code-cell span,
  .user-email-cell span {
    font-size: var(--font-size-xs);
  }
  employee-page td[data-label="Actions"] .btn {
    width: var(--touch-target-min);
    height: var(--touch-target-min);
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--touch-target-min);
  }
}
.audit-log-table {
  table-layout: auto;
}
body.route-audit-logs .app-header-alert {
  padding: var(--space-1-5) var(--space-2-5);
  min-height: calc(var(--touch-target-min) - var(--space-1));
  font-size: var(--font-size-2xs);
  line-height: 1.3;
}
audit-log-page {
  display: block;
  --audit-shell-max: 100%;
  --audit-touch-target-min: 50px;
  --touch-target-min: var(--audit-touch-target-min);
  --audit-control-touch-target: var(--touch-target-min);
  --audit-control-min-height: var(--audit-control-touch-target);
  --audit-pagination-touch-target: var(--touch-target-min);
  --audit-pagination-min-height: var(--audit-pagination-touch-target);
  --audit-control-padding-inline: clamp(var(--space-2), 2.2vw, var(--space-3));
  --audit-control-font-size: clamp(0.9rem, 0.88rem + 0.14vw, 0.98rem);
  --audit-toolbar-sticky-top: calc(var(--navbar-height) + env(safe-area-inset-top, 0px) + var(--space-2));
  --audit-details-readable: min(100%, 42rem);
  --audit-human-col-date: 100%;
  --audit-human-col-actor: 100%;
  --audit-human-col-job: 100%;
  --audit-human-col-source: 100%;
  --audit-human-col-action: 100%;
  --audit-human-col-changes: 100%;
}
body.route-audit-logs audit-log-page .container-fluid.cq-dashboard.audit-shell {
  overflow-x: clip;
}
audit-log-page .audit-shell.workspace-shell {
  padding-bottom: var(--space-6);
}
audit-log-page .audit-workspace-content {
  box-sizing: border-box;
  width: min(100%, var(--audit-shell-max));
  max-width: var(--audit-shell-max);
  margin-inline: auto;
  padding-top: var(--space-2);
  padding-inline: var(--space-3);
  align-items: stretch;
}
audit-log-page .audit-main-card.card {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  contain: layout style;
  overflow: visible;
}
audit-log-page .audit-main-card.card:hover {
  transform: none;
}
audit-log-page .audit-main-card.card .card-header,
audit-log-page .audit-main-card.card .card-body {
  overflow: visible;
}
audit-log-page .audit-toolbar {
  padding: var(--space-2);
  position: relative;
  z-index: calc(var(--z-sticky) + 1);
}
audit-log-page .audit-main-card .card-body {
  padding: 0.875rem;
}
audit-log-page .audit-filter-form {
  display: grid;
  gap: var(--space-4);
}
audit-log-page .audit-controls-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2-5);
  padding: var(--space-2);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-xl);
  background: var(--color-surface-soft);
  position: relative;
  z-index: var(--z-dropdown-floating);
  overflow: visible;
  container-type: inline-size;
  container-name: audit-controls;
}
audit-log-page .audit-controls-combined {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2-5);
  min-width: 0;
  align-items: start;
}
audit-log-page .audit-filter-controls,
audit-log-page .audit-filter-actions,
audit-log-page .audit-utility-actions,
audit-log-page .audit-retention-group,
audit-log-page .audit-log-scroll,
audit-log-page .audit-log-table,
audit-log-page .audit-log-table tbody,
audit-log-page .audit-log-table tr,
audit-log-page .audit-log-table th,
audit-log-page .audit-log-table td {
  min-width: 0;
}
audit-log-page .audit-filter-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-1-5);
  align-items: end;
  position: relative;
  z-index: var(--z-dropdown-floating);
  overflow: visible;
}
audit-log-page .audit-filter-controls > .dropdown {
  min-width: 0;
  position: relative;
}
audit-log-page .audit-job-search {
  display: block;
  min-width: 0;
  margin: 0;
}
audit-log-page .audit-job-search .form-control {
  width: 100%;
  min-height: var(--audit-control-min-height);
  padding-inline: var(--audit-control-padding-inline);
  font-size: var(--audit-control-font-size);
  line-height: 1.2;
}
audit-log-page .audit-filter-controls .dropdown .btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  min-width: 0;
  min-height: var(--audit-control-min-height);
  padding-inline: var(--audit-control-padding-inline);
  font-size: var(--audit-control-font-size);
  line-height: 1.2;
  flex-wrap: wrap;
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: break-word;
}
audit-log-page .audit-filter-controls .dropdown .btn::after {
  flex-shrink: 0;
  margin-left: var(--space-2);
}
audit-log-page .audit-filter-controls .dropdown-menu {
  width: 100%;
  min-width: 100%;
  max-width: min(calc(100vw - var(--space-6)), var(--width-col-xl));
  z-index: var(--z-dropdown-floating);
}
audit-log-page .audit-export-action .dropdown-menu {
  width: 100%;
  min-width: 100%;
}
audit-log-page .audit-filter-controls .dropdown-menu .dropdown-item {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
audit-log-page .audit-date-range {
  display: grid;
  gap: var(--space-1-5);
  min-width: 0;
  position: relative;
  grid-column: auto;
}
audit-log-page .audit-date-range__label {
  letter-spacing: var(--tracking-wider);
  font-size: clamp(0.75rem, 0.72rem + 0.18vw, 0.875rem);
  line-height: 1.2;
}
audit-log-page .audit-date-range-control {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  min-height: var(--audit-control-min-height);
  padding: 0 var(--audit-control-padding-inline);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  background: var(--color-surface-elevated);
  box-shadow: inset 0 0 0 1px var(--glass-white-inset);
  cursor: pointer;
  position: relative;
  font: inherit;
  font-size: var(--audit-control-font-size);
  line-height: 1.2;
  color: inherit;
}
audit-log-page .audit-date-range-control:focus-within {
  border-color: rgba(var(--color-brand-primary-rgb), 0.5);
  box-shadow: 0 0 0 2px rgba(var(--color-brand-primary-rgb), 0.2);
}
audit-log-page .audit-date-range__icon,
audit-log-page .audit-date-range__caret {
  color: var(--color-text-secondary);
  font-size: var(--font-size-base);
  flex: 0 0 auto;
}
audit-log-page .audit-date-range__text {
  display: flex;
  align-items: center;
  gap: var(--space-1);
  flex: 1 1 auto;
  min-width: 0;
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  font-size: var(--font-size-sm);
  flex-wrap: wrap;
  white-space: normal;
  overflow: visible;
  overflow-wrap: break-word;
}
audit-log-page .audit-date-range__text > span {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  overflow-wrap: break-word;
  max-width: 100%;
  min-width: 0;
}
audit-log-page .audit-date-range__sep {
  display: inline;
  flex: 0 0 auto;
}
audit-log-page .audit-date-range-inputs {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
  width: 100%;
  max-height: 0;
  max-block-size: 0;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transition: max-height var(--dur-fast) var(--ease-out), max-block-size var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out);
}
audit-log-page[data-date-inputs-open="true"] .audit-date-range-inputs {
  max-height: 9rem;
  max-block-size: 9rem;
  opacity: 1;
  pointer-events: auto;
}
audit-log-page .audit-date-range-input {
  width: 100%;
  min-height: var(--audit-control-min-height);
  font-size: var(--audit-control-font-size);
}
audit-log-page[data-date-inputs-open="false"] .audit-date-range-input {
  pointer-events: none;
}
audit-log-page .audit-filter-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
  align-items: stretch;
  padding-top: var(--space-2);
  border-top: 1px solid var(--color-border-light);
}
audit-log-page .audit-filter-actions > * {
  min-width: 0;
  align-self: start;
}
audit-log-page .audit-utility-actions,
audit-log-page .audit-retention-group {
  display: grid;
  gap: var(--space-2);
}
audit-log-page .audit-utility-actions {
  grid-template-columns: minmax(0, 1fr);
}
audit-log-page .audit-toolbar-kicker {
  color: var(--color-text-primary);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
  line-height: 1.25;
}
audit-log-page .audit-utility-actions > * {
  min-width: 0;
}
audit-log-page .audit-utility-actions .btn {
  white-space: nowrap;
  min-height: var(--audit-control-min-height);
}
audit-log-page .audit-filter-actions .dropdown,
audit-log-page .audit-filter-actions .dropdown .btn,
audit-log-page .audit-filter-input {
  width: 100%;
}
audit-log-page .audit-retention-group {
  grid-template-columns: minmax(0, 1fr);
  align-items: stretch;
}
audit-log-page .audit-retention-group > * {
  min-width: 0;
}
audit-log-page .audit-retention-group .form-control,
audit-log-page .audit-retention-group .btn {
  min-height: var(--audit-control-min-height);
  font-size: var(--audit-control-font-size);
}
audit-log-page .audit-retention-group .form-control {
  width: 100%;
  font-variant-numeric: tabular-nums;
  padding-inline: var(--audit-control-padding-inline);
}
audit-log-page .audit-retention-group .btn {
  width: 100%;
  white-space: nowrap;
  padding-inline: var(--audit-control-padding-inline);
}
audit-log-page .audit-prune-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  width: 100%;
  min-height: var(--audit-control-min-height);
  padding-inline: var(--audit-control-padding-inline);
  font-size: var(--audit-control-font-size);
}
audit-log-page .audit-prune-action__label {
  white-space: nowrap;
}
audit-log-page .audit-log-scroll {
  max-height: min(70vh, 42.5rem);
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  position: relative;
}
audit-log-page .audit-log-scroll .audit-log-table {
  margin-bottom: 0;
}
audit-log-page .audit-log-table,
job-detail-page .audit-log-table,
lead-detail-page .audit-log-table,
project-list .audit-log-table {
  width: 100%;
}
audit-log-page .audit-log-table th,
audit-log-page .audit-log-table td,
job-detail-page .audit-log-table th,
job-detail-page .audit-log-table td,
lead-detail-page .audit-log-table th,
lead-detail-page .audit-log-table td,
project-list .audit-log-table th,
project-list .audit-log-table td {
  font-size: clamp(0.8125rem, 0.79rem + 0.16vw, 0.9375rem);
  line-height: 1.45;
  vertical-align: top;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
audit-log-page .audit-log-table .table-cell-value,
job-detail-page .audit-log-table .table-cell-value,
lead-detail-page .audit-log-table .table-cell-value,
project-list .audit-log-table .table-cell-value {
  display: block;
  max-width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
}
audit-log-page .audit-log-table .table-cell-value a,
job-detail-page .audit-log-table .table-cell-value a,
lead-detail-page .audit-log-table .table-cell-value a,
project-list .audit-log-table .table-cell-value a {
  word-break: break-word;
}
audit-log-page .audit-log-table thead th,
job-detail-page .audit-log-table thead th,
lead-detail-page .audit-log-table thead th,
project-list .audit-log-table thead th {
  position: sticky;
  top: 0;
  z-index: var(--z-local-raised);
  background: var(--color-surface-elevated);
  box-shadow: inset 0 -1px 0 var(--color-border-light);
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-tight);
}
audit-log-page .audit-action-cell .badge,
job-detail-page .audit-action-cell .badge,
lead-detail-page .audit-action-cell .badge,
project-list .audit-action-cell .badge {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding-inline: var(--space-2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
audit-log-page .audit-details-cell,
job-detail-page .audit-details-cell,
lead-detail-page .audit-details-cell,
project-list .audit-details-cell {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
}
audit-log-page .audit-details-cell .audit-details-text,
job-detail-page .audit-details-cell .audit-details-text,
lead-detail-page .audit-details-cell .audit-details-text,
project-list .audit-details-cell .audit-details-text {
  font-size: clamp(0.75rem, 0.72rem + 0.16vw, 0.9rem);
  white-space: inherit;
  overflow-wrap: inherit;
  word-break: inherit;
  line-height: 1.45;
  max-inline-size: var(--audit-details-readable);
}
@media (width < 1366px) {
  audit-log-page .audit-log-scroll.table-responsive-cards {
    max-height: none;
    overflow-y: visible;
  }
}
audit-log-page .audit-log-scroll.table-responsive-cards table,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-log-table {
  display: block;
  width: 100%;
  min-width: 0;
  table-layout: auto;
}
audit-log-page .audit-log-scroll.table-responsive-cards thead {
  display: none;
}
audit-log-page .audit-log-scroll.table-responsive-cards tbody {
  display: flex;
  flex-direction: column;
  gap: var(--space-2-5);
}
audit-log-page .audit-log-scroll.table-responsive-cards tbody tr {
  display: flex;
  flex-direction: column;
  gap: var(--space-1);
  padding: var(--space-3);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  background: var(--color-surface-elevated);
  box-shadow: var(--shadow-sm);
}
audit-log-page .audit-log-scroll.table-responsive-cards td,
audit-log-page .audit-log-scroll.table-responsive-cards th {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-1);
  padding: var(--space-1) 0;
  border: 0;
  border-bottom: 1px solid var(--color-border-light);
  min-width: 0;
  text-align: left;
}
audit-log-page .audit-log-scroll.table-responsive-cards td:last-child,
audit-log-page .audit-log-scroll.table-responsive-cards th:last-child {
  border-bottom: none;
}
audit-log-page .audit-log-scroll.table-responsive-cards td > .table-cell-value {
  flex: 1 1 0;
  min-width: 0;
  max-width: 100%;
  width: 100%;
  overflow-wrap: break-word;
  word-break: break-word;
}
audit-log-page .audit-log-scroll.table-responsive-cards .table-card-label {
  display: inline-flex;
  align-items: center;
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  letter-spacing: var(--tracking-tight);
  color: var(--color-text-secondary);
  font-family: var(--font-family-sans);
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-action-cell .badge {
  max-width: 100%;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  word-break: break-word;
  line-height: 1.25;
}
audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] {
  justify-content: flex-start;
  font-weight: var(--font-weight-semibold);
}
audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] .table-card-label {
  display: inline-flex;
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-date-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-user-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-entity-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-id-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-action-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-actor-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-job-identity-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-source-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-action-cell,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-changes-cell {
  width: 100%;
  min-width: 0;
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-cell .table-cell-value,
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-disclosure {
  width: 100%;
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-disclosure > summary {
  min-inline-size: var(--audit-control-min-height);
  min-block-size: var(--audit-control-min-height);
  gap: var(--space-1);
  white-space: nowrap;
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-disclosure > summary::after {
  content: "";
  width: 0.45rem;
  height: 0.45rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translateY(-1px);
  transition: transform var(--dur-fast) var(--ease-out);
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-disclosure[open] > summary::after {
  transform: rotate(225deg) translateY(-1px);
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-id-cell .table-cell-value {
  font-size: 1rem;
  font-weight: var(--font-weight-semibold);
}
audit-log-page .audit-log-scroll.table-responsive-cards .audit-job-identity-cell .table-cell-value {
  font-size: 1rem;
  font-weight: var(--font-weight-semibold);
}
audit-log-page .workspace-pagination > div {
  margin-top: var(--space-2-5);
  padding: var(--space-2);
  container-type: inline-size;
  container-name: audit-pagination;
}
audit-log-page .workspace-pagination .pagination-container {
  gap: var(--space-1-5);
}
audit-log-page .workspace-pagination .pagination {
  gap: var(--space-1);
}
audit-log-page #itemsPerPageSelect {
  width: 100%;
  min-width: 0;
  min-height: var(--audit-pagination-min-height);
  padding-inline: var(--audit-control-padding-inline);
  font-size: var(--audit-control-font-size);
  line-height: 1.2;
}
audit-log-page .workspace-pagination .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: var(--audit-pagination-min-height);
  min-height: var(--audit-pagination-min-height);
  padding: var(--space-1) var(--space-1-5);
  font-size: var(--font-size-sm);
}
@media (width >= 768px) and (width < 1366px) {
  body.route-audit-logs .app-header-alert {
    padding: var(--space-2) var(--space-3);
    min-height: var(--touch-target-min);
    font-size: var(--font-size-xs);
  }
  audit-log-page {
    --audit-shell-max: 100%;
    --audit-touch-target-min: 50px;
    --touch-target-min: var(--audit-touch-target-min);
    --audit-control-touch-target: var(--touch-target-min);
    --audit-pagination-touch-target: var(--touch-target-min);
  }
  audit-log-page .audit-workspace-content {
    padding-inline: var(--space-4);
  }
  audit-log-page .audit-controls-container {
    padding: var(--space-2-5);
    gap: var(--space-2-5);
  }
  audit-log-page .audit-controls-combined {
    gap: var(--space-2-5);
  }
  audit-log-page .audit-filter-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2-5);
  }
  audit-log-page .audit-job-search {
    grid-column: 1 / -1;
  }
  audit-log-page .audit-filter-controls .dropdown .btn {
    flex-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range {
    grid-column: 1 / -1;
  }
  audit-log-page .audit-date-range__text {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: hidden;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range__text > span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
  }
  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2-5);
    align-items: stretch;
  }
  audit-log-page .audit-utility-actions,
  audit-log-page .audit-retention-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  audit-log-page .audit-retention-group .btn {
    width: auto;
  }
  audit-log-page #btnPruneLogs {
    align-self: stretch;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards {
    max-height: min(58vh, 42rem);
    overflow-y: auto;
    padding-right: var(--space-1);
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody {
    gap: var(--space-3);
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas:
      "date actor"
      "job source"
      "action action"
      "before after";
    gap: var(--space-2) var(--space-3);
    padding: var(--space-3);
  }
  audit-log-page .audit-log-scroll.table-responsive-cards td,
  audit-log-page .audit-log-scroll.table-responsive-cards th {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: var(--space-1);
    padding: 0;
    border: 0;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .table-card-label {
    flex: 0 0 auto;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-date-cell {
    grid-area: date;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-actor-cell,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-user-cell {
    grid-area: actor;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-job-identity-cell,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-id-cell {
    grid-area: job;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-source-cell,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-entity-cell {
    grid-area: source;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-action-cell,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-action-cell {
    grid-area: action;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-details-cell,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-changes-cell {
    grid-area: changes;
    width: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-before-cell {
    grid-area: before;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-human-after-cell {
    grid-area: after;
  }
  audit-log-page .workspace-pagination > div {
    padding: var(--space-3);
  }
}
@media (width >= 1366px) and (width < 1920px) {
  audit-log-page {
    --audit-shell-max: 100%;
    --audit-touch-target-min: 44px;
    --touch-target-min: var(--audit-touch-target-min);
    --audit-control-touch-target: var(--touch-target-min);
    --audit-pagination-touch-target: var(--touch-target-min);
    --audit-human-col-date: 13%;
    --audit-human-col-actor: 13%;
    --audit-human-col-job: 14%;
    --audit-human-col-source: 10%;
    --audit-human-col-action: 16%;
    --audit-human-col-changes: 34%;
    --audit-human-col-before: 17%;
    --audit-human-col-after: 17%;
  }
  audit-log-page .audit-workspace-content {
    padding-inline: var(--space-4);
  }
  audit-log-page .audit-toolbar {
    padding: var(--space-1-5);
  }
  audit-log-page .audit-main-card .card-body {
    padding: 0.875rem;
  }
  audit-log-page .audit-filter-form {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }
  body.route-audit-logs .app-header-alert {
    padding: var(--space-2) var(--space-4);
    min-height: calc(var(--touch-target-min) + var(--space-1));
  }
  audit-log-page .audit-controls-container {
    gap: var(--space-2);
    padding: var(--space-2);
  }
  audit-log-page .audit-controls-combined {
    grid-template-columns: minmax(0, 1.38fr) minmax(0, 1.12fr);
    gap: var(--space-2);
    align-items: end;
  }
  audit-log-page .audit-filter-controls {
    grid-template-columns: minmax(14rem, 1.25fr) repeat(3, minmax(7.5rem, 0.85fr)) minmax(14rem, 1.25fr);
    gap: var(--space-1-5);
  }
  audit-log-page .audit-filter-controls .dropdown .btn {
    flex-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range {
    grid-column: auto;
  }

  audit-log-page .audit-job-search {
    grid-column: auto;
  }
  audit-log-page .audit-date-range__text {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: hidden;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range__text > span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
  }
  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr) auto;
    gap: var(--space-2);
    align-items: end;
  }
  audit-log-page .audit-utility-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  audit-log-page #btnPruneLogs {
    width: auto;
    min-width: 11rem;
  }
  audit-log-page .audit-log-scroll {
    max-height: min(70vh, 42.5rem);
    overflow-y: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards {
    max-height: min(70vh, 42.5rem);
    overflow-y: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards table,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-log-table {
    display: table;
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards thead {
    display: table-header-group;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody {
    display: table-row-group;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody tr {
    display: table-row;
    box-shadow: none;
    background: transparent;
    border: 0;
    padding: 0;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards td,
  audit-log-page .audit-log-scroll.table-responsive-cards th {
    display: table-cell;
    padding: var(--space-2-5) var(--space-3);
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: top;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .table-card-label,
  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] .table-card-label {
    display: none;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] {
    font-weight: inherit;
  }
  audit-log-page .audit-log-table {
    --audit-col-date: 14%;
    --audit-col-user: 15%;
    --audit-col-entity: 10%;
    --audit-col-item: 15%;
    --audit-col-action: 18%;
    --audit-col-details: 28%;
  }
  audit-log-page .audit-human-table {
    --audit-col-date: var(--audit-human-col-date);
    --audit-col-user: var(--audit-human-col-actor);
    --audit-col-entity: var(--audit-human-col-source);
    --audit-col-item: var(--audit-human-col-job);
    --audit-col-action: var(--audit-human-col-action);
    --audit-col-details: var(--audit-human-col-changes);
  }
  audit-log-page .audit-log-table thead .audit-date-cell {
    width: var(--audit-col-date);
  }
  audit-log-page .audit-log-table thead .audit-user-cell {
    width: var(--audit-col-user);
  }
  audit-log-page .audit-log-table thead .audit-entity-cell {
    width: var(--audit-col-entity);
  }
  audit-log-page .audit-log-table thead .audit-id-cell {
    width: var(--audit-col-item);
  }
  audit-log-page .audit-log-table thead .audit-action-cell {
    width: var(--audit-col-action);
  }
  audit-log-page .audit-log-table thead .audit-details-cell {
    width: var(--audit-col-details);
  }
  audit-log-page .audit-date-cell,
  audit-log-page .audit-user-cell,
  audit-log-page .audit-entity-cell,
  audit-log-page .audit-id-cell,
  audit-log-page .audit-action-cell,
  audit-log-page .audit-details-cell {
    width: auto;
    min-width: 0;
  }
}
@media (width >= 1920px), (min-width: 1920px) {
  audit-log-page {
    --audit-shell-max: 100%;
    --audit-touch-target-min: 44px;
    --touch-target-min: var(--audit-touch-target-min);
    --audit-control-touch-target: var(--touch-target-min);
    --audit-pagination-touch-target: var(--touch-target-min);
    --audit-human-col-date: 12%;
    --audit-human-col-actor: 13%;
    --audit-human-col-job: 14%;
    --audit-human-col-source: 9%;
    --audit-human-col-action: 14%;
    --audit-human-col-changes: 38%;
    --audit-human-col-before: 19%;
    --audit-human-col-after: 19%;
  }
  audit-log-page .audit-workspace-content {
    padding-inline: var(--space-5);
  }
  body.route-audit-logs .app-header-alert {
    padding: var(--space-2) var(--space-4);
  }
  audit-log-page .audit-filter-form {
    gap: var(--space-5);
  }
  audit-log-page .audit-controls-container {
    gap: var(--space-4);
    padding: var(--space-3);
  }
  audit-log-page .audit-controls-combined {
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1.2fr);
    gap: var(--space-4);
    align-items: end;
  }
  audit-log-page .audit-filter-controls {
    grid-template-columns: minmax(16rem, 1.25fr) repeat(3, minmax(8.5rem, 0.85fr)) minmax(16rem, 1.25fr);
    gap: var(--space-4);
  }
  audit-log-page .audit-filter-controls .dropdown .btn {
    flex-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range {
    grid-column: auto;
  }
  audit-log-page .audit-date-range__text {
    flex-wrap: nowrap;
    white-space: nowrap;
    overflow: hidden;
    overflow-wrap: normal;
  }
  audit-log-page .audit-date-range__text > span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
  }
  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr) auto;
    gap: var(--space-3);
    align-items: end;
  }
  audit-log-page .audit-utility-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  audit-log-page #btnPruneLogs {
    width: auto;
    min-width: 12.5rem;
  }
  audit-log-page .audit-log-scroll,
  audit-log-page .audit-log-scroll.table-responsive-cards {
    max-height: min(72vh, 48rem);
    overflow-y: auto;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards table,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-log-table {
    display: table;
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards thead {
    display: table-header-group;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody {
    display: table-row-group;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards tbody tr {
    display: table-row;
    box-shadow: none;
    background: transparent;
    border: 0;
    padding: 0;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards td,
  audit-log-page .audit-log-scroll.table-responsive-cards th {
    display: table-cell;
    padding: var(--space-3);
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: top;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards .table-card-label,
  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] .table-card-label {
    display: none;
  }
  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] {
    font-weight: inherit;
  }
  audit-log-page .audit-log-table {
    --audit-col-date: 12%;
    --audit-col-user: 15%;
    --audit-col-entity: 10%;
    --audit-col-item: 15%;
    --audit-col-action: 15%;
    --audit-col-details: 33%;
  }
  audit-log-page .audit-human-table {
    --audit-col-date: var(--audit-human-col-date);
    --audit-col-user: var(--audit-human-col-actor);
    --audit-col-entity: var(--audit-human-col-source);
    --audit-col-item: var(--audit-human-col-job);
    --audit-col-action: var(--audit-human-col-action);
    --audit-col-details: var(--audit-human-col-changes);
  }
  audit-log-page .audit-log-table thead .audit-date-cell {
    width: var(--audit-col-date);
  }
  audit-log-page .audit-log-table thead .audit-user-cell {
    width: var(--audit-col-user);
  }
  audit-log-page .audit-log-table thead .audit-entity-cell {
    width: var(--audit-col-entity);
  }
  audit-log-page .audit-log-table thead .audit-id-cell {
    width: var(--audit-col-item);
  }
  audit-log-page .audit-log-table thead .audit-action-cell {
    width: var(--audit-col-action);
  }
  audit-log-page .audit-log-table thead .audit-details-cell {
    width: var(--audit-col-details);
  }
  audit-log-page .audit-date-cell,
  audit-log-page .audit-user-cell,
  audit-log-page .audit-entity-cell,
  audit-log-page .audit-id-cell,
  audit-log-page .audit-action-cell,
  audit-log-page .audit-details-cell {
    width: auto;
    min-width: 0;
  }
}
@container audit-controls (max-width: 41.99rem) {
  audit-log-page .audit-controls-combined,
  audit-log-page .audit-filter-controls,
  audit-log-page .audit-filter-actions,
  audit-log-page .audit-utility-actions,
  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr);
  }

  audit-log-page .audit-date-range {
    grid-column: auto;
  }

  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  audit-log-page .audit-utility-actions,
  audit-log-page .audit-retention-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  audit-log-page #btnPruneLogs {
    min-inline-size: 0;
  }

  audit-log-page .audit-filter-controls .dropdown .btn,
  audit-log-page .audit-date-range-control,
  audit-log-page .audit-retention-group .form-control,
  audit-log-page .audit-retention-group .btn,
  audit-log-page .audit-prune-action {
    white-space: normal;
  }
}

@container audit-controls (min-width: 42rem) and (max-width: 67.99rem) {
  audit-log-page .audit-controls-combined,
  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 1fr);
  }

  audit-log-page .audit-filter-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  audit-log-page .audit-job-search {
    grid-column: 1 / -1;
  }

  audit-log-page .audit-date-range {
    grid-column: 1 / -1;
  }

  audit-log-page .audit-utility-actions,
  audit-log-page .audit-retention-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@container audit-controls (min-width: 68rem) {
  audit-log-page .audit-controls-combined {
    grid-template-columns: minmax(0, 1.38fr) minmax(0, 1.12fr);
    align-items: end;
  }

  audit-log-page .audit-filter-controls {
    grid-template-columns: minmax(14rem, 1.25fr) repeat(3, minmax(7.5rem, 0.85fr)) minmax(14rem, 1.25fr);
  }

  audit-log-page .audit-date-range {
    grid-column: auto;
  }

  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr) auto;
    align-items: end;
  }

  audit-log-page .audit-utility-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  audit-log-page #btnPruneLogs {
    width: auto;
  }
}

@media (width >= 1366px) and (width < 1920px) {
  audit-log-page .audit-controls-combined {
    grid-template-columns: minmax(0, 1.38fr) minmax(0, 1.12fr);
    align-items: end;
  }

  audit-log-page .audit-filter-controls {
    grid-template-columns: minmax(15rem, 1.25fr) repeat(3, minmax(8rem, 0.85fr)) minmax(15rem, 1.25fr);
  }

  audit-log-page .audit-date-range {
    grid-column: auto;
  }

  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr) auto;
    align-items: end;
  }

  audit-log-page .audit-utility-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@media (width >= 1920px), (min-width: 1920px) {
  audit-log-page .audit-controls-combined {
    grid-template-columns: minmax(0, 1.45fr) minmax(0, 1.2fr);
    align-items: end;
  }

  audit-log-page .audit-filter-controls {
    grid-template-columns: minmax(16rem, 1.25fr) repeat(3, minmax(8.5rem, 0.85fr)) minmax(16rem, 1.25fr);
  }

  audit-log-page .audit-date-range {
    grid-column: auto;
  }

  audit-log-page .audit-filter-actions {
    grid-template-columns: minmax(0, 0.88fr) minmax(0, 1.12fr) auto;
    align-items: end;
  }

  audit-log-page .audit-utility-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  audit-log-page .audit-retention-group {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}

@container audit-pagination (max-width: 37.99rem) {
  audit-log-page .workspace-pagination > div > :first-child {
    width: 100%;
    flex-wrap: wrap;
  }

  audit-log-page #itemsPerPageSelect,
  audit-log-page .workspace-pagination pagination-controls,
  audit-log-page .workspace-pagination .pagination-container,
  audit-log-page .workspace-pagination .pagination-container nav {
    width: 100%;
  }

  audit-log-page .workspace-pagination .pagination-container {
    flex-direction: column;
    align-items: stretch;
  }

  audit-log-page .workspace-pagination .pagination {
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@container audit-pagination (min-width: 38rem) {
  audit-log-page #itemsPerPageSelect {
    width: auto;
    min-width: clamp(5rem, 14cqi, 6.75rem);
  }

  audit-log-page .workspace-pagination > div > :first-child {
    flex-wrap: nowrap;
  }
}

@container table-cards (min-width: 60rem) {
  audit-log-page .audit-log-scroll {
    max-height: min(70vh, 42.5rem);
    overflow-y: auto;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards {
    max-height: min(70vh, 42.5rem);
    overflow-y: auto;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards table,
  audit-log-page .audit-log-scroll.table-responsive-cards .audit-log-table {
    display: table;
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards thead {
    display: table-header-group;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards tbody {
    display: table-row-group;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards tbody tr {
    display: table-row;
    box-shadow: none;
    background: transparent;
    border: 0;
    padding: 0;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards td,
  audit-log-page .audit-log-scroll.table-responsive-cards th {
    display: table-cell;
    padding: var(--space-2-5) var(--space-3);
    border-bottom: 1px solid var(--color-border-light);
    vertical-align: top;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards .table-card-label,
  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] .table-card-label {
    display: none;
  }

  audit-log-page .audit-log-scroll.table-responsive-cards td[data-card-title="true"] {
    font-weight: inherit;
  }

  audit-log-page .audit-log-table {
    --audit-col-date: 14%;
    --audit-col-user: 15%;
    --audit-col-entity: 10%;
    --audit-col-item: 15%;
    --audit-col-action: 18%;
    --audit-col-details: 28%;
  }
  audit-log-page .audit-human-table {
    --audit-col-date: var(--audit-human-col-date);
    --audit-col-user: var(--audit-human-col-actor);
    --audit-col-entity: var(--audit-human-col-source);
    --audit-col-item: var(--audit-human-col-job);
    --audit-col-action: var(--audit-human-col-action);
    --audit-col-details: var(--audit-human-col-changes);
  }
}

audit-log-page[data-date-inputs-open="true"] .audit-controls-combined {
  align-items: start;
}
audit-log-page[data-ui-state="submitting"] {
  cursor: progress;
}
audit-log-page[data-ui-state="submitting"] #btnPruneLogs,
audit-log-page[data-ui-state="submitting"] #btnUpdateRetention,
audit-log-page[data-ui-state="submitting"] #retentionDays {
  pointer-events: none;
}
audit-log-page .audit-log-table tbody tr.audit-row-highlight {
  outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.55);
  outline-offset: -2px;
  background: rgba(var(--color-brand-primary-rgb), 0.12);
  transition: background-color 180ms ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  audit-log-page .audit-log-table tbody tr.audit-row-highlight {
    transition: none;
  }
}
location-picker {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.location-picker-map-shell {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border-radius: var(--radius-2xl);
  overflow: hidden;
  isolation: isolate;
}
.location-picker-map {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.cq-map {
  width: 100%;
  height: var(--map-height, 400px);
  min-height: var(--map-height, 400px);
}
.location-picker-map iframe,
.location-picker-map img {
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
.map-instructions {
  z-index: var(--z-local-raised);
  pointer-events: none;
  max-width: min(100%, 20rem);
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
@media (width < 768px) {
  .location-picker-map :is(button[aria-label="Keyboard shortcuts"], button[title="Keyboard shortcuts"]) {
    right: var(--space-2);
    bottom: var(--space-2);
    transform: none;
  }
}
@media (width >= 768px) and (width < 1366px) {
  .location-picker-map :is(button[aria-label="Keyboard shortcuts"], button[title="Keyboard shortcuts"]) {
    right: var(--space-2);
    bottom: var(--space-2);
    transform: none;
  }
}
.location-picker-marker {
  width: max(var(--touch-target-min), 2.75rem);
  height: max(var(--touch-target-min), 2.75rem);
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  border-radius: var(--radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(var(--color-brand-primary-rgb), 0.82);
  background: rgba(var(--color-white-rgb), 0.92);
  box-shadow: var(--shadow-lg);
  cursor: grab;
  touch-action: none;
}
.location-picker-marker:active {
  cursor: grabbing;
}
.location-picker-marker-core {
  width: 0.875rem;
  height: 0.875rem;
  border-radius: var(--radius-pill);
  background: var(--color-brand-primary-700);
  box-shadow: 0 0 0 0.2rem rgba(var(--color-brand-primary-rgb), 0.22);
}
#jobEditModal .modal-dialog,
#jobEditModal .modal-content,
#jobEditModal #jobEditForm,
#jobEditModal #jobEditForm > .row,
#jobEditModal #jobEditForm > .row > [class*="col-"] {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
#jobEditModal .modal-dialog {
  margin: 0;
}
#jobEditModal .modal-content {
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  isolation: isolate;
}
#jobEditModal .modal-header,
#jobEditModal .modal-body,
#jobEditModal .modal-footer {
  background-color: var(--bs-body-bg);
}
#jobEditModal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-bottom: var(--space-8);
}
#jobEditModal .modal-footer {
  align-items: center;
  gap: var(--space-2);
}
#jobEditModal .job-edit-footer-status {
  flex: 1 1 16rem;
  min-width: 0;
  margin-inline-end: auto;
  overflow-wrap: break-word;
}
#jobEditModal .job-edit-sections {
  display: grid;
  gap: var(--space-4);
}
#jobEditModal .job-edit-section {
  min-width: 0;
  margin: 0 0 var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--bs-border-color);
  border-radius: var(--radius-lg);
  background: var(--bs-body-bg);
}
#jobEditModal .job-edit-section legend {
  float: none;
  width: auto;
  margin: 0 0 var(--space-3);
  padding: 0;
  color: var(--bs-secondary-color);
  font-size: var(--font-size-sm);
  font-weight: 700;
  text-transform: uppercase;
}
#jobEditModal .job-lead-header-metadata {
  background: var(--bs-light);
  border: 1px solid var(--bs-border-color);
  border-radius: var(--radius-md, 8px);
  display: grid;
  gap: var(--space-2);
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
  margin: 0;
  padding: var(--space-3);
}
#jobEditModal .job-lead-header-metadata-item {
  min-width: 0;
}
#jobEditModal .job-lead-header-metadata dt {
  color: var(--bs-secondary-color);
  font-size: var(--font-size-xs, 0.75rem);
  font-weight: 700;
  margin: 0 0 0.15rem;
}
#jobEditModal .job-lead-header-metadata dd {
  color: var(--bs-body-color);
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: 700;
  margin: 0;
  overflow-wrap: break-word;
}
#jobEditModal .job-edit-section textarea {
  resize: vertical;
}
#jobEditModal .job-edit-location {
  --map-height: var(--height-map-md);
}
#jobEditModal .job-edit-location .location-picker-map-shell {
  border-radius: var(--radius-2xl);
}
#jobEditModal .job-edit-location :is(input, button, .btn) {
  min-height: max(var(--touch-target-min), 48px);
}
#jobEditModal #editMapLinks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  min-width: 0;
}
#jobEditModal #editMapLinks > * {
  min-width: 0;
}
#jobEditModal #editMapLinks a {
  display: inline-flex;
  align-items: center;
  height: var(--touch-target-min);
  min-height: var(--touch-target-min);
  padding-inline: var(--space-2);
  border-radius: var(--radius-lg);
}
#jobEditModal .form-check {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: max(var(--touch-target-min), 48px);
}
#jobEditModal .form-check-input {
  width: max(var(--touch-target-min), 48px);
  height: max(var(--touch-target-min), 48px);
  min-width: max(var(--touch-target-min), 48px);
  min-height: max(var(--touch-target-min), 48px);
  margin-top: 0;
  flex: 0 0 max(var(--touch-target-min), 48px);
}
#jobEditModal #btnSaveJob,
#jobEditModal .modal-footer .btn {
  height: max(var(--touch-target-min), 48px);
  min-height: max(var(--touch-target-min), 48px);
}
@media (width < 768px) {
  #jobEditModal {
    padding: 0;
    background-color: var(--bs-body-bg);
  }
  #jobEditModal .modal-dialog {
    background-color: var(--bs-body-bg);
    width: 100%;
    max-width: none;
    height: var(--app-viewport-height);
    margin: 0;
    min-height: var(--app-viewport-height);
  }
  #jobEditModal .modal-content {
    height: 100%;
    min-height: var(--app-viewport-height);
    max-height: var(--app-viewport-height);
    border-radius: 0;
    box-shadow: none;
  }
  #jobEditModal .modal-header {
    padding-top: max(var(--space-3), env(safe-area-inset-top));
  }
  #jobEditModal .modal-body {
    padding: calc(var(--space-3) + var(--space-2)) var(--space-3) calc(var(--space-3) + env(safe-area-inset-bottom));
    scroll-padding-bottom: calc(11rem + env(safe-area-inset-bottom));
  }
  #jobEditModal .job-edit-section {
    padding: var(--space-3);
  }
  #jobEditModal .job-edit-sections > .job-edit-section:first-child {
    margin-top: var(--space-3);
  }
  #jobEditModal .job-lead-header-disclosure > summary {
    cursor: pointer;
    min-height: var(--touch-target-min);
    padding-block: var(--space-1);
  }
  #jobEditModal .job-lead-header-disclosure > summary:focus-visible {
    outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.5);
    outline-offset: 2px;
  }
  #jobEditModal #editMapLinks {
    flex-direction: column;
    align-items: flex-start;
  }
  #jobEditModal #editMapLinks a {
    width: 100%;
    justify-content: flex-start;
  }
  #jobEditModal #btnSaveJob,
  #jobEditModal .modal-footer .btn {
    width: 100%;
  }
  #jobEditModal .modal-footer {
    align-items: stretch;
    padding-bottom: max(var(--space-3), env(safe-area-inset-bottom));
  }
  #jobEditModal .job-edit-footer-status {
    flex-basis: auto;
    width: 100%;
  }
}
@media (width >= 768px) and (width < 1366px) {
  #jobEditModal .modal-dialog {
    width: min(calc(100vw - var(--space-6)), 46rem);
    max-width: calc(100vw - var(--space-6));
    block-size: calc(100dvh - var(--space-8));
    margin: var(--space-4) auto;
    margin-block: var(--space-4);
    min-block-size: 0;
  }
  #jobEditModal .modal-content {
    block-size: 100%;
    max-height: 100%;
  }
  #jobEditModal .modal-body {
    padding: var(--space-4);
  }
  #jobEditModal #jobEditForm > .row {
    row-gap: var(--space-3);
  }
}
@media (width >= 1366px) and (width < 1920px) {
  #jobEditModal .modal-dialog {
    width: min(calc(100vw - var(--space-8)), 78rem);
    max-width: calc(100vw - var(--space-8));
    margin: var(--space-5) auto;
  }
  #jobEditModal .modal-content {
    max-height: calc(100dvh - var(--space-10));
  }
  #jobEditModal .modal-body {
    padding: var(--space-4);
  }
  #jobEditModal #jobEditForm > .row {
    row-gap: var(--space-4);
  }
  #jobEditModal .job-edit-location {
    --map-height: clamp(18rem, 30vh, 24rem);
  }
}
@media (width >= 1920px) {
  #jobEditModal .modal-dialog {
    width: min(calc(100vw - var(--space-10)), 88rem);
    max-width: calc(100vw - var(--space-10));
    margin: var(--space-6) auto;
  }
  #jobEditModal .modal-content {
    max-height: calc(100dvh - var(--space-12));
  }
  #jobEditModal .modal-body {
    padding: var(--space-5);
  }
  #jobEditModal #jobEditForm > .row {
    row-gap: var(--space-4);
  }
  #jobEditModal .job-edit-location {
    --map-height: clamp(20rem, 32vh, 26rem);
  }
}
.app-action-dialog-modal .modal-dialog,
.job-action-dialog-modal .modal-dialog,
.app-action-dialog-modal .modal-content,
.job-action-dialog-modal .modal-content {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.app-action-dialog-modal .modal-content,
.job-action-dialog-modal .modal-content {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.app-action-dialog-content > form,
.job-action-dialog-modal .modal-content > form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-block-size: 0;
  min-inline-size: 0;
}
.app-action-dialog-body,
.job-action-dialog-body {
  flex: 1 1 auto;
  min-block-size: 0;
  min-width: 0;
  overscroll-behavior: contain;
}
.app-action-dialog-footer,
.job-action-dialog-footer {
  flex: 0 0 auto;
  gap: var(--space-2);
}
.app-action-dialog-footer .btn,
.job-action-dialog-footer .btn,
.app-action-dialog-body :is(input, select, textarea),
.job-action-dialog-body :is(input, select, textarea) {
  min-height: max(var(--touch-target-min), 48px);
  min-block-size: max(var(--touch-target-min), 48px);
}
.app-action-dialog-modal .app-action-dialog-footer .dialog-action-btn,
.job-action-dialog-modal .job-action-dialog-footer .dialog-action-btn {
  min-height: max(var(--touch-target-min), 48px);
  min-block-size: max(var(--touch-target-min), 48px);
}
.job-action-dialog-body #suggestBtn,
.app-action-dialog-body #suggestBtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: max(var(--touch-target-min), 48px);
  padding-block: var(--space-1);
  padding-inline: var(--space-2);
  line-height: 1.2;
}
.job-action-dialog-body .position-relative {
  min-width: 0;
}
.lead-finance-status-row {
  align-items: center;
  border: 1px solid var(--bs-border-color);
  border-radius: var(--radius-lg);
  display: grid;
  gap: var(--space-2);
  grid-template-columns: minmax(0, 1.1fr) minmax(8rem, 0.9fr);
  margin-block: 0 0.5rem;
  min-inline-size: 0;
  padding: var(--space-2);
}
.lead-finance-status-row:last-child {
  margin-block-end: 0;
}
.lead-finance-status-check {
  align-items: center;
  display: inline-flex;
  gap: var(--space-2);
  min-block-size: max(var(--touch-target-min), 48px);
  min-inline-size: 0;
}
.lead-finance-status-check > span {
  min-inline-size: 0;
  overflow-wrap: break-word;
}
.lead-finance-status-row .form-control {
  min-inline-size: 0;
}
.app-action-dialog-body .job-code-input .job-code-prefix {
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
  background: var(--color-surface);
}
.app-action-dialog-body .job-code-input input {
  text-transform: uppercase;
  letter-spacing: var(--tracking-wide);
}
@media (width < 768px) {
  .app-action-dialog-modal .modal-dialog,
  .job-action-dialog-modal .modal-dialog {
    width: 100%;
    max-width: none;
    margin: 0;
    height: min(var(--app-viewport-height), 100dvh);
    min-height: min(var(--app-viewport-height), 100dvh);
  }
  .app-action-dialog-modal .modal-content,
  .job-action-dialog-modal .modal-content {
    height: 100%;
    max-height: min(var(--app-viewport-height), 100dvh);
    min-height: 100%;
    border-radius: 0;
  }
  .app-action-dialog-body,
  .job-action-dialog-body {
    padding: var(--space-3);
    overflow-y: auto;
  }
  .lead-finance-status-row {
    grid-template-columns: 1fr;
  }
  .app-action-dialog-footer .btn,
  .job-action-dialog-footer .btn {
    width: 100%;
  }
  .job-action-dialog-body #suggestBtn {
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: var(--space-2);
  }
}
@media (width >= 768px) and (width < 1366px) {
  .app-action-dialog-modal .modal-dialog,
  .job-action-dialog-modal .modal-dialog {
    width: min(calc(100vw - var(--space-6)), 42rem);
    max-width: calc(100vw - var(--space-6));
    height: calc(100dvh - var(--space-8));
    min-height: 0;
    margin: var(--space-4) auto;
  }
  .app-action-dialog-modal .modal-content,
  .job-action-dialog-modal .modal-content {
    max-height: calc(100dvh - var(--space-8));
  }
  .app-action-dialog-body,
  .job-action-dialog-body {
    padding: var(--space-4);
    overflow-y: auto;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  .app-action-dialog-modal .modal-dialog,
  .job-action-dialog-modal .modal-dialog {
    width: min(calc(100vw - var(--space-8)), 46rem);
    max-width: calc(100vw - var(--space-8));
    margin: var(--space-5) auto;
  }
  .app-action-dialog-modal .modal-content,
  .job-action-dialog-modal .modal-content {
    max-height: calc(100dvh - var(--space-10));
  }
  .app-action-dialog-body,
  .job-action-dialog-body {
    padding: var(--space-4);
    overflow-y: auto;
  }
}
@media (width >= 1920px) {
  .app-action-dialog-modal .modal-dialog,
  .job-action-dialog-modal .modal-dialog {
    width: min(calc(100vw - var(--space-10)), 48rem);
    max-width: calc(100vw - var(--space-10));
    margin: var(--space-6) auto;
  }
  .app-action-dialog-modal .modal-content,
  .job-action-dialog-modal .modal-content {
    max-height: calc(100dvh - var(--space-12));
  }
  .app-action-dialog-body,
  .job-action-dialog-body {
    padding: var(--space-5);
    overflow-y: auto;
  }
}
.btn-edit-input,
.btn-edit-design-info,
.action-chip.btn-edit-input,
.action-chip.btn-edit-design-info {
  background: var(--action-edit-input, var(--color-brand-primary-700));
  border-color: var(--action-edit-input, var(--color-brand-primary-700));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-edit-input:hover,
.btn-edit-input:focus,
.btn-edit-design-info:hover,
.btn-edit-design-info:focus {
  background: var(--action-edit-input-hover, var(--color-brand-primary-700));
  border-color: var(--action-edit-input-hover, var(--color-brand-primary-700));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-export-pdf {
  background: var(--action-export-pdf, var(--color-text-secondary));
  border-color: var(--action-export-pdf, var(--color-text-secondary));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-export-pdf:hover,
.btn-export-pdf:focus {
  background: var(--action-export-pdf-hover, var(--color-text-secondary));
  border-color: var(--action-export-pdf-hover, var(--color-text-secondary));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-edit-output,
.action-chip.btn-edit-output {
  background: var(--action-edit-output, var(--color-info));
  border-color: var(--action-edit-output, var(--color-info));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-edit-output:hover,
.btn-edit-output:focus {
  background: var(--action-edit-output-hover, var(--color-info));
  border-color: var(--action-edit-output-hover, var(--color-info));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-assign-designer,
.action-chip.btn-assign-designer {
  background: var(--action-assign-designer, var(--app-palette-teal));
  border-color: var(--action-assign-designer, var(--app-palette-teal));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-assign-designer:hover,
.btn-assign-designer:focus {
  background: var(--action-assign-designer-hover, var(--app-palette-teal));
  border-color: var(--action-assign-designer-hover, var(--app-palette-teal));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reassign-designer,
.action-chip.btn-reassign-designer {
  background: var(--action-reassign-designer, var(--color-info));
  border-color: var(--action-reassign-designer, var(--color-info));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reassign-designer:hover,
.btn-reassign-designer:focus {
  background: var(--action-reassign-designer-hover, var(--color-info));
  border-color: var(--action-reassign-designer-hover, var(--color-info));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reassign-sales,
.action-chip.btn-reassign-sales {
  background: var(--action-reassign-sales, var(--color-warning));
  border-color: var(--action-reassign-sales, var(--color-warning));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reassign-sales:hover,
.btn-reassign-sales:focus {
  background: var(--action-reassign-sales-hover, var(--color-warning));
  border-color: var(--action-reassign-sales-hover, var(--color-warning));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reassign-sales:disabled,
.btn-reassign-sales.disabled {
  background: color-mix(in oklch, var(--action-reassign-sales, var(--color-warning)), var(--bs-secondary, var(--color-text-secondary)) 34%);
  border-color: color-mix(in oklch, var(--action-reassign-sales, var(--color-warning)), var(--bs-secondary, var(--color-text-secondary)) 34%);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-unlink-job,
.action-chip.btn-unlink-job {
  background: var(--action-unlink-job, var(--color-danger));
  border-color: var(--action-unlink-job, var(--color-danger));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-unlink-job:hover,
.btn-unlink-job:focus,
.btn-unlink-job:active {
  background: var(--action-unlink-job-hover, var(--color-danger));
  border-color: var(--action-unlink-job-hover, var(--color-danger));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-unlink-job:disabled,
.btn-unlink-job.disabled {
  background: color-mix(in oklch, var(--action-unlink-job, var(--color-danger)), var(--bs-secondary, var(--color-text-secondary)) 34%);
  border-color: color-mix(in oklch, var(--action-unlink-job, var(--color-danger)), var(--bs-secondary, var(--color-text-secondary)) 34%);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-insufficient,
.action-chip.btn-insufficient {
  background: var(--action-insufficient);
  border-color: var(--action-insufficient);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-insufficient:hover,
.btn-insufficient:focus {
  background: var(--action-insufficient-hover);
  border-color: var(--action-insufficient-hover);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-hold,
.action-chip.btn-hold {
  background: var(--action-hold, var(--app-palette-yellow));
  border-color: var(--app-palette-navy);
  color: var(--on-hold, var(--app-palette-navy));
}
.btn-hold:hover,
.btn-hold:focus {
  background: var(--action-hold-hover, color-mix(in srgb, var(--app-palette-yellow) 72%, var(--app-palette-dark-grey)));
  border-color: var(--app-palette-navy);
  color: var(--on-hold, var(--app-palette-navy));
}
.btn-complete,
.action-chip.btn-complete {
  background: var(--action-complete, var(--color-success));
  border-color: var(--action-complete, var(--color-success));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-complete:hover,
.btn-complete:focus {
  background: var(--action-complete-hover, var(--color-success));
  border-color: var(--action-complete-hover, var(--color-success));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reinstate,
.action-chip.btn-reinstate {
  background: var(--action-reinstate);
  border-color: var(--action-reinstate);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-reinstate:hover,
.btn-reinstate:focus {
  background: var(--action-reinstate-hover);
  border-color: var(--action-reinstate-hover);
  color: var(--color-text-inverse, var(--color-white));
}
.btn-cancel,
.action-chip.btn-cancel {
  background: var(--action-cancel, var(--app-palette-dark-grey));
  border-color: var(--action-cancel, var(--app-palette-dark-grey));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-cancel:hover,
.btn-cancel:focus {
  background: var(--action-cancel-hover, var(--color-danger));
  border-color: var(--action-cancel-hover, var(--color-danger));
  color: var(--color-text-inverse, var(--color-white));
}
.btn-contract-award,
.action-chip.btn-contract-award {
  background: var(--action-contract-award);
  border-color: var(--action-contract-award);
  color: var(--on-contract-award, var(--color-text-inverse, var(--color-white)));
}
.btn-contract-award:hover,
.btn-contract-award:focus {
  background: var(--action-contract-award-hover);
  border-color: var(--action-contract-award-hover);
  color: var(--on-contract-award, var(--color-text-inverse, var(--color-white)));
}
.btn-arrange-schedule,
.action-chip.btn-arrange-schedule {
  background: var(--action-arrange-schedule);
  border-color: var(--action-arrange-schedule);
  color: var(--on-arrange-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-arrange-application,
.action-chip.btn-arrange-application {
  background: var(--action-arrange-application);
  border-color: var(--action-arrange-application);
  color: var(--on-arrange-application, var(--color-text-inverse, var(--color-white)));
}
.btn-arrange-application:hover,
.btn-arrange-application:focus {
  background: var(--action-arrange-application-hover);
  border-color: var(--action-arrange-application-hover);
  color: var(--on-arrange-application, var(--color-text-inverse, var(--color-white)));
}
.btn-arrange-schedule:hover,
.btn-arrange-schedule:focus {
  background: var(--action-arrange-schedule-hover);
  border-color: var(--action-arrange-schedule-hover);
  color: var(--on-arrange-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-rearrange-schedule,
.action-chip.btn-rearrange-schedule {
  background: var(--action-rearrange-schedule);
  border-color: var(--action-rearrange-schedule);
  color: var(--on-rearrange-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-rearrange-schedule:hover,
.btn-rearrange-schedule:focus {
  background: var(--action-rearrange-schedule-hover);
  border-color: var(--action-rearrange-schedule-hover);
  color: var(--on-rearrange-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-cancel-schedule,
.action-chip.btn-cancel-schedule {
  background: var(--action-cancel-schedule);
  border-color: var(--action-cancel-schedule);
  color: var(--on-cancel-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-cancel-schedule:hover,
.btn-cancel-schedule:focus {
  background: var(--action-cancel-schedule-hover);
  border-color: var(--action-cancel-schedule-hover);
  color: var(--on-cancel-schedule, var(--color-text-inverse, var(--color-white)));
}
.btn-submit-document,
.action-chip.btn-submit-document {
  background: var(--action-submit-document);
  border-color: var(--action-submit-document);
  color: var(--on-submit-document, var(--color-text-inverse, var(--color-white)));
}
.btn-submit-document:hover,
.btn-submit-document:focus {
  background: var(--action-submit-document-hover);
  border-color: var(--action-submit-document-hover);
  color: var(--on-submit-document, var(--color-text-inverse, var(--color-white)));
}
.btn-resubmit-document,
.action-chip.btn-resubmit-document {
  background: var(--action-resubmit-document);
  border-color: var(--action-resubmit-document);
  color: var(--on-resubmit-document, var(--color-text-inverse, var(--color-white)));
}
.btn-resubmit-document:hover,
.btn-resubmit-document:focus {
  background: var(--action-resubmit-document-hover);
  border-color: var(--action-resubmit-document-hover);
  color: var(--on-resubmit-document, var(--color-text-inverse, var(--color-white)));
}
.btn-cancel-application,
.action-chip.btn-cancel-application {
  background: var(--action-cancel-application);
  border-color: var(--action-cancel-application);
  color: var(--on-cancel-application, var(--color-text-inverse, var(--color-white)));
}
.btn-cancel-application:hover,
.btn-cancel-application:focus {
  background: var(--action-cancel-application-hover);
  border-color: var(--action-cancel-application-hover);
  color: var(--on-cancel-application, var(--color-text-inverse, var(--color-white)));
}
.btn-design-details,
.action-chip.btn-design-details {
  background: var(--action-design-details);
  border-color: var(--action-design-details);
  color: var(--on-design-details, var(--color-text-inverse, var(--color-white)));
}
.btn-design-details:hover,
.btn-design-details:focus {
  background: var(--action-design-details-hover);
  border-color: var(--action-design-details-hover);
  color: var(--on-design-details, var(--color-text-inverse, var(--color-white)));
}
.btn-convert-as-built,
.action-chip.btn-convert-as-built {
  background: var(--action-convert-as-built);
  border-color: var(--action-convert-as-built);
  color: var(--on-convert-as-built, var(--color-text-inverse, var(--color-white)));
}
.btn-convert-as-built:hover,
.btn-convert-as-built:focus {
  background: var(--action-convert-as-built-hover);
  border-color: var(--action-convert-as-built-hover);
  color: var(--on-convert-as-built, var(--color-text-inverse, var(--color-white)));
}
.btn-admin-backward,
.action-chip.btn-admin-backward {
  background: var(--action-admin-backward, var(--app-palette-yellow));
  border-color: var(--app-palette-navy);
  color: var(--on-admin-backward, var(--app-palette-navy));
}
.btn-admin-backward:hover,
.btn-admin-backward:focus {
  background: var(--action-admin-backward-hover, color-mix(in srgb, var(--app-palette-yellow) 72%, var(--app-palette-dark-grey)));
  border-color: var(--app-palette-navy);
  color: var(--on-admin-backward, var(--app-palette-navy));
}
.btn-sales-details {
  background: transparent;
  border: 1px solid var(--action-sales-details, var(--app-palette-navy));
  color: var(--app-palette-navy);
}
.btn-sales-details:hover,
.btn-sales-details:focus {
  background: var(--app-palette-navy);
  border-color: var(--app-palette-navy);
  color: var(--app-palette-snow);
}
.table-responsive .table {
  table-layout: auto;
  width: 100%;
}
.table-responsive .table th,
.table-responsive .table td {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
@media (width >= 768px) {
  .table-responsive {
    border-radius: var(--radius-xl);
    border: 1px solid var(--color-border-light);
  }
  .table-responsive .table {
    border-radius: inherit;
    table-layout: fixed;
    white-space: nowrap;
  }
  .table-responsive .table th,
  .table-responsive .table td {
    overflow-wrap: normal;
    word-break: normal;
  }
}
.session-warning-modal {
  display: grid;
  place-items: center;
  padding: max(var(--space-3), env(safe-area-inset-top)) max(var(--space-3), env(safe-area-inset-right)) max(var(--space-3), env(safe-area-inset-bottom)) max(var(--space-3), env(safe-area-inset-left));
  background: var(--color-surface-overlay);
  z-index: var(--z-modal);
}
.session-warning-modal .modal-dialog,
.session-warning-modal .modal-content {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}
.session-warning-modal .modal-dialog {
  margin: 0;
  pointer-events: auto;
}
.session-warning-modal .modal-content {
  border-radius: var(--radius-2xl);
  overflow: hidden;
}
.session-warning-modal .modal-header,
.session-warning-modal .modal-body,
.session-warning-modal .modal-footer {
  padding-inline: var(--space-4);
}
.session-warning-modal .modal-body {
  padding-block: var(--space-4);
}
.session-warning-modal .modal-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-2);
}
.session-warning-modal .modal-footer .btn {
  width: 100%;
  min-height: var(--touch-target-min);
}
.session-warning-modal #sessionCountdown {
  line-height: 1;
  overflow-wrap: break-word;
}
@media (width < 768px) {
  .session-warning-modal .modal-dialog {
    width: min(100%, calc(100vw - (var(--space-3) * 2)));
    max-height: calc(var(--app-viewport-height) - (var(--space-3) * 2));
  }
  .session-warning-modal .modal-content {
    max-height: calc(var(--app-viewport-height) - (var(--space-3) * 2));
  }
  .session-warning-modal .modal-body {
    padding-block: var(--space-3);
  }
  .session-warning-modal #sessionCountdown {
    font-size: clamp(2rem, 12vw, 3rem);
  }
}
@media (width >= 768px) and (width < 1366px) {
  .session-warning-modal .modal-dialog {
    width: min(100%, 32rem);
  }
  .session-warning-modal .modal-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (width >= 1366px) and (width < 1920px) {
  .session-warning-modal .modal-dialog {
    width: min(100%, 30rem);
  }
  .session-warning-modal .modal-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (width >= 1920px) {
  .session-warning-modal .modal-dialog {
    width: min(100%, 32rem);
  }
  .session-warning-modal .modal-footer {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
pagination-controls {
  display: block;
  width: 100%;
}
.pagination-container {
  flex-direction: column;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: var(--space-2);
}
.pagination-container nav {
  width: 100%;
  min-width: 0;
}
.pagination {
  flex-wrap: wrap;
  justify-content: flex-start;
}
.pagination-container.pagination-container--compact {
  align-items: stretch;
}
.pagination-container.pagination-container--compact > small {
  width: 100%;
  text-align: center;
}
.pagination-container.pagination-container--compact .pagination {
  justify-content: center;
}
.page-link {
  padding: var(--space-1-5) var(--space-2);
}
@media (width >= 768px) {
  .pagination-container {
    flex-direction: row;
    align-items: center;
  }
  .pagination-container nav {
    width: auto;
  }
}
job-list .jobs-filter-bar {
  position: relative;
  z-index: var(--z-dropdown-floating);
  overflow: visible;
  margin: 0 0 var(--jobs-filter-block-gap);
}
job-list {
  --jobs-tabs-filter-gap: var(--space-0-75);
  --jobs-filter-block-gap: var(--space-2);
  --jobs-list-min-height: clamp(18rem, 46vh, 30rem);
}
job-list .jobs-filter-note-row {
  justify-content: flex-start;
  line-height: 1.5;
  max-width: 100%;
}
job-list .jobs-bulk-actions {
  position: relative;
  z-index: var(--z-dropdown-floating);
  margin: 0 0 var(--jobs-filter-block-gap);
}
job-list .jobs-bulk-actions__layout,
job-list .jobs-bulk-actions__summary,
job-list .jobs-bulk-actions__buttons {
  min-width: 0;
}
job-list .jobs-col-select {
  width: calc(var(--touch-target-min) + var(--space-1));
  min-width: calc(var(--touch-target-min) + var(--space-1));
  text-align: center;
  vertical-align: middle;
}
job-list .jobs-col-select .form-check-input {
  display: block;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  margin: 0 auto;
  cursor: pointer;
}
job-list .col-hidden {
  display: none;
}
job-list .cq-card,
job-list .cq-card * {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: auto;
}
job-list #columnChooserMenu {
  z-index: var(--z-tooltip);
  right: 0;
  left: auto;
  min-width: var(--width-max-xs);
  max-width: min(320px, calc(100vw - var(--space-6, 1.5rem)));
}
job-list #jobListContainer {
  min-height: var(--jobs-list-min-height);
}
job-list #jobListContainer.virtual-table {
  overflow-y: auto;
}
job-list #jobListContainer:not(.virtual-table) {
  min-height: 0;
  overflow-y: visible;
}
job-list .job-row-clickable {
  cursor: pointer;
}
job-list .dropdown-menu .dropdown-item {
  min-height: var(--touch-target-min);
  display: flex;
  align-items: center;
}
job-list .jobs-date-range {
  min-width: 0;
  max-width: 100%;
  flex: 1 1 220px;
}
job-list .jobs-code-scope .btn {
  padding: var(--space-1) var(--space-2);
  font-size: var(--font-size-xs);
  line-height: 1.1;
  letter-spacing: var(--tracking-2xs);
  white-space: nowrap;
  min-width: var(--touch-target-min);
}
job-list .jobs-code-scope .btn:focus-visible {
  outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.4);
  outline-offset: 2px;
}
job-list .date-range-pill {
  --job-date-input-reserve: 10ch;
  display: grid;
  grid-template-columns: minmax(var(--job-date-input-reserve), 1fr) auto minmax(var(--job-date-input-reserve), 1fr);
  align-items: center;
  gap: var(--space-1);
  padding: 0 var(--space-1);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  background: var(--glass-bg-light);
  min-height: var(--touch-target-min);
  min-width: 0;
  width: 100%;
  overflow: hidden;
}
job-list .date-range-pill:focus-within {
  border-color: rgba(var(--color-brand-primary-rgb), 0.4);
  box-shadow: 0 0 0 2px rgba(var(--color-brand-primary-rgb), 0.12);
  background: var(--job-panel);
}
job-list .date-range-pill .form-control {
  border: 0;
  background: transparent;
  padding: var(--space-1-5) 0;
  min-height: var(--touch-target-min);
  min-inline-size: var(--job-date-input-reserve);
  box-shadow: none;
  min-width: var(--job-date-input-reserve);
  width: 100%;
  font-size: var(--font-size-sm);
  line-height: 1.1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
job-list .date-range-sep {
  font-size: var(--font-size-xs);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--color-text-muted);
}
job-list .jobs-col-tablet,
job-list .jobs-col-laptop {
  display: none;
}
job-list .table-responsive-cards .jobs-col-tablet,
job-list .table-responsive-cards .jobs-col-laptop {
  display: flex;
}
job-list .jobs-filter-grid {
  flex-direction: column;
  align-items: stretch;
  gap: var(--space-1);
}
job-list .jobs-filter-grid > * {
  width: 100%;
  position: relative;
  z-index: var(--z-local-raised);
}
job-list .jobs-filter-grid > *:focus-within {
  z-index: var(--z-select-surface);
}
job-list .jobs-filter-bar .btn-group {
  width: 100%;
}
job-list .jobs-filter-bar .btn-group:not(.jobs-category-tabs) .btn {
  flex: 1 1 0;
}
job-list .jobs-filter-bar .btn-group.jobs-category-tabs {
  width: auto;
  flex: 0 0 auto;
}
job-list .jobs-filter-bar .btn-group.jobs-category-tabs .btn {
  flex: 0 0 auto;
}
job-list .jobs-filter-bar .form-select,
job-list .jobs-filter-bar .form-control,
job-list .jobs-filter-bar .btn,
job-list .jobs-filter-bar .btn-group .btn {
  min-height: var(--touch-target-min);
}
job-list .jobs-bulk-actions .btn {
  min-height: var(--touch-target-min);
}
job-list .jobs-bulk-actions .form-check-input {
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
}
job-list .jobs-code-scope .btn {
  font-size: var(--font-size-xs);
  padding: var(--space-1) var(--space-1-5);
}
job-list #categoryTabs .nav-link {
  min-height: var(--touch-target-min);
  display: inline-flex;
  align-items: center;
}
job-list .jobs-date-range {
  width: 100%;
  flex: 0 0 auto;
  height: auto;
}
job-list .date-range-pill .form-control {
  font-size: var(--font-size-sm);
}
@media (width >= 768px) {
  job-list .table-responsive-cards {
    overflow-x: auto;
    overflow-y: visible;
  }
  job-list .table-responsive-cards .table,
  job-list .table-responsive-cards .jobs-table {
    display: table;
    width: 100%;
    min-width: 100%;
    table-layout: fixed;
  }
  job-list .table-responsive-cards thead {
    display: table-header-group;
  }
  job-list .table-responsive-cards tbody {
    display: table-row-group;
  }
  job-list .table-responsive-cards tr,
  job-list .table-responsive-cards tr.table-card-full {
    display: table-row;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    transform: none;
  }
  job-list .table-responsive-cards td,
  job-list .table-responsive-cards th,
  job-list .table-responsive-cards tr.table-card-full td,
  job-list .table-responsive-cards tr.table-card-full th {
    display: table-cell;
    padding: var(--space-3) var(--space-3-5);
    vertical-align: top;
    border-bottom: 1px solid var(--color-border-light);
    text-align: left;
  }
  job-list .table-responsive-cards td[data-card-title="true"] {
    justify-content: initial;
    font-weight: inherit;
  }
  job-list .table-responsive-cards .table-card-label,
  job-list .table-responsive-cards td::before,
  job-list .table-responsive-cards th::before {
    display: none;
  }
}
@media (width >= 768px) and (width < 1366px) {
  job-list {
    --jobs-tabs-filter-gap: var(--space-1);
    --jobs-filter-block-gap: var(--space-2);
    --jobs-list-min-height: clamp(20rem, 48vh, 34rem);
  }
  job-list .table-responsive-cards .jobs-col-tablet {
    display: table-cell;
  }
  job-list .table-responsive-cards .jobs-col-laptop {
    display: none;
  }
  job-list .jobs-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: var(--space-2);
  }
  job-list .jobs-filter-grid > * {
    min-width: 0;
    width: 100%;
  }
  job-list .jobs-filter-grid > .jobs-filter-field--code,
  job-list .jobs-filter-grid > .jobs-filter-field--date,
  job-list .jobs-filter-grid > .jobs-filter-field--note,
  job-list .jobs-filter-grid > .w-100 {
    grid-column: 1 / -1;
  }
  job-list .jobs-filter-bar .btn-group {
    width: 100%;
  }
  job-list .jobs-date-range {
    width: 100%;
    flex: 0 0 auto;
  }
  job-list .date-range-pill .form-control {
    font-size: var(--font-size-sm);
  }
  job-list .glass-table th,
  job-list .glass-table td {
    padding: var(--space-3) var(--space-3-5);
  }
}
@media (width >= 1366px) and (width < 1920px) {
  job-list {
    --jobs-tabs-filter-gap: var(--space-1);
    --jobs-filter-block-gap: var(--space-2);
    --jobs-list-min-height: clamp(22rem, 52vh, 38rem);
  }
  job-list .table-responsive-cards .jobs-col-tablet {
    display: table-cell;
  }
  job-list .jobs-table th[data-col="category"] {
    min-width: 10rem;
    white-space: nowrap;
    overflow-wrap: normal;
    word-break: normal;
  }
  job-list .jobs-table td[data-col="category"] {
    min-width: 10rem;
  }
  job-list .table-responsive-cards .jobs-col-laptop {
    display: table-cell;
  }
  job-list .jobs-filter-grid {
    display: grid;
    grid-template-columns:
      minmax(0, 0.68fr)
      minmax(0, 1.08fr)
      minmax(0, 1.08fr)
      minmax(0, 0.92fr)
      minmax(0, 1.5fr)
      minmax(0, 0.88fr);
    align-items: end;
    gap: var(--space-3);
  }
  job-list .jobs-filter-grid > * {
    min-width: 0;
    width: 100%;
  }
  job-list .jobs-filter-grid > .minw-140,
  job-list .jobs-filter-grid > .minw-180 {
    min-width: 0;
  }
  job-list .jobs-filter-bar .btn-group {
    width: 100%;
  }
  job-list .jobs-code-scope .btn {
    flex: 0 1 auto;
    min-width: max-content;
    padding-inline: var(--space-2);
  }
  job-list .jobs-date-range {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
  }
  job-list .jobs-filter-grid > .w-100 {
    grid-column: 1 / -1;
  }
  job-list .jobs-filter-bar .form-select,
  job-list .jobs-filter-bar .form-control,
  job-list .jobs-filter-bar .btn,
  job-list .jobs-filter-bar .btn-group .btn {
    font-size: var(--font-size-base);
    line-height: 1.2;
  }
  job-list .glass-table th,
  job-list .glass-table td {
    padding: var(--space-3) var(--space-4);
  }
  job-list .jobs-table td[data-col="location"],
  job-list .jobs-table td[data-col="created"] {
    font-size: var(--font-size-sm);
    line-height: 1.35;
  }
}
@media (width >= 1920px) {
  job-list {
    --jobs-tabs-filter-gap: var(--space-1-5);
    --jobs-filter-block-gap: var(--space-3);
    --jobs-list-min-height: clamp(24rem, 54vh, 42rem);
  }
  job-list .table-responsive-cards .jobs-col-tablet,
  job-list .table-responsive-cards .jobs-col-laptop {
    display: table-cell;
  }
  job-list .jobs-filter-grid {
    display: grid;
    align-items: end;
    gap: var(--space-3);
    grid-template-columns:
      minmax(0, 0.76fr)
      minmax(0, 1.08fr)
      minmax(0, 1.08fr)
      minmax(0, 0.92fr)
      minmax(0, 1.4fr)
      minmax(0, 1fr);
  }
  job-list .jobs-filter-grid > * {
    min-width: 0;
    width: 100%;
  }
  job-list .jobs-filter-grid > .minw-140,
  job-list .jobs-filter-grid > .minw-180 {
    min-width: 0;
  }
  job-list .jobs-filter-grid > .w-100 {
    grid-column: 1 / -1;
  }
  job-list .jobs-date-range {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
  }
  job-list .glass-table th,
  job-list .glass-table td {
    padding: var(--space-3) var(--space-4);
  }
}
:is(job-list, desk-page) .jobs-filter-field {
  min-width: 0;
}
:is(job-list, desk-page) .jobs-filter-field .form-label {
  margin-bottom: var(--space-1);
}
job-list .jobs-filter-note-row {
  min-width: 0;
}
@media (width < 768px) {
  job-list .jobs-filter-bar {
    padding: var(--space-2);
  }
  job-list .jobs-filter-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
    gap: var(--space-2);
  }
  job-list .jobs-filter-field,
  job-list .jobs-filter-note-row {
    width: 100%;
  }
  job-list .jobs-bulk-actions__layout {
    align-items: stretch;
  }
  job-list .jobs-bulk-actions__summary {
    width: 100%;
  }
  job-list .jobs-bulk-actions__buttons {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  job-list .jobs-bulk-actions__buttons .btn {
    width: 100%;
    justify-content: center;
  }
  job-list #assignModal .modal-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
  }
  job-list #assignModal .modal-footer .btn {
    width: 100%;
  }
}
@media (width >= 768px) and (width < 1366px) {
  job-list .jobs-filter-bar {
    padding: var(--space-3);
  }
  job-list .jobs-filter-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: var(--space-3) var(--space-2);
  }
  job-list .jobs-filter-field--status {
    grid-column: 1;
  }
  job-list .jobs-filter-field--sales {
    grid-column: 2;
  }
  job-list .jobs-filter-field--designer {
    grid-column: 1;
  }
  job-list .jobs-filter-field--code {
    grid-column: 1 / -1;
  }
  job-list .jobs-filter-field--date {
    grid-column: 1 / -1;
  }
  job-list .jobs-filter-field--sort {
    grid-column: 2;
  }
  job-list .jobs-filter-field--note {
    grid-column: 1 / -1;
  }
  job-list .jobs-bulk-actions__layout {
    flex-wrap: wrap;
    align-items: stretch;
  }
  job-list .jobs-bulk-actions__summary {
    width: 100%;
  }
  job-list .jobs-bulk-actions__buttons {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-left: 0;
  }
  job-list .jobs-bulk-actions__buttons .btn {
    justify-content: center;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  job-list .jobs-filter-field--status {
    grid-column: 1;
  }
  job-list .jobs-filter-field--sales {
    grid-column: 2;
  }
  job-list .jobs-filter-field--designer {
    grid-column: 3;
  }
  job-list .jobs-filter-field--code {
    grid-column: 4;
  }
  job-list .jobs-filter-field--date {
    grid-column: 5;
  }
  job-list .jobs-filter-field--sort {
    grid-column: 6;
  }
  job-list .jobs-filter-field--note {
    grid-column: 1 / -1;
  }
  job-list .jobs-table th[data-col="code"],
  job-list .jobs-table td[data-col="code"] {
    min-width: 7.5rem;
  }
  job-list .jobs-table th[data-col="status"],
  job-list .jobs-table td[data-col="status"] {
    min-width: 7.75rem;
  }
  job-list .jobs-table th[data-col="assigned_sales"],
  job-list .jobs-table td[data-col="assigned_sales"] {
    min-width: 9.5rem;
  }
  job-list .jobs-table th[data-col="assigned_designer"],
  job-list .jobs-table td[data-col="assigned_designer"] {
    min-width: 9.5rem;
  }
  job-list .jobs-table th[data-col="location"],
  job-list .jobs-table td[data-col="location"] {
    min-width: 8.5rem;
  }
  job-list .jobs-table th[data-col="created"],
  job-list .jobs-table td[data-col="created"] {
    min-width: 11rem;
  }
}
@media (width >= 1920px) {
  job-list .jobs-filter-field--status {
    grid-column: 1;
  }
  job-list .jobs-filter-field--sales {
    grid-column: 2;
  }
  job-list .jobs-filter-field--designer {
    grid-column: 3;
  }
  job-list .jobs-filter-field--code {
    grid-column: 4;
  }
  job-list .jobs-filter-field--date {
    grid-column: 5;
  }
  job-list .jobs-filter-field--sort {
    grid-column: 6;
  }
  job-list .jobs-filter-field--note {
    grid-column: 1 / -1;
  }
  job-list .jobs-table th[data-col="code"],
  job-list .jobs-table td[data-col="code"] {
    min-width: 8.25rem;
  }
  job-list .jobs-table th[data-col="status"],
  job-list .jobs-table td[data-col="status"] {
    min-width: 8.5rem;
  }
  job-list .jobs-table th[data-col="assigned_sales"],
  job-list .jobs-table td[data-col="assigned_sales"] {
    min-width: 10.5rem;
  }
  job-list .jobs-table th[data-col="assigned_designer"],
  job-list .jobs-table td[data-col="assigned_designer"] {
    min-width: 10.5rem;
  }
  job-list .jobs-table th[data-col="location"],
  job-list .jobs-table td[data-col="location"] {
    min-width: 9.5rem;
  }
  job-list .jobs-table th[data-col="created"],
  job-list .jobs-table td[data-col="created"] {
    min-width: 12.5rem;
  }
}
.dropdown-menu {
  z-index: var(--z-dropdown-floating);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-xl);
  padding: var(--space-2);
  max-inline-size: min(24rem, calc(100vw - (var(--dropdown-viewport-margin) * 2)));
  max-block-size: min(var(--dropdown-max-height), calc(100dvh - (var(--dropdown-viewport-margin) * 2)));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  animation: dropdown-fade-in var(--dur-fast) var(--ease-out);
  text-align: left;
}
.dropdown-menu :is(.dropdown-item, .dropdown-header),
.form-select,
select,
searchable-select .searchable-select-input {
  text-align: left;
}
.dropdown-menu.show {
  opacity: 1;
}
.dropdown-menu.dropdown-menu-smart {
  z-index: var(--z-dropdown-floating);
}
.dropdown-menu.dropdown-menu-capped,
.dropdown-menu[data-dropdown-cap-items] {
  max-block-size: min(var(--dropdown-runtime-max-height, var(--dropdown-capped-max-height, var(--dropdown-cap-max-height))), calc(100dvh - (var(--dropdown-viewport-margin) * 2)));
  overflow-y: auto;
  overscroll-behavior: contain;
}
.dropdown-menu[data-dropdown-guard="active"] {
  translate: var(--dropdown-collision-offset-x, 0px) var(--dropdown-collision-offset-y, 0px);
  max-block-size: min(var(--dropdown-runtime-max-height, var(--dropdown-capped-max-height, var(--dropdown-max-height))), calc(100dvh - (var(--dropdown-viewport-margin) * 2)));
}
searchable-select {
  display: block;
  width: 100%;
  min-width: 0;
}
searchable-select .searchable-select-wrapper,
searchable-select .input-group {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
searchable-select {
  font-size: 1rem;
  line-height: 1.5;
}
searchable-select .input-group {
  flex-wrap: nowrap;
}
searchable-select .searchable-select-input {
  flex: 1 1 auto;
  font-size: inherit;
  min-width: 0;
  width: 1%;
}
searchable-select .searchable-select-toggle {
  align-items: center;
  display: inline-flex;
  flex: 0 0 var(--touch-target-min, 48px);
  font-size: inherit;
  justify-content: center;
  max-width: var(--touch-target-min, 48px);
  min-width: var(--touch-target-min, 48px);
  padding-inline: 0;
}
.searchable-select-dropdown {
  font-size: 1rem;
  line-height: 1.5;
  z-index: var(--z-select-surface);
  width: 100%;
  max-width: 100vw;
  box-sizing: border-box;
  max-height: min(var(--searchable-select-max-height), calc(100dvh - (var(--searchable-select-margin) * 2)));
  overflow-y: auto;
  display: none;
}
.searchable-select-dropdown[data-dropdown-cap-items] {
  max-height: min(var(--dropdown-runtime-max-height, var(--dropdown-capped-max-height, var(--searchable-select-max-height))), calc(100dvh - (var(--searchable-select-margin) * 2)));
}
.searchable-select-dropdown[style*="display: block"] {
  display: block;
}
.searchable-select-dropdown :is(.dropdown-item, .dropdown-header) {
  font-size: inherit;
  line-height: inherit;
}
.searchable-select-dropdown .dropdown-item {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  display: block;
  width: 100%;
  min-height: var(--dropdown-cap-item-min-height);
}
.searchable-select-wrapper.is-open {
  z-index: var(--z-select-surface);
}
.glass-panel.searchable-select-panel-open {
  position: relative;
  z-index: var(--z-select-surface);
}
.glass-panel-bordered {
  border: 1px solid var(--color-border);
}
.searchable-select-portal.searchable-select-portal {
  margin-top: 0;
  position: fixed;
  z-index: var(--z-select-portal);
  pointer-events: auto;
  max-width: calc(100vw - 16px);
  box-sizing: border-box;
}
.searchable-select-portal.searchable-select-portal[data-searchable-select-modal-portal] {
  z-index: var(--z-select-modal-portal);
}
.searchable-select-portal.searchable-select-portal[style*="display: block"] {
  animation: none;
  opacity: 1;
  transform: none;
  visibility: visible;
}
@keyframes dropdown-fade-in {
  from {
    opacity: 0;
    transform: translateY(calc(-1 * var(--space-2)));
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.dropdown-item {
  border-radius: var(--radius-lg);
  padding: var(--space-2-5) var(--space-3);
  font-weight: var(--font-weight-medium);
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
  transition:
    background-color var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}
.dropdown-item:hover {
  background: var(--color-surface-hover);
}
.dropdown-item.active,
.dropdown-item:active {
  background: rgba(var(--color-brand-primary-rgb), 0.1);
  color: var(--color-brand-primary-800);
}
.notif-dropdown {
  width: min(100%, calc(100vw - var(--space-4) - var(--space-4)));
  max-width: min(100%, calc(100vw - var(--space-4) - var(--space-4)));
  max-height: calc(var(--app-viewport-height) - var(--space-12));
  overflow-x: hidden;
  z-index: var(--z-notification);
}
.notif-dropdown .dropdown-item {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
@media (width >= 768px) {
  .notif-dropdown {
    width: min(var(--notif-dropdown-width), calc(100vw - var(--space-6) - var(--space-6)));
    max-width: min(var(--notif-dropdown-width), calc(100vw - var(--space-6) - var(--space-6)));
    max-height: min(var(--notif-dropdown-max-height), calc(var(--app-viewport-height) - var(--space-12)));
  }
}
[data-testid="toast-area"] .toast {
  width: 100%;
  max-width: min(100%, 22rem);
  margin-inline-start: auto;
  overflow: hidden;
}
[data-testid="toast-area"] .toast-header,
[data-testid="toast-area"] .toast-body {
  overflow-wrap: break-word;
  word-break: break-word;
}
[data-testid="toast-area"] .toast-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-top: var(--space-3);
}
[data-testid="toast-area"] .toast-action {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  min-height: var(--touch-target-min);
  padding: 0;
  margin: 0;
  white-space: normal;
  text-align: left;
}
body.nav-open [data-testid="toast-area"] .toast {
  max-width: 100%;
  margin-inline: 0;
}
@media (width >= 768px) {
  [data-testid="toast-area"] .toast {
    max-width: 24rem;
  }
}
@media (width >= 1366px) {
  [data-testid="toast-area"] .toast {
    max-width: 26.25rem;
  }
}
@media (width >= 1920px) {
  [data-testid="toast-area"] .toast {
    max-width: 28rem;
  }
}
.dropdown-divider {
  margin: var(--space-2) 0;
}
.alert {
  border: none;
  border-radius: var(--radius-xl);
  padding: var(--space-4) var(--space-5);
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
}
.app-header-alert {
  border-radius: 0;
  margin: 0;
  padding: var(--space-2) var(--space-3);
  min-height: var(--touch-target-min);
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  font-size: var(--font-size-xs);
  line-height: 1.35;
}
.app-header-alert-placeholder {
  visibility: hidden;
  background: transparent;
  border: 0;
  box-shadow: none;
  pointer-events: none;
}
@media (width >= 768px) {
  .app-header-alert {
    padding: var(--space-3) var(--space-4);
    min-height: calc(var(--touch-target-min) + var(--space-2));
    font-size: var(--font-size-sm);
  }
}
.progress {
  height: var(--space-2);
  border-radius: var(--radius-full);
  background: var(--color-surface-muted);
  overflow: hidden;
}
.progress.progress-xs {
  height: var(--space-1);
}
.progress.progress-sm {
  height: var(--space-1-5);
}
.progress-bar {
  border-radius: var(--radius-full);
  transition: width var(--dur-slow) var(--ease-out);
}
.progress-bar-zero {
  width: 0%;
}
.dashboard-search-results {
  z-index: var(--z-dashboard-search);
  max-block-size: min(var(--dropdown-runtime-max-height, var(--height-map-sm)), calc(100dvh - (var(--dropdown-viewport-margin) * 2)));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  transform: translateX(var(--dashboard-search-offset-x, 0));
  width: 100%;
  max-width: calc(100vw - (var(--dropdown-viewport-margin) * 2));
}
.dashboard-search-results.dashboard-search-results--portal {
  position: fixed;
  z-index: var(--z-dashboard-search);
  margin-block: 0;
  transform: none;
}
.dashboard-search-results.dashboard-search-results--above {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: var(--space-2);
}
.dashboard-search-results.dashboard-search-results--portal.dashboard-search-results--above {
  bottom: auto;
  margin-bottom: 0;
}
.dashboard-search-results .list-group-item {
  min-height: var(--touch-target-min);
}
.dashboard-search-results__section + .dashboard-search-results__section {
  border-top: 1px solid var(--color-border);
}
.dashboard-search-results__heading {
  padding: var(--space-2) var(--space-3) var(--space-1);
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0;
  background: var(--color-surface-muted);
}
.dashboard-search-results .list-group-item strong,
.dashboard-search-results .list-group-item small {
  overflow-wrap: break-word;
  word-break: break-word;
}
.dashboard-search-results .list-group-item small {
  line-height: 1.35;
}
.dashboard-search-results .badge {
  font-variant-numeric: tabular-nums;
}
.empty-state {
  text-align: center;
  padding: var(--space-12) var(--space-6);
}
.empty-state-icon {
  font-size: var(--font-size-7xl);
  color: var(--color-text-disabled);
  margin-bottom: var(--space-4);
  opacity: 0.5;
}
.empty-state-title {
  font-family: var(--font-family-display);
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text-primary);
  margin-bottom: var(--space-2);
}
.empty-state-description {
  color: var(--color-text-secondary);
  max-width: 40ch;
  margin-inline: auto;
  margin-bottom: var(--space-6);
}
.empty-state .btn {
  min-width: var(--width-col-3xs);
}
system-settings-page {
  display: block;
}
system-settings-page .settings-mobile-toolbar {
  display: grid;
  width: 100%;
  max-width: 100%;
  align-self: stretch;
  gap: var(--space-3);
  padding: var(--space-3);
  border-radius: var(--radius-2xl);
  border: 1px solid var(--settings-border);
  background: var(--job-panel);
  box-shadow: var(--shadow-md);
  margin-bottom: var(--space-4);
  position: sticky;
  top: calc(var(--navbar-height, var(--space-16)) + var(--space-2));
  z-index: var(--z-sticky);
}
system-settings-page .settings-shell-grid {
  display: grid;
  grid-template-columns: 1fr;
  width: 100%;
  max-width: var(--container-laptop);
  align-self: stretch;
  margin-inline: auto;
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
  column-gap: var(--space-4);
  row-gap: var(--space-4);
}
system-settings-page .settings-shell-grid > [class*="col-"] {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
system-settings-page .settings-nav-card {
  border-radius: var(--radius-2xl);
  border: 1px solid var(--settings-border);
  background: linear-gradient(180deg, rgba(var(--color-white-rgb), 0.96), rgba(var(--color-surface-rgb, 248, 245, 238), 0.92));
  box-shadow: var(--shadow-lg);
  width: 100%;
  max-width: 100%;
}
system-settings-page .settings-nav-sticky {
  top: var(--space-20);
}
system-settings-page .modal-body-scroll {
  max-height: 60vh;
  overflow-y: auto;
}
system-settings-page .settings-nav {
  display: grid;
  gap: var(--space-1);
  padding: var(--space-2);
  max-height: calc(var(--app-viewport-height) - 240px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
system-settings-page .settings-nav-table .settings-col-label {
  width: 20%;
}
system-settings-page .settings-nav-table .settings-col-path {
  width: 15%;
}
system-settings-page .settings-nav-table .settings-col-icon {
  width: 10%;
}
system-settings-page .settings-nav-table .settings-col-roles {
  width: 55%;
}
system-settings-page .settings-nav-table td,
system-settings-page .settings-nav-table th {
  min-width: 0;
}
system-settings-page .settings-nav-table td code {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
}
system-settings-page .settings-nav-table .form-check-inline {
  margin-right: 0;
  margin-bottom: var(--space-1);
}
system-settings-page .settings-nav .nav-link {
  border-radius: var(--radius-3xl);
  border: 1px solid transparent;
  color: var(--settings-ink);
  font-family: var(--font-family-display);
  letter-spacing: var(--tracking-2xs);
  transition: transform var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-fast) var(--ease-out),
              background-color var(--dur-fast) var(--ease-out);
}
system-settings-page .settings-nav .nav-link:hover {
  background: var(--color-surface-ink-faint);
  border-color: var(--color-border-ink-subtle);
}
system-settings-page .settings-nav .nav-link.active {
  background: linear-gradient(135deg, rgba(var(--app-palette-teal-rgb), 0.18), rgba(var(--app-palette-orange-rgb), 0.22));
  border-color: rgba(var(--app-palette-teal-rgb), 0.24);
  color: var(--color-brand-primary-800);
  box-shadow: var(--shadow-md);
}
system-settings-page .settings-content {
  min-width: 0;
  width: min(100%, var(--width-container-lg));
  margin-inline: auto;
}
system-settings-page .settings-status,
system-settings-page .settings-state {
  display: block;
  width: 100%;
  min-height: 0;
}
system-settings-page[data-ui-state="submitting"] {
  cursor: progress;
}
system-settings-page[data-ui-state="submitting"] .settings-content {
  pointer-events: none;
  opacity: 0.92;
}
system-settings-page .settings-content-col {
  display: flex;
  justify-content: center;
  margin-inline: auto;
}
system-settings-page .settings-content .card-header {
  flex-wrap: wrap;
  gap: var(--space-2);
}
system-settings-page .form-control,
system-settings-page .form-select,
system-settings-page .btn {
  font-size: var(--font-size-base);
}
system-settings-page .settings-content :is(.form-control, .form-select) {
  min-height: var(--touch-target-min);
}
system-settings-page .settings-content textarea.form-control {
  min-height: max(calc(var(--touch-target-min) * 1.75), 5.5rem);
}
system-settings-page .form-label.small {
  font-size: max(var(--settings-label-font-min), var(--font-size-xs));
  line-height: 1.35;
  overflow-wrap: break-word;
}
system-settings-page :is(.form-text, small, .small) {
  font-size: max(var(--settings-micro-font-min), var(--font-size-xs));
  line-height: 1.35;
}
system-settings-page .settings-content :is(.row, [class*="col-"], .input-group) {
  min-width: 0;
}
system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) {
  align-items: flex-start;
}
system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > [class*="col-"] {
  min-width: 0;
}
system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > :is(.col-12, .col-md-12),
system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .settings-grid-span-full {
  flex: 0 0 100%;
  max-width: 100%;
}
system-settings-page .settings-content .cq-form .settings-grid-span-full {
  min-width: 0;
}
system-settings-page .settings-range-field {
  min-width: 0;
}
system-settings-page .settings-range-input {
  display: block;
  width: 100%;
  min-height: var(--touch-target-min);
  height: var(--touch-target-min);
  margin-block: 0;
  padding-inline: 0;
}
system-settings-page .settings-range-input::-webkit-slider-thumb {
  width: 1.25rem;
  height: 1.25rem;
}
system-settings-page .settings-range-input::-moz-range-thumb {
  width: 1.25rem;
  height: 1.25rem;
}
system-settings-page .form-check {
  display: flex;
  gap: var(--space-2);
  min-height: var(--touch-target-min);
  align-items: flex-start;
  padding-left: 0;
}
system-settings-page .settings-content .form-check-input {
  position: static;
  float: none;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  margin-top: 0;
  margin-left: 0;
  flex: 0 0 var(--touch-target-min);
}
system-settings-page .settings-content .form-check-label {
  flex: 1 1 auto;
  min-width: 0;
  padding-top: calc(var(--space-1) / 2);
}
system-settings-page #brandingSettingsForm .alert a[data-spa="true"] {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch-target-min);
  padding-inline: var(--space-2);
  border-radius: var(--radius-pill);
}
system-settings-page :is(#primaryColorPicker, #accentColorPicker, #secondaryColorPicker) {
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  padding: 0.125rem;
  flex: 0 0 var(--touch-target-min);
}
system-settings-page :is(#primaryColorPicker, #accentColorPicker, #secondaryColorPicker) + .form-control {
  flex: 1 1 auto;
  min-width: 0;
}
system-settings-page .settings-filter-row .settings-filter-group {
  width: 100%;
}
system-settings-page .settings-filter-row .settings-filter-group input,
system-settings-page .settings-filter-row .settings-filter-group select {
  width: 100%;
}
system-settings-page #compPagination {
  width: 100%;
}
system-settings-page #compPagination .btn {
  width: 100%;
}
system-settings-page .table-responsive-cards {
  overflow-x: visible;
}
system-settings-page .table-responsive-cards table {
  display: block;
  width: 100%;
}
system-settings-page .table-responsive-cards thead {
  display: none;
}
system-settings-page .table-responsive-cards tbody {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
system-settings-page .table-responsive-cards tr {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-4);
  border: 1px solid var(--settings-border);
  border-radius: var(--radius-xl);
  background: var(--color-surface-elevated);
  box-shadow: var(--shadow-sm);
}
system-settings-page .table-responsive-cards tr.table-card-full {
  display: block;
  text-align: center;
}
system-settings-page .table-responsive-cards td,
system-settings-page .table-responsive-cards th {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-start;
  gap: var(--space-3);
  padding: var(--space-2) 0;
  border-bottom: 1px dashed var(--settings-border);
  word-break: break-word;
  overflow-wrap: break-word;
}
system-settings-page .table-responsive-cards td::before,
system-settings-page .table-responsive-cards th::before {
  content: attr(data-label);
  font-family: var(--font-family-display);
  letter-spacing: var(--tracking-wider);
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  color: var(--settings-ink-muted);
  flex-shrink: 0;
  min-width: var(--width-col-sm);
}
system-settings-page .table-responsive-cards td:last-child,
system-settings-page .table-responsive-cards th:last-child {
  border-bottom: none;
}
system-settings-page .table-responsive-cards td.actions-cell,
system-settings-page .table-responsive-cards td[data-label="Actions"] {
  justify-content: flex-end;
  padding-top: var(--space-3);
  margin-top: var(--space-2);
  border-top: 1px dashed var(--settings-border);
  border-bottom: none;
}
system-settings-page .table-responsive-cards td.actions-cell::before,
system-settings-page .table-responsive-cards td[data-label="Actions"]::before {
  display: none;
}
system-settings-page .table-responsive-cards td.actions-cell .btn {
  min-width: var(--space-24);
  min-height: var(--touch-target-min);
}
system-settings-page .table-responsive-cards .table-card-label {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-family-display);
  letter-spacing: var(--tracking-wider);
  font-size: var(--font-size-xs);
  text-transform: uppercase;
  color: var(--settings-ink-muted);
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
system-settings-page .table-responsive-cards tr.table-card-full td::before,
system-settings-page .table-responsive-cards tr.table-card-full th::before {
  display: none;
}
system-settings-page .table-responsive-cards td.table-card-full,
system-settings-page .table-responsive-cards tr.table-card-full td,
system-settings-page .table-responsive-cards tr.table-card-full th {
  justify-content: center;
  border: none;
}
@media (width >= 768px) and (width < 1366px) {
  system-settings-page .settings-shell-grid {
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch;
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > :is(.col-md-3, .col-md-4, .col-md-6) {
    flex: 0 0 50%;
    max-width: 50%;
  }
  system-settings-page .settings-filter-row .settings-filter-group {
    width: auto;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  system-settings-page .settings-shell-grid {
    grid-template-columns: minmax(0, var(--settings-sidebar-inline, 20rem)) minmax(0, 1fr);
    align-items: start;
    max-width: var(--settings-shell-max-laptop, 84rem);
  }
  system-settings-page .settings-content {
    width: 100%;
    max-width: var(--settings-content-max-laptop, 63rem);
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-4,
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-3 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  system-settings-page .table-responsive-cards {
    overflow-x: auto;
  }
  system-settings-page .table-responsive-cards table {
    display: table;
    width: 100%;
  }
  system-settings-page .table-responsive-cards thead {
    display: table-header-group;
  }
  system-settings-page .table-responsive-cards tbody {
    display: table-row-group;
  }
  system-settings-page .table-responsive-cards tr,
  system-settings-page .table-responsive-cards tr.table-card-full {
    display: table-row;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }
  system-settings-page .table-responsive-cards td,
  system-settings-page .table-responsive-cards th,
  system-settings-page .table-responsive-cards tr.table-card-full td,
  system-settings-page .table-responsive-cards tr.table-card-full th {
    display: table-cell;
    padding: var(--space-2) var(--space-3);
    border-bottom: 1px solid var(--settings-border);
    vertical-align: middle;
    text-align: left;
    gap: 0;
  }
  system-settings-page .table-responsive-cards td::before,
  system-settings-page .table-responsive-cards th::before,
  system-settings-page .table-responsive-cards .table-card-label {
    display: none;
    content: none;
  }
  system-settings-page .table-responsive-cards td.actions-cell,
  system-settings-page .table-responsive-cards td[data-label="Actions"] {
    justify-content: flex-start;
    border-top: 0;
    margin-top: 0;
    padding-top: var(--space-2);
    border-bottom: 1px solid var(--settings-border);
  }
}
@media (width >= 1920px) {
  system-settings-page .settings-shell-grid {
    grid-template-columns: minmax(0, var(--settings-sidebar-inline, 21rem)) minmax(0, 1fr);
    align-items: start;
    max-width: var(--settings-shell-max-desktop, 104rem);
  }
  system-settings-page .settings-content {
    width: 100%;
    max-width: var(--settings-content-max-desktop, 72rem);
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-4,
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-3 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4) > .col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }
  system-settings-page .settings-content .cq-form :is(.row.g-3, .row.g-4).settings-compact-grid > .col-md-3 {
    flex: 0 0 25%;
    max-width: 25%;
  }
  system-settings-page .table-responsive-cards {
    overflow-x: auto;
  }
  system-settings-page .table-responsive-cards table {
    display: table;
    width: 100%;
  }
  system-settings-page .table-responsive-cards thead {
    display: table-header-group;
  }
  system-settings-page .table-responsive-cards tbody {
    display: table-row-group;
  }
  system-settings-page .table-responsive-cards tr,
  system-settings-page .table-responsive-cards tr.table-card-full {
    display: table-row;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }
  system-settings-page .table-responsive-cards td,
  system-settings-page .table-responsive-cards th,
  system-settings-page .table-responsive-cards tr.table-card-full td,
  system-settings-page .table-responsive-cards tr.table-card-full th {
    display: table-cell;
    padding: var(--space-3) var(--space-4);
    border-bottom: 1px solid var(--settings-border);
    vertical-align: middle;
    text-align: left;
    gap: 0;
  }
  system-settings-page .table-responsive-cards td::before,
  system-settings-page .table-responsive-cards th::before,
  system-settings-page .table-responsive-cards .table-card-label {
    display: none;
    content: none;
  }
  system-settings-page .table-responsive-cards td.actions-cell,
  system-settings-page .table-responsive-cards td[data-label="Actions"] {
    justify-content: flex-start;
    border-top: 0;
    margin-top: 0;
    padding-top: var(--space-3);
    border-bottom: 1px solid var(--settings-border);
  }
}
.settings-modal .modal-dialog {
  width: 100%;
  margin: 0;
  min-height: 100%;
  box-sizing: border-box;
  padding-inline: var(--space-2);
}
.settings-modal .modal-content {
  min-height: min(var(--app-viewport-height), 100dvh);
  border-radius: 0;
  border: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  overscroll-behavior: contain;
}
.settings-modal .modal-header,
.settings-modal .modal-footer {
  flex-shrink: 0;
  gap: var(--space-2);
}
.settings-modal .modal-body {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}
.settings-modal .modal-body-scroll {
  max-height: none;
  overflow: visible;
}
.settings-modal .settings-modal-table {
  min-width: 0;
  overflow: auto;
}
.settings-modal .settings-modal-table .table {
  margin-bottom: 0;
}
.settings-modal .settings-modal-table thead th {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  background: var(--color-surface-elevated);
}
@media (width < 768px) {
  .settings-modal .modal-dialog {
    padding-inline: 0;
  }
  .settings-modal .modal-footer {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }
  .settings-modal .modal-footer .btn {
    width: 100%;
    justify-content: center;
  }
}
@media (width >= 768px) {
  .settings-modal .modal-dialog {
    width: min(96vw, 72rem);
    max-width: 72rem;
    margin: var(--space-4) auto;
    min-height: calc(min(var(--app-viewport-height), 100dvh) - (var(--space-4) * 2));
  }
  .settings-modal .modal-content {
    min-height: 0;
    max-height: calc(min(var(--app-viewport-height), 100dvh) - (var(--space-4) * 2));
    border-radius: var(--radius-2xl);
    border: 1px solid var(--color-border-light);
  }
}
config-table-component td.actions-cell,
config-table-component td[data-label="Actions"] {
  min-width: var(--width-filter-md);
}
config-table-master th.actions-col {
  width: var(--width-filter-md);
}
config-table-master td.actions-cell {
  min-width: var(--width-filter-md);
}
.workspace-shell {
  position: relative;
  padding-bottom: var(--space-6);
}
.workspace-shell::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(var(--color-surface-rgb, 248, 245, 238), 0.72) 0%, transparent 60%);
  opacity: 0.36;
  pointer-events: none;
  z-index: auto;
}
.workspace-content {
  position: relative;
  z-index: var(--z-local-raised);
}
.workspace-content.container-max.p-4,
.workspace-content.container-max.p-5 {
  padding: var(--space-4);
}
.workspace-card.card {
  background: var(--color-surface-elevated);
  border: 1px solid var(--color-border-light);
  box-shadow: var(--shadow-sm);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.workspace-toolbar {
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-xl);
  background: var(--job-panel);
  padding: var(--space-3);
}

.workspace-toolbar h2,
.workspace-toolbar .h5 {
  color: var(--color-text-primary);
  letter-spacing: var(--tracking-tight);
  text-transform: none;
}
.workspace-panel-surface.card {
  background: var(--color-surface-soft);
  border-color: var(--color-border-light);
}
.workspace-toolbar .form-label,
.workspace-filter .form-label {
  font-family: var(--font-family-sans);
  letter-spacing: var(--tracking-tight);
  text-transform: none;
  color: var(--color-text-secondary);
  font-size: var(--font-size-xs);
}
.workspace-filters {
  width: 100%;
  gap: var(--space-2);
}
.workspace-filter {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  background: var(--color-surface-elevated);
}
.workspace-filter .form-control,
.workspace-filter .form-select {
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  background: var(--color-surface-elevated);
  box-shadow: none;
}
.workspace-filter .form-control:focus,
.workspace-filter .form-select:focus {
  border-color: rgba(var(--color-brand-primary-rgb), 0.36);
  box-shadow: 0 0 0 2px rgba(var(--color-brand-primary-rgb), 0.14);
}
.workspace-pagination > div {
  border-top: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  background: var(--color-surface-elevated);
}
system-settings-page.workspace-page .settings-mobile-toolbar {
  border: 1px solid var(--color-border-light);
  box-shadow: var(--shadow-md);
}
system-settings-page.workspace-page .settings-nav .nav-link {
  font-family: var(--font-family-sans);
  color: var(--color-text-primary);
  letter-spacing: var(--tracking-tight);
}
employee-page.workspace-page {
  --employee-ink: var(--color-text-primary);
  --employee-ink-muted: var(--color-text-secondary);
  --employee-accent: var(--color-brand-primary);
  --employee-surface: var(--color-surface-soft);
  --employee-surface-strong: var(--color-surface-elevated);
  --employee-border: var(--color-border-light);
  --employee-border-strong: var(--color-border-light);
  --employee-shadow: var(--shadow-lg);
  --employee-spotlight: rgba(var(--color-brand-primary-rgb), 0.12);
  --employee-grid: rgba(var(--color-brand-primary-rgb), 0.08);
}
system-settings-page.workspace-page {
  --settings-ink: var(--color-text-primary);
  --settings-ink-muted: var(--color-text-secondary);
  --settings-border: var(--color-border-light);
  --settings-grid: rgba(var(--color-brand-primary-rgb), 0.08);
  --settings-shell-max: 100%;
  --settings-content-max: 100%;
  --settings-sidebar-inline: clamp(18.5rem, 19vw, 21rem);
  --settings-rail-inline: clamp(13rem, 15vw, 16rem);
  --settings-shell-max-laptop: 100%;
  --settings-shell-max-desktop: 100%;
  --settings-content-max-laptop: 100%;
  --settings-content-max-desktop: 100%;
}
system-settings-page.workspace-page .settings-mobile-toolbar > div,
system-settings-page.workspace-page .settings-content-col,
system-settings-page.workspace-page .settings-content-layout,
system-settings-page.workspace-page .settings-utility-rail,
system-settings-page.workspace-page #settingsContent,
system-settings-page.workspace-page #settingsContent > * {
  min-width: 0;
  width: 100%;
  max-width: 100%;
}
system-settings-page.workspace-page .settings-content-col {
  justify-content: flex-start;
  align-self: stretch;
}
system-settings-page.workspace-page #settingsContent > * {
  display: block;
}
system-settings-page.workspace-page .settings-content .cq-form {
  width: 100%;
  max-width: 100%;
}
system-settings-page.workspace-page .settings-mobile-toolbar .form-label {
  margin-bottom: var(--space-1);
}
@media (width < 768px) {
  system-settings-page.workspace-page .settings-mobile-toolbar {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
    padding: var(--space-2-5);
  }
  system-settings-page.workspace-page .settings-content {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
  }
  system-settings-page.workspace-page #editableSettingsForm > .sticky-bottom {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: var(--space-2);
  }
  system-settings-page.workspace-page #editableSettingsForm > .sticky-bottom > .btn {
    width: 100%;
    justify-content: center;
  }
  system-settings-page.workspace-page #editableSettingsForm > .sticky-bottom > #editableSaveStatus {
    width: 100%;
    margin-right: 0;
  }
}
@media (width >= 768px) and (width < 1366px) {
  system-settings-page.workspace-page .settings-mobile-toolbar {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: var(--space-3);
  }
  system-settings-page.workspace-page .settings-content {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  system-settings-page.workspace-page {
    --settings-shell-max: var(--settings-shell-max-laptop);
    --settings-content-max: var(--settings-content-max-laptop);
  }
  system-settings-page.workspace-page .settings-shell-grid {
    width: 100%;
    max-width: var(--settings-shell-max-laptop);
    margin-inline: auto;
  }
  system-settings-page.workspace-page .settings-content {
    width: 100%;
    max-width: 100%;
    margin-inline: 0 auto;
  }
}
@media (width >= 1920px) {
  system-settings-page.workspace-page {
    --settings-shell-max: var(--settings-shell-max-desktop);
    --settings-content-max: var(--settings-content-max-desktop);
  }
  system-settings-page.workspace-page .settings-shell-grid {
    width: 100%;
    max-width: var(--settings-shell-max-desktop);
    margin-inline: auto;
  }
  system-settings-page.workspace-page .settings-content {
    width: 100%;
    max-width: 100%;
    margin-inline: 0 auto;
  }
}
employee-page.workspace-page .employee-control-card.card,
system-settings-page.workspace-page .settings-nav-card.card,
audit-log-page.workspace-page .audit-main-card.card {
  background: var(--color-surface-elevated);
  border: 1px solid var(--color-border-light);
  box-shadow: var(--shadow-sm);
}
system-settings-page.workspace-page .settings-nav .nav-link:hover {
  background: rgba(var(--color-brand-primary-rgb), 0.08);
  border-color: rgba(var(--color-brand-primary-rgb), 0.2);
}
system-settings-page.workspace-page .settings-nav .nav-link.active {
  background: rgba(var(--color-brand-primary-rgb), 0.12);
  border-color: rgba(var(--color-brand-primary-rgb), 0.2);
  color: var(--color-brand-primary-800);
  box-shadow: none;
}
employee-page.workspace-page .employee-table thead th {
  background: var(--color-surface-soft);
  color: var(--color-text-secondary);
  font-family: var(--font-family-sans);
  letter-spacing: var(--tracking-tight);
  font-size: var(--font-size-xs);
}
employee-page.workspace-page .employee-table tbody tr:hover {
  background: rgba(var(--color-brand-primary-rgb), 0.08);
}
employee-page.workspace-page .employee-pagination > div {
  border-top: 1px solid var(--color-border-light);
  background: var(--color-surface-elevated);
}
employee-page.workspace-page .employee-pagination .page-link {
  border-color: var(--color-border-light);
  border-radius: var(--radius-md);
}
employee-page.workspace-page .employee-pagination .page-item.active .page-link {
  background: var(--color-brand-primary);
  border-color: var(--color-brand-primary);
  color: var(--color-text-inverse, var(--color-white));
}
audit-log-page.workspace-page .audit-log-table thead th {
  background: var(--color-surface-soft);
  color: var(--color-text-secondary);
  font-family: var(--font-family-sans);
  letter-spacing: var(--tracking-tight);
}
audit-log-page.workspace-page .audit-filter-group {
  border: 1px solid var(--color-border-light);
  background: var(--color-surface-soft);
}
audit-log-page.workspace-page .audit-controls-container {
  border: 1px solid var(--color-border-light);
  background: var(--color-surface-soft);
}
audit-log-page.workspace-page .audit-date-range-control {
  border-color: var(--color-border-light);
  background: var(--color-surface-elevated);
}
employee-page.workspace-page .table-responsive-cards tbody tr,
system-settings-page.workspace-page .table-responsive-cards tr {
  border: 1px solid var(--color-border-light);
  background: var(--color-surface-elevated);
  box-shadow: var(--shadow-sm);
}
employee-page.workspace-page .table-responsive-cards .table-card-label,
system-settings-page.workspace-page .table-responsive-cards td::before,
system-settings-page.workspace-page .table-responsive-cards th::before,
system-settings-page.workspace-page .table-responsive-cards .table-card-label {
  color: var(--color-text-secondary);
  font-family: var(--font-family-sans);
  letter-spacing: var(--tracking-tight);
}
employee-page.workspace-page .empty-state-icon {
  color: var(--color-text-secondary);
}
#employeeHistoryModal .modal-content {
  border: 1px solid var(--color-border-light);
  box-shadow: var(--shadow-lg);
}
#backToTop {
  bottom: 1rem;
  right: 1rem;
  z-index: var(--z-dropdown);
  width: 3rem;
  height: 3rem;
}
@media (forced-colors: active) {
  .btn {
    border: 2px solid currentColor;
  }
  .badge {
    border: 1px solid currentColor;
  }
}
::selection {
  background: rgba(var(--color-brand-primary-rgb), 0.3);
  color: inherit;
}
@media (width >= 768px) {
  .status-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  logout-handler .status-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .audit-log-scroll.table-responsive-cards table,
  .audit-log-scroll.table-responsive-cards .audit-log-table {
    display: table;
    table-layout: fixed;
    width: 100%;
    min-width: 100%;
  }
  job-list .table-responsive-cards .jobs-col-tablet {
    display: table-cell;
  }
  #smartInsights .insight-card > .d-flex {
    flex-direction: row;
    align-items: center;
  }
  #smartInsights .insight-card .btn {
    width: auto;
  }
  #recentJobsList .job-item {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  #recentJobsList .job-item .badge {
    align-self: auto;
    margin-left: auto;
  }
  #catSummaryCounts {
    flex-wrap: wrap;
    overflow-x: visible;
  }
  #catTabs {
    flex-wrap: wrap;
    overflow-x: visible;
  }
  .input-responsive {
    width: auto;
    min-width: var(--width-filter-lg);
    max-width: var(--width-sidebar-sm);
  }
  .full-width-mobile {
    width: auto;
  }
  .flex-fill-mobile {
    flex: 0 1 auto;
  }
  .status-suggestions {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }
  .workspace-content.container-max.p-4,
  .workspace-content.container-max.p-5 {
    padding: var(--space-5);
  }
}
@media (width >= 1366px) {
  .status-card {
    padding: var(--space-8);
  }
  logout-handler .status-grid {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
  .audit-id-cell {
    width: var(--width-filter-lg);
    min-width: var(--width-col-lg);
  }
  .audit-action-cell {
    width: var(--width-col-md);
    min-width: var(--width-filter-sm);
  }
  .audit-details-cell {
    min-width: var(--width-sidebar-sm);
  }
  job-list .table-responsive-cards .jobs-col-laptop {
    display: table-cell;
  }
  employee-page .employee-control-card {
    border-radius: var(--radius-2xl);
  }
  employee-page .employee-table-wrap.table-responsive-cards > table.employee-table {
    display: table;
    table-layout: fixed;
    width: 100%;
    min-width: 100%;
  }
  employee-page .table-responsive-cards thead {
    display: table-header-group;
  }
  employee-page .table-responsive-cards tbody {
    display: table-row-group;
  }
  employee-page .table-responsive-cards tr,
  employee-page .table-responsive-cards tr.table-card-full {
    display: table-row;
  }
  employee-page .table-responsive-cards td,
  employee-page .table-responsive-cards th,
  employee-page .table-responsive-cards tr.table-card-full td,
  employee-page .table-responsive-cards tr.table-card-full th {
    display: table-cell;
  }
  employee-page .table-responsive-cards td::before,
  employee-page .table-responsive-cards th::before,
  employee-page .table-responsive-cards .table-card-label {
    display: none;
  }
  employee-page .employee-actions {
    flex-wrap: nowrap;
    gap: var(--space-1);
  }
  employee-page .employee-actions .btn {
    min-height: var(--touch-target-min);
  }
  employee-page .employee-table th:last-child,
  employee-page .employee-table td[data-label="Actions"] {
    min-width: var(--space-52);
  }
  .workspace-shell {
    padding-bottom: var(--space-8);
  }
  .workspace-content.container-max.p-4,
  .workspace-content.container-max.p-5 {
    padding: var(--space-6);
  }
}
@media (width >= 1920px) {
  .status-card {
    padding: var(--space-10);
  }
  employee-page .employee-control-card {
    box-shadow: var(--shadow-xl);
  }
  .workspace-shell {
    padding-bottom: var(--space-10);
  }
}
.container-max.p-0 {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.container-max.p-0 > .row.justify-content-center {
  width: 100%;
  max-width: 100%;
}
.form-control::placeholder,
.form-select::placeholder,
input::placeholder,
textarea::placeholder {
  color: var(--color-text-secondary);
  opacity: 1;
}
.btn-primary {
  background-color: var(--color-brand-primary-700);
  border-color: var(--color-brand-primary-700);
  color: var(--on-primary);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--color-brand-primary-800);
  border-color: var(--color-brand-primary-800);
  color: var(--on-primary);
}
.badge.bg-info,
.bg-info.badge,
.text-bg-info {
  background-color: var(--color-info-700);
  color: var(--app-palette-black);
}
.badge.bg-success-subtle.text-success,
.bg-success-subtle.text-success,
.text-success.bg-success-subtle {
  color: var(--color-success-700);
  border-color: rgba(var(--app-palette-forest-rgb), 0.35);
}
job-list #jobListContainer {
  container-type: inline-size;
  container-name: jobs-table;
}
job-list .jobs-table {
  width: 100%;
  min-width: 100%;
}
job-list .jobs-filter-caption {
  caption-side: top;
  padding: 0;
  text-align: left;
}
job-list .jobs-filter-surface {
  display: grid;
  gap: var(--space-3);
  padding: var(--space-3);
  border-bottom: 1px solid var(--color-border-light);
  background:
    linear-gradient(180deg, rgba(var(--color-white-rgb), 0.76), rgba(var(--color-white-rgb), 0.52)),
    radial-gradient(circle at top right, rgba(var(--color-brand-primary-rgb), 0.08), transparent 55%);
}
job-list .jobs-filter-field,
job-list .jobs-filter-header-stack,
job-list .jobs-filter-note {
  min-width: 0;
}
job-list .jobs-filter-field {
  display: grid;
  gap: var(--space-1);
  align-content: start;
}
job-list .jobs-filter-label {
  display: inline-flex;
  align-items: center;
  min-height: 1.5rem;
  font-size: var(--font-size-xs);
  font-weight: 600;
  color: var(--color-text-secondary);
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
job-list .jobs-filter-label--static {
  margin-top: auto;
  margin-bottom: auto;
}
job-list .jobs-filter-control,
job-list .jobs-code-scope .btn,
job-list .jobs-header-button {
  min-height: max(48px, var(--touch-target-min));
}
job-list .jobs-filter-control {
  width: 100%;
  min-width: 0;
  border-color: var(--color-border-light);
  background: rgba(var(--color-white-rgb), 0.88);
  box-shadow: none;
}
job-list .jobs-filter-control:focus,
job-list .jobs-filter-control:focus-visible {
  border-color: rgba(var(--color-brand-primary-rgb), 0.42);
  box-shadow: 0 0 0 3px rgba(var(--color-brand-primary-rgb), 0.12);
}
job-list .jobs-code-scope {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-1);
}
job-list .jobs-code-scope .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
  padding-inline: var(--space-2);
}
job-list .jobs-filter-note {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  min-height: max(48px, var(--touch-target-min));
  padding: 0 var(--space-1);
  color: var(--color-text-secondary);
  font-size: var(--font-size-sm);
  line-height: 1.4;
}
job-list .jobs-filter-row--header th {
  padding: var(--space-2) var(--space-3);
  vertical-align: top;
  background: rgba(var(--color-white-rgb), 0.82);
  border-bottom: 1px solid var(--color-border-light);
}
job-list .jobs-filter-header-cell .jobs-filter-field {
  gap: var(--space-1);
}
job-list .jobs-filter-field--inline .jobs-filter-label {
  min-height: 1rem;
}
job-list .jobs-filter-header-cell--created .jobs-filter-header-stack {
  display: grid;
  gap: var(--space-2);
}
job-list .jobs-header-row th {
  vertical-align: middle;
}
job-list .jobs-header-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
}
job-list .jobs-header-button:focus-visible {
  outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.44);
  outline-offset: 3px;
  border-radius: var(--radius-md);
}
job-list .jobs-sort-indicator {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.25rem;
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}
job-list .jobs-table-empty-state {
  padding: var(--space-4);
  border-top: 1px solid var(--color-border-light);
  background: rgba(var(--color-white-rgb), 0.52);
}
@container jobs-table (max-width: 46rem) {
  job-list .jobs-filter-surface--rail .date-range-pill {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-2);
    padding-block: var(--space-2);
  }
  job-list .jobs-filter-surface--rail .date-range-sep {
    display: none;
  }
}
@media (width < 768px) {
  job-list .jobs-filter-surface {
    grid-template-columns: minmax(0, 1fr);
    padding: var(--space-2);
  }
  job-list .jobs-filter-note {
    align-items: flex-start;
    padding-inline: 0;
  }
}
@media (width >= 768px) and (width < 1366px) {
  job-list .jobs-filter-surface {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  job-list .jobs-filter-field--code,
  job-list .jobs-filter-field--date,
  job-list .jobs-filter-field--sort,
  job-list .jobs-filter-note {
    grid-column: 1 / -1;
  }
}
@media (width >= 1366px) and (width < 1920px) {
  job-list .jobs-filter-row--header th {
    padding: var(--space-2) var(--space-2-5);
  }
  job-list .jobs-header-button:hover {
    color: var(--color-brand-primary);
  }
}
@media (width >= 1920px) {
  job-list .jobs-filter-row--header th {
    padding: var(--space-3);
  }
  job-list .jobs-filter-header-cell--created .jobs-filter-header-stack {
    gap: var(--space-3);
  }
  job-list .jobs-header-button:hover {
    color: var(--color-brand-primary);
  }
}
@media (width >= 1920px) {
  employee-page .employee-toolbar {
    grid-template-columns: minmax(0, 1fr) minmax(40rem, 56rem);
    align-items: end;
    gap: var(--space-4);
  }
  employee-page .employee-filters {
    grid-template-columns: minmax(11rem, 13rem) minmax(11rem, 13rem) minmax(20rem, 1fr);
    align-items: end;
    gap: var(--space-3);
  }
  employee-page .employee-table-wrap {
    overflow-x: auto;
  }
  employee-page .employee-table-wrap.table-responsive-cards > table.employee-table {
    display: table;
    table-layout: fixed;
    width: 100%;
    min-width: 100%;
  }
  employee-page .employee-col-role {
    width: 10.5rem;
  }
  employee-page .employee-col-status {
    width: 9rem;
  }
  employee-page .employee-col-login {
    width: 13rem;
  }
  employee-page .employee-col-actions {
    width: 12rem;
  }
  employee-page .employee-table thead th,
  employee-page .employee-table td {
    padding: var(--space-3);
  }
  employee-page .employee-name,
  employee-page .employee-email,
  employee-page .employee-login-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  employee-page .employee-actions {
    flex-wrap: nowrap;
    justify-content: flex-end;
    gap: var(--space-1);
  }
  employee-page .employee-head-actions,
  employee-page .employee-cell-actions {
    text-align: right;
  }
}

:is(lead-detail-page, job-detail-page) {
  --record-detail-touch-target: 48px;
  --record-detail-panel-radius: 8px;
  --record-detail-line: color-mix(in oklch, var(--bs-border-color, var(--color-border)), var(--bs-primary, var(--bs-primary)) 9%);
  --record-detail-muted-surface: color-mix(in oklch, var(--bs-light, var(--color-surface-soft)), var(--bs-primary, var(--bs-primary)) 4%);
  --record-detail-ink: color-mix(in oklch, var(--bs-dark, var(--color-text-primary)), var(--bs-primary, var(--bs-primary)) 5%);
}

:is(lead-detail-page, job-detail-page) .record-detail-grid {
  align-items: start;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: minmax(0, 1fr);
}

:is(lead-detail-page, job-detail-page) :is(.record-detail-grid--columns, .lead-detail-section-grid--jobs-columns) > :is(.record-detail-column, .lead-detail-section-column) {
  display: grid;
  gap: inherit;
  min-inline-size: 0;
}

:is(lead-detail-page, job-detail-page) :is(.record-detail-grid--columns, .lead-detail-section-grid--jobs-columns) > :is(.record-detail-column, .lead-detail-section-column) > .record-detail-section {
  grid-column: auto;
  inline-size: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
}

@media (width >= 1366px) {
  :is(lead-detail-page, job-detail-page) :is(.record-detail-grid--columns, .lead-detail-section-grid--jobs-columns) {
    align-items: start;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

:is(lead-detail-page, job-detail-page) .record-detail-section {
  align-self: start;
  background: var(--bs-body-bg, var(--color-white));
  border: 1px solid var(--record-detail-line);
  border-radius: var(--record-detail-panel-radius);
  display: grid;
  gap: 0.55rem;
  min-inline-size: 0;
  padding: 0.875rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible {
  padding: 0;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible > summary {
  align-items: center;
  cursor: pointer;
  display: grid;
  gap: 0.45rem;
  grid-template-columns: minmax(0, 1fr) auto auto;
  list-style: none;
  min-block-size: var(--record-detail-touch-target);
  padding: 0.85rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible > summary::-webkit-details-marker {
  display: none;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible > summary > span {
  align-items: center;
  display: inline-flex;
  gap: 0.4rem;
  min-inline-size: 0;
}

:is(lead-detail-page, job-detail-page) .record-section-field-count {
  background: var(--record-detail-muted-surface);
  border: 1px solid var(--record-detail-line);
  border-radius: 999px;
  color: var(--record-detail-ink);
  font-size: var(--font-size-3xs);
  font-weight: 850;
  padding: 0.2rem 0.55rem;
  white-space: nowrap;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-chevron {
  color: var(--bs-secondary-color, var(--color-text-secondary));
  justify-self: end;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible[open] .record-detail-section-chevron {
  transform: rotate(180deg);
}

:is(lead-detail-page, job-detail-page) .record-detail-section-collapsible > :not(summary) {
  border-block-start: 1px solid var(--record-detail-line);
  padding: 0.85rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-head {
  align-items: center;
  display: flex;
  gap: 0.55rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-head > span:first-child {
  align-items: center;
  display: inline-flex;
  gap: 0.55rem;
  min-inline-size: 0;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-head .bi {
  color: var(--bs-primary, var(--bs-primary));
  display: inline-flex;
  flex: 0 0 1rem;
  font-size: 1rem;
  inline-size: 1rem;
  justify-content: center;
  line-height: 1;
  max-inline-size: 1rem;
  overflow: clip;
}

:is(lead-detail-page, job-detail-page) .record-info-list {
  display: block;
  margin: 0;
}

:is(lead-detail-page, job-detail-page) .record-info-list > div {
  border-block-end: 1px solid var(--record-detail-line);
  display: grid;
  gap: 0.35rem;
  grid-template-columns: minmax(8rem, 0.8fr) minmax(0, 1fr);
  padding-block: 0.55rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section .record-info-list > div:last-child {
  border-block-end: 0;
}

:is(lead-detail-page, job-detail-page) .record-info-list dt {
  color: var(--bs-secondary-color, var(--color-text-secondary));
  font-size: var(--font-size-2xs);
  font-weight: 700;
  text-transform: uppercase;
}

:is(lead-detail-page, job-detail-page) .record-info-list dd {
  margin: 0;
  overflow-wrap: break-word;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-more {
  border-top: 1px dashed var(--record-detail-line);
  margin-top: 0.5rem;
  padding-top: 0.5rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-more > summary {
  color: var(--bs-primary, var(--bs-primary));
  cursor: pointer;
  font-size: 0.78rem;
  font-weight: 800;
  list-style: none;
  min-block-size: 2.5rem;
}

:is(lead-detail-page, job-detail-page) .record-detail-section-more > summary::-webkit-details-marker {
  display: none;
}

job-detail-page #sharedInfoTab #actionButtons.job-design-actions-inline {
  align-items: stretch;
  border: 0;
  border-block-start: 1px solid var(--record-detail-line);
  border-radius: 0;
  box-shadow: none;
  container-type: inline-size;
  display: grid;
  gap: 0.45rem;
  margin: 0 0 0.75rem;
  padding: 0.75rem 0 0;
  width: 100%;
}

job-detail-page #sharedInfoTab #actionButtons.job-design-actions-inline > * {
  flex: 0 1 auto;
  justify-self: auto;
  width: auto;
}

profile-page {
  --profile-touch-target-min: 48px;
  --profile-touch-target-width: 48px;
  --profile-shell-gap: clamp(0.875rem, 0.76rem + 0.48vw, 1.5rem);
  --profile-column-gap: clamp(0.875rem, 0.78rem + 0.32vw, 1.25rem);
  --profile-surface-padding: clamp(0.875rem, 0.78rem + 0.36vw, 1.375rem);
  --profile-surface-radius: clamp(1rem, 0.92rem + 0.26vw, 1.375rem);
  --profile-inline-padding: clamp(0.75rem, 0.62rem + 0.36vw, 1.125rem);
  --profile-shell-max-width: 1440px;
  --profile-form-max-width: 100%;
  --profile-card-border: rgba(var(--color-brand-primary-rgb), 0.12);
  --profile-card-shadow: 0 18px 40px rgba(var(--app-palette-navy-rgb), 0.08);
  --profile-text-compact: clamp(0.875rem, 0.84rem + 0.12vw, 0.9375rem);
  --profile-control-font-size: clamp(15px, 0.9rem + 0.08vw, 16px);
  color: var(--color-text-primary);
  container-type: inline-size;
  container-name: profile-shell;
  display: block;
}

profile-page .profile-password-fields .input-group .btn {
  width: var(--profile-touch-target-width);
  min-width: var(--profile-touch-target-width);
  min-inline-size: var(--profile-touch-target-width);
  inline-size: var(--profile-touch-target-width);
  height: var(--profile-touch-target-min);
  min-height: var(--profile-touch-target-min);
  block-size: var(--profile-touch-target-min);
  min-block-size: var(--profile-touch-target-min);
  flex: 0 0 var(--profile-touch-target-width);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
  text-align: center;
}

profile-page .profile-password-fields .input-group .btn > :is(i, svg, .bi) {
  flex: 0 0 auto;
  inline-size: 1rem;
  block-size: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  line-height: 1;
}

@media (width >= 1366px) {
  profile-page {
    --profile-touch-target-min: 44px;
    --profile-touch-target-width: 44px;
  }
}

profile-page [data-testid="profile-shell"].container-max {
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  overflow-x: clip;
}

profile-page .container-max.p-0.profile-shell,
profile-page [data-testid="profile-shell"].container-max.p-0 {
  display: grid;
  align-items: stretch;
}

profile-page [data-testid="profile-shell"] {
  display: grid;
  gap: var(--profile-shell-gap);
  width: 100%;
  max-width: 100%;
  margin-inline: auto;
  min-width: 0;
  container-type: inline-size;
  container-name: profile-workspace;
}

profile-page[data-layout-mode="mobile"] {
  --profile-touch-target-min: 48px;
}

profile-page[data-layout-mode="tablet"] {
  --profile-touch-target-min: 48px;
}

profile-page[data-layout-mode="laptop"],
profile-page[data-layout-mode="desktop"] {
  --profile-touch-target-min: 44px;
  --profile-touch-target-width: 44px;
}

profile-page .profile-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--profile-shell-gap);
  width: 100%;
  min-width: 0;
  align-items: start;
}

profile-page [data-testid="profile-primary-column"],
profile-page [data-testid="profile-secondary-column"] {
  display: grid;
  gap: var(--profile-column-gap);
  min-width: 0;
  align-content: start;
  align-self: start;
}

profile-page .profile-col > flagship-card {
  min-width: 0;
  align-self: start;
}

profile-page .profile-col > flagship-card .card {
  height: auto;
  min-height: 0;
  padding: 0;
  overflow: clip;
  border: 1px solid var(--profile-card-border);
  border-radius: var(--profile-surface-radius);
  background:
    linear-gradient(180deg, rgba(var(--color-white-rgb), 0.98), rgba(var(--color-white-rgb), 0.93)),
    radial-gradient(circle at top right, rgba(var(--color-brand-primary-rgb), 0.08), transparent 58%);
  box-shadow: var(--profile-card-shadow);
}

profile-page .profile-col > flagship-card[heading="My Activity"] .card {
  overflow: visible;
}

profile-page .profile-col > flagship-card .card > .card-header {
  padding: var(--profile-surface-padding);
}

profile-page .profile-col > flagship-card .card > .card-content {
  padding: 0 var(--profile-surface-padding) var(--profile-surface-padding);
}

profile-page [data-testid="profile-form"] {
  display: grid;
  gap: var(--profile-column-gap);
  width: min(100%, var(--profile-form-max-width));
  max-width: var(--profile-form-max-width);
  min-width: 0;
  container-type: inline-size;
  container-name: profile-form;
}

profile-page [data-testid="profile-security-form"] {
  display: grid;
  gap: var(--profile-column-gap);
  width: min(100%, var(--profile-form-max-width));
  max-width: var(--profile-form-max-width);
  min-width: 0;
  container-type: inline-size;
  container-name: profile-security;
}

profile-page :is([data-testid="profile-login-history-state"], [data-testid="profile-created-jobs-state"], [data-testid="profile-assigned-jobs-state"]) {
  container-type: inline-size;
  container-name: profile-activity;
}

profile-page .profile-identity {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(0.75rem, 0.64rem + 0.3vw, 1rem);
  min-width: 0;
  padding: clamp(0.75rem, 0.66rem + 0.24vw, 1rem);
  border: 1px solid rgba(var(--color-brand-primary-rgb), 0.12);
  border-radius: calc(var(--profile-surface-radius) - 0.125rem);
  background:
    linear-gradient(180deg, rgba(var(--color-white-rgb), 0.96), rgba(var(--color-white-rgb), 0.91)),
    radial-gradient(circle at top right, rgba(var(--color-brand-primary-rgb), 0.08), transparent 60%);
}

profile-page .profile-avatar {
  inline-size: max(3.25rem, var(--profile-touch-target-min));
  block-size: max(3.25rem, var(--profile-touch-target-min));
  min-inline-size: var(--profile-touch-target-min);
  min-block-size: var(--profile-touch-target-min);
  border-radius: var(--radius-pill);
  overflow: hidden;
  position: relative;
  display: grid;
  place-items: center;
  border: 1px solid rgba(var(--color-brand-primary-rgb), 0.18);
  background: linear-gradient(135deg, rgba(var(--color-brand-primary-rgb), 0.18), rgba(var(--color-brand-accent-rgb), 0.22));
}

profile-page .profile-avatar-image {
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
  display: block;
}

profile-page .profile-avatar-fallback {
  position: absolute;
  inset: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: clamp(0.95rem, 0.92rem + 0.1vw, 1.05rem);
  font-weight: var(--font-weight-bold);
  color: var(--color-brand-primary-800);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  opacity: 0;
  transition: opacity var(--dur-fast) var(--ease-out);
}

profile-page .profile-avatar.is-fallback .profile-avatar-fallback {
  opacity: 1;
}

profile-page .profile-identity-meta {
  display: grid;
  gap: 0.25rem;
  min-width: 0;
}

profile-page .profile-identity-name {
  font-size: clamp(1rem, 0.96rem + 0.14vw, 1.125rem);
  font-weight: var(--font-weight-semibold);
  line-height: 1.25;
  overflow-wrap: break-word;
}

profile-page .profile-identity-email {
  font-size: var(--profile-text-compact);
  line-height: 1.5;
  overflow-wrap: break-word;
}

profile-page .profile-account-fields,
profile-page .profile-password-fields,
profile-page .profile-security-fields,
profile-page .profile-form-actions {
  display: grid;
  gap: clamp(0.75rem, 0.67rem + 0.22vw, 1rem);
}

profile-page .profile-account-fields > .profile-field,
profile-page .profile-password-fields > .profile-field,
profile-page .profile-security-fields > .profile-field,
profile-page .profile-form-actions > * {
  min-width: 0;
}

profile-page .profile-account-fields > .profile-field,
profile-page .profile-password-fields > .profile-field,
profile-page .profile-security-fields > .profile-field {
  margin-bottom: 0;
}

profile-page .profile-divider {
  margin: 0;
}

profile-page .profile-form-actions {
  justify-items: start;
}

profile-page .profile-form-actions > :is(.mt-2, .mt-3) {
  margin-top: 0;
}

profile-page .profile-dirty-state {
  min-height: 1.25rem;
}

profile-page :is(#profilePasswordPolicy, #profileEmailDisplay, .profile-dirty-state small, .responsive-text, .login-history-ip, .login-history-time, .login-history-reason) {
  font-size: max(0.875rem, 14px, clamp(0.8125rem, 0.79rem + 0.18vw, 0.9375rem));
  line-height: 1.5;
}

profile-page #profileEmailDisplay {
  display: none;
  margin-top: 0;
}

profile-page .profile-status {
  width: min(100%, 36rem);
  margin-top: 0;
}

profile-page :is(#profileEmail, #profileRole, #profileName, #profileCurrentPassword, #profilePassword, #profilePasswordConfirm, #newSecurityQuestion, #newSecurityAnswer) {
  font-size: var(--profile-control-font-size);
  line-height: 1.4;
  block-size: var(--profile-touch-target-min);
  height: var(--profile-touch-target-min);
}

profile-page :is(#profileEmail, #profileRole, #profileName, #profileCurrentPassword, #profilePassword, #profilePasswordConfirm, #newSecurityQuestion, #newSecurityAnswer, #profileSubmitButton, #securitySubmitButton, .profile-tabs .nav-link, .profile-security-disclosure > summary, .profile-job-item, .profile-password-fields .input-group .btn) {
  transition:
    background-color var(--dur-fast) var(--ease-out),
    border-color var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out),
    opacity var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out);
}

profile-page :is(#profileName, #profileCurrentPassword, #profilePassword, #profilePasswordConfirm, #newSecurityQuestion, #newSecurityAnswer, #profileSubmitButton, #securitySubmitButton, .profile-tabs .nav-link, .profile-password-fields .input-group .btn) {
  min-height: var(--profile-touch-target-min);
  min-block-size: var(--profile-touch-target-min);
}

profile-page :is(#profileEmail, #profileRole) {
  min-height: var(--profile-touch-target-min);
}

profile-page .profile-action {
  display: inline-flex;
  align-items: center;
  width: 100%;
  justify-content: center;
  font-size: clamp(0.95rem, 0.92rem + 0.08vw, 1rem);
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  white-space: normal;
  overflow: visible;
  block-size: auto;
  height: auto;
  min-block-size: var(--profile-touch-target-min);
  padding-inline: clamp(1rem, 0.9rem + 0.3vw, 1.35rem);
}

profile-page .touch-target {
  min-height: var(--profile-touch-target-min);
}

profile-page :is(.form-control, .form-select):focus {
  border-color: rgba(var(--color-brand-primary-rgb), 0.5);
  box-shadow: 0 0 0 0.2rem rgba(var(--color-brand-primary-rgb), 0.16);
}

profile-page :is(button, a, input, select, summary):focus-visible {
  outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.72);
  outline-offset: 2px;
}

profile-page :is(.profile-action, .profile-tabs .nav-link, .profile-password-fields .input-group .btn):active:not(:disabled) {
  transform: translateY(1px);
}

profile-page :is(button, input, select):disabled,
profile-page :is(button, input, select)[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.68;
}

profile-page :is(#profileEmail, #profileRole):disabled {
  opacity: 1;
}

profile-page .security-question-section :is(.small, .form-label.small) {
  font-size: var(--profile-text-compact);
  line-height: 1.5;
}

profile-page .profile-security-fields :is(.form-select-sm, .form-control-sm) {
  font-size: var(--profile-control-font-size);
}

profile-page form[data-ui-state="submitting"] {
  pointer-events: none;
  cursor: progress;
}

profile-page form[data-ui-state="submitting"] .profile-action {
  opacity: 0.92;
}

profile-page form[data-ui-state="submitting"] .profile-action .spinner-border {
  flex: 0 0 auto;
  margin-inline-end: 0.45rem;
}

profile-page[data-ui-state="submitting"] {
  cursor: progress;
}

profile-page #profileForm .input-group > .form-control {
  min-width: 0;
}

profile-page .form-text.text-danger,
profile-page .profile-job-code,
profile-page .login-history-agent,
profile-page .login-history-ip,
profile-page .login-history-time {
  overflow-wrap: break-word;
  word-break: break-word;
}

profile-page .form-control.is-invalid,
profile-page .form-select.is-invalid {
  border-color: rgba(var(--color-danger-rgb), 0.72);
  box-shadow: 0 0 0 0.14rem rgba(var(--color-danger-rgb), 0.12);
}

profile-page .form-control.is-valid,
profile-page .form-select.is-valid {
  border-color: rgba(var(--color-success-rgb), 0.72);
  box-shadow: 0 0 0 0.14rem rgba(var(--color-success-rgb), 0.1);
}

profile-page .profile-status.alert-success {
  border-color: rgba(var(--color-success-rgb), 0.22);
  background: rgba(var(--color-success-rgb), 0.1);
}

profile-page .profile-status.alert-danger {
  border-color: rgba(var(--color-danger-rgb), 0.22);
  background: rgba(var(--color-danger-rgb), 0.1);
}

profile-page .profile-status.alert-warning {
  border-color: rgba(var(--color-warning-rgb), 0.28);
  background: rgba(var(--color-warning-rgb), 0.12);
}

profile-page .profile-state {
  position: relative;
  min-height: clamp(12rem, 22vh, 16rem);
}

profile-page .profile-state--jobs {
  min-height: clamp(13rem, 26vh, 18rem);
}

profile-page .profile-state[data-state="ready"] {
  min-height: 0;
}

profile-page .profile-state--jobs[data-state="ready"] {
  min-height: 0;
}

profile-page .profile-state__panel,
profile-page .profile-state__content {
  display: none;
}

profile-page .profile-state[data-state="loading"] .profile-state__panel--loading,
profile-page .profile-state[data-state="empty"] .profile-state__panel--empty,
profile-page .profile-state[data-state="error"] .profile-state__panel--error,
profile-page .profile-state[data-state="forbidden"] .profile-state__panel--forbidden,
profile-page .profile-state[data-state="ready"] .profile-state__content {
  display: block;
}

profile-page .profile-state--jobs .profile-state__content {
  overflow: visible;
}

profile-page .profile-state--jobs:is([data-state="empty"], [data-state="error"], [data-state="forbidden"]) {
  min-height: 0;
}

profile-page .profile-state .empty-state {
  padding: clamp(1rem, 0.88rem + 0.3vw, 1.35rem);
}

profile-page #profilePasswordStrength {
  display: block;
  min-height: 0;
}

profile-page .profile-tabs {
  display: grid;
  gap: 0.625rem;
  margin: 0;
  padding: 0;
  border-bottom: 0;
}

profile-page .profile-tabs .nav-item {
  min-width: 0;
  margin: 0;
}

profile-page .profile-tabs .nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 100%;
  block-size: var(--profile-touch-target-min);
  height: var(--profile-touch-target-min);
  padding: 0.5rem 1rem;
  border: 1px solid rgba(var(--color-brand-primary-rgb), 0.14);
  border-radius: var(--radius-pill);
  background: rgba(var(--color-white-rgb), 0.94);
  color: var(--color-text-primary);
  font-size: clamp(0.92rem, 0.88rem + 0.1vw, 0.98rem);
  line-height: 1.25;
  text-align: center;
  box-shadow: 0 10px 24px rgba(var(--app-palette-navy-rgb), 0.04);
}

profile-page .profile-tabs .nav-link.active {
  background: rgba(var(--color-brand-primary-rgb), 0.12);
  border-color: rgba(var(--color-brand-primary-rgb), 0.34);
  color: var(--color-brand-primary-800);
  box-shadow: 0 12px 24px rgba(var(--app-palette-navy-rgb), 0.08);
}

profile-page .profile-tabs .nav-link:focus-visible {
  outline: 2px solid rgba(var(--color-brand-primary-rgb), 0.6);
  outline-offset: 2px;
}

profile-page .profile-security-disclosure {
  display: grid;
  gap: 0.75rem;
}

profile-page .profile-security-disclosure > summary {
  align-items: center;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  min-block-size: var(--profile-touch-target-min);
  font-size: 0.95rem;
  font-weight: 700;
  list-style: none;
}

profile-page .profile-security-disclosure > summary::-webkit-details-marker {
  display: none;
}

profile-page .profile-security-disclosure:not([open]) .profile-security-disclosure-body {
  display: none;
}

profile-page .profile-security-card .card-content {
  display: grid;
  gap: 0.75rem;
}

profile-page[data-layout-mode="mobile"] .profile-grid,
profile-page[data-layout-mode="tablet"] .profile-grid {
  grid-template-columns: minmax(0, 1fr);
}

profile-page[data-layout-mode="laptop"] .profile-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
}

profile-page[data-layout-mode="desktop"] .profile-grid {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
}

profile-page[data-layout-mode="tablet"] .profile-tabs,
profile-page[data-layout-mode="laptop"] .profile-tabs,
profile-page[data-layout-mode="desktop"] .profile-tabs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

profile-page[data-layout-mode="laptop"] .profile-action {
  width: auto;
  min-width: clamp(11rem, 16vw, 14rem);
}

profile-page[data-layout-mode="desktop"] .profile-action {
  width: auto;
  min-width: clamp(11.5rem, 12vw, 14rem);
}

profile-page .profile-jobs-list,
profile-page #createdJobsList,
profile-page #assignedJobsList {
  text-align: left;
  align-items: stretch;
}

profile-page .profile-list-summary {
  grid-column: 1 / -1;
  display: block;
  list-style: none;
  margin: 0;
  padding: 0.625rem 0.75rem 0;
  color: var(--color-text-secondary);
  font-size: var(--profile-text-compact);
  line-height: 1.5;
}

profile-page .profile-list-summary:last-child {
  padding-bottom: 0.25rem;
}

profile-page .profile-job-item,
profile-page .login-history-item {
  min-width: 0;
}

profile-page .profile-job-item {
  display: grid;
  gap: 0.625rem;
  width: 100%;
  align-items: start;
  text-align: left;
}

profile-page .profile-job-main,
profile-page .login-history-main {
  min-width: 0;
}

profile-page .profile-job-meta,
profile-page .login-history-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

profile-page .profile-job-date {
  font-size: var(--profile-text-compact);
  text-align: left;
}

profile-page .login-history-row {
  display: grid;
  gap: 0.625rem;
}

profile-page .login-history-agent {
  line-height: 1.35;
  max-inline-size: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

profile-page .login-history-agent.is-truncated {
  cursor: help;
}

profile-page .security-question-section {
  display: grid;
  gap: 0.75rem;
}

profile-page .security-question-section .profile-security-fields {
  display: grid;
  gap: 0.75rem;
}

profile-page .security-question-section .profile-field--security-question,
profile-page .security-question-section .profile-field--security-answer {
  margin-bottom: 0;
}

profile-page .security-question-section .form-label.small {
  margin-bottom: 0.35rem;
  font-size: var(--profile-text-compact);
  letter-spacing: 0;
  text-transform: none;
}

profile-page .security-question-section .form-control-sm,
profile-page .security-question-section .form-select-sm {
  min-height: var(--profile-touch-target-min);
}

profile-page .security-question-section .form-select {
  max-width: 100%;
}

@container profile-workspace (width >= 48rem) {
  profile-page [data-testid="profile-shell"] {
    gap: clamp(1rem, 0.88rem + 0.34vw, 1.625rem);
  }
}

@container profile-form (width < 42rem) {
  profile-page .profile-identity {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
  }

  profile-page .profile-form-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}

@container profile-form (width >= 34rem) {
  profile-page .profile-account-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  profile-page .profile-field--name {
    grid-column: 1 / -1;
  }
}

@container profile-security (width < 30rem) {
  profile-page .profile-security-fields,
  profile-page .profile-form-actions--security {
    grid-template-columns: minmax(0, 1fr);
  }
}

@container profile-activity (width < 34rem) {
  profile-page .profile-job-item,
  profile-page .login-history-row {
    grid-template-columns: minmax(0, 1fr);
  }

  profile-page .profile-job-date {
    justify-self: start;
    white-space: normal;
  }

  profile-page .login-history-meta {
    justify-content: flex-start;
    text-align: left;
  }
}

@container profile-activity (width >= 34rem) {
  profile-page .profile-job-item,
  profile-page .login-history-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
  }

  profile-page .profile-job-date {
    justify-self: end;
    text-align: right;
    white-space: nowrap;
  }

  profile-page .login-history-meta {
    justify-content: flex-end;
    text-align: right;
  }
}

@media (width < 768px) {
  profile-page {
    --profile-touch-target-min: 48px;
    --profile-touch-target-width: 48px;
  }

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

  profile-page .profile-tabs {
    grid-template-columns: minmax(0, 1fr);
  }

  profile-page .profile-action {
    width: 100%;
  }

  profile-page #profilePasswordStrength {
    min-height: 0;
  }

  profile-page .profile-col > flagship-card .card {
    transform: none;
  }

  profile-page .profile-security-card .card-content {
    gap: 0.5rem;
  }

  profile-page .profile-state--jobs {
    min-height: clamp(10rem, 34vh, 14rem);
  }

  profile-page .profile-state {
    min-height: clamp(10rem, 28vh, 13rem);
  }
}


@media (width >= 768px) and (width < 1366px) {
  profile-page {
    --profile-touch-target-min: 48px;
    --profile-touch-target-width: 48px;
  }

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

  profile-page .profile-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  profile-page .profile-col > flagship-card .card > .card-content {
    padding: 0 var(--profile-surface-padding) var(--profile-surface-padding);
  }

  profile-page .profile-col > flagship-card .card {
    transform: none;
  }

  profile-page #profilePasswordStrength {
    min-height: clamp(1.5rem, 2.5vh, 2rem);
  }

  profile-page .profile-state--jobs {
    min-height: clamp(11rem, 24vh, 15rem);
  }
}


@media (width >= 1366px) and (width < 1920px) {
  profile-page {
    --profile-touch-target-min: 44px;
    --profile-touch-target-width: 44px;
    --profile-shell-max-width: 1366px;
  }

  profile-page .profile-grid {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  }

  profile-page .profile-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  profile-page .profile-action {
    width: auto;
    min-width: clamp(11rem, 16vw, 14rem);
  }

  profile-page .profile-tabs .nav-link:hover {
    border-color: rgba(var(--color-brand-primary-rgb), 0.28);
    color: var(--color-brand-primary-800);
  }

  profile-page .profile-col > flagship-card .card:hover {
    transform: translateY(-1px);
    box-shadow: 0 22px 42px rgba(var(--app-palette-navy-rgb), 0.11);
  }

  profile-page #profilePasswordStrength {
    min-height: clamp(1.75rem, 2.4vh, 2.25rem);
  }
}

@media (width >= 1920px) {
  profile-page {
    --profile-touch-target-min: 44px;
    --profile-touch-target-width: 44px;
    --profile-shell-max-width: 1440px;
  }

  profile-page .profile-grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  }

  profile-page .profile-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  profile-page .profile-action {
    width: auto;
    min-width: clamp(11.5rem, 12vw, 14rem);
  }

  profile-page .profile-tabs .nav-link:hover {
    border-color: rgba(var(--color-brand-primary-rgb), 0.28);
    color: var(--color-brand-primary-800);
  }

  profile-page .profile-col > flagship-card .card:hover {
    transform: translateY(-1px);
    box-shadow: 0 22px 42px rgba(var(--app-palette-navy-rgb), 0.11);
  }

  profile-page #profilePasswordStrength {
    min-height: clamp(2rem, 2.2vh, 2.5rem);
  }
}


/* Generate Proposal / Generate PVSyst Report CTAs (SPECIFICATION.md D28) */
.btn-generate-proposal,
.action-chip.btn-generate-proposal {
  background: var(--action-generate-proposal, var(--app-palette-blue));
  border-color: var(--action-generate-proposal, var(--app-palette-blue));
  color: var(--on-generate-proposal, var(--color-text-inverse, var(--color-white)));
}
.btn-generate-proposal:hover,
.btn-generate-proposal:focus {
  background: var(--action-generate-proposal-hover, var(--app-palette-blue));
  border-color: var(--action-generate-proposal-hover, var(--app-palette-blue));
  color: var(--on-generate-proposal, var(--color-text-inverse, var(--color-white)));
}
.btn-generate-pvsyst,
.action-chip.btn-generate-pvsyst {
  background: var(--action-generate-pvsyst, var(--app-palette-teal-solid));
  border-color: var(--action-generate-pvsyst, var(--app-palette-teal-solid));
  color: var(--on-generate-pvsyst, var(--color-text-inverse, var(--color-white)));
}
.btn-generate-pvsyst:hover,
.btn-generate-pvsyst:focus {
  background: var(--action-generate-pvsyst-hover, var(--app-palette-teal-solid));
  border-color: var(--action-generate-pvsyst-hover, var(--app-palette-teal-solid));
  color: var(--on-generate-pvsyst, var(--color-text-inverse, var(--color-white)));
}