.brand-wrap { align-items: center; gap: 14px; line-height: 1.2; }
.demo-brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; height: 40px; color: white; font-size: 27px; font-weight: 600; white-space: nowrap; }
.demo-brand-mark { display: block; flex: 0 0 40px; width: 40px; height: 40px; }
.demo-brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.demo-brand-name { display: block; flex: 0 0 166px; width: 166px; height: 34px; object-fit: contain; object-position: left center; }
/* Stable chrome spacing; compact modules wrap, while status indicators stay together. */
body > header.topbar { padding: 4px 8px; gap: 6px 10px; align-items: center; }
.topbar .brand-wrap { gap: 10px; margin-left: 0; justify-content: flex-start; }
.topbar .top-actions { gap: 6px; align-items: center; flex-wrap: nowrap; }
.topbar .top-actions > .ghost { box-sizing: border-box; height: 34px; min-height: 34px; }
body > nav.tabs { justify-content: flex-start; align-items: center; padding: 7px 8px; gap: 7px; }
.tabs .tabs-button-row { display: flex; flex: 0 1 auto; flex-wrap: wrap; gap: 7px; width: max-content; max-width: 100%; min-width: 0; }
.tabs .tabs-button-row:focus-visible { outline: 1px solid var(--chrome-ink); outline-offset: -2px; }
.tabs .tabs-button-row > .tab { flex: 0 0 auto; height: 34px; min-height: 34px; padding-inline: 10px; white-space: nowrap; }
.tabs .tabs-info-strip { flex: 0 0 auto; width: max-content; max-width: 100%; }
@media (max-width: 700px) {
  .topbar .brand-wrap { justify-content: center; }
}
@media (max-width: 640px) {
  .tabs .tabs-button-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .tabs .tabs-button-row > .tab { min-width: 0; justify-content: center; padding-inline: 6px; }
}
@media (max-width: 360px) {
  .tabs .tabs-button-row > .tab { padding-inline: 4px; }
}
.header-pdf-logo-frame { display: none !important; }
#brandLightning { display: inline-flex !important; position: static; transform: none; flex: 0 0 30px; }
.demo-session { margin-left: 10px; font-size: 12px; color: #c6d5e5; }
.demo-reports-status { display: contents; }
.demo-exit { flex: 0 0 auto; height: 34px; white-space: nowrap; }
html { height: 100%; overflow: hidden; }
body { height: 100dvh; min-height: 0; overflow: hidden; }
.topbar, .tabs { flex: 0 0 auto; }
main { margin: 8px 8px max(8px, env(safe-area-inset-bottom)); padding: 0; }
#appUpdateButton { cursor: not-allowed; }
#tab-scheduling .scheduling-table { width: 100%; }
#tab-scheduling .scheduling-table-wrap.active > .table-scroll { overflow: auto !important; scrollbar-gutter: auto; }
#tab-scheduling .scheduling-table td { height: 34px; box-sizing: border-box; }
#tab-scheduling .scheduling-table td > * { max-width: 100%; min-width: 0; }
#tab-parts > .parts-control-panel .parts-entries-scroll::after { content: none; }
#tab-parts > .parts-control-panel .parts-entries-scroll { margin-right: -9px; border-radius: 0; scrollbar-gutter: stable; overflow-y: scroll !important; }
#partsEntriesPagination { border-top: 1px solid var(--line); }
#clientsTable td:nth-child(8) .status-badge { max-width: 100%; }
@media (max-width: 700px) {
  .demo-session { display: none; }
  .topbar { flex-wrap: wrap; }
}
#tab-suppliers .supplier-bank-heading {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px 24px;
}
#tab-suppliers .supplier-bank-heading-title { flex: 0 0 auto; }
#tab-suppliers .supplier-internal-row { flex: 0 0 auto; }


/* Demo-only artwork, session and dropdown treatment. Shared layout is in app-responsive.css. */
@media (max-width: 1200px) {
  .estimate-select-menu.demo-mobile-dropdown {
    position: fixed !important; overflow-y: auto !important; overscroll-behavior: contain;
    z-index: 5200; box-sizing: border-box;
  }
  .estimate-select-menu.demo-mobile-dropdown .estimate-select-option { min-height: 40px; }
}