/*
 * Asset V Roads — production layout integrity corrections.
 * Root cause: the 12-column dashboard had .span-12 markup but NO corresponding
 * CSS declaration, shrinking risk cards to a single ~100px track.
 * Do not use transform/zoom on the dashboard or GIS coordinate layers.
 */
:root { --av-content-min: 0; }
/* Attribute-level visibility must win over .button and .nav-item display rules. */
[hidden] { display: none !important; }
#installAppBtn[hidden], #refreshAppBtn[hidden] { display: none !important; }
#app, .workspace, main.workspace, .view, .view > *, .dashboard-grid,
.dashboard-grid > *, .signal-strip > *, .card, .card-header,
.field-layout > *, .inbox-layout > *, .gis-layout > *,
.admin-layout > *, .av-admin-main, .av-admin-content {
  min-width: 0;
  max-width: 100%;
}
.workspace, .view { width: 100%; }
.view { box-sizing: border-box; }
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(12,minmax(0,1fr));
  align-items: stretch;
  gap: clamp(14px,1.3vw,22px);
}
.dashboard-grid > .span-12 { grid-column: 1 / -1; min-width: 0; }
.dashboard-grid > .span-7 { grid-column: span 7; min-width: 0; }
.dashboard-grid > .span-5 { grid-column: span 5; min-width: 0; }
.dashboard-grid > .card { width: 100%; }
#view-command .risk-workbench-card {
  grid-column: 1 / -1;
  width: 100%;
}
#view-command .card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 16px 22px;
}
#view-command .card-header > div:first-child {
  flex: 1 1 360px;
  min-width: min(100%,250px);
  max-width: 100%;
}
#view-command .card-header h2 { overflow-wrap: break-word; }
#view-command .card-header p { max-width: 85ch; }
#view-command .card-header > .button,
#view-command .card-header > .header-actions { flex: 0 0 auto; max-width: 100%; }
#view-command .header-actions { flex-wrap: wrap; }
#view-command .risk-asset-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(min(100%,240px),1fr));
  gap: 16px;
  width: 100%;
}
#view-command .risk-asset-grid > * { min-width: 0; }
#view-command .control-matrix {
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
#view-command .control-matrix .matrix-head,
#view-command .control-matrix .matrix-row {
  min-width: 720px;
}
/* Prevent the title/action row and massive search bar fighting over width. */
.global-bar {
  display: grid;
  grid-template-columns: minmax(210px,1fr) minmax(0,max-content);
  align-items: center;
  gap: clamp(10px,2vw,28px);
}
.command-search {
  width: 100%;
  max-width: none;
  min-width: 0;
}
.command-search input { width: 100%; min-width: 0; }
.command-search kbd { flex: 0 0 auto; }
.global-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  min-width: 0;
  max-width: min(100%,960px);
  gap: 8px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
}
.global-actions > * { flex: 0 0 auto; }
.environment-pill { white-space: normal; line-height: 1.3; max-width: 135px; }
.hero-row, .page-heading { min-width: 0; flex-wrap: wrap; }
.hero-row > *, .page-heading > * { min-width: 0; }
.hero-actions, .heading-actions, .header-actions { min-width: 0; max-width: 100%; }
.hero-row h1, .page-heading h1 { overflow-wrap: break-word; }
/* Tables and forms scroll only within their own panel, not the full page. */
.table-card, .table-wrap, .av-table-wrap, .register-toolbar,
.report-categories, .audit-hero, .risk-layout, .risk-overview,
.gis-layout, .field-layout, .inbox-layout, .admin-layout,
.exception-overview, .recon-summary { max-width: 100%; min-width: 0; }
.table-card { overflow: hidden; }
.table-wrap, .av-table-wrap { overflow-x: auto; }
.asset-table { min-width: 700px; }
.control-matrix, .recon-table, .diff-table { max-width: 100%; overflow-x: auto; }
.admin-content, .card, .approval-panel, .risk-asset-card { overflow-wrap: anywhere; }
.report-categories {
  grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr));
}
.report-card { min-width: 0; }
.card-header, .approval-panel-head { flex-wrap: wrap; }
.card-header > *, .approval-panel-head > * { min-width: 0; }
.view-tabs, .workbench-tabs, .drawer-tabs, .admin-nav,
.register-toolbar, .gis-toolbar-groups { max-width: 100%; }
.view-tabs, .workbench-tabs, .drawer-tabs { overflow-x: auto; scrollbar-width: thin; }
.view-tabs button, .workbench-tabs button { flex: 0 0 auto; white-space: nowrap; }
.field-form input, .field-form select, .field-form textarea,
.admin-form input, .admin-form select, .admin-form textarea,
.global-actions button, .role-switcher { max-width: 100%; }
/* Sidebar content should not spill into or below the workspace. */
.sidebar { min-width: 0; min-height: 0; }
.sidebar .sidebar-foot { margin-top: auto; }
#app > .workspace { min-width: 0; }

/* Breakpoint applies to usable panel width, including the sidebar. */
@media (max-width: 1400px) {
  .global-actions .environment-pill { display: none; }
}
@media (max-width: 1180px) {
  .dashboard-grid > .span-7,
  .dashboard-grid > .span-5,
  .dashboard-grid > .span-12 { grid-column: 1 / -1; }
  .dashboard-grid { gap: 18px; }
  .global-bar { grid-template-columns: minmax(190px,1fr) minmax(0,max-content); }
  .signal-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .inbox-layout { grid-template-columns: minmax(260px,320px) minmax(0,1fr); }
  .field-layout { grid-template-columns: minmax(0,1fr); }
  .exception-overview, .recon-summary { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 980px) {
  .global-actions .button.secondary { display: none; }
  .global-actions .environment-pill { display: none; }
  .global-bar { gap: 12px; }
  .gis-layout, .admin-layout, .risk-layout, .inbox-layout { grid-template-columns: minmax(0,1fr); }
  .report-categories { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 820px) {
  /* Don't float a redundant "Online / Everything synced" card over the page. */
  .offline-dock:not(.offline):not(.needs-attention) { display: none; }
  .global-bar { grid-template-columns: minmax(0,1fr) auto; }
  .global-actions .button.secondary, .global-actions .button.primary { display:none; }
  #refreshAppBtn:not([hidden]), #installAppBtn:not([hidden]) {
    display: inline-flex; min-width: 44px; width: 44px; min-height: 44px;
    padding: 0; font-size: 0; align-items: center; justify-content: center;
  }
  #refreshAppBtn:not([hidden])::before { content: '↻'; font-size: 23px; }
  #installAppBtn:not([hidden])::before { content: '↓'; font-size: 22px; }
  .global-actions { max-width: 50vw; }
  .global-actions .top-icon { display: none; }
  .view { max-width: 100vw; }
  .dashboard-grid > .span-7,
  .dashboard-grid > .span-5,
  .dashboard-grid > .span-12 { grid-column: 1 / -1; }
  .signal-strip, .audit-hero { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .exception-overview, .recon-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  #view-command .control-matrix .matrix-head,
  #view-command .control-matrix .matrix-row { min-width: 640px; }
}
@media (max-width: 600px) {
  .global-actions { max-width: 38vw; }
  .global-actions .button { padding-inline: 9px; }
  .signal-strip, .exception-overview, .recon-summary,
  .report-categories, .audit-hero, .admin-cards { grid-template-columns: minmax(0,1fr); }
  #view-command .card-header > div:first-child { flex-basis: 100%; }
  #view-command .card-header > .button, #view-command .card-header > .header-actions { flex-basis: auto; }
  .risk-overview, .campaign-layout { grid-template-columns: minmax(0,1fr); }
  .risk-factor { grid-template-columns: minmax(95px,130px) minmax(0,1fr) 40px; }
  .asset-table { min-width: 640px; }
  .view-tabs { width: 100%; }
  .report-card { min-height: 110px; }
  .field-form, .admin-form, .change-comparison { grid-template-columns: minmax(0,1fr); }
}


/* Data read failures are operational states, not empty business data. */
.av-service-health{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;
  gap:16px;padding:17px clamp(20px,2.8vw,46px);
  background:#fff5ed;border-bottom:1px solid #edc8a1;color:#704014;
}
.av-service-health-copy{flex:1 1 320px;min-width:0}
.av-service-health strong{font-size:15px;font-weight:800;line-height:1.4}
.av-service-health p{margin:4px 0 0;font-size:14px;line-height:1.55;color:#805829}
.av-service-health .button{min-height:44px;white-space:nowrap;background:#fff;border:1px solid #e4b488}
@media(max-width:600px){
 .av-service-health{padding:14px;gap:11px}
 .av-service-health .button{width:100%}
}