/* Strata — dark, content-first. Bootstrap 5 provides the base; this adds the
   masthead, station chip, and sample/borehole surfaces. */

:root {
  --strata-accent: #4a9eff;
  --strata-earth: #b8895a;
}

body { min-height: 100vh; }

/* Masthead */
.masthead {
  border-bottom: 1px solid var(--bs-border-color);
  background: var(--bs-tertiary-bg);
}
.masthead-inner { display: flex; align-items: center; gap: 1rem; padding: .6rem 0; }
.brand { display: flex; align-items: center; gap: .55rem; text-decoration: none; color: var(--bs-body-color); }
.brand-strata { display: inline-block; width: 26px; height: 26px; }
.brand-name { font-weight: 600; letter-spacing: .04em; }
.brand-sub { display: block; font-size: .68rem; color: var(--bs-secondary-color); letter-spacing: .06em; text-transform: uppercase; }
.masthead-right { margin-left: auto; display: flex; align-items: center; gap: .75rem; }
.masthead-nav { display: flex; gap: 1rem; }
.masthead-nav a { color: var(--bs-secondary-color); text-decoration: none; font-size: .92rem; }
.masthead-nav a:hover, .masthead-nav a.active { color: var(--bs-body-color); }

/* Station chip */
.station-chip {
  display: inline-flex; align-items: center; gap: .4rem;
  border: 1px solid var(--bs-border-color); border-radius: 999px;
  background: var(--bs-body-bg); color: var(--bs-body-color);
  padding: .28rem .7rem; font-size: .85rem; cursor: pointer;
}
.station-chip.station-unset { border-color: var(--strata-accent); color: var(--strata-accent); }
.station-dot { color: var(--strata-accent); }

/* Material tag pills */
.tag-pill {
  display: inline-block; padding: .05rem .5rem; margin: .1rem .15rem .1rem 0;
  border-radius: 999px; font-size: .74rem; background: var(--bs-secondary-bg);
  border: 1px solid var(--bs-border-color);
}

/* Test-instance status chips */
.status-in_box { color: var(--bs-secondary-color); }
.status-in_progress { color: var(--strata-accent); }
.status-completed { color: var(--bs-success); }

.sample-photo-thumb { width: 64px; height: 64px; object-fit: cover; border-radius: 6px; background: var(--bs-secondary-bg); }
.sample-row.selected { outline: 2px solid var(--strata-accent); outline-offset: -2px; }

.custody-trail { font-size: .85rem; }
.custody-trail .ev { color: var(--strata-earth); font-weight: 500; }

.depth-cell { font-variant-numeric: tabular-nums; }
.foot { color: var(--bs-secondary-color); font-size: .82rem; padding: 1.5rem 0; }

/* Signed-in account chip (RBAC, Stage 1.1) */
.account-chip {
  display: inline-flex; flex-direction: column; align-items: flex-start;
  gap: 0; line-height: 1.05; padding: .25rem .6rem; margin-left: .35rem;
  background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color);
  border-radius: 7px; cursor: pointer; color: inherit;
}
.account-chip:hover { border-color: var(--strata-accent); }
.account-chip .account-name { font-weight: 600; font-size: .85rem; }
.account-chip .account-role { font-size: .68rem; text-transform: uppercase;
  letter-spacing: .04em; color: var(--bs-secondary-color); }

/* Project lifecycle rail (Stage 2.1) */
.lifecycle-rail { font-size: .72rem; }
.lifecycle-step { padding: .1rem .4rem; border-radius: 4px; background: var(--bs-tertiary-bg);
  color: var(--bs-secondary-color); white-space: nowrap; }
.lifecycle-step.active { background: var(--strata-accent, #4a7c9e); color: #fff; font-weight: 600; }
