/*
 * DZ INV operational experience layer.
 * Native CSS only: the existing shell and route modules already provide the
 * right behavior, permissions, and state model.
 */

:root {
  --content-max: 1760px;
  --page-gutter: clamp(16px, 1.8vw, 28px);
  --section-gap: clamp(12px, 1.2vw, 16px);
  --line-strong: #343a40;
  --surface-hover: #0d1114;
  --text-soft: #c8cdd2;
}

body.product-foundation {
  --sidebar-track-width: var(--sidebar-width);
  background: var(--workspace);
  font-variant-numeric: tabular-nums;
}

body.product-foundation.sidebar-rail {
  --sidebar-track-width: var(--sidebar-rail-width);
}

body.product-foundation .product-shell {
  grid-template-columns: var(--sidebar-track-width) minmax(0, 1fr);
  height: calc(100vh - var(--bottom-bar-height));
}

body.product-foundation .product-sidebar {
  position: static;
  min-height: 0;
  gap: 10px;
  padding: 0 10px 12px;
  border-inline-start-color: var(--line);
  background: #0b1117;
}

body.product-foundation .sidebar-brand {
  min-height: var(--topbar-height);
  height: var(--topbar-height);
  gap: 6px;
  margin-inline: -10px;
  padding: 0 6px 0 6px;
  border-block-end: 1px solid var(--line);
}

body.product-foundation .sidebar-brand strong {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  color: var(--text);
  direction: ltr;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-align: start;
  text-overflow: clip;
  unicode-bidi: isolate;
  white-space: nowrap;
}

body.product-foundation .sidebar-brand small {
  display: none;
}

body.product-foundation .sidebar-brand-copy {
  display: grid;
  flex: 1 1 auto;
  min-width: 0;
  gap: 2px;
  overflow: hidden;
}

body.product-foundation .sidebar-brand-symbol {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
  place-items: center;
}

body.product-foundation .sidebar-brand-logo,
body.product-foundation .brand-mark {
  grid-area: 1 / 1;
  width: 36px;
  min-width: 36px;
  max-width: 36px;
  height: 36px;
  border: 1px solid #5b3831;
  border-radius: 12px;
  object-fit: contain;
  background: #11151a;
}

body.product-foundation .brand-mark {
  display: grid;
  place-items: center;
  color: var(--brand);
  clip-path: none;
  font-size: .82rem;
  font-weight: 900;
  letter-spacing: .08em;
}

body.product-foundation .brand-mark::before {
  display: none;
}

body.product-foundation .nav-group-label {
  padding: 2px 9px 4px;
  color: #737b82;
  font-size: .66rem;
  letter-spacing: .08em;
}

body.product-foundation .product-sidebar .workspace-nav {
  gap: 2px;
  padding-inline: 0;
  scrollbar-color: #30363b transparent;
}

body.product-foundation .product-sidebar .nav-button {
  position: relative;
  min-height: 44px;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #aeb5bb;
  background: transparent;
  font-size: .82rem;
  font-weight: 720;
  line-height: 1.2;
  white-space: normal;
}

body.product-foundation .sidebar-width-probe {
  position: fixed;
  inset: 0 auto auto 0;
  visibility: hidden;
  width: max-content;
  max-width: none;
  pointer-events: none;
}

body.product-foundation .sidebar-width-probe :is(.nav-button, .nav-category-trigger) {
  width: max-content;
}

body.product-foundation .nav-category-trigger {
  white-space: nowrap;
}

body.product-foundation .product-sidebar .nav-button:hover {
  border-color: #252a2f;
  color: var(--text);
  background: #080a0c;
}

body.product-foundation .product-sidebar .nav-button.active {
  border-color: transparent;
  color: #fff;
  background: #2b1718;
  box-shadow: none;
}

body.product-foundation .product-sidebar .nav-button.active::after {
  position: absolute;
  inset-block: 8px;
  inset-inline-end: -1px;
  width: 2px;
  background: var(--brand);
  content: "";
}

body.product-foundation .product-sidebar .nav-button.active .nav-icon {
  color: var(--brand);
}

body.product-foundation .nav-icon svg {
  width: 18px;
  height: 18px;
}

body.product-foundation .command-bar svg,
body.product-foundation .product-sidebar svg,
body.product-foundation .mobile-bottom-nav svg,
body.product-foundation dialog svg {
  stroke-width: 1.7;
}

body.product-foundation .product-sidebar .welcome {
  gap: 8px;
  margin-block-end: 0;
  padding: 12px 6px 0;
  border: 0;
  border-block-start: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .product-sidebar .welcome h2 {
  margin: 0;
  font-size: .84rem;
}

body.product-foundation .product-sidebar .welcome button,
body.product-foundation .drawer-close {
  border-color: transparent;
  border-radius: 4px;
  background: transparent;
}

body.product-foundation .sidebar-collapse {
  flex: 0 0 44px;
  width: 44px;
  min-width: 44px;
  height: 44px;
  margin-inline-start: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  color: var(--text-soft);
  background: #11151a;
}

body.product-foundation .sidebar-collapse:hover {
  border-color: #3b4248;
  color: #fff;
  background: var(--surface-hover);
}

body.product-foundation .sidebar-collapse:active {
  border-color: #4a525a;
  color: #fff;
  background: #080a0c;
}

body.product-foundation .sidebar-collapse:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 2px;
}

body.product-foundation .sidebar-collapse svg {
  width: 18px;
  height: 18px;
}

body.product-foundation .drawer-close {
  display: none;
}

body.product-foundation .sidebar-collapsed {
  grid-template-columns: var(--sidebar-rail-width) minmax(0, 1fr);
}

body.product-foundation .sidebar-collapsed .product-sidebar {
  padding-inline: 8px;
}

body.product-foundation .sidebar-collapsed .sidebar-brand {
  justify-content: center;
  margin-inline: -8px;
  padding-inline: 8px;
}

body.product-foundation .sidebar-collapsed :is(.sidebar-brand-symbol, .sidebar-brand-copy) {
  display: none;
}

body.product-foundation .sidebar-collapsed .sidebar-collapse {
  margin-inline: auto;
}

body.product-foundation .sidebar-collapsed :is(.nav-button, .nav-category-trigger) {
  width: 44px;
  min-width: 44px;
  min-height: 44px;
  margin-inline: auto;
  padding: 0;
  justify-content: center;
}

body.product-foundation .sidebar-collapsed :is(.nav-button, .nav-category-trigger) > :not(.nav-icon) {
  display: none;
}

@media (min-width: 821px) {
  body.product-foundation .sidebar-collapsed .product-sidebar {
    overflow-x: hidden;
  }

  body.product-foundation .sidebar-collapsed .nav-group-label,
  body.product-foundation .sidebar-collapsed .product-sidebar .welcome,
  body.product-foundation .sidebar-collapsed .nav-badge {
    display: none;
  }
}

body.product-foundation .command-bar {
  height: var(--topbar-height);
  min-height: var(--topbar-height);
  gap: 10px;
  padding: 0 var(--page-gutter);
  border-block-end-color: var(--line);
  background: #0b1117;
  box-shadow: none;
  backdrop-filter: none;
}

body.product-foundation .command-context {
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: baseline;
  gap: 8px;
}

body.product-foundation .command-context .page-heading {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 820;
  letter-spacing: -.018em;
}

body.product-foundation .breadcrumb {
  color: #737c84;
  font-size: .69rem;
  white-space: nowrap;
}

/* One nav: hide sibling strips that repeat the sidebar leaf. */
body.product-foundation .product-content :is(
  .wz-link-button,
  .rd-back,
  .mw-link-button,
  .leaf-back
) {
  display: none;
}

.visually-hidden,
body.product-foundation .product-content #users-title {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

body.product-foundation .product-content :is(
  #master-data-title,
  #workforce-page-title,
  #wizenet-title,
  #ravihit-title,
  #checklists-title,
  #issued-documents-title,
  #imports-panel .import-heading h2,
  .occ-page-heading h2,
  #wizenet-panel > .wz-heading .eyebrow,
  #ravihit-panel > .rd-heading .eyebrow,
  #checklists-panel > .mw-heading .eyebrow,
  #issued-documents-panel > .rd-heading .eyebrow,
  .occ-page-heading .eyebrow
) {
  display: none;
}

body.product-foundation .command-actions {
  gap: 6px;
}

body.product-foundation #notification-button {
  position: relative;
  width: 44px;
  min-width: 44px;
  height: 44px;
  border-color: transparent;
  border-radius: 4px;
  color: var(--text-soft);
  background: transparent;
}

body.product-foundation #notification-button:hover {
  border-color: #3b4248;
  color: #fff;
  background: #080a0c;
}

body.product-foundation .notification-count {
  position: absolute;
  inset-block-start: 3px;
  inset-inline-end: 3px;
  display: grid;
  min-width: 18px;
  height: 18px;
  place-items: center;
  padding-inline: 4px;
  border: 2px solid #0b1117;
  border-radius: 999px;
  color: #fff;
  background: var(--brand);
  font-size: .625rem;
  font-weight: 900;
  line-height: 1;
}

body.product-foundation .command-search {
  min-width: 190px;
  min-height: 44px;
  padding-inline: 11px;
  border-radius: 10px;
  background: #0f1820;
}

body.product-foundation .related-routes {
  display: flex;
  min-width: 0;
  flex: 0 0 auto;
  gap: 24px;
  padding: 0 var(--page-gutter);
  overflow-x: auto;
  border-block-end: 1px solid var(--line);
  background: #0b1117;
  scrollbar-width: thin;
}

body.product-foundation .related-routes[hidden] {
  display: none;
}

body.product-foundation .related-routes a {
  display: inline-flex;
  min-height: 44px;
  flex: 0 0 auto;
  align-items: center;
  padding-inline: 2px;
  border: 0;
  border-block-end: 2px solid transparent;
  border-radius: 0;
  color: #959da4;
  background: transparent;
  text-decoration: none;
  white-space: nowrap;
}

body.product-foundation .related-routes a:hover {
  border-block-end-color: #555d64;
  color: #fff;
}

body.product-foundation .related-routes a[aria-current="page"] {
  border-block-end-color: var(--brand);
  color: #fff;
  background: transparent;
  box-shadow: none;
}

body.product-foundation .command-actions > *,
body.product-foundation .command-actions button {
  flex: 0 0 auto;
}

body.product-foundation .command-search,
body.product-foundation .command-actions .secondary,
body.product-foundation .user-menu-trigger {
  border-color: transparent;
  border-radius: 4px;
  background: transparent;
}

body.product-foundation .command-search {
  min-width: 160px;
  border-block-end-color: #32383e;
  border-radius: 0;
}

body.product-foundation .command-search:hover,
body.product-foundation .command-actions .secondary:hover,
body.product-foundation .user-menu-trigger:hover {
  border-color: #3b4248;
  background: #080a0c;
}

body.product-foundation .user-menu[popover] {
  position: fixed;
  inset: auto;
  inset-block-start: calc(var(--topbar-height) + 8px);
  inset-inline-end: max(10px, var(--page-gutter));
  width: min(240px, calc(100vw - 20px));
  margin: 0;
  padding: 12px;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  color: var(--text);
  background: var(--surface);
  box-shadow: 0 20px 48px #000a;
}

body.product-foundation .user-menu:popover-open {
  display: grid;
  gap: 6px;
}

body.product-foundation .user-menu > span {
  color: var(--muted);
  font-size: .78rem;
}

body.product-foundation .user-menu > button {
  width: 100%;
  min-height: 44px;
  text-align: start;
  color: var(--text);
  background: var(--surface-raised);
}

body.product-foundation dialog.app-dialog.command-palette > form,
body.product-foundation dialog.app-dialog .users-form {
  grid-template-columns: 1fr;
  gap: 0;
  padding: 0;
}

body.product-foundation dialog.app-dialog.command-palette [data-dialog-scroll],
body.product-foundation dialog.app-dialog .users-form > [data-dialog-scroll] {
  display: grid;
  gap: 12px;
}

body.product-foundation dialog.app-dialog.command-palette .global-search-results {
  max-height: none;
}

body.product-foundation .environment-chip {
  min-height: 26px;
  padding: 3px 7px;
  border-color: #652926;
  border-radius: 2px;
  color: #ff7770;
  background: transparent;
}

body.product-foundation .quick-action {
  min-height: 44px;
  padding-inline: 14px;
  border: 1px solid var(--brand);
  border-radius: 4px;
  background: var(--brand);
  box-shadow: none;
}

body.product-foundation .quick-action:hover {
  background: #e5342b;
}

body.product-foundation .product-content {
  width: min(100%, var(--content-max));
  padding: var(--page-gutter);
  scrollbar-color: #30363b transparent;
}

body.product-foundation .product-content > section,
body.product-foundation .product-content > div {
  min-width: 0;
}

body.product-foundation h1,
body.product-foundation h2,
body.product-foundation h3 {
  color: #f7fafc;
  letter-spacing: -.018em;
}

body.product-foundation h2 {
  font-size: clamp(1.2rem, 1.6vw, 1.45rem);
}

body.product-foundation h3 {
  font-size: 1rem;
}

body.product-foundation .muted {
  color: #93a0ac;
}

body.product-foundation .eyebrow {
  color: #ff716b;
  font-size: .7rem;
  letter-spacing: .06em;
}

body.product-foundation .card {
  margin-block-end: var(--section-gap);
  padding: clamp(15px, 1.35vw, 20px);
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--surface);
  background-image: none;
  box-shadow: none;
}

body.product-foundation .section-heading,
body.product-foundation .section-title,
body.product-foundation .field-section-heading {
  min-width: 0;
  align-items: center;
  gap: 14px;
  margin-block-end: 14px;
}

body.product-foundation .section-heading > div,
body.product-foundation .section-title > div {
  min-width: 0;
}

body.product-foundation .section-heading > button,
body.product-foundation .section-title > button {
  width: auto;
  flex: 0 0 auto;
}

body.product-foundation button,
body.product-foundation .button {
  border-radius: 4px;
}

body.product-foundation button:active,
body.product-foundation .button:active {
  transform: translateY(1px);
}

body.product-foundation .secondary,
body.product-foundation .ghost,
body.product-foundation .tab {
  border-color: #30363b;
  color: #d4dce3;
  background: #090c0f;
}

body.product-foundation .secondary:hover,
body.product-foundation .ghost:hover,
body.product-foundation .tab:hover {
  border-color: #4a5158;
  color: #fff;
  background: #101418;
}

body.product-foundation input,
body.product-foundation select,
body.product-foundation textarea {
  min-height: 46px;
  border-color: #30363b;
  border-radius: 4px;
  color: var(--text);
  background: #030405;
}

body.product-foundation input:hover,
body.product-foundation select:hover,
body.product-foundation textarea:hover {
  border-color: #4a5158;
}

body.product-foundation input::placeholder,
body.product-foundation textarea::placeholder {
  color: #6f7d89;
}

body.product-foundation label {
  color: #c6d0d8;
  font-size: .84rem;
}

body.product-foundation .filters,
body.product-foundation .filter-bar {
  grid-template-columns: repeat(auto-fit, minmax(155px, 1fr));
  gap: 11px;
  align-items: end;
}

body.product-foundation .filters .search {
  grid-column: span 2;
}

body.product-foundation .filters > button,
body.product-foundation .filter-bar > button {
  width: auto;
  min-width: 112px;
  align-self: end;
}

body.product-foundation .filter-actions {
  display: flex;
  align-self: end;
  gap: 8px;
}

body.product-foundation .filter-actions > button {
  width: auto;
  min-width: 0;
  flex: 1;
}

body.product-foundation .filter-timezone {
  grid-column: 1 / -1;
  padding-block-start: 2px;
}

body.product-foundation .filter-disclosure {
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #030405;
}

body.product-foundation .filter-disclosure > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  gap: 12px;
  cursor: pointer;
  font-weight: 800;
  list-style: none;
}

body.product-foundation .filter-disclosure > summary::-webkit-details-marker {
  display: none;
}

body.product-foundation .filter-disclosure[open] > summary {
  margin-block-end: 14px;
  padding-block-end: 12px;
  border-block-end: 1px solid var(--line);
}

body.product-foundation .summary:not(.occ-summary),
body.product-foundation .reviews-kpis,
body.product-foundation .quotation-metrics,
body.product-foundation .project-metrics,
body.product-foundation .package-counts {
  gap: 0;
  overflow: hidden;
  border: 0;
  border-block: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .summary:not(.occ-summary) article,
body.product-foundation .reviews-kpis article,
body.product-foundation .quotation-metrics article,
body.product-foundation .project-metrics article,
body.product-foundation .package-counts article {
  min-width: 0;
  margin: 0;
  padding: 14px 17px;
  border: 0;
  border-inline-end: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  background-image: none;
  box-shadow: none;
}

body.product-foundation .summary:not(.occ-summary) article:first-child,
body.product-foundation .reviews-kpis article:first-child,
body.product-foundation .quotation-metrics article:first-child,
body.product-foundation .project-metrics article:first-child,
body.product-foundation .package-counts article:first-child {
  border-inline-end: 0;
}

body.product-foundation .summary:not(.occ-summary) .warning,
body.product-foundation .reviews-kpis .warning {
  color: var(--warning);
  background: #100d06;
}

body.product-foundation .summary strong,
body.product-foundation .reviews-kpis strong {
  color: #fff;
  font-size: clamp(1.5rem, 2vw, 1.9rem);
  line-height: 1.1;
}

body.product-foundation .tabs,
body.product-foundation .segmented {
  gap: 20px;
  padding: 0;
  border: 0;
  border-block-end: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .tabs > button,
body.product-foundation .segmented > button {
  min-height: 44px;
  border: 0;
  border-block-end: 2px solid transparent;
  border-radius: 0;
  background: transparent;
}

body.product-foundation .tabs > button.active,
body.product-foundation .tabs > button[aria-selected="true"],
body.product-foundation .segmented > button.active,
body.product-foundation .segmented > button[aria-pressed="true"] {
  border-block-end-color: var(--brand);
  color: #fff;
  background: transparent;
  box-shadow: none;
}

body.product-foundation .detail-grid {
  gap: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #030405;
}

body.product-foundation .detail-grid > div {
  padding: 12px 14px;
  border: 0;
  border-block-end: 1px solid var(--line);
  border-inline-end: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .detail-grid dt {
  color: #82919d;
}

body.product-foundation .detail-grid dd {
  color: #eef3f7;
}

body.product-foundation .call,
body.product-foundation .history-event,
body.product-foundation .user-row,
body.product-foundation .assignment-card {
  border-color: #252b30;
  border-radius: 4px;
  background: #07090b;
  background-image: none;
  box-shadow: none;
}

body.product-foundation .call:hover,
body.product-foundation .history-event:hover,
body.product-foundation .user-row:hover,
body.product-foundation .assignment-card:hover {
  border-color: #40474e;
  background: var(--surface-hover);
}

body.product-foundation .board > section {
  border-color: var(--line);
  border-radius: 4px;
  background: #030405;
}

body.product-foundation .ui-state,
body.product-foundation .state,
body.product-foundation .empty-state {
  border-color: #2b3136;
  border-radius: 4px;
  color: #a9b5bf;
  background: #050708;
}

body.product-foundation .ui-state-icon {
  color: #8b9aa6;
  background: #090c0f;
}

body.product-foundation dialog {
  border-color: #363d43;
  border-radius: 6px;
  color: var(--text);
  background: #050708;
}

body.product-foundation dialog::backdrop {
  background: #030507d9;
  backdrop-filter: blur(4px);
}

body.product-foundation .product-foundation,
body.product-foundation .finance-workspace .finance-overview,
body.product-foundation .finance-create,
body.product-foundation .finance-detail {
  background-image: none;
}

body.product-foundation .finance-workspace .package-counts article::after,
body.product-foundation .occ-summary article::after {
  display: none;
}

body.product-foundation .finance-panel,
body.product-foundation .operations-command-center .occ-toolbar,
body.product-foundation .occ-board-card,
body.product-foundation .occ-workload {
  border-color: var(--line);
  background: var(--surface);
  background-image: none;
}

body.product-foundation .operations-command-center .occ-toolbar {
  border-block-start: 3px solid var(--brand);
}

body.product-foundation .occ-summary {
  gap: 8px;
}

body.product-foundation .product-content .occ-summary article {
  min-height: 82px;
  padding: 13px 15px;
  border-color: #252b30;
  background: #07090b;
  background-image: none;
}

body.product-foundation .reviews-workspace,
body.product-foundation .master-data-layout,
body.product-foundation .call-editor-layout {
  gap: var(--section-gap);
}

body.product-foundation .review-completion-facts,
body.product-foundation .review-pricing-snapshot {
  margin-block-start: 12px;
}

body.product-foundation .review-pricing-snapshot {
  padding-block: 14px;
  border-block: 1px solid var(--line);
}

body.product-foundation .review-pricing-documents {
  padding-block: 14px;
  border-block-end: 1px solid var(--line);
}

body.product-foundation .review-pricing-snapshot h3 {
  margin-block-start: 0;
}

body.product-foundation .review-detail-grid {
  gap: 0;
  margin-block: 14px;
  border-block: 1px solid var(--line);
}

body.product-foundation .review-detail-grid section {
  padding: 14px;
  border: 0;
  border-block-end: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .review-detail-grid section:nth-last-child(-n + 2) {
  border-block-end: 0;
}

body.product-foundation .review-secondary {
  padding: 0;
  border: 0;
  border-block-end: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation .review-secondary > summary {
  padding: 10px 2px;
  color: var(--text-soft);
  cursor: pointer;
  font-weight: 800;
}

body.product-foundation .review-secondary > ul,
body.product-foundation .review-secondary > p {
  margin-block: 0 12px;
}

body.product-foundation #field-panel .field-workflow-nav {
  position: sticky;
  inset-block-start: 0;
  z-index: 4;
  padding-block: 8px;
  background: var(--workspace);
}

body.product-foundation #field-panel button,
body.product-foundation #field-panel .button {
  min-height: 48px;
}

body.product-foundation .site-footer {
  border-block-start-color: var(--line);
  min-height: var(--bottom-bar-height);
  height: var(--bottom-bar-height);
  padding: 0;
  background: #0b1117;
}

body.product-foundation .footer-inner {
  display: grid;
  height: 100%;
  grid-template-columns: var(--sidebar-track-width) minmax(0, 1fr);
  align-items: stretch;
  gap: 0;
}

body.product-foundation .footer-provider {
  display: flex;
  gap: 9px;
  padding-inline: 12px;
  border-inline-start: 1px solid var(--line);
  background: #0d151d;
}

body.product-foundation .footer-provider img {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  object-fit: contain;
}

body.product-foundation .footer-provider strong,
body.product-foundation .footer-version {
  font-size: .72rem;
}

body.product-foundation .footer-provider small {
  display: block;
  color: #758592;
  font-size: .58rem;
}

body.product-foundation .footer-client {
  display: none;
}

body.product-foundation .client-logo {
  max-height: 28px;
}

body.product-foundation .client-wordmark {
  padding: 4px 8px;
  border-radius: 3px;
}

body.product-foundation .footer-runtime {
  padding-inline: 16px;
}

body.product-foundation.sidebar-rail .footer-provider span {
  display: none;
}

body.product-foundation.sidebar-rail .footer-provider {
  min-width: 0;
  padding-inline: 0;
  justify-content: center;
  overflow: hidden;
}

body.product-foundation .footer-runtime {
  gap: 8px;
  color: #747d85;
  font-size: .68rem;
}

body.auth-pending {
  padding-block-end: 0;
  background: var(--workspace);
}

/* No header on auth screens (owner-approved: no topbar on login). */
body.auth-pending .auth-topbar {
  display: none;
}

/* Centered auth column: quiet intro, then the login card over the pipeline canvas. */
body.auth-pending .auth-layout {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: none;
  min-height: calc(100dvh - 48px);
  margin: 0;
  padding: 20px 20px 56px;
  background: transparent;
}

.auth-pipeline {
  display: none;
}

body.auth-pending .auth-pipeline {
  display: block;
  position: fixed;
  z-index: 0;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

body.auth-pending .auth-pipeline canvas {
  display: block;
  width: 100%;
  height: 100%;
}

body.auth-pending .auth-layout::before {
  display: none;
}

body.auth-pending .auth-hero {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(100%, 508px);
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  text-align: center;
}

body.auth-pending .auth-hero::before,
body.auth-pending .auth-hero::after {
  display: none;
}

body.auth-pending .auth-hero-art {
  display: none;
}

body.auth-pending .auth-hero-copy {
  position: static;
  max-width: none;
}

body.auth-pending .auth-kicker {
  color: #6f7d89;
  font: 800 .68rem Arial, sans-serif;
  letter-spacing: .18em;
}

body.auth-pending .auth-hero h1 {
  max-width: 508px;
  margin-block: 4px 0;
  color: var(--muted);
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;
}

body.auth-pending .auth-hero-copy > p:not(.auth-kicker) {
  display: none;
}

body.auth-pending .auth-trust {
  display: none;
}

/* Keep any leftover emblem markup from intercepting the workspace. */
.auth-emblem { display: none; }

/* Product lockup lives inside the auth cards so the brand is the first thing in the box. */
.auth-product-logo {
  display: none;
}

body.auth-pending .auth-product-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-block-end: 16px;
  padding-block-end: 16px;
  border-block-end: 1px solid var(--line);
  text-align: center;
}

body.auth-pending .auth-product-logo img {
  width: auto;
  max-width: 180px;
  height: 72px;
  flex: none;
  object-fit: contain;
}

body.auth-pending .auth-product-logo strong {
  color: var(--text);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
}

/* Centered login / change-password / session-error cards in the new shell. */
body.auth-pending #login-card,
body.auth-pending #change-password-screen,
body.auth-pending #session-error-card {
  position: relative;
  z-index: 1;
  align-self: center;
  justify-self: center;
  width: min(calc(100% - 32px), 508px);
  max-width: none;
  margin: 0;
  padding: 28px 32px 24px;
  overflow: visible;
  border: 1px solid var(--border-strong);
  border-radius: 12px;
  background: var(--surface);
  box-shadow: none;
}

body.auth-pending #login-card::after,
body.auth-pending #change-password-screen::after,
body.auth-pending #session-error-card::after {
  display: none;
}

body.auth-pending .auth-card-tag {
  border-radius: 8px;
  background: var(--surface-raised);
}

body.auth-pending #login-card h2,
body.auth-pending #change-password-screen h2,
body.auth-pending #session-error-card h2 {
  margin-block-end: 6px;
  color: var(--text);
  font-size: 1.5rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -.03em;
}

body.auth-pending #login-card > .muted,
body.auth-pending #change-password-screen > .muted,
body.auth-pending #session-error-card > .muted {
  margin-block-end: 0;
  color: #98a5b2;
  font-size: .875rem;
  line-height: 1.5;
}

/* Client-logo slot at the top of the card (same configured source as the footer). */
.auth-client-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-block-end: 12px;
  padding-block-end: 10px;
  border-block-end: 1px solid var(--line);
}

.auth-client-logo-box {
  display: grid;
  flex: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px dashed var(--border-strong);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
  color: var(--muted);
}

.auth-client-logo-box svg {
  width: 20px;
  height: 20px;
}

.auth-client-logo-caption {
  color: var(--muted);
  font-size: .75rem;
  line-height: 1.5;
}

.auth-client-logo-img {
  display: block;
  max-width: 180px;
  max-height: 48px;
  object-fit: contain;
}

.auth-client-logo:has(.auth-client-logo-img:not(.hidden)) .auth-client-logo-box,
.auth-client-logo:has(.auth-client-logo-img:not(.hidden)) .auth-client-logo-caption {
  display: none;
}

/* Unfinished tenant-logo chrome stays out of the way unless a real logo is loaded. */
.auth-client-logo:not(:has(.auth-client-logo-img:not(.hidden))) {
  display: none;
}

/* "או כניסה עם סיסמה" divider above the password form. */
.auth-or-divider {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-block: 10px;
  color: var(--muted);
  font-size: .8rem;
  font-weight: 600;
}

.auth-or-divider::before,
.auth-or-divider::after {
  flex: 1;
  height: 1px;
  background: var(--line);
  content: "";
}

body.product-foundation #reviews-panel .reviews-kpis {
  gap: 12px;
  overflow: visible;
  border: 0;
  background: transparent;
}

body.product-foundation #reviews-panel .reviews-kpis article {
  padding: 16px;
  border: 1px solid #252f38;
  border-radius: 8px;
  background: #0d131a;
}

body.product-foundation #reviews-panel .reviews-kpis article:first-child {
  border-inline-end: 1px solid #252f38;
}

body.auth-pending #login-form,
body.auth-pending #change-password-form {
  gap: 14px;
  margin-block-start: 16px;
}

body.auth-pending #login-form :is(input, button),
body.auth-pending #change-password-form :is(input, button) {
  scroll-margin-block-end: 52px;
}

body.auth-pending input {
  min-height: 48px;
  border-color: var(--border-strong);
  border-radius: 10px;
  background: var(--surface-raised);
}

body.auth-pending .password-toggle {
  border-radius: 8px;
  background: var(--surface);
}

body.auth-pending .auth-submit {
  min-height: 48px;
  border-radius: 8px;
  box-shadow: 0 10px 22px rgba(255, 59, 48, .18);
}

/* Phone-only biometric onboarding — rendered only at phone widths (see media query). */
.auth-bio-panel {
  display: none;
}

.bio-activate {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-block-end: 6px;
  padding: 12px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
}

.phone-wrap {
  flex: none;
  width: 44px;
  padding-block-start: 2px;
}

.phone-wrap svg {
  width: 44px;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .45));
}

.bio-body {
  flex: 1;
  min-width: 0;
}

.bio-body h3 {
  margin-block-end: 3px;
  font-size: 1.05rem;
  line-height: 1.25;
}

.bio-body > p {
  margin-block-end: 6px;
  color: var(--muted);
  font-size: .8rem;
  line-height: 1.5;
}

.device-line {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-block-end: 8px;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 600;
}

.bio-actions {
  display: flex;
  align-items: center;
  gap: 6px;
}

.scan-bar {
  animation: auth-scan-y 3s ease-in-out infinite;
}

.fp-pulse {
  transform-box: fill-box;
  transform-origin: center;
  animation: auth-fp-pulse 3s ease-out infinite;
}

@keyframes auth-scan-y {
  0% {
    transform: translateY(12px);
    opacity: 0;
  }
  12% {
    opacity: .9;
  }
  88% {
    opacity: .9;
  }
  100% {
    transform: translateY(76px);
    opacity: 0;
  }
}

@keyframes auth-fp-pulse {
  0% {
    transform: scale(.5);
    opacity: .75;
  }
  100% {
    transform: scale(1.4);
    opacity: 0;
  }
}

.bio-active {
  display: block;
  margin-block-end: 6px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
}

.bio-user {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-block-end: 12px;
}

.avatar {
  display: grid;
  flex: none;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid var(--border-strong);
  border-radius: 50%;
  background: var(--surface);
  color: var(--muted);
  font-size: 1.05rem;
  font-weight: 800;
}

.bio-user-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.bio-user-meta strong {
  font-size: .95rem;
}

.bio-phone {
  color: var(--muted);
  font-size: .8rem;
  font-variant-numeric: tabular-nums;
  direction: ltr;
  text-align: right;
}

.bio-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  color: var(--muted);
  font-size: .7rem;
  font-weight: 700;
}

.bio-chip i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 8px rgba(41, 211, 145, .6);
}

.bio-hint {
  margin-block-start: 10px;
  color: var(--muted);
  font-size: .72rem;
  text-align: center;
}

/* Biometric actions: honest, secondary-surface buttons; no fake auth. */
body.auth-pending #bio-enable {
  width: auto;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: #dce4ea;
  background: var(--surface-raised);
  font-size: .85rem;
  font-weight: 700;
}

body.auth-pending #bio-enable:hover:not(:disabled) {
  border-color: #536471;
  color: #fff;
  background: #1a2530;
}

body.auth-pending #bio-enable:active:not(:disabled) {
  background: #222e39;
  transform: translateY(1px);
}

body.auth-pending #bio-enable:disabled {
  border-color: #2b3742;
  color: #6f7d89;
  background: #090e13;
  opacity: 1;
}

body.auth-pending #bio-later {
  width: auto;
  min-height: 44px;
  padding: 0 10px;
  border-radius: var(--radius-sm);
  color: var(--muted);
  background: transparent;
  font-size: .85rem;
  font-weight: 700;
}

body.auth-pending #bio-later:hover:not(:disabled) {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.auth-pending #bio-later:active:not(:disabled) {
  opacity: .75;
}

body.auth-pending #bio-login {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 48px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  color: var(--text);
  background: var(--surface);
  font-size: .95rem;
  font-weight: 800;
}

body.auth-pending #bio-login:hover:not(:disabled) {
  border-color: #536471;
  background: #17212b;
}

body.auth-pending #bio-login:active:not(:disabled) {
  background: #222e39;
  transform: translateY(1px);
}

body.auth-pending #bio-login:disabled {
  border-color: #2b3742;
  color: #6f7d89;
  background: #090e13;
  opacity: 1;
}

/* SMS-recovery block — same honest help path as before (mail to the system admin). */
.auth-recovery {
  margin-block-start: 10px;
  padding-block-start: 10px;
  border-block-start: 1px dashed var(--line);
}

body.auth-pending #recovery-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 44px;
  padding: 0 4px;
  border-radius: var(--radius-sm);
  color: #b8c4cc;
  background: transparent;
  font-size: .875rem;
  font-weight: 700;
}

body.auth-pending #recovery-toggle:hover:not(:disabled) {
  color: var(--text);
}

body.auth-pending #recovery-toggle[aria-expanded="true"] {
  color: var(--text);
}

body.auth-pending #recovery-toggle:focus-visible {
  outline: 3px solid var(--auth-focus);
  outline-offset: 3px;
}

.auth-recovery-panel {
  margin-block-start: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  background: var(--surface-raised);
}

.auth-recovery-panel p {
  margin-block-end: 6px;
  color: #b8c4cc;
  font-size: .8rem;
  line-height: 1.6;
}

.auth-recovery-panel a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #d9e0e6;
  font-size: .8rem;
  font-weight: 700;
  text-underline-offset: 4px;
}

.auth-recovery-panel a:hover {
  color: #fff;
}

/* Card meta row: help link + demo preview toggle (mobile) + phone-only hint (desktop). */
body.auth-pending .auth-card-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 16px;
  margin-block-start: 14px;
  padding-block-start: 12px;
  border-block-start: 1px solid var(--line);
  color: var(--muted);
  font-size: .75rem;
  line-height: 1.5;
}

body.auth-pending .auth-card-meta a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: #d9e0e6;
  text-underline-offset: 4px;
}

body.auth-pending .auth-card-meta a:hover {
  color: #fff;
}

body.auth-pending #bio-preview-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 4px;
  border-radius: var(--radius-sm);
  color: var(--muted);
  background: transparent;
  font-size: .78rem;
  font-weight: 700;
}

body.auth-pending #bio-preview-toggle:hover:not(:disabled) {
  color: #b8c4cc;
}

body.auth-pending #bio-preview-toggle:active:not(:disabled) {
  opacity: .75;
}

.desktop-bio-hint {
  display: none;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: .75rem;
  white-space: nowrap;
}

/* Desktop (>=561px): no biometric UI, only the muted phone-only hint. */
@media (min-width: 561px) {
  body.auth-pending #bio-activate,
  body.auth-pending #bio-active,
  body.auth-pending #bio-preview-toggle {
    display: none !important;
  }

  body.auth-pending .auth-or-divider {
    display: none;
  }

  .desktop-bio-hint {
    display: inline-flex;
  }
}

/* Auth footer restyle: provider · developer + connection state + version (approved design). */
body.auth-pending .site-footer {
  min-height: 48px;
  height: 48px;
  padding-block: 4px;
  border-block-start-color: var(--line);
  background: var(--workspace);
}

body.auth-pending .footer-provider,
body.auth-pending #app-version {
  min-height: 48px;
}

body.auth-pending .footer-provider {
  gap: .55rem;
}

body.auth-pending .footer-provider span {
  display: inline-flex;
  flex-direction: row;
  align-items: baseline;
  gap: .45rem;
}

body.auth-pending .footer-provider small {
  display: inline;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: 0;
}

body.auth-pending .footer-provider small::before {
  margin-inline-end: .45rem;
  content: "·";
}

body.auth-pending .footer-provider img {
  width: 28px;
  height: 28px;
  border-radius: 6px;
}

body.auth-pending .footer-client {
  display: none;
}

body.auth-pending .footer-runtime {
  gap: .5rem;
  margin-inline-start: auto;
  color: var(--muted);
  font-size: .75rem;
}

body.auth-pending .footer-runtime > :not(.connection-state):not(.footer-version):not(#footer-environment) {
  display: none;
}

body.auth-pending .footer-version {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin: 0;
}

body.auth-pending .footer-version::before {
  margin-inline-end: .5rem;
  content: "·";
}

body.auth-pending #status {
  inset-block-end: 60px;
  border-radius: 8px;
  background: #160809;
}

body.auth-pending:has(#session-error-card:not(.hidden)) #status {
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  border: 0;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

@media (max-width: 1100px) {
  body.product-foundation .command-bar {
    gap: 8px;
  }

  body.product-foundation .filters .search {
    grid-column: auto;
  }
}

@media (max-width: 820px) {
  body.product-foundation {
    --bottom-bar-height: 60px;
  }

  body.product-foundation .product-shell,
  body.product-foundation .sidebar-collapsed {
    display: block;
  }

  body.product-foundation .product-sidebar {
    position: fixed;
    width: min(86vw, 304px);
    padding: 12px 10px calc(12px + env(safe-area-inset-bottom));
  }

  body.product-foundation .drawer-close {
    display: inline-grid;
  }

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

  body.product-foundation .sidebar-collapsed .sidebar-brand {
    justify-content: flex-start;
    min-height: 58px;
    height: auto;
    margin-inline: 0;
    padding: 0 4px 10px;
  }

  body.product-foundation .sidebar-collapsed :is(.sidebar-brand-symbol, .sidebar-brand-copy) {
    display: grid;
  }

  body.product-foundation .sidebar-collapsed :is(.nav-button, .nav-category-trigger) {
    width: 100%;
    min-width: 0;
    margin-inline: 0;
    padding: 8px 10px;
    justify-content: flex-start;
    font-size: .86rem;
  }

  body.product-foundation .sidebar-collapsed .nav-category-trigger {
    font-size: .78rem;
  }

  body.product-foundation .sidebar-collapsed :is(.nav-button, .nav-category-trigger) > :not(.nav-icon) {
    display: inline;
  }

  body.product-foundation .sidebar-collapsed .nav-badge {
    display: grid;
  }

  body.product-foundation .sidebar-collapsed .nav-group-label {
    font-size: .66rem;
  }

  body.product-foundation .product-sidebar .welcome {
    gap: 4px;
    padding-block-start: 8px;
  }

  body.product-foundation .drawer-overlay {
    background: #000c;
    backdrop-filter: none;
  }

  body.product-foundation .command-bar {
    min-height: 60px;
    padding: 7px 10px;
  }

  body.product-foundation .command-context .page-heading {
    max-width: none;
    overflow: visible;
    font-size: 1.08rem;
    line-height: 1.15;
    white-space: normal;
  }

  body.product-foundation .breadcrumb {
    display: none;
  }

  body.product-foundation .environment-chip,
  body.product-foundation #notification-button {
    display: none;
  }

  body.product-foundation .command-search {
    width: 44px;
    min-width: 44px;
    border-block-end-color: transparent;
  }

  body.product-foundation .command-search span,
  body.product-foundation .command-search kbd {
    display: none;
  }

  body.product-foundation .command-actions .quick-action {
    display: inline-grid;
    width: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    place-items: center;
  }

  body.product-foundation .command-actions .quick-action span {
    display: none;
  }

  body.product-foundation .product-content {
    padding: 10px;
  }

  body.product-foundation .related-routes {
    max-width: 100vw;
    gap: 18px;
    padding: 0 10px;
  }

  body.product-foundation .mobile-bottom-nav {
    min-height: calc(var(--bottom-bar-height) + env(safe-area-inset-bottom));
    border-block-start-color: var(--line);
    background: #0b1117;
    box-shadow: none;
    backdrop-filter: none;
  }

body.product-foundation .mobile-bottom-nav button {
    min-height: 56px;
    border-radius: 0;
    color: #8997a3;
  }

  body.product-foundation .mobile-bottom-nav button.active {
    color: #fff;
    background: transparent;
    box-shadow: inset 0 2px var(--brand);
  }

  body.auth-pending {
    padding-block-end: 0;
  }

  body.auth-pending .auth-layout {
    height: auto;
    min-height: calc(100dvh - 48px);
    margin-block-start: 0;
    padding: 20px 16px 56px;
    gap: 14px;
    background: transparent;
  }

  body.auth-pending .auth-layout::before {
    display: none;
  }

  body.auth-pending .auth-hero {
    display: none;
  }

  body.auth-pending .site-footer {
    position: static;
    inset: auto;
    height: auto;
    min-height: 48px;
  }

  body.auth-pending .footer-inner {
    flex-wrap: nowrap;
    overflow: hidden;
  }

  body.auth-pending .footer-runtime {
    min-width: 0;
  }

  body.auth-pending .auth-product-logo {
    margin-block-end: 12px;
    padding-block-end: 12px;
  }

  body.auth-pending #login-card,
  body.auth-pending #change-password-screen,
  body.auth-pending #session-error-card {
    width: min(100%, 508px);
    max-height: none;
    padding: 22px 24px 20px;
    overflow: visible;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--surface);
  }

  body.auth-pending #login-card h2,
  body.auth-pending #change-password-screen h2,
  body.auth-pending #session-error-card h2 {
    font-size: 1.5rem;
  }

  body.auth-pending .site-footer {
    position: static;
    inset: auto;
    height: auto;
    min-height: 48px;
    padding: 4px 16px;
  }

    body.auth-pending #status {
    inset-block-end: 56px;
    pointer-events: none;
  }

  body.product-foundation .summary:not(.occ-summary),
  body.product-foundation .reviews-kpis,
  body.product-foundation .quotation-metrics,
  body.product-foundation .project-metrics,
  body.product-foundation .package-counts {
    grid-template-columns: 1fr 1fr;
  }

  body.product-foundation .summary:not(.occ-summary) article,
  body.product-foundation .reviews-kpis article,
  body.product-foundation .quotation-metrics article,
  body.product-foundation .project-metrics article,
  body.product-foundation .package-counts article {
    min-height: 76px;
    padding: 12px;
    border-block-end: 1px solid var(--line);
  }

  body.product-foundation .card {
    padding: 14px;
  }

  body.product-foundation .filters,
  body.product-foundation .filter-bar {
    grid-template-columns: 1fr 1fr;
  }

  body.product-foundation .filters > button,
  body.product-foundation .filter-bar > button {
    width: 100%;
  }
}

@media (max-width: 520px) {
  body.product-foundation .command-actions {
    gap: 4px;
  }

  body.product-foundation .command-actions .quick-action {
    width: 44px;
    min-width: 44px;
    padding: 0;
  }

  body.product-foundation .filters,
  body.product-foundation .filter-bar,
  body.product-foundation form {
    grid-template-columns: 1fr;
  }

  body.product-foundation .filters .search,
  body.product-foundation .wide {
    grid-column: auto;
  }

  body.product-foundation .section-heading,
  body.product-foundation .section-title {
    align-items: stretch;
    flex-direction: column;
  }

  body.product-foundation .section-heading > button,
  body.product-foundation .section-title > button {
    width: 100%;
  }

  body.product-foundation .detail-grid {
    grid-template-columns: 1fr;
  }

  body.product-foundation .detail-grid > div {
    border-inline-end: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.product-foundation .command-bar,
  body.product-foundation .mobile-bottom-nav,
  body.product-foundation .drawer-overlay {
    backdrop-filter: none;
  }
}

@media (max-width: 620px) {
  body.product-foundation #reviews-panel.review-modal-open :is(.reviews-overview, .reviews-queue) {
    display: none;
  }

  body.product-foundation #reviews-detail[aria-modal="true"] {
    inset: 0;
    z-index: 60;
    width: 100vw;
    height: 100dvh;
    max-height: 100dvh;
    padding: 0 14px calc(198px + env(safe-area-inset-bottom));
    overflow: auto;
    overscroll-behavior: contain;
    border: 0;
    border-radius: 0;
    background: #050708;
  }

  body.product-foundation #reviews-detail[aria-modal="true"] > .section-heading {
    position: sticky;
    z-index: 2;
    inset-block-start: 0;
    margin-inline: -14px;
    padding: calc(10px + env(safe-area-inset-top)) 14px 10px;
    border-block-end: 1px solid var(--line);
    background: #050708;
  }

  body.product-foundation #reviews-detail[aria-modal="true"] > .section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
  }

  body.product-foundation #reviews-detail[aria-modal="true"] > .section-heading > button {
    width: auto;
    min-width: 96px;
  }

  body.product-foundation #reviews-detail[aria-modal="true"] #reviews-decision-form .field-actions {
    position: fixed;
    z-index: 62;
    inset-inline: 0;
    inset-block-end: 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 0;
    padding: 12px 14px calc(12px + env(safe-area-inset-bottom));
    border-block-start: 1px solid var(--line);
    background: #0d131a;
  }

  body.product-foundation:has(#reviews-detail[aria-modal="true"]) .related-routes {
    visibility: hidden;
  }
}

@media (max-width: 480px) {
  body.auth-pending #login-card,
  body.auth-pending #change-password-screen,
  body.auth-pending #session-error-card {
    padding: 18px;
  }

  body.auth-pending .auth-card-tag {
    margin-block-end: 8px;
  }

  body.auth-pending #login-form,
  body.auth-pending #change-password-form {
    margin-block-start: 16px;
  }

  body.auth-pending .auth-card-meta {
    gap: 8px;
    margin-block-start: 16px;
    padding-block-start: 8px;
  }

  .bio-activate,
  .bio-active {
    padding: 10px;
  }

  .phone-wrap,
  .phone-wrap svg {
    width: 40px;
  }
}

/* Short-height authentication screens scroll as one document so the footer never covers the form. */
@media (max-height: 700px) {
  body.auth-pending {
    min-height: 100dvh;
    padding-block-end: 0;
    overflow-y: auto;
  }

  body.auth-pending .auth-layout {
    height: auto;
    min-height: 0;
    justify-content: flex-start;
  }

  body.auth-pending #login-card,
  body.auth-pending #change-password-screen,
  body.auth-pending #session-error-card {
    align-self: center;
    max-height: none;
    overflow: visible;
  }

  body.auth-pending .site-footer {
    position: static;
    inset: auto;
    flex: 0 0 auto;
  }
}

@media (min-width: 821px) and (max-height: 700px) {
  body.auth-pending #status {
    position: static;
    grid-column: 1 / -1;
    max-width: none;
    margin: 0 clamp(20px, 4vw, 64px) 16px;
  }
}

/* V3 commercial summaries keep the shared card language instead of the flat shell treatment. */
body.product-foundation :is(#quotation-metrics, #projects-metrics, #account-package-counts) {
  gap: 12px;
  overflow: visible;
  border: 0;
  background: transparent;
}

body.product-foundation :is(#quotation-metrics, #projects-metrics, #account-package-counts) article {
  min-height: 86px;
  padding: 14px;
  border: 1px solid #2b3945;
  border-radius: 12px;
  background: #101820;
  box-shadow: var(--shadow-sm);
}

@media (max-width: 700px) {
  body.product-foundation :is(#quotation-metrics, #projects-metrics, #account-package-counts) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1100px) {
  body.product-foundation #users-panel {
    grid-template-columns: minmax(0, 1.65fr) minmax(320px, .75fr);
    align-items: start;
  }

  body.product-foundation #branding-card {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  body.product-foundation #users-panel > .card:not(#branding-card):not(#user-create-section) {
    grid-column: 1;
    grid-row: 1;
  }

  body.product-foundation #user-create-section {
    grid-column: 2;
    grid-row: 1;
    position: sticky;
    inset-block-start: 10px;
  }

  body.product-foundation #imports-panel > .card {
    grid-template-columns: minmax(320px, .78fr) minmax(0, 1.22fr);
  }
}

/* 0.6.6 visual-usability pass: preserve the supported flows and expose their hierarchy. */
body.product-foundation #calls-panel .calls-command {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

body.product-foundation #calls-panel :is(.calls-pulse, .calls-filters) {
  grid-column: 1;
}

body.product-foundation #calls-panel .calls-pulse {
  gap: 0;
  min-height: 48px;
  overflow: hidden;
  border-block: 1px solid var(--line);
}

body.product-foundation #calls-panel .calls-pulse article {
  position: relative;
  min-height: 48px;
  padding: 7px 12px;
  border: 0;
  border-inline-start: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
}

body.product-foundation #calls-panel .calls-pulse article:last-child {
  border-inline-start: 0;
}

body.product-foundation #calls-panel .calls-pulse article::before {
  display: none;
}

body.product-foundation #calls-panel .calls-query-bar {
  grid-template-columns: minmax(250px, 1.45fr) repeat(3, minmax(120px, .65fr)) auto;
}

body.product-foundation #calls-panel .calls-filter-disclosure {
  padding: 0;
  border: 0;
  background: transparent;
}

body.product-foundation #calls-panel .calls-filter-disclosure > summary {
  min-height: 28px;
}

body.product-foundation #reviews-detail {
  direction: ltr;
}

body.product-foundation #reviews-detail > * {
  direction: rtl;
}

body.product-foundation #users-kpis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-block: 14px;
}

body.product-foundation #users-kpis .status-chip {
  display: grid;
  min-height: 64px;
  align-content: center;
  padding: 10px 14px;
  border: 1px solid #29323a;
  border-radius: 4px;
  color: #dce4ea;
  background: #07090b;
  font-size: .82rem;
}

body.product-foundation #branding-card {
  margin-block-end: 0;
}

body.product-foundation #imports-panel > .import-workspace {
  display: grid;
  gap: 16px;
  padding: 0;
  border: 0;
  background: transparent;
}

body.product-foundation #imports-panel .import-heading,
body.product-foundation #imports-panel .import-history {
  grid-column: 1 / -1;
}

body.product-foundation #imports-panel .import-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  padding-block-end: 16px;
  border-block-end: 1px solid var(--line);
}

body.product-foundation #imports-panel .import-heading h2,
body.product-foundation #imports-panel .import-heading p {
  margin-block-end: 4px;
}

body.product-foundation #imports-panel .import-progress {
  display: flex;
  flex: 0 0 auto;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: import-step;
}

body.product-foundation #imports-panel .import-progress li {
  display: flex;
  align-items: center;
  min-height: 44px;
  gap: 8px;
  padding-inline: 12px;
  border-block: 1px solid #30363b;
  color: #aab5be;
  font-size: .74rem;
  font-weight: 800;
  counter-increment: import-step;
}

body.product-foundation #imports-panel .import-progress li:first-child {
  border-inline-start: 1px solid #30363b;
}

body.product-foundation #imports-panel .import-progress li:last-child {
  border-inline-end: 1px solid #30363b;
}

body.product-foundation #imports-panel .import-progress li::before {
  display: grid;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid #5b6872;
  border-radius: 50%;
  color: #fff;
  content: counter(import-step);
  font-size: .67rem;
}

body.product-foundation #imports-panel .import-progress li[aria-current="step"] {
  border-color: #ff7770;
  color: #fff;
  background: #21100f;
}

body.product-foundation #imports-panel .import-progress li[data-complete] {
  border-color: #2f705b;
  color: #72dfb7;
}

body.product-foundation #imports-panel .import-stage {
  min-width: 0;
  margin: 0;
  padding: 18px;
  border: 1px solid #29323a;
  border-radius: 6px;
  background: #07090b;
}

body.product-foundation #imports-panel .import-stage h3 {
  display: flex;
  align-items: center;
  gap: 9px;
  margin: 0 0 14px;
}

body.product-foundation #imports-panel .import-stage h3 > span {
  display: grid;
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
  place-items: center;
  border: 1px solid #7c302d;
  border-radius: 50%;
  color: #ff7770;
  font-size: .75rem;
}

body.product-foundation #imports-panel #import-form {
  grid-column: 1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 12px;
}

body.product-foundation #imports-panel .import-upload-zone {
  display: grid;
  gap: 8px;
  min-height: 150px;
  align-content: center;
  padding: 16px;
  border: 1px dashed #53616b;
  border-radius: 4px;
  background: #030405;
}

body.product-foundation #imports-panel .import-upload-zone .branding-file-control {
  min-width: 0;
  max-width: 100%;
  width: 100%;
}

body.product-foundation #imports-panel .import-upload-zone .localized-file-name {
  flex: 1;
}

body.product-foundation #imports-panel #import-mapping {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-block-start: 4px;
  padding-block-start: 16px;
  border-block-start: 1px solid var(--line);
}

body.product-foundation #imports-panel .import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

body.product-foundation #imports-panel .import-actions :is(button, .button) {
  width: auto;
}

body.product-foundation #imports-panel .import-preview-stage {
  grid-column: 2;
}

body.product-foundation #imports-panel #import-preview {
  min-height: 230px;
  margin: 14px 0 0;
  padding: 18px;
  overflow: auto;
  border: 1px solid #29323a;
  border-radius: 4px;
  color: #e6edf2;
  background: #030405;
  font-family: inherit;
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.8;
  white-space: pre-wrap;
}

body.product-foundation #imports-panel #import-preview:empty::before {
  color: #778692;
  content: "תוצאות הבדיקה יוצגו כאן לפני שמירת המלאי.";
}

body.product-foundation #imports-panel .import-history {
  margin: 0;
  padding-block-start: 16px;
}

body.product-foundation #imports-panel #imports-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

body.product-foundation #imports-panel .import-job {
  margin: 0;
}

@media (max-width: 900px) {
  body.product-foundation #calls-panel .calls-query-bar {
    grid-template-columns: 2fr 1fr 1fr;
  }

  body.product-foundation #imports-panel > .import-workspace {
    grid-template-columns: 1fr;
  }

  body.product-foundation #imports-panel :is(#import-form, .import-preview-stage) {
    grid-column: 1;
  }

  body.product-foundation #imports-panel #import-form {
    grid-template-columns: minmax(0, 1fr);
  }

  body.product-foundation #imports-panel #import-form > .wide {
    grid-column: 1;
  }

  body.product-foundation #imports-panel .import-heading {
    align-items: stretch;
    flex-direction: column;
  }

  body.product-foundation #imports-panel .import-progress li {
    flex: 1;
    justify-content: center;
  }
}

@media (max-width: 620px) {
  body.product-foundation #calls-panel .calls-pulse article {
    padding-inline-end: 8px;
  }

  body.product-foundation #calls-panel .calls-pulse article::before {
    display: none;
  }

  body.product-foundation #users-kpis,
  body.product-foundation #imports-panel #imports-list {
    grid-template-columns: 1fr;
  }

  body.product-foundation #imports-panel .import-progress {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
  }

  body.product-foundation #imports-panel .import-progress li {
    min-width: 0;
    padding-inline: 6px;
    font-size: .66rem;
    text-align: center;
  }

  body.product-foundation #imports-panel .import-progress li::before {
    display: none;
  }

  body.product-foundation #imports-panel #import-mapping {
    grid-template-columns: 1fr;
  }

  body.product-foundation #imports-panel .import-actions :is(button, .button) {
    width: 100%;
  }
}

/* Mobile compaction: keep the primary action fully on screen at 360-560px (e2e contract). */
@media (max-width: 560px) {
  body.auth-pending .auth-product-logo { gap: 6px; margin-block-end: 8px; padding-block-end: 8px; }
  body.auth-pending .auth-product-logo img { max-width: 140px; height: 56px; }
  body.auth-pending .auth-product-logo strong { font-size: .95rem; }
  body.auth-pending .auth-layout { gap: 10px; padding-block-end: 16px; }
  body.auth-pending .footer-provider span { display: none; }
  body.auth-pending .footer-provider img { width: 22px; height: 22px; }
  body.auth-pending #login-card,
  body.auth-pending #change-password-screen,
  body.auth-pending #session-error-card { padding: 16px; }
  body.auth-pending .auth-card-tag { margin-block-end: 6px; }
  body.auth-pending #login-card h2 { font-size: 1.3rem; margin-block-end: 2px; }
  body.auth-pending #login-card > .muted { font-size: .8rem; line-height: 1.4; }
  .auth-client-logo { gap: 8px; margin-block-end: 8px; padding-block-end: 8px; }
  .auth-client-logo-box { width: 36px; height: 36px; }
  .auth-client-logo-box svg { width: 16px; height: 16px; }
  .auth-client-logo-caption { font-size: .68rem; }
  .bio-activate, .bio-active { gap: 8px; padding: 8px 10px; margin-block-end: 4px; }
  .phone-wrap, .phone-wrap svg { width: 32px; }
  .bio-body h3 { font-size: .92rem; margin-block-end: 2px; }
  .bio-body > p { font-size: .73rem; line-height: 1.4; margin-block-end: 4px; }
  .device-line { margin-block-end: 5px; font-size: .66rem; gap: 2px 8px; }
  .bio-user { gap: 8px; margin-block-end: 8px; }
  .avatar { width: 36px; height: 36px; font-size: .9rem; }
  .bio-user-meta strong { font-size: .85rem; }
  .bio-chip { padding: 2px 8px; }
  .auth-or-divider { margin-block: 6px; }
  body.auth-pending #login-form,
  body.auth-pending #change-password-form { gap: 10px; margin-block-start: 10px; }
  .auth-recovery { margin-block-start: 6px; padding-block-start: 6px; }
  body.auth-pending .auth-card-meta { gap: 6px; margin-block-start: 8px; padding-block-start: 6px; }
}
/* Desktop vertical trim: hero + card fit the 900px viewport with the fixed footer. */
@media (min-width: 1101px) {
  body.auth-pending .auth-hero h1 { margin-block: 4px 0; font-size: 1.05rem; }
  body.auth-pending .auth-hero-copy > p:not(.auth-kicker) { display: none; }
  body.auth-pending .auth-hero { margin-block-end: 0; }
}