/* P02.7 — shared dashboard density. Loaded after dark-controls.css. */
.app-shell {
  --workspace-gap: 12px;
  --workspace-pad: 16px;
  --workspace-muted: #c7c2b8;
}

@media (min-width: 861px) {
  .app-shell { grid-template-columns: 220px minmax(0, 1fr); }
}

.app-shell .sidebar { border: 0; padding: 20px 12px 14px; }
.app-shell .sidebar .wordmark { padding: 0 8px 18px; }
.app-shell .sidebar-label { margin: 11px 11px 7px; font-size: 11px; }
.app-shell .side-nav { gap: 2px; min-height: 0; overflow-y: auto; }
.app-shell .side-nav button { min-height: 36px; padding: 6px 10px; gap: 10px; font-size: 13px; line-height: 1.3; }
.app-shell .side-nav button svg { width: 17px; height: 17px; }
.app-shell .sidebar-foot { margin-top: auto; }

.app-shell .app-topbar { min-height: 66px; padding: 10px 22px; gap: 12px; justify-content: flex-start; }
.app-shell .app-topbar > .breadcrumb { flex: 0 1 auto; min-width: 0; margin: 0; }
.app-shell .app-topbar > .topbar-tools { margin-left: auto; }
.app-shell .app-topbar .unified-search input { min-height: 38px; padding-block: 8px; font-size: 14px; }
.app-shell .app-topbar .topbar-tools { gap: 8px; }
.app-shell .app-topbar .icon-button { min-width: 36px; min-height: 36px; }

.app-shell .main-content { padding: 18px clamp(16px, 1.6vw, 28px) 30px; font-size: 14px; line-height: 1.5; }
.app-shell .main-content .page-heading { gap: 12px 20px; margin-bottom: 17px; padding-bottom: 13px; }
.app-shell .main-content .page-heading h1 { margin: 1px 0 3px; font-size: clamp(23px, 2vw, 28px); line-height: 1.2; }
.app-shell .main-content .page-heading .eyebrow { margin-bottom: 4px; font-size: 11px; }
.app-shell .main-content .page-heading p:not(.eyebrow) { margin-block: 0; font-size: 13px; line-height: 1.45; }
.app-shell .main-content .heading-actions { gap: 7px; }
.app-shell .main-content .dashboard-hero { padding: 18px 20px; margin-bottom: 15px; gap: 16px; }
.app-shell .main-content .dashboard-hero h2 { margin: 5px 0 5px; font-size: 21px; }
.app-shell .main-content .dashboard-hero p { font-size: 13px; line-height: 1.45; }
.app-shell .main-content .toolbar { margin-bottom: 13px; gap: 9px; }
.app-shell .main-content :is(.filters, .meeting-filters) { gap: 8px; }

.app-shell .main-content .button,
.app-shell .main-content .icon-button,
.app-shell .main-content .text-button { min-height: 36px; }
.app-shell .main-content .button { padding: 7px 12px; font-size: 13px; line-height: 1.3; }
.app-shell .main-content .button.small { padding: 6px 10px; font-size: 12px; }
.app-shell .main-content .icon-button { min-width: 36px; }
.app-shell .main-content .engineering-upload-job > .button { min-height: 44px; }
.app-shell .main-content .button.primary { color: #191713; border-color: #d7ac00; background: #ffd21a; }
.app-shell .main-content :is(.status, .count-pill) { font-size: 12px; line-height: 1.35; }

.app-shell .main-content :is(.panel-head, .calendar-header) { padding: 13px 16px; }
.app-shell .main-content .panel-body { padding: 16px; }
.app-shell .main-content :is(.activity-card:not(.team-person-card), .resource-card, .board-card) { padding: 16px; gap: 12px; }
.app-shell .main-content :is(.activity-grid, .resource-grid, .board-grid) { gap: 12px; }
.app-shell .main-content .activity-card p,
.app-shell .main-content .resource-card p { font-size: 13px; line-height: 1.5; }
.app-shell .main-content .activity-meta { font-size: 12px; gap: 8px; }
.app-shell .main-content .data-table { font-size: 13px; }
.app-shell .main-content .data-table th { padding: 10px 14px; font-size: 11px; }
.app-shell .main-content .data-table td { padding: 11px 14px; }
.app-shell .main-content .data-table td small { font-size: 12px; }
.app-shell .main-content .pagination { padding: 12px 16px; font-size: 12px; }
.app-shell .main-content .page-foot { margin-top: 22px; padding-top: 13px; font-size: 11px; }

.app-shell .main-content .field { margin-bottom: 12px; }
.app-shell .main-content :is(.field label, .field-label) { margin-bottom: 5px; font-size: 13px; }
.app-shell .main-content :is(.field input, .field select, .filter-input, .filters select, .search-wrap input) { min-height: 40px; padding: 8px 11px; font-size: 14px; }
.app-shell .main-content .field textarea { padding: 9px 11px; font-size: 14px; line-height: 1.5; }
.app-shell .main-content .field small { font-size: 12px; }

.dialog { max-height: calc(100dvh - 24px); }
.dialog .dialog-head { padding: 14px 18px; }
.dialog .dialog-head h2 { font-size: 18px; }
.dialog .dialog-body { padding: 16px 18px; }
.dialog .dialog-foot { padding: 12px 18px; gap: 8px; }
.dialog .field { margin-bottom: 12px; }
.dialog :is(.field label, .field-label) { font-size: 13px; margin-bottom: 5px; }
.dialog :is(.field input, .field select, .field textarea) { font-size: 14px; }
.dialog .button { min-height: 36px; padding: 7px 12px; font-size: 13px; }

@media (pointer: coarse) {
  .app-shell .side-nav button,
  .app-shell .app-topbar .icon-button,
  .app-shell .main-content :is(.button, .icon-button, .text-button),
  .dialog .button { min-height: 44px; }
  .app-shell .main-content .icon-button { min-width: 44px; }
}

@media (max-width: 860px) {
  .app-shell .sidebar { padding: 10px 4px; }
  .app-shell .app-topbar { min-height: 64px; padding: 9px 16px; }
}

@media (max-width: 600px) {
  .app-shell .app-topbar { gap: 8px; }
  .app-shell .main-content { padding: 15px 14px 26px; }
  .app-shell .main-content .page-heading { margin-bottom: 14px; padding-bottom: 11px; }
  .app-shell .main-content .page-heading h1 { font-size: 24px; }
  .app-shell .main-content .dashboard-hero { padding: 16px; }
  .app-shell .main-content .heading-actions { width: 100%; gap: 7px; }
  .app-shell .main-content .heading-actions .button { flex: 1 1 auto; }
  .app-shell .side-nav button,
  .app-shell .app-topbar .icon-button,
  .app-shell .main-content :is(.button, .icon-button, .text-button),
  .dialog :is(.button, .icon-button) { min-height: 44px; }
  .app-shell .app-topbar .icon-button,
  .app-shell .main-content .icon-button,
  .dialog .icon-button { min-width: 44px; }
  .app-shell .main-content :is(.field input, .field select, .field textarea, .filter-input, .filters select, .search-wrap input),
  .dialog :is(.field input, .field select, .field textarea) { font-size: 16px; }
  .app-shell .main-content :is(.panel-head, .calendar-header) { padding: 12px 14px; }
  .app-shell .main-content .panel-body { padding: 14px; }
  .app-shell .main-content :is(.activity-card:not(.team-person-card), .resource-card, .board-card) { padding: 14px; }
  .dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .dialog .dialog-head { padding: 12px 14px; }
  .dialog .dialog-body { padding: 14px; }
  .dialog .dialog-foot { padding: 11px 14px; }
}

/* app.css gives the full-card ::before a pale fallback background color.
   Keep only the three-pixel area stripe so the dark card text stays legible. */
.app-shell .main-content .area-card::before { background-color: transparent; }

/* Personal dashboard banner: factual signals on the approved dark paper texture. */
.app-shell .main-content .dashboard-hero--personal { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:132px;padding:16px 20px;border:1px solid #5d5231;border-left:5px solid #ffd21a;background:linear-gradient(90deg,#11110f 0%,#171710 38%,#26231a 72%,#332d1c 100%);color:#f7f4eb;isolation:isolate; }
.app-shell .main-content .dashboard-hero--personal::before { content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.20;background:linear-gradient(90deg,#c2a648 1px,transparent 1px) 0 0/24px 24px,linear-gradient(#c2a648 1px,transparent 1px) 0 0/24px 24px;-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 36%,transparent 84%);mask-image:linear-gradient(90deg,#000 0%,#000 36%,transparent 84%); }
.app-shell .main-content .dashboard-hero--personal::after { content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,rgba(5,5,5,.96) 0%,rgba(7,7,7,.88) 34%,rgba(9,9,9,.55) 62%,rgba(9,9,9,0) 91%); }
.app-shell .main-content .dashboard-hero--personal :is(.dashboard-hero-copy,.dashboard-hero-metric) { position:relative;z-index:1; }
.app-shell .main-content .dashboard-hero--personal .eyebrow { margin:0;color:#f4d86b;font-size:11px;font-weight:800;letter-spacing:.1em; }
.app-shell .main-content .dashboard-hero--personal h2 { max-width:none;margin:5px 0 4px;color:#f7f4eb;font-size:clamp(23px,2vw,26px); }
.app-shell .main-content .dashboard-hero--personal p:not(.eyebrow) { max-width:75ch;margin:0;color:#dedbd0;font-size:13px;line-height:1.4; }
.app-shell .main-content .dashboard-hero-action { min-height:32px;margin-top:7px;padding:2px 0;border:0;background:transparent;color:#f4d86b;font-size:12px;font-weight:800;text-align:left;text-decoration:underline;text-underline-offset:3px;cursor:pointer; }
.app-shell .main-content .dashboard-hero-action:focus-visible { outline:2px solid #ffd21a;outline-offset:3px; }
.app-shell .main-content .dashboard-hero-metric { display:grid;gap:3px;justify-items:end;text-align:right;min-width:90px; }
.app-shell .main-content .dashboard-hero-metric strong { color:#f7f4eb;font:900 clamp(30px,3vw,42px)/1 Montserrat,Arial,sans-serif; }
.app-shell .main-content .dashboard-hero-metric span { color:#dedbd0;font-size:11px; }
@media(max-width:600px){.app-shell .main-content .dashboard-hero--personal{grid-template-columns:1fr;padding:15px;gap:9px}.app-shell .main-content .dashboard-hero-metric{justify-items:start;text-align:left}.app-shell .main-content .dashboard-hero-action{min-height:44px}}
.app-shell .main-content .dashboard-grid .activity-list-row{align-items:flex-start;padding-block:18px}
.app-shell .main-content .activity-list-row>.row-main{display:grid;gap:12px;min-width:0}
.app-shell .main-content .activity-list-row .activity-row-heading{display:flex;align-items:flex-start;flex-wrap:wrap;gap:8px 10px;min-width:0}
.app-shell .main-content .activity-list-row .activity-row-heading .activity-row-link{flex:1 1 160px;min-width:0}
.app-shell .main-content .activity-list-row .activity-row-heading>.status{flex:0 1 auto;margin:0;max-width:100%;white-space:normal}
.app-shell .main-content .activity-list-row .activity-row-responsibles{display:flex;align-items:center;min-height:36px;min-width:0;color:var(--muted);font-size:10px;line-height:1.6}
.app-shell .main-content .activity-list-row .related-skills{position:relative;z-index:2;margin:0;min-width:0}
.app-shell .main-content .activity-list-row .completeness-badge{margin-top:0}
.app-shell .main-content .dashboard-grid .activity-list-row>.status{align-self:flex-start;margin-top:2px;max-width:125px;white-space:normal}
.app-shell .main-content .dashboard-grid .activity-list-row>svg{align-self:center}
@media(max-width:600px){.app-shell .main-content .dashboard-grid .activity-list-row{padding:16px 15px}.app-shell .main-content .dashboard-grid .activity-list-row>.status{margin-top:0;max-width:100%}}
.app-shell .main-content .dashboard-pending-reports{margin-bottom:16px;border-radius:12px}
.app-shell .main-content .dashboard-grid{gap:16px;margin-top:16px}
.app-shell .main-content .dashboard-grid>section.panel{border-radius:12px}
.app-shell .main-content :is(.objective-summary-panel,.dashboard-goals){border-radius:12px}
.app-shell .main-content :is(.objective-summary-panel .panel-head,.dashboard-goals>.dashboard-goals-heading,.objective-tabs-toolbar){border-radius:10px;background:#292825}
.app-shell .main-content .objective-tabs-toolbar{padding:10px 12px;border:1px solid #47443c}

/* Subactivities remain on the dashboard's dark surfaces. */
.subactivity-row{background:var(--soft,#222);color:var(--text,#f2f1ea)}
.activity-detail-page .activity-current-attention{border-radius:10px}
.app-shell .main-content .panel>.panel-head:first-child{border-start-start-radius:inherit;border-start-end-radius:inherit}
