/* De `--ssdash-*`-namen waren een tweede tokenlaag met eigen hexcodes naast die
   van het platform: precies het "herdefinieer niet" uit het ONTWERPSYSTEEM-blok
   in ss-portal-style.css. Ze blijven als ALIAS bestaan zodat de bestaande
   selectors hieronder ongemoeid blijven, maar ze dragen geen eigen waarde meer
   -- wie de tint van het pilot-dossier wil wijzigen, doet dat voortaan op de
   ene plek. */
:root {
  --ssdash-bg: var(--ss-color-bg);
  --ssdash-surface-alt: var(--ss-color-bg);
  --ssdash-border-strong: var(--ss-color-border);

  --ssdash-text: var(--ss-color-text);
  --ssdash-heading: var(--ss-color-accent);
  --ssdash-muted: var(--ss-color-text-soft);

  --ssdash-shadow-sm: var(--ss-shadow-md);
  --ssdash-shadow-md: var(--ss-shadow-md);
}

/* ==========================================================
   Detail page shell extension
   ========================================================== */

body.single-pilot,
body.single-pilot .wp-site-blocks,
body.ss-pilot-chrome-free,
body.ss-pilot-detail-page {
  margin: 0;
  background: var(--ss-color-bg);
  color: var(--ss-color-text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, sans-serif;
  line-height: 1.5;
}

body.single-pilot *,
body.ss-pilot-chrome-free * {
  box-sizing: border-box;
}

/* Hero gradient regel verplaatst naar PM-243/PM-250 blok onderaan dit bestand. */

body.single-pilot .ss-app-main,
body.ss-pilot-chrome-free .ss-app-main {
  width: 100%;
  max-width: var(--ss-container);
  margin: 0 auto;
  padding: 0 var(--ss-space-5) var(--ss-space-6);
}

body.ss-pilot-chrome-free.admin-bar .ss-app-main {
  padding-top: 18px;
}

body.single-pilot.ss-pilot-chrome-free.admin-bar .ss-app-main {
  padding-top: 0;
}

body.single-pilot img,
body.ss-pilot-chrome-free img {
  max-width: 100%;
  height: auto;
}

body.single-pilot a,
body.ss-pilot-chrome-free a {
  transition:
    color var(--ss-transition),
    opacity var(--ss-transition),
    border-color var(--ss-transition),
    background-color var(--ss-transition),
    box-shadow var(--ss-transition),
    transform var(--ss-transition);
}

/* ==========================================================
   Typography alignment with portal
   ========================================================== */

.ss-page-hero--pilot-detail {
  position: relative;
  margin-bottom: 0;
}

.ss-page-hero--pilot-detail .ss-eyebrow {
  display: inline-block;
  margin-bottom: 8px;
  font-size: var(--ss-fs-meta);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.82);
}

.ss-page-hero--pilot-detail .ss-page-title {
  margin: 4px 0 0 0;
  font-size: var(--ss-fs-display);
  line-height: 1.1;
  font-weight: 700;
  color: var(--ss-color-text-on-dark);
  letter-spacing: 0;
}

.ss-page-hero--pilot-detail .ss-page-subtitle {
  max-width: 760px;
  margin: 8px 0 0;
  font-size: var(--ss-fs-item);
  color: rgba(255, 255, 255, 0.92);
}

.ss-page-hero--pilot-detail .ss-page-subtitle strong {
  color: var(--ss-color-text-on-dark, #fff);
}

.ss-pilot-detail-shell .ss-card,
.ss-pilot-detail-shell .ss-activity-card {
  background: var(--ss-color-surface);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius-lg);
  box-shadow: var(--ss-shadow-md);
}

.ss-pilot-detail-shell .ss-card {
  padding: 18px;
}

.ss-pilot-detail-shell .ss-btn,
.ss-pilot-detail-shell .ss-btn:link,
.ss-pilot-detail-shell .ss-btn:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  min-width: 0;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: var(--ss-fs-body);
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.ss-pilot-detail-shell .ss-btn--primary {
  background: var(--ss-color-primary);
  border-color: var(--ss-color-primary);
  color: var(--ss-color-text-on-dark);
  box-shadow: 0 8px 18px rgba(30, 115, 190, 0.22);
}

.ss-pilot-detail-shell .ss-btn--primary:hover {
  background: var(--ss-color-primary, #1E74E0);
  border-color: var(--ss-color-primary, #1E74E0);
  color: var(--ss-color-text-on-dark);
}

.ss-pilot-detail-shell .ss-btn--secondary {
  background: var(--ss-color-surface);
  border-color: var(--ss-color-border);
  color: var(--ss-color-accent-dark);
}

.ss-pilot-detail-shell .ss-btn--secondary:hover {
  border-color: var(--ss-color-primary);
  color: var(--ss-color-primary);
  background: var(--ss-color-bg, #EDF0F5);
}

.ss-pilot-detail-shell .ss-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid var(--ss-color-border);
  background: var(--ss-color-bg, #EDF0F5);
  font-size: var(--ss-fs-meta);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}

.ss-pilot-detail-shell .ss-badge--primary {
  background: rgba(30, 115, 190, 0.10);
  border-color: rgba(30, 115, 190, 0.15);
  color: var(--ss-color-primary-ink);
}

.ss-pilot-detail-shell .ss-badge--accent {
  background: rgba(75, 42, 138, 0.10);
  border-color: rgba(75, 42, 138, 0.15);
  color: var(--ss-color-accent);
}

/* Was als enige badge een VOLVLAK groen met witte tekst: 3.0:1 op 11px, en
   bovendien de enige van de vijf die niet de ink-op-tint-vorm had. Nu gelijk
   aan zijn buren -- zowel leesbaar als consistent. */
.ss-pilot-detail-shell .ss-badge--success {
  background: rgba(47, 169, 107, 0.16);
  border-color: rgba(47, 169, 107, 0.24);
  color: var(--ss-color-success-ink);
}

.ss-pilot-detail-shell .ss-badge--danger {
  background: rgba(180, 32, 54, 0.10);
  border-color: rgba(180, 32, 54, 0.16);
  color: var(--ss-color-danger-ink, #C0362F);
}

.ss-pilot-detail-shell .ss-badge--warning {
  background: rgba(203, 128, 19, 0.12);
  border-color: rgba(203, 128, 19, 0.18);
  color: var(--ss-color-warning-ink, #8A5A00);
}

.ss-pilot-detail-shell .ss-stack {
  display: grid;
  gap: 18px;
}

.ss-pilot-detail-shell .ss-stack--page {
  gap: 16px;
}

.ss-pilot-detail-shell .ss-stack--sm {
  gap: 12px;
}

/* ==========================================================
   Hero composition
   ========================================================== */

.ss-pilot-hero-bar {
  position: relative;
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 220px;
  gap: 18px;
  align-items: center;
  padding: 0;
}

.ss-pilot-hero-bar__content {
  grid-column: 2;
  min-width: 0;
  padding-top: 2px;
  text-align: center;
}

.ss-pilot-hero-bar__media {
  grid-column: 3;
  display: flex;
  justify-content: flex-end;
  align-self: end;
  position: relative;
  z-index: 4;
  margin-bottom: -23px;
}

.ss-pilot-hero-media-card {
  width: 100%;
  max-width: 150px;
  height: 135px;
  padding: 6px 8px;
  background: var(--ss-color-surface);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius-lg);
  box-shadow: 0 10px 26px rgba(15, 42, 68, 0.10);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.ss-pilot-hero-media-card img {
  display: block;
  width: 118%;
  max-width: none;
  max-height: 126px;
  object-fit: contain;
  object-position: center center;
  transform: scale(1.16);
  transform-origin: center center;
}

/* ==========================================================
   Hanging summary block
   ========================================================== */

.ss-pilot-summary-card {
  position: relative;
  z-index: 3;
  margin-top: -32px;
  padding: 18px 18px 16px;
}

.ss-pilot-layout--intake .ss-pilot-setup-shell {
  background: var(--ss-color-surface);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius-lg);
  box-shadow: var(--ss-shadow-md);
  overflow: hidden;
  position: relative;
  z-index: 3;
  transform: translateY(-32px);
  padding: 18px;
}

.ss-pilot-setup-accordion-summary {
  list-style: none;
}

.ss-pilot-setup-accordion-summary::-webkit-details-marker {
  display: none;
}

.ss-pilot-setup-accordion-summary__meta {
  display: none;
}

.ss-pilot-setup-accordion-summary::after {
  content: '▾';
  display: inline-block;
  margin-left: auto;
  font-size: var(--ss-fs-title);
  line-height: 1;
  transition: transform 0.2s ease;
}

.ss-pilot-setup-accordion-item[open] .ss-pilot-setup-accordion-summary::after {
  transform: rotate(180deg);
}

.ss-pilot-summary-hang {
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
  gap: 18px;
  align-items: start;
}

.ss-pilot-summary-hang__facts,
.ss-pilot-summary-hang__activity {
  min-width: 0;
}

.ss-pilot-summary-hang__heading,
.ss-pilot-summary-hang__activity-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.ss-pilot-summary-hang__title {
  margin: 0;
  font-size: var(--ss-fs-title);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ssdash-heading);
}

.ss-pilot-summary-hang__meta {
  margin: 3px 0 0;
  font-size: var(--ss-fs-sub);
  line-height: 1.35;
  color: var(--ss-color-text-soft);
}

.ss-pilot-summary-hang__activity-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.ss-pilot-summary-facts {
  display: grid;
  gap: 8px;
}

.ss-pilot-summary-fact {
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr);
  gap: 10px;
  align-items: start;
  padding: 8px 10px;
  background: var(--ss-color-surface, #fff);
  border: 1px solid var(--ss-color-border);
  border-radius: 12px;
}

.ss-pilot-summary-fact__label {
  font-size: var(--ss-fs-meta);
  line-height: 1.25;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ssdash-heading);
}

.ss-pilot-summary-fact__value {
  font-size: var(--ss-fs-body);
  line-height: 1.35;
  color: var(--ss-color-text);
}

/* ==========================================================
   Section headers
   ========================================================== */

.ss-pilot-detail-shell .ss-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  height: 50px;
  padding: 6px 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--ss-color-accent-dark) 0%, var(--ss-color-accent) 100%);
  box-shadow: var(--ss-shadow-sm);
  overflow: hidden;
}

.ss-pilot-detail-shell .ss-section-header__title {
  margin: 0;
  font-size: var(--ss-fs-item);
  line-height: 1;
  font-weight: 700;
  color: var(--ss-color-text-on-dark);
}

.ss-pilot-detail-shell .ss-section-header__meta {
  margin: 4px 0 0;
  font-size: var(--ss-fs-label);
  line-height: 1.05;
  color: rgba(255, 255, 255, 0.86);
}

.ss-section-header--inside-card {
  margin-bottom: 12px;
}

/* ==========================================================
   Summary / overview
   ========================================================== */

.ssdash-info {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 10px;
}

.ssdash-info--hero {
  margin-bottom: 10px;
}

.ssdash-tile {
  padding: 11px 12px 10px;
  background: var(--ssdash-surface-alt);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius-md);
}

.ssdash-tile h3,
.ssdash-block h3,
.ssdash-evidence h4,
.ssdash-update-attachments h4 {
  margin: 0 0 5px;
  font-size: var(--ss-fs-body);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ssdash-heading);
}

.ssdash-tile p {
  margin: 0;
  font-size: var(--ss-fs-body);
  line-height: 1.35;
  color: var(--ss-color-text);
}

.ss-pilot-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.ssdash-block + .ssdash-block {
  margin-top: 0;
}

.ssdash-block__body,
.ssdash-block__body p {
  margin: 0;
  font-size: var(--ss-fs-body);
  line-height: 1.6;
  color: var(--ss-color-text);
}

/* ==========================================================
   Top activity preview
   ========================================================== */

.ss-pilot-activity-preview-list {
  display: grid;
  gap: 10px;
}

.ss-pilot-activity-preview-card {
  padding: 12px 14px;
  background: var(--ss-color-surface, #fff);
  border: 1px solid rgba(123, 92, 246, 0.14);
  border-radius: 14px;
}

.ss-pilot-activity-preview-card.has-media {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 120px;
  gap: 12px;
  align-items: start;
}

.ss-pilot-activity-preview-card.has-no-media {
  display: block;
}

.ss-pilot-activity-preview-card__content {
  min-width: 0;
}

.ss-pilot-activity-preview-card__topline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-bottom: 8px;
}

.ss-pilot-activity-preview-card__topline .ss-pilot-activity-preview-card__meta {
  order: 0;
}

.ss-pilot-activity-preview-card__topline .ss-badge {
  order: 1;
}

.ss-pilot-activity-preview-card__meta {
  font-size: var(--ss-fs-sub);
  line-height: 1.4;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-activity-preview-card__title {
  margin: 0 0 6px;
  font-size: var(--ss-fs-item);
  line-height: 1.3;
  font-weight: 700;
}

.ss-pilot-activity-preview-card__title a {
  text-decoration: none;
  font-weight: 700;
}

.ss-pilot-activity-preview-card--issue
.ss-pilot-activity-preview-card__title a {
  color: var(--ss-color-hero, #c63c77);
}

.ss-pilot-activity-preview-card--update
.ss-pilot-activity-preview-card__title a {
  color: var(--ss-color-primary, #1E74E0);
}

.ss-pilot-activity-preview-card__title a:hover,
.ss-pilot-activity-preview-card__title a:focus {
  text-decoration: underline;
}

.ss-pilot-activity-preview-card__title a:hover {
  opacity: 0.8;
}

.ss-pilot-activity-preview-card__excerpt {
  color: var(--ss-color-text, #16202A);
  font-size: var(--ss-fs-body);
  line-height: 1.55;
}

.ss-pilot-activity-preview-card__excerpt p {
  margin: 0;
}

.ss-pilot-activity-preview-card__details {
  margin-top: 7px;
  font-size: var(--ss-fs-sub);
  line-height: 1.45;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-activity-preview-card__media {
  width: 100%;
  height: 80px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--ss-color-bg, #EDF0F5);
  border: 1px solid var(--ss-color-border, #D5DCE6);
  align-self: start;
}

.ss-pilot-activity-preview-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ssdash-empty-card--embedded {
  margin: 0;
  padding: 14px;
}

/* ==========================================================
   KPI cards
   ========================================================== */

.ssdash-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.ssdash-kpi {
  background: var(--ss-color-surface);
  border: 1px solid var(--ss-color-border);
  border-radius: var(--ss-radius-lg);
  box-shadow: var(--ssdash-shadow-sm);
  padding: 16px;
}

.ssdash-kpi__name {
  margin-bottom: 8px;
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  color: var(--ss-color-text-soft);
}

.ssdash-kpi__value {
  margin-bottom: 6px;
  font-size: var(--ss-fs-display);
  line-height: 0.96;
  font-weight: 700;
  color: var(--ss-color-hero);
}

.ssdash-kpi__value span {
  margin-left: 4px;
  font-size: var(--ss-fs-item);
  font-weight: 700;
  color: var(--ss-color-primary);
}

.ssdash-kpi__target {
  margin-bottom: 8px;
  font-size: var(--ss-fs-body);
  color: var(--ss-color-text-soft);
}

.ssdash-kpi__definition {
  margin-bottom: 8px;
  font-size: var(--ss-fs-sub);
  line-height: 1.5;
}

.ssdash-kpi__meta {
  display: grid;
  gap: 5px;
  margin: 0;
}

.ssdash-kpi__meta div {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 8px;
  font-size: var(--ss-fs-sub);
  line-height: 1.35;
}

.ssdash-kpi__meta dt {
  color: var(--ss-color-text-soft);
}

.ssdash-kpi__meta dd {
  margin: 0;
  color: var(--ss-color-text);
}

/* ==========================================================
   Timeline
   ========================================================== */

.ssdash-timeline {
  display: grid;
  gap: 10px;
}

.ssdash-timeline__row {
  display: grid;
  grid-template-columns: 120px 24px minmax(0, 1fr);
  gap: 0;
  align-items: stretch;
}

.ssdash-timeline__date-col {
  display: flex;
  justify-content: flex-end;
  padding-right: 12px;
  padding-top: 10px;
}

.ssdash-timeline__date-label {
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  color: var(--ss-color-text-soft);
  white-space: nowrap;
}

.ssdash-timeline__axis-col {
  position: relative;
  display: flex;
  justify-content: center;
}

.ssdash-timeline__axis-col::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  width: 2px;
  background: rgba(30, 115, 190, 0.35);
}

.ssdash-timeline__dot {
  position: relative;
  z-index: 1;
  margin-top: 10px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--ss-color-primary);
}

.ssdash-timeline__row.is-current .ssdash-timeline__dot {
  box-shadow: 0 0 0 5px rgba(30, 115, 190, 0.14);
}

.ssdash-timeline__content-col {
  padding-left: 12px;
}

.ssdash-timeline__card {
  padding: 10px 12px;
  border: 1px solid var(--ss-color-border);
  border-radius: 14px;
  background: var(--ss-color-surface, #fff);
  box-shadow: var(--ssdash-shadow-sm);
}

.ssdash-timeline__mainline {
  display: grid;
  grid-template-columns: minmax(180px, 0.95fr) minmax(110px, 0.35fr) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
}

.ssdash-timeline__title {
  font-size: var(--ss-fs-item);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ssdash-heading);
}

.ssdash-timeline__status {
  display: inline-block;
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  color: var(--ss-color-primary);
  text-transform: capitalize;
}

.ssdash-timeline__notes {
  font-size: var(--ss-fs-sub);
  line-height: 1.4;
  color: var(--ss-color-text-soft);
}

/* ==========================================================
   Two-column pilot detail layout
   ========================================================== */

.ss-pilot-layout {
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.ss-pilot-layout__rail,
.ss-pilot-layout__main,
.ss-pilot-layout__section {
  min-width: 0;
}

.ss-pilot-layout__rail .ss-pilot-setup-shell {
  margin-top: 0;
}

.ss-pilot-layout__rail .ss-pilot-setup-shell__body {
  position: static;
  top: auto;
  align-self: start;
}

/* ==========================================================
   Activity intelligence v2
   ========================================================== */

.ssdash-attention-strip {
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(180, 32, 54, 0.14);
  border-radius: 16px;
  background:
    linear-gradient(180deg, rgba(255, 244, 246, 0.96) 0%, rgba(255, 250, 251, 0.96) 100%);
  box-shadow: 0 10px 24px rgba(180, 32, 54, 0.05);
}

.ssdash-attention-strip__head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.ssdash-attention-strip__title {
  margin: 0;
  font-size: var(--ss-fs-item);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ss-color-danger-ink, #C0362F);
}

.ssdash-attention-strip__meta {
  margin: 0;
  font-size: var(--ss-fs-sub);
  line-height: 1.35;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-attention-strip__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ssdash-attention-pill {
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 11px 12px;
  border: 1px solid rgba(180, 32, 54, 0.12);
  border-radius: 12px;
  background: var(--ss-color-surface, #fff);
  color: inherit;
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(15, 42, 68, 0.04);
}

.ssdash-attention-pill:hover,
.ssdash-attention-pill:focus {
  border-color: rgba(180, 32, 54, 0.26);
  box-shadow: 0 10px 22px rgba(180, 32, 54, 0.08);
  transform: translateY(-1px);
}

.ssdash-attention-pill__eyebrow {
  font-size: var(--ss-fs-label);
  line-height: 1.1;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ss-color-danger-ink, #C0362F);
}

.ssdash-attention-pill__title {
  font-size: var(--ss-fs-body);
  line-height: 1.35;
  font-weight: 700;
  color: var(--ss-color-text, #16202A);
}

.ssdash-attention-pill__meta {
  font-size: var(--ss-fs-meta);
  line-height: 1.4;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-activity-intelligence {
  display: grid;
  gap: 14px;
}

.ssdash-activity-filters {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 14px 16px;
  flex-wrap: wrap;
  padding: 14px 16px;
  border: 1px solid var(--ss-color-border);
  border-radius: 16px;
  background: var(--ss-color-surface, #fff);
  box-shadow: 0 8px 20px rgba(15, 42, 68, 0.04);
}

.ssdash-activity-filters__group {
  display: flex;
  align-items: end;
  gap: 12px 14px;
  flex-wrap: wrap;
  min-width: 0;
}

.ssdash-activity-filters__label {
  display: block;
  margin-bottom: 6px;
  font-size: var(--ss-fs-meta);
  line-height: 1.1;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ssdash-heading);
}

.ssdash-activity-filters__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ssdash-filter-chip {
  appearance: none;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  background: var(--ss-color-surface, #fff);
  color: var(--ss-color-text-soft, #5F6B7A);
  border-radius: 999px;
  min-height: 36px;
  padding: 0 12px;
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}

.ssdash-filter-chip:hover,
.ssdash-filter-chip:focus {
  border-color: var(--ss-color-primary);
  color: var(--ss-color-primary);
  background: var(--ss-color-bg, #EDF0F5);
  outline: none;
}

.ssdash-filter-chip.is-active {
  background: rgba(30, 115, 190, 0.10);
  border-color: rgba(30, 115, 190, 0.18);
  color: var(--ss-color-primary);
}

.ssdash-activity-filters__field {
  display: grid;
  min-width: 160px;
}

.ssdash-activity-filters__field select {
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 10px;
  background: var(--ss-color-surface, #fff);
  color: var(--ss-color-text, #16202A);
  font-size: var(--ss-fs-body);
  line-height: 1.2;
}

.ssdash-activity-filters__field select:focus {
  outline: none;
  border-color: var(--ss-color-primary);
  box-shadow: 0 0 0 3px rgba(30, 115, 190, 0.10);
}

.ssdash-activity-groups {
  display: grid;
  gap: 14px;
}

.ssdash-activity-group {
  display: grid;
  gap: 10px;
}

.ssdash-activity-group__head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  padding: 0 2px;
}

.ssdash-activity-group__title {
  margin: 0;
  font-size: var(--ss-fs-title);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ssdash-heading);
}

.ssdash-activity-group__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  min-height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  background: var(--ss-color-surface, #fff);
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-empty-card--filtered {
  margin-top: 2px;
}

/* ==========================================================
   Activity stream
   ========================================================== */

.ssdash-activity-card {
  border-left: 4px solid transparent;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 18px;
  background: var(--ss-color-surface, #fff);
  box-shadow: 0 10px 24px rgba(15, 42, 68, 0.04);
  overflow: hidden;
  padding: 0;
}

.ssdash-activity-card--update {
  border-left-color: var(--ss-color-primary);
}

.ssdash-activity-card--issue {
  border-left-color: var(--ss-color-hero);
}

.ssdash-activity-card__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 16px;
  align-items: start;
  padding: 16px 18px 14px;
}

.ssdash-activity-card__main,
.ssdash-activity-card__side {
  min-width: 0;
}

.ssdash-activity-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-bottom: 8px;
  font-size: var(--ss-fs-sub);
  line-height: 1.35;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-activity-card__context {
  margin-bottom: 10px;
  font-size: var(--ss-fs-body);
  color: var(--ss-color-text-soft, #5F6B7A);
  text-align: right;
  line-height: 1.4;
  font-weight: 700;
}

.ssdash-activity-card__meta--side {
  justify-content: flex-end;
  margin-bottom: 10px;
}

.ssdash-activity-card__title {
  margin: 0 0 6px;
  font-size: var(--ss-fs-title);
  line-height: 1.15;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.ssdash-activity-card--issue .ssdash-activity-card__title {
  color: var(--ss-color-hero);
}

.ssdash-activity-card--update .ssdash-activity-card__title {
  color: var(--ss-color-primary);
}

.ssdash-activity-card__title .ssdash-title-toggle {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  font: inherit;
  cursor: pointer;
}

.ssdash-activity-card__preview {
  margin-top: 2px;
  color: var(--ss-color-text, #16202A);
  line-height: 1.58;
  font-size: var(--ss-fs-body);
}

.ssdash-activity-card__preview p {
  margin: 0;
}

.ssdash-activity-card__detail-note {
  margin-top: 8px;
  font-size: var(--ss-fs-sub);
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-activity-card__toggle-row {
  margin-top: 10px;
}

.ssdash-activity-card__context {
  font-size: var(--ss-fs-body);
  color: var(--ss-color-text-soft, #5F6B7A);
  text-align: right;
  line-height: 1.4;
  font-weight: 700;
}

.ssdash-activity-card__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.ssdash-activity-card__badges--side {
  justify-content: flex-end;
  margin-top: 10px;
}

.ssdash-activity-card__media {
  width: 100%;
  max-width: 270px;
  height: 160px;
  margin-left: auto;
  border-radius: 12px;
  overflow: hidden;
  background: var(--ss-color-bg, #EDF0F5);
  border: 1px solid var(--ss-color-border, #D5DCE6);
}

.ssdash-activity-card__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ssdash-inline-body-expanded,
.ssdash-inline-discussion-expanded {
  margin: 0 18px;
  padding: 14px 0 0;
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ssdash-inline-discussion-expanded {
  padding-bottom: 14px;
}

.ssdash-inline-expanded__content > * + * {
  margin-top: 10px;
}

.ssdash-inline-body-expanded__content {
  color: var(--ss-color-text, #16202A);
  line-height: 1.62;
  font-size: var(--ss-fs-body);
}

.ssdash-inline-body-expanded__content p {
  margin: 0 0 10px;
}

.ssdash-inline-body-expanded__extras {
  margin-top: 12px;
}

/* Evidence / attachments */
.ssdash-evidence,
.ssdash-update-attachments {
  margin-top: 8px;
  padding: 12px 14px;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 14px;
  background: var(--ss-color-bg, #EDF0F5);
  display: block;
}

.ssdash-evidence h4,
.ssdash-update-attachments h4 {
  margin: 0 0 10px;
  font-size: var(--ss-fs-body);
  line-height: 1.3;
  color: var(--ss-color-accent, #4B2A8A);
}

.ssdash-evidence__item,
.ssdash-update-attachments__item {
  padding: 10px 12px;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 12px;
  background: var(--ss-color-surface, #fff);
}

.ssdash-evidence__item + .ssdash-evidence__item,
.ssdash-update-attachments__item + .ssdash-update-attachments__item {
  margin-top: 8px;
}

.ssdash-evidence__meta,
.ssdash-update-attachments__meta {
  display: flex;
  align-items: center;
  gap: 8px 10px;
  flex-wrap: wrap;
  margin-bottom: 6px;
  font-size: var(--ss-fs-meta);
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-evidence__date,
.ssdash-update-attachments__date {
  margin-left: auto;
}

.ssdash-evidence__caption,
.ssdash-update-attachments__caption {
  margin-bottom: 5px;
  color: var(--ss-color-text, #16202A);
  line-height: 1.45;
  font-size: var(--ss-fs-body);
}

.ssdash-evidence__file a,
.ssdash-update-attachments__file a {
  font-weight: 700;
  text-decoration: none;
  font-size: var(--ss-fs-body);
}

.ssdash-issue__owner {
  margin-top: 8px;
  font-size: var(--ss-fs-sub);
  line-height: 1.4;
  color: var(--ss-color-text-soft);
}

/* ==========================================================
   Activity actions — minimal real path
   ========================================================== */

.ssdash-issue-actions {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ssdash-issue-actions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 10px;
}

.ssdash-issue-actions__feedback {
  margin-top: 8px;
  font-size: var(--ss-fs-sub);
  line-height: 1.35;
  font-weight: 700;
}

.ssdash-issue-actions__feedback[data-state="loading"] {
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ssdash-issue-actions__feedback[data-state="success"] {
  color: var(--ss-color-success-ink, #0B6E4F);
}

.ssdash-issue-actions__feedback[data-state="error"] {
  color: var(--ss-color-danger-ink, #C0362F);
}

.ss-pilot-detail-shell .ssdash-issue-action[disabled],
.ss-pilot-detail-shell .ssdash-issue-action:disabled {
  opacity: 0.48;
  cursor: default;
  pointer-events: none;
  border-color: var(--ss-color-border, #D5DCE6);
  color: var(--ss-color-text-soft, #5F6B7A);
  background: var(--ss-color-bg, #EDF0F5);
  box-shadow: none;
}

.ss-pilot-detail-shell .ssdash-issue-action[disabled]:hover,
.ss-pilot-detail-shell .ssdash-issue-action:disabled:hover {
  border-color: var(--ss-color-border, #D5DCE6);
  color: var(--ss-color-text-soft, #5F6B7A);
  background: var(--ss-color-bg, #EDF0F5);
}

/* ==========================================================
   Discussion zone
   ========================================================== */

.ss-thread-discussion-inline {
  padding: 0 0 12px;
}

.ss-thread-discussion-inline__head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}

.ss-thread-discussion-inline__head-main {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.ss-thread-discussion-inline__title {
  margin: 0;
  font-size: var(--ss-fs-title);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ss-color-text, #16202A);
}

.ss-thread-discussion-inline__count {
  font-size: var(--ss-fs-sub);
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-thread-empty {
  margin: 0 0 12px;
  padding: 2px 0 0;
  color: var(--ss-color-text-soft, #5F6B7A);
  font-size: var(--ss-fs-body);
  line-height: 1.5;
}

.ss-thread-empty p {
  margin: 0;
}

.ss-thread-preview {
  display: grid;
  gap: 10px;
  margin-top: 2px;
}

.ss-thread-item {
  margin: 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.ss-thread-item-card {
  display: block !important;
  min-width: 0 !important;
  padding: 12px 14px !important;
  border: 1px solid var(--ss-color-border, #D5DCE6) !important;
  border-radius: 14px !important;
  background: var(--ss-color-surface, #fff) !important;
  box-shadow: none !important;
}

.ss-thread-item.is-child {
  margin-left: calc(16px * min(var(--ss-thread-depth, 1), 4)) !important;
  padding-left: 10px !important;
  border-left: 2px solid var(--ss-color-border, #D5DCE6) !important;
}

.ss-thread-item-meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.ss-thread-author {
  color: var(--ss-color-accent, #4B2A8A);
  font-size: var(--ss-fs-body);
  font-weight: 700;
}

.ss-thread-date {
  color: var(--ss-color-text-soft, #5F6B7A);
  font-size: var(--ss-fs-meta);
}

.ss-thread-content {
  color: var(--ss-color-text, #16202A);
  line-height: 1.55;
  font-size: var(--ss-fs-body);
}

.ss-thread-content p {
  margin: 0;
}

.ss-thread-item-actions {
  margin-top: 8px !important;
}

.ss-thread-inline-reply {
  border: 1px solid var(--ss-color-border, #D5DCE6) !important;
  border-radius: 999px !important;
  background: var(--ss-color-surface, #fff) !important;
  color: var(--ss-color-accent, #4B2A8A) !important;
  font-weight: 700 !important;
  font-size: var(--ss-fs-sub) !important;
  padding: 5px 12px !important;
  cursor: pointer !important;
}

.ss-thread-children {
  margin-top: 8px !important;
  padding-left: 0 !important;
  border-left: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

/* Reply form */
.ss-thread-reply-form {
  display: block !important;
  overflow: visible !important;
  margin-top: 14px !important;
  padding: 14px !important;
  border: 1px solid var(--ss-color-border, #D5DCE6) !important;
  border-radius: 16px !important;
  background: var(--ss-color-bg, #EDF0F5) !important;
}

.ss-thread-reply-form--empty {
  margin-bottom: 12px;
}

.ss-thread-reply-form--empty + .ss-thread-empty {
  margin-top: 0;
}

.ss-thread-comment-form {
  display: block !important;
  margin: 0 !important;
}

.ss-thread-reply-form__title {
  display: block !important;
  margin: 0 0 10px !important;
  font-size: var(--ss-fs-item) !important;
  line-height: 1.25 !important;
  color: var(--ss-color-text, #16202A) !important;
  font-weight: 700 !important;
}

.ss-thread-form__field {
  display: block !important;
  margin: 0 0 10px !important;
}

.ss-thread-form__label,
.ss-thread-reply-form label {
  display: block !important;
  margin: 0 0 6px !important;
  font-size: var(--ss-fs-sub) !important;
  font-weight: 700 !important;
  color: var(--ss-color-text, #16202A) !important;
}

.ss-thread-form__textarea,
.ss-thread-reply-form textarea {
  display: block !important;
  width: 100% !important;
  min-height: 120px !important;
  padding: 10px 12px !important;
  border: 1px solid var(--ss-color-border, #D5DCE6) !important;
  border-radius: 12px !important;
  background: var(--ss-color-surface, #fff) !important;
  color: var(--ss-color-text, #16202A) !important;
  line-height: 1.5 !important;
  resize: vertical !important;
  box-sizing: border-box !important;
  appearance: none !important;
  font-size: var(--ss-fs-body) !important;
}

.ss-thread-form__textarea:focus,
.ss-thread-reply-form textarea:focus {
  outline: none !important;
  border-color: var(--ss-color-primary, #1E74E0) !important;
  box-shadow: 0 0 0 3px rgba(30, 115, 190, 0.12) !important;
}

.ss-thread-replying-to {
  display: block !important;
  margin: 0 0 8px !important;
  font-size: var(--ss-fs-sub) !important;
  font-weight: 700 !important;
  color: var(--ss-color-accent, #4B2A8A) !important;
}

.ss-thread-form__actions {
  margin-top: 8px;
}

.ss-thread-reply-form button[type="submit"],
.ss-thread-reply-form .ss-btn {
  min-height: 40px !important;
  margin-top: 8px !important;
}

/* ==========================================================
   Pilot Setup — hardened portal form layer
   ========================================================== */

.ss-pilot-setup-shell {
  margin-top: 0;
}

.ss-pilot-setup-shell__body {
  min-width: 0;
}

.ss-pilot-setup-card {
  border-radius: 16px;
  overflow: hidden;
}

.ss-pilot-setup-intro {
  margin-bottom: 12px;
  color: var(--ss-color-text-soft, #5F6B7A);
  font-size: var(--ss-fs-body);
  line-height: 1.5;
}

.ss-pilot-setup-intro p {
  margin: 0;
}

.ss-pilot-setup-status-panel,
.ss-pilot-setup-activation-panel {
  border-radius: 16px;
}

.ss-pilot-setup-status-panel__head,
.ss-pilot-setup-activation-panel__body {
  display: grid;
  gap: 10px;
}

.ss-pilot-setup-status-panel__title,
.ss-pilot-setup-activation-panel__title {
  margin: 0;
  font-size: var(--ss-fs-title);
  line-height: 1.2;
  font-weight: 700;
  color: var(--ssdash-heading);
}

.ss-pilot-setup-status-panel__meta {
  margin: 4px 0 0;
  font-size: var(--ss-fs-sub);
  line-height: 1.4;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-setup-status-panel__body p,
.ss-pilot-setup-activation-panel__text {
  margin: 0;
  font-size: var(--ss-fs-item);
  line-height: 1.6;
  color: var(--ss-color-text, #16202A);
}

.ss-pilot-setup-notice {
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  background: var(--ss-color-surface, #fff);
  box-shadow: 0 8px 18px rgba(15, 42, 68, 0.04);
}

.ss-pilot-setup-notice p {
  margin: 0;
  font-size: var(--ss-fs-body);
  line-height: 1.45;
  font-weight: 700;
}

.ss-pilot-setup-notice--success {
  border-color: rgba(31, 157, 85, 0.22);
  background: rgba(31, 157, 85, 0.06);
}

.ss-pilot-setup-notice--success p {
  color: var(--ss-color-success-ink, #0B6E4F);
}

.ss-pilot-setup-notice--warning {
  border-color: rgba(203, 128, 19, 0.22);
  background: rgba(203, 128, 19, 0.07);
}

.ss-pilot-setup-notice--warning p {
  color: var(--ss-color-warning-ink, #8A5A00);
}

.ss-pilot-setup-notice--error {
  border-color: rgba(180, 32, 54, 0.22);
  background: rgba(180, 32, 54, 0.06);
}

.ss-pilot-setup-notice--error p {
  color: var(--ss-color-danger-ink, #C0362F);
}

.ss-pilot-setup-accordion-item {
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 14px;
  background: var(--ss-color-bg, #EDF0F5);
  padding: 0;
  margin-bottom: 8px;
  overflow: hidden;
}

.ss-pilot-setup-accordion-item:last-child {
  margin-bottom: 0;
}

.ss-pilot-setup-accordion-summary {
  cursor: pointer;
  padding: 14px 16px;
  font-weight: 700;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: var(--ss-color-surface, #fff);
  border-radius: 14px;
  list-style: none;
}

.ss-pilot-setup-accordion-summary::-webkit-details-marker {
  display: none;
}

.ss-pilot-setup-accordion-summary__title {
  font-size: var(--ss-fs-item);
  line-height: 1.25;
  color: var(--ss-color-text, #16202A);
}

.ss-pilot-setup-accordion-summary__meta {
  flex-shrink: 0;
  font-size: var(--ss-fs-sub);
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-setup-accordion-item[open] .ss-pilot-setup-accordion-summary {
  background: var(--ss-color-bg, #EDF0F5);
  border-bottom: 1px solid var(--ss-color-border, #D5DCE6);
}

.ss-pilot-setup-accordion-body {
  padding: 12px;
}

.ss-pilot-setup-item {
  padding: 14px;
  background: var(--ss-color-surface, #fff);
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 14px;
  margin-bottom: 8px;
  box-shadow: 0 4px 12px rgba(15, 42, 68, 0.04);
}

.ss-pilot-setup-item:last-child {
  margin-bottom: 0;
}

.ss-pilot-setup-item__header {
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--ss-color-border, #D5DCE6);
}

.ss-pilot-setup-item__title {
  font-size: var(--ss-fs-item);
  font-weight: 700;
  margin: 0;
  line-height: 1.25;
  color: var(--ssdash-heading);
}

.ss-pilot-setup-item--document {
  background: var(--ss-color-surface, #fff);
}

.ss-pilot-setup-item--empty {
  background: linear-gradient(180deg, var(--ss-color-surface, #fff) 0%, var(--ss-color-bg, #EDF0F5) 100%);
}

.ss-pilot-setup-empty-state {
  padding: 6px 2px 2px;
}

.ss-pilot-setup-empty-state p {
  margin: 0;
  font-size: var(--ss-fs-item);
  line-height: 1.65;
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-setup-field {
  display: grid;
  grid-template-columns: 1fr;
  gap: 5px;
  padding: 8px 0;
  align-items: start;
}

.ss-pilot-setup-field + .ss-pilot-setup-field {
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ss-pilot-setup-field__label {
  display: block;
  font-size: var(--ss-fs-meta);
  color: var(--ss-color-text-soft, #5F6B7A);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  line-height: 1.2;
  font-weight: 700;
  margin: 0;
}

.ss-pilot-setup-field__value {
  font-size: var(--ss-fs-item);
  color: var(--ss-color-text, #16202A);
  font-weight: 400;
  line-height: 1.5;
  min-width: 0;
}

.ss-pilot-setup-field__value p {
  margin: 0;
}

.ss-pilot-setup-doc-link {
  display: inline-block;
  margin-right: 10px;
  margin-top: 4px;
  font-weight: 700;
  text-decoration: none;
}

.ss-pilot-setup-doc-link:hover,
.ss-pilot-setup-doc-link:focus {
  text-decoration: underline;
}

/* Form controls */

.ss-pilot-setup-input,
.ss-pilot-setup-textarea,
.ss-pilot-setup-select {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 12px;
  background: var(--ss-color-surface, #fff);
  color: var(--ss-color-text, #16202A);
  font-size: var(--ss-fs-item);
  line-height: 1.35;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background-color 0.2s ease;
  appearance: none;
}

.ss-pilot-setup-input,
.ss-pilot-setup-select {
  min-height: 44px;
  padding: 0 14px;
}

.ss-pilot-setup-textarea {
  min-height: 116px;
  padding: 12px 14px;
  resize: vertical;
}

.ss-pilot-setup-input--time {
  min-width: 0;
}

.ss-pilot-setup-select {
  padding-right: 42px;
  background-image:
    linear-gradient(45deg, transparent 50%, var(--ss-color-text-soft, #5F6B7A) 50%),
    linear-gradient(135deg, var(--ss-color-text-soft, #5F6B7A) 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 2px),
    calc(100% - 12px) calc(50% - 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

.ss-pilot-setup-input::placeholder,
.ss-pilot-setup-textarea::placeholder {
  color: var(--ss-color-text-soft, #5F6B7A);
}

.ss-pilot-setup-input:hover,
.ss-pilot-setup-textarea:hover,
.ss-pilot-setup-select:hover {
  border-color: var(--ss-color-border, #D5DCE6);
}

.ss-pilot-setup-input:focus,
.ss-pilot-setup-textarea:focus,
.ss-pilot-setup-select:focus {
  outline: none;
  border-color: var(--ss-color-primary);
  box-shadow: 0 0 0 3px rgba(30, 115, 190, 0.12);
  background: var(--ss-color-surface, #fff);
}

/* Actions */

.ss-pilot-setup-form__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px 12px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ss-pilot-setup-form__actions .ss-btn--secondary {
  background: var(--ss-color-surface, #fff);
}

.ss-pilot-setup-form__actions .ss-btn--primary {
  min-width: 142px;
}

.ss-pilot-setup-activate-form {
  margin-top: 12px;
}

.ss-pilot-setup-activation-panel__body .ss-btn--primary {
  align-self: flex-start;
}

/* ==========================================================
   Responsive
   ========================================================== */

@media (max-width: 1080px) {
  .ss-pilot-hero-bar {
    grid-template-columns: 1fr;
    min-height: 208px;
    padding-bottom: 32px;
  }

  .ss-pilot-hero-bar__media {
    justify-content: flex-start;
  }

  .ss-pilot-hero-media-card {
    max-width: 160px;
    height: 124px;
  }

  .ss-pilot-hero-media-card img {
    width: 118%;
    max-width: none;
    max-height: 110px;
    transform: scale(1.16);
    transform-origin: center center;
  }

  .ss-pilot-summary-card {
    margin-top: -32px;
  }

  .ssdash-kpis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ssdash-info {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ssdash-timeline__row {
    grid-template-columns: 100px 24px minmax(0, 1fr);
  }

  .ss-pilot-layout {
    grid-template-columns: 280px minmax(0, 1fr);
    gap: 16px;
  }

  .ss-pilot-summary-hang {
    grid-template-columns: 1fr;
  }

  .ssdash-attention-strip__list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 920px) {
  .ss-pilot-layout {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .ss-pilot-layout__rail {
    order: 1;
  }

  .ss-pilot-layout__main {
    order: 2;
  }

  .ss-pilot-layout__rail .ss-pilot-setup-shell__body {
    position: static;
    top: auto;
  }

  .ssdash-activity-card__grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .ssdash-activity-card__meta--side {
    justify-content: flex-start;
  }

  .ssdash-activity-card__media {
    margin-left: 0;
    max-width: 100%;
  }

  .ssdash-activity-card__badges--side {
    justify-content: flex-start !important;
    margin-top: 6px !important;
  }

  .ssdash-inline-body-expanded,
  .ssdash-inline-discussion-expanded {
    margin: 0 16px;
  }

  .ss-pilot-summary-hang__activity-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .ss-pilot-summary-hang__activity-actions {
    justify-content: flex-start;
  }

  .ssdash-activity-filters {
    flex-direction: column;
    align-items: stretch;
  }

  .ssdash-activity-filters__group {
    align-items: stretch;
  }
}

@media (max-width: 768px) {
  body.single-pilot .ss-app-main,
  body.ss-pilot-chrome-free .ss-app-main {
    padding: var(--ss-space-4) var(--ss-space-3) var(--ss-space-5);
  }

  .ss-pilot-hero-bar {
    min-height: auto;
    grid-template-columns: 1fr;
    padding: 0 0 18px;
  }

  .ss-pilot-hero-bar__content {
    padding-bottom: 0;
  }

  .ss-pilot-hero-bar__media {
    justify-content: flex-start;
  }

  .ss-pilot-hero-media-card {
    max-width: 156px;
    height: 112px;
  }

  .ss-pilot-hero-media-card img {
    width: 118%;
    max-width: none;
    max-height: 92px;
    transform: scale(1.16);
    transform-origin: center center;
  }

  .ss-pilot-summary-card {
    margin-top: 0;
  }

  .ss-pilot-detail-shell .ss-card {
    padding: 14px;
  }

  .ss-pilot-detail-shell .ss-section-header {
    padding: 6px 10px;
  }

  .ss-pilot-detail-shell .ss-section-header__title {
    font-size: var(--ss-fs-item);
  }

  .ss-pilot-detail-shell .ss-section-header__meta {
    font-size: var(--ss-fs-label);
  }

  .ssdash-kpis,
  .ssdash-info,
  .ss-pilot-overview-grid {
    grid-template-columns: 1fr;
  }

  .ssdash-timeline__row {
    grid-template-columns: 1fr;
    gap: 6px;
  }

  .ssdash-timeline__date-col {
    justify-content: flex-start;
    padding-right: 0;
    padding-top: 0;
  }

  .ssdash-timeline__axis-col {
    justify-content: flex-start;
    min-height: 18px;
  }

  .ssdash-timeline__axis-col::before {
    left: 4px;
  }

  .ssdash-timeline__content-col {
    padding-left: 0;
  }

  .ssdash-timeline__mainline {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .ss-thread-item-meta {
    flex-direction: column;
    align-items: flex-start;
  }

  .ss-pilot-summary-hang {
    gap: 14px;
  }

  .ss-pilot-summary-fact {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .ss-pilot-activity-preview-card.has-media {
    grid-template-columns: 1fr;
  }

  .ss-pilot-activity-preview-card__media {
    height: 140px;
    order: 2;
  }

  .ssdash-activity-filters__field {
    min-width: 0;
    width: 100%;
  }

  .ssdash-activity-filters__field select {
    width: 100%;
  }

  .ss-pilot-setup-form__actions {
    justify-content: stretch;
  }

  .ss-pilot-setup-form__actions .ss-btn {
    width: 100%;
  }

  .ss-pilot-setup-form__actions .ss-btn--primary {
    min-width: 0;
  }
}

@media (max-width: 640px) {
  /* De titel kromp hier van clamp(19..24px) naar 18px. Nu de basis zelf de
     titelrol uit de schaal draagt, is een tweede telefoonmaat overbodig. */

  .ss-thread-item-card {
    padding: 11px 12px !important;
  }

  .ss-thread-reply-form {
    padding: 12px !important;
  }

  .ss-pilot-setup-accordion-summary {
    padding: 12px 13px;
  }

  .ss-pilot-setup-accordion-body {
    padding: 10px;
  }

  .ss-pilot-setup-item {
    padding: 12px;
  }

  .ss-pilot-setup-field {
    gap: 4px;
    padding: 7px 0;
  }

  .ss-pilot-activity-preview-card {
    padding: 11px 12px;
  }

  .ss-pilot-activity-preview-card__media {
    height: 120px;
  }

  .ssdash-attention-strip,
  .ssdash-activity-filters {
    padding: 12px;
  }

  .ssdash-filter-chip {
    min-height: 34px;
    padding: 0 11px;
  }

  .ss-pilot-setup-input,
  .ss-pilot-setup-select {
    min-height: 42px;
  }

  .ss-pilot-setup-textarea {
    min-height: 108px;
  }
}

.ss-pilot-summary-hang__facts,
.ss-pilot-summary-hang__activity {
  min-width: 0;
  padding: 14px;
  background: var(--ssdash-surface-alt);
  border: 1px solid var(--ss-color-border);
  border-radius: 16px;
}

.ssdash-activity-card__toggle-row {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ssdash-expand-toggle {
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
  font-size: var(--ss-fs-body);
  font-weight: 700;
  color: var(--ss-color-text-soft, #5F6B7A);
  cursor: pointer;
}

.ssdash-expand-toggle:hover {
  color: var(--ss-color-primary);
  text-decoration: underline;
}

.ss-pilot-detail-shell .ss-badge {
  border-radius: 999px;
  font-weight: 700;
  opacity: 0.9;
}

.ss-pilot-detail-shell .ss-badge--primary,
.ss-pilot-detail-shell .ss-badge--accent {
  background: rgba(30, 115, 190, 0.08);
  border-color: rgba(30, 115, 190, 0.12);
}

.ssdash-issue-actions__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.ssdash-issue-actions {
  margin-top: 10px;
}

/* =========================================
   INTAKE MODE — FULL WIDTH LAYOUT
========================================= */

.ss-pilot-layout--intake {
  grid-template-columns: 1fr !important;
}

.ss-pilot-layout--intake .ss-pilot-layout__rail,
.ss-pilot-layout--intake .ss-pilot-setup-shell,
.ss-pilot-layout--intake .ss-pilot-setup-shell__body,
.ss-pilot-layout--intake .ss-pilot-setup-card,
.ss-pilot-layout--intake .ss-pilot-setup-status-panel,
.ss-pilot-layout--intake .ss-pilot-setup-activation-panel {
  width: 100%;
  max-width: 100%;
}

.ss-pilot-layout--intake textarea,
.ss-pilot-layout--intake input[type="text"],
.ss-pilot-layout--intake input[type="email"],
.ss-pilot-layout--intake input[type="number"],
.ss-pilot-layout--intake input[type="time"],
.ss-pilot-layout--intake select {
  width: 100%;
  max-width: 100%;
}

.ss-pilot-layout--intake textarea {
  min-height: 120px;
}

/* =========================================================================
   INTAKE — COMPACTE GRID-LAYOUT (PM-xxx, Fase 1a)
   Velden stromen in 2–3 kolommen i.p.v. één lange kolom met volle-breedte
   velden. Stuurt op het bestaande data-field-type op de veld-wrapper —
   geen markup-/save-path wijziging. Korte velden smal, notities + checkbox-
   groepen over de volle rij.
   ========================================================================= */

.ss-pilot-layout--intake .ss-pilot-setup-item__body {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
  align-items: start;
}

@media (min-width: 1180px) {
  .ss-pilot-layout--intake .ss-pilot-setup-item__body {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .ss-pilot-layout--intake .ss-pilot-setup-item__body {
    grid-template-columns: 1fr;
  }
}

/* binnen het grid: per-veld scheidingslijn/padding terug — het grid draagt nu de ritmiek */
.ss-pilot-layout--intake .ss-pilot-setup-item__body > .ss-pilot-setup-field {
  padding: 0;
}

.ss-pilot-layout--intake .ss-pilot-setup-item__body > .ss-pilot-setup-field + .ss-pilot-setup-field {
  border-top: 0;
}

/* volle rij voor notities, bestandsvelden en checkbox-groepen */
.ss-pilot-layout--intake .ss-pilot-setup-item__body > .ss-pilot-setup-field[data-field-type="textarea"],
.ss-pilot-layout--intake .ss-pilot-setup-item__body > .ss-pilot-setup-field[data-field-type="file"],
.ss-pilot-layout--intake .ss-pilot-setup-item__body > .ss-pilot-setup-field:has(.ss-pilot-setup-checkbox-group) {
  grid-column: 1 / -1;
}

/* korte velden: input passend dimensioneren i.p.v. blanco 100% (overschrijft de full-width regel hierboven) */
.ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="time"] .ss-pilot-setup-input,
.ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="number"] .ss-pilot-setup-input {
  max-width: 160px;
}

.ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="yes-no"] .ss-pilot-setup-select,
.ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="select"] .ss-pilot-setup-select {
  max-width: 240px;
}

@media (max-width: 600px) {
  .ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="yes-no"] .ss-pilot-setup-select,
  .ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="select"] .ss-pilot-setup-select,
  .ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="time"] .ss-pilot-setup-input,
  .ss-pilot-layout--intake .ss-pilot-setup-field[data-field-type="number"] .ss-pilot-setup-input {
    max-width: 100%;
  }
}

/* checkbox-groep: inline chips i.p.v. gestapelde regels */
.ss-pilot-layout--intake .ss-pilot-setup-checkbox-group {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}

.ss-pilot-layout--intake .ss-pilot-setup-checkbox-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin: 0;
  padding: 8px 12px;
  font-size: var(--ss-fs-body);
  background: var(--ss-color-bg, #EDF0F5);
  border: 1px solid var(--ss-color-border, #D5DCE6);
  border-radius: 8px;
  cursor: pointer;
}

/* compactere notitievelden in het grid (volle breedte is genoeg hoogte) */
.ss-pilot-layout--intake .ss-pilot-setup-textarea {
  min-height: 84px;
}

/* =========================================================================
   INTAKE WIZARD (PM-xxx, Fase 1b)
   Stap-navigatie + live conditional reveal. Progressive enhancement: zonder
   JS valt dit terug op alle stappen onder elkaar (panes niet hidden).
   ========================================================================= */

.ss-wz__progress {
  height: 4px;
  background: var(--ss-color-bg, #EDF0F5);
  border-radius: 999px;
  overflow: hidden;
  margin-bottom: 14px;
}

.ss-wz__progress-bar {
  display: block;
  height: 100%;
  width: 0;
  background: var(--ss-color-primary);
  transition: width 0.3s ease;
}

.ss-wz__stepper {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding-bottom: 6px;
  margin-bottom: 16px;
  -webkit-overflow-scrolling: touch;
}

.ss-wz-step-pill {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 7px 12px;
  border-radius: 999px;
  font-size: var(--ss-fs-sub);
  font-weight: 700;
  color: var(--ss-color-text-soft, #5F6B7A);
  white-space: nowrap;
}

.ss-wz-step-pill__dot {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--ss-color-bg, #EDF0F5);
  color: var(--ss-color-text-soft, #5F6B7A);
  font-size: var(--ss-fs-meta);
  flex: 0 0 auto;
}

.ss-wz-step-pill.is-active {
  color: var(--ss-color-primary);
  background: rgba(30, 116, 224, .12);
}

.ss-wz-step-pill.is-active .ss-wz-step-pill__dot {
  background: var(--ss-color-primary);
  color: var(--ss-color-text-on-dark, #fff);
}

.ss-wz-step-pill.is-done {
  color: var(--ss-color-success-ink, #0B6E4F);
}

.ss-wz-step-pill.is-done .ss-wz-step-pill__dot {
  background: rgba(47, 169, 107, .16);
  color: var(--ss-color-success-ink, #0B6E4F);
}

.ss-wz__pane[hidden] {
  display: none;
}

/* groups (fieldset) — reset native fieldset chrome */
.ss-wz-group {
  border: 0;
  margin: 0 0 18px;
  padding: 0;
  min-width: 0;
}

.ss-wz-group[hidden] {
  display: none;
}

.ss-wz-group__title {
  display: block;
  width: 100%;
  font-size: var(--ss-fs-item);
  font-weight: 700;
  color: var(--ssdash-heading);
  margin: 0 0 12px;
  padding: 0 0 8px;
  border-bottom: 1px solid var(--ss-color-border, #D5DCE6);
}

/* flatten de inner veld-container card binnen een groep/cond (geen dubbele box) */
.ss-wz-group .ss-pilot-setup-item:not([data-repeater-row]),
.ss-cond .ss-pilot-setup-item:not([data-repeater-row]) {
  border: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
  background: transparent;
}

/* conditioneel inner blok (workstation-subvelden, cleaning-only survey-subvelden) */
.ss-cond {
  border: 0;
  border-top: 1px dashed var(--ss-color-border, #D5DCE6);
  margin: 12px 0 0;
  padding: 12px 0 0;
  min-width: 0;
}

.ss-cond[hidden] {
  display: none;
}

/* wizard footer */
.ss-wz__foot {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--ss-color-border, #D5DCE6);
}

.ss-wz__counter {
  font-size: var(--ss-fs-sub);
  color: var(--ss-color-text-soft);
}

.ss-wz__foot-actions {
  margin-left: auto;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.ss-btn--ghost {
  background: transparent;
  border-color: transparent;
  color: var(--ss-color-text-soft);
}

@media (max-width: 600px) {
  .ss-wz__foot-actions {
    width: 100%;
    margin-left: 0;
  }

  .ss-wz__foot-actions .ss-btn {
    flex: 1 1 auto;
  }
}

/* =============================================================
   SS PILOT HEADER — PM-243 / PM-250
   Patroon: 1:1 portal-stijl (sibling-rij in hero)
   Scope: body.single-pilot .ss-pilot-detail-shell
   ============================================================= */

.ss-page-hero--pilot-detail {
  position: relative;
  isolation: isolate;
  background: transparent;
  padding: 0 calc(var(--ss-space-5) + 18px) 40px;
}

.ss-page-hero--pilot-detail::before {
  content: '';
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  right: calc(50% - 50vw);
  bottom: 0;
  background: var(--ss-color-hero, #c63c77);
  z-index: -1;
}

body.single-pilot .ss-page-hero--pilot-detail {
  margin-bottom: 0;
}

/* Dode pilot-header-selectors (.ss-pilot-hdr__*) verwijderd na nav-IA v2:
   de oude pilot-header (inc/pilot-nav.php) is vervangen door de gedeelde
   megamenu-header ssp_render_portal_header(); markup bestaat niet meer. */

/* ============================================================
   PM-356 PR-D — gedeelde megamenu-header op de pilot-detailpagina
   ============================================================ */

/* (1) Breedte-uitlijning: de header zit binnen .ss-app-main die zelf al
   max-width + var(--ss-space-5)-padding heeft. De header niet nóg eens
   inspringen. padding-bottom = roze overlap-zone voor de eerste card. */
.ss-page-hero--pilot-detail .ss-portal-hero-bar {
  max-width: none;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 40px;
}

/* (3+4) Layout exact als de rest van het portaal: roze als ACHTERGROND-gradient
   op de shell (zoals portal-home), i.p.v. een positioned ::before. Daardoor:
   (a) megamenu valt over de content (nav z-index > card, geen stacking-val),
   (b) de eerste card overlapt de roze band -40px, en (c) de extra ruimte
   verdwijnt — de base .ss-app-shell-gradient is 188px; hier teruggebracht naar
   140px, net als portal-home. */
.ss-page-hero--pilot-detail::before { display: none; }
/* hero = stacking-context bóven de content zodat het megamenu over de cards valt
   (pink is nu een achtergrond op de shell, dus dit bedekt de content niet).
   pointer-events:none zodat de transparante overlap-zone (padding-bottom) de
   klikken op de eronder stekende content (New Update/Issue-knoppen) NIET opvangt;
   alleen de echte header-elementen (topbalk + nav/megamenu) blijven klikbaar. */
.ss-page-hero--pilot-detail { z-index: 50; pointer-events: none; }
.ss-page-hero--pilot-detail .ss-portal-hero-bar__top,
.ss-page-hero--pilot-detail .ss-portal-hdr__nav { pointer-events: auto; }
body.ss-pilot-chrome-free .ss-pilot-detail-shell,
body.single-pilot .ss-pilot-detail-shell {
  background: linear-gradient(180deg, var(--ss-color-hero, #c63c77) 0, var(--ss-color-hero, #c63c77) 140px, var(--ss-color-bg) 140px, var(--ss-color-bg) 100%);
}
/* content-stack overlapt de roze band -40px — op de CONTAINER (net als
   .ss-portal-tiles op portal-home), niet op het eerste kind. Geldt voor élke
   pilot-staat (snapshot, intake-setup). */
.ss-pilot-detail-shell .ss-stack--page {
  margin-top: -40px;
  position: relative;
  z-index: 3;
}

/* Robot-thumbnail in de snapshot-kaart — hard begrenzen (de body img-regel
   max-width:100%/height:auto wint anders) en ~2x groter (Ron). */
.ss-pilot-summary-hang__aside {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-shrink: 0;
}
.ss-pilot-detail-shell .ss-pilot-thumb {
  height: 92px !important;
  width: auto !important;
  max-width: 150px;
  object-fit: contain;
  border-radius: 8px;
  background: var(--ss-color-surface, #fff);
  border: 1px solid var(--ss-color-border);
  padding: 4px 6px;
}

/* R-20261016-16 (REGELS_ux regel 2): invoer in het pilot-setup-formulier in de gewone letter.
   Chromium geeft een <textarea> standaard monospace ("typemachineletter"); de rustige
   intake-typografie (PM-933) gold alleen binnen .ssp-intake-wrap, niet op /pilot/. */
[data-pilot-setup-form] input,
[data-pilot-setup-form] select,
[data-pilot-setup-form] textarea,
[data-pilot-setup-form] button {
  font-family: inherit;
}

/* B3b (R-20261016-34): miniaturen van intake-foto's (fotovak, klant-uitnodiging, pilot-dossier
   alleen-lezen). Eigen CSS, alleen tokens. */
.ss-foto-vak__thumbs, .ss-foto-dossier__thumbs { display: flex; flex-wrap: wrap; gap: var(--ss-space-1); }
.ss-foto-thumb { position: relative; display: inline-block; width: 56px; height: 56px; }
.ss-foto-thumb__a { display: block; box-sizing: border-box; width: 100%; height: 100%; overflow: hidden; border: 1px solid var(--ss-color-border); border-radius: var(--ss-radius-sm); background: var(--ss-color-bg); }
.ss-foto-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ss-foto-thumb__a--doc { display: flex; align-items: center; justify-content: center; font-weight: 700; color: var(--ss-color-text-soft); text-decoration: none; }
.ss-foto-thumb.is-wacht .ss-foto-thumb__a { opacity: .55; border-style: dashed; }
.ss-foto-thumb__del { position: absolute; top: -10px; right: -10px; display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.ss-foto-thumb__del span { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: var(--ss-color-text); color: var(--ss-color-surface); line-height: 1; }
.ss-foto-dossier { display: grid; gap: var(--ss-space-3); }
.ss-foto-dossier__g { min-width: 0; }
.ss-foto-dossier__t { margin: 0 0 var(--ss-space-1); font-weight: 700; overflow-wrap: anywhere; }
.ss-foto-dossier__g .ss-muted { margin: 0; }
.ss-foto-klant .ss-foto-dossier__thumbs { margin-bottom: var(--ss-space-3); }