/* Estrutura comum dos aplicativos técnicos */
.container {
  width: 100%;
  max-width: none;
  padding: 0;
  background: var(--surface-page);
}

.page-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--space-2) var(--space-4);
  margin: 0;
  padding: var(--space-2) var(--space-5);
  background: var(--surface-raised);
  border-bottom: 1px solid var(--border-subtle);
  grid-template-areas: none;
}
.page-header > .page-header-title,
.page-header > .project-actions { grid-area: auto; }

.page-header > .page-header-title {
  display: grid;
  grid-template-columns: auto minmax(180px, .7fr) minmax(360px, 1.3fr);
  grid-template-areas: "brand title info";
  gap: var(--space-3);
  align-items: center;
  min-width: 0;
}

.page-header-title > .app-brand-bar { grid-area: brand; }
.page-header-title > h1 { grid-area: title; margin: 0; font-size: var(--font-size-xl); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.page-header-title > .project-info {
  grid-area: info;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-1);
  min-width: 0;
}
.page-header-title .project-info-field { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--space-1); min-width: 0; }
.page-header-title .project-info-field > span { min-width: 0; font-size: var(--font-size-xs); color: var(--text-tertiary); }
.page-header-title .project-info-input { width: 100%; min-width: 0; min-height: 28px; padding-block: 3px; background: var(--surface-subtle); border-color: transparent; }
.page-header-title .project-info-input:focus { background: var(--surface-raised); border-color: var(--brand-blue-600); }

.page-header > .project-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  min-width: 0;
  justify-content: flex-end;
}

.app-save-state {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--state-warning-strong);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
}
.app-save-state::before { content: ""; width: 7px; height: 7px; background: var(--state-warning); border-radius: 50%; }

.app-body { gap: 0; padding: var(--space-4); background: var(--surface-page); }
.sidebar {
  position: relative;
  flex-basis: 248px;
  border-color: var(--border-subtle);
  border-radius: var(--radius-md) 0 0 var(--radius-md);
  transition: none;
}
.content {
  padding: var(--space-4);
  background: var(--surface-raised);
  border: 1px solid var(--border-subtle);
  border-left: 0;
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
}

.sidebar-collapse-btn {
  position: sticky;
  top: 0;
  z-index: 4;
  width: calc(100% - var(--space-2));
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: var(--space-1);
  padding: var(--space-1) var(--space-2);
  color: var(--text-secondary);
  font: inherit;
  font-size: var(--font-size-xs);
  background: var(--surface-subtle);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.sidebar-collapse-btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; }
.sidebar-collapsed .sidebar { flex-basis: 54px; width: 54px; }
.sidebar-collapsed .sidebar .nav-category-toggle,
.sidebar-collapsed .sidebar .nav-label,
.sidebar-collapsed .sidebar-collapse-label { display: none; }
.sidebar-collapsed .sidebar-nav { padding-inline: var(--space-1); }
.sidebar-collapsed .nav-item { justify-content: center; padding-inline: var(--space-2); border-left-width: 0; }
.sidebar-collapsed .nav-item.active { box-shadow: inset 3px 0 var(--brand-blue-600); }
.sidebar-collapsed .sidebar-collapse-btn { justify-content: center; }
.sidebar-collapsed .sidebar-collapse-btn svg { transform: rotate(180deg); }

.nav-category-toggle { min-height: 34px; }
.nav-item { min-height: 38px; }
.nav-item.active { background: var(--surface-selected); color: var(--brand-navy-800); }

/* Redes grandes: permite ao navegador ignorar cards fora da área visível. */
#orcamentoContainer :is(.orc-condition-card, .orc-entity) {
  content-visibility: auto;
  contain-intrinsic-block-size: 44px;
}

.app-page-context {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-3);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border-subtle);
}
.app-page-heading { min-width: 0; }
.app-page-title-row { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2); }
.app-page-context h2 { margin: 0; color: var(--text-primary); font-size: var(--font-size-xl); }
.app-page-context p { margin: var(--space-1) 0 0; color: var(--text-secondary); font-size: var(--font-size-sm); line-height: var(--line-height-default); }
.app-page-actions { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.app-page-state,
.nav-status-badge,
.nav-category-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  min-height: 20px;
  padding: 1px 6px;
  font-size: 10px;
  font-weight: var(--font-weight-bold);
  line-height: 1;
  border-radius: 999px;
}
.app-page-state.is-pending,
.nav-status-badge.is-pending,
.nav-category-status.is-pending { color: var(--state-danger-strong); background: var(--state-danger-soft); border: 1px solid var(--state-danger); }
.app-page-state.is-complete,
.nav-status-badge.is-complete { color: var(--state-success-strong); background: var(--state-success-soft); border: 1px solid var(--state-success); }
.app-page-state.is-attention { color: var(--state-warning-strong); background: var(--state-warning-soft); border: 1px solid var(--state-warning); }
.nav-status-badge { margin-left: auto; }
.nav-category-status:empty { display: none; }
.nav-category-toggle::after { margin-left: var(--space-1); }

.app-overview-grid,
.app-settings-grid,
.app-documents-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-4);
}
.app-overview-card { display: grid; gap: var(--space-2); }
.app-overview-card h3 { margin: 0; font-size: var(--font-size-lg); }
.app-overview-card p { margin: 0; color: var(--text-secondary); line-height: var(--line-height-default); }
.app-settings-body > .params-panel,
.app-settings-body > .project-params-wrapper { width: 100%; max-width: none; }
.app-settings-body > .params-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1100px) {
  .page-header { grid-template-columns: minmax(0, 1fr); }
  .page-header > .project-actions { justify-content: flex-start; }
  .page-header > .page-header-title { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "brand title" "info info"; }
  .page-header-title > .project-info { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
  .page-header { padding: var(--space-3) var(--space-4); }
  .page-header > .project-actions { overflow: visible; flex-wrap: wrap; padding-bottom: var(--space-1); }
  .page-header > .page-header-title { grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "title" "info"; }
  .page-header-title > h1 { white-space: normal; overflow: visible; }
  .page-header-title > .app-brand-bar { width: 100%; }
  .page-header .project-btn .btn-label { display: none; }
  .page-header .project-btn { min-width: 36px; justify-content: center; }
  .page-header-title > .project-info { grid-template-columns: 1fr; }
  .app-body { position: relative; padding: var(--space-2); }
  .sidebar { flex-basis: 54px; width: 54px; border-radius: var(--radius-md) 0 0 var(--radius-md); }
  .sidebar .nav-category-toggle,
  .sidebar .nav-label,
  .sidebar-collapse-label { display: none; }
  .sidebar .nav-item { justify-content: center; padding-inline: var(--space-2); }
  .sidebar-collapse-btn { justify-content: center; }
  .sidebar-expanded .sidebar { position: absolute; inset: var(--space-2) auto var(--space-2) var(--space-2); z-index: 30; width: min(280px, calc(100vw - 32px)); box-shadow: var(--shadow-lg); }
  .sidebar-expanded .sidebar .nav-category-toggle,
  .sidebar-expanded .sidebar .nav-label,
  .sidebar-expanded .sidebar-collapse-label { display: flex; }
  .sidebar-expanded .sidebar .nav-item { justify-content: flex-start; }
  .content { border-radius: 0 var(--radius-md) var(--radius-md) 0; padding: var(--space-3); }
  .tab-panel { min-width: 0; max-width: 100%; }
  .tab-panel :is(table, form, fieldset) { max-width: 100%; }
  .tab-panel :is([class*="table-wrapper"], [class*="tabela-wrapper"], [class*="table-container"]) {
    max-width: 100%;
    overflow: auto;
    overscroll-behavior-inline: contain;
  }
  .app-overview-grid,
  .app-settings-grid,
  .app-documents-grid,
  .app-settings-body > .params-panel { grid-template-columns: 1fr; }
}
.app-settings-layout { display: grid; gap: var(--sp-4); width: 100%; max-width: 1600px; margin-inline: auto; }
.app-settings-section { padding: 0; overflow: hidden; }
.app-settings-section > header { padding: var(--sp-4); border-bottom: 1px solid var(--c-border); background: var(--c-surface-alt); }
.app-settings-section > header h3 { margin: 0 0 4px; color: var(--c-text); }
.app-settings-section > header p { margin: 0; color: var(--c-text-muted); font-size: var(--fs-sm); }
.app-settings-project .project-info { display: grid; grid-template-columns: minmax(220px,.9fr) minmax(280px,1.2fr) minmax(320px,1.4fr); gap: var(--sp-4); width: 100%; padding: var(--sp-4); }
.app-settings-project .project-info-field { display: grid; gap: 6px; min-width: 0; }
.app-settings-project .project-info-field > span { font-size: var(--fs-xs); font-weight: var(--fw-bold); color: var(--c-text-muted); }
.app-settings-project .project-info-input { width: 100%; min-height: 38px; }
.app-settings-technical > :not(header) { margin: 0; padding: var(--sp-4); border: 0; box-shadow: none; }
.app-settings-technical .project-params-table { width:100%; table-layout:fixed; font-size:var(--fs-sm); border:0; }
.app-settings-technical .project-params-table thead th { padding:var(--sp-3); font-size:var(--fs-sm); }
.app-settings-technical .project-params-table tr.param-section-header td { padding:var(--sp-2) var(--sp-3); text-align:left; font-size:var(--fs-xs); color:var(--c-accent); }
.app-settings-technical .project-params-table td.param-cell { height:64px; padding:var(--sp-3); white-space:normal; vertical-align:middle; }
.app-settings-technical .project-params-table .param-label { display:block; margin-bottom:6px; color:var(--c-text-muted); font-weight:var(--fw-semibold); }
.app-settings-technical .project-params-table .param-input { width:100%; min-height:36px; padding:6px 9px; text-align:left; }
.app-settings-technical .project-params-table select.param-input { width:100%; }
.app-settings-technical .project-params-table .param-fixed-value { width:100%; min-width:70px; padding:6px 9px; text-align:left; }
.app-settings-technical .project-params-table .param-calc-cell { background:var(--surface-subtle); }
.app-settings-technical .project-params-table .param-calc-cell .param-label::after { content:"Calculado"; float:right; padding:2px 6px; color:var(--text-secondary); background:var(--neutral-100); border-radius:var(--radius-pill); font-size:var(--font-size-2xs); font-weight:var(--font-weight-semibold); }
.app-settings-technical :is(input,select)[aria-invalid="true"],
.app-settings-project :is(input,select)[aria-invalid="true"] { border-color:var(--state-danger); background:var(--state-danger-soft); box-shadow:0 0 0 1px var(--state-danger); }
.app-settings-technical .params-panel { display:grid; grid-template-columns:repeat(4,minmax(180px,1fr)); gap:var(--sp-3); width:100%; padding:var(--sp-4); background:transparent; }
.app-settings-technical .params-panel-group { min-width:0; padding:var(--sp-4); border:1px solid var(--c-border); border-radius:var(--r-md); background:var(--c-surface-alt); }
.app-settings-technical .params-panel-title { margin-bottom:var(--sp-2); font-size:var(--fs-xs); }
.app-settings-technical .params-panel-row { gap:var(--sp-2) var(--sp-3); }
.app-settings-technical .param-inline { min-height:36px; flex:1 1 120px; justify-content:space-between; }
.app-settings-technical .param-inline-input { width:88px; min-height:32px; }
@media (max-width:1100px) { .app-settings-project .project-info,.app-settings-technical .params-panel { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:768px) {
  .app-settings-project .project-info,.app-settings-technical .params-panel { grid-template-columns:1fr; }
  .app-settings-technical .project-params-table,.app-settings-technical .project-params-table tbody { display:block; width:100%; }
  .app-settings-technical .project-params-table thead { display:block; }
  .app-settings-technical .project-params-table thead tr { display:grid; }
  .app-settings-technical .project-params-table tbody tr { display:grid; grid-template-columns:minmax(0,1fr); }
  .app-settings-technical .project-params-table td.param-cell { display:block; width:100%; height:auto; }
}