/* PM — styles layered on top of Bootstrap 5. */

html, body { height: 100%; }
body {
  display: flex;
  flex-direction: column;
  background: #fbfbfc;
  -webkit-font-smoothing: antialiased;
}
main { flex: 1 0 auto; }

/* ── top navigation ─────────────────────────────────────────────────── */
.pm-nav { background: #fff; padding-top: .15rem; padding-bottom: .15rem; }
.pm-nav .nav-link {
  color: #495057;
  font-size: .95rem;
  padding: .75rem 1rem;
  border-bottom: 2px solid transparent;
}
.pm-nav .nav-link:hover { color: #212529; }
.pm-nav .nav-link.active {
  color: #198754;
  border-bottom-color: #198754;
  font-weight: 500;
}
.pm-footer { background: #fff; }

/* ── avatars ────────────────────────────────────────────────────────── */
.pm-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  font-weight: 600;
  line-height: 1;
  flex-shrink: 0;
  user-select: none;
}

/* ── project cards ──────────────────────────────────────────────────── */
.pm-project-card {
  display: flex;
  align-items: flex-start;
  gap: .9rem;
  border: 1px solid #dee2e6;
  border-left: 4px solid var(--pm-accent, #0d6efd);
  border-radius: .5rem;
  background: #fff;
  padding: 1rem 1.15rem;
  height: 100%;
  text-decoration: none;
  color: inherit;
  transition: box-shadow .15s, transform .15s;
}
.pm-project-card:hover {
  box-shadow: 0 .35rem .9rem rgba(0, 0, 0, .08);
  transform: translateY(-1px);
  color: inherit;
}
.pm-project-card h3 {
  font-size: 1.05rem;
  font-weight: 700;
  margin: 0 0 .35rem;
}
.pm-project-card .pm-meta { font-size: .85rem; color: #6c757d; }

/* ── page headings ──────────────────────────────────────────────────── */
.pm-page-head {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-bottom: 1.25rem;
}
.pm-page-head h1 {
  font-size: 1.6rem;
  font-weight: 700;
  margin: 0;
}
.pm-page-head .bi { font-size: 1.4rem; color: #0d6efd; }

/* ── sign-in and other narrow forms ─────────────────────────────────── */
.pm-auth-wrap {
  max-width: 26rem;
  margin: 3.5rem auto;
}
.pm-auth-wrap .card { border-color: #dee2e6; }
.pm-brand {
  text-align: center;
  margin-bottom: 1.5rem;
}
.pm-brand .pm-brand-name {
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: -.02em;
}
.pm-brand .pm-brand-tag { color: #6c757d; font-size: .9rem; }

/* ── tables ─────────────────────────────────────────────────────────── */
.pm-table { background: #fff; }
.pm-table th {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6c757d;
  font-weight: 600;
}
.pm-table td { vertical-align: middle; }

/* A one-off password shown after account creation when mail didn't go out. */
.pm-secret {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  background: #fff3cd;
  border: 1px solid #ffe69c;
  border-radius: .35rem;
  padding: .2rem .5rem;
  user-select: all;
}

/* ── empty states ───────────────────────────────────────────────────── */
.pm-empty {
  text-align: center;
  padding: 3.5rem 1rem;
  color: #6c757d;
}
.pm-empty .bi {
  font-size: 2.5rem;
  display: block;
  margin-bottom: .75rem;
  opacity: .45;
}

.pm-badge-access { font-size: .72rem; font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .pm-project-card { transition: none; }
}

/* ── board table ────────────────────────────────────────────────────── */
.pm-table-scroll {
  overflow: auto;
  max-height: calc(100vh - 230px);
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: .5rem;
}
.pm-board-table { margin: 0; font-size: .9rem; }
.pm-board-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f8f9fa;
  border-bottom: 1px solid #dee2e6;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6c757d;
  font-weight: 600;
  white-space: nowrap;
}
.pm-board-table .pm-col-name    { min-width: 280px; }
.pm-board-table .pm-col-th      { min-width: 150px; }
.pm-board-table .pm-col-actions { width: 44px; }
.pm-col-grip, .pm-group-grip, .pm-item-grip { cursor: grab; opacity: .35; }
.pm-col-grip:hover, .pm-group-grip:hover, .pm-item-grip:hover { opacity: 1; }

.pm-group-row td {
  background: #f8f9fa;
  font-size: .85rem;
  padding: .45rem .6rem;
}
.pm-item-row:hover  { background: #f8fbff; }
.pm-subtask         { background: #fcfcfd; }
.pm-subtask .pm-item-name { font-size: .86rem; color: #495057; }
.pm-add-row td      { padding: .2rem .6rem; border-bottom: 0; }

.pm-cell            { max-width: 260px; }
.pm-editable        { cursor: pointer; }
.pm-editable:hover  { box-shadow: inset 0 0 0 1px #cfe2ff; }
.pm-cell-empty      { color: #ced4da; }
.pm-editable-name   { cursor: text; }

.pm-status {
  display: inline-block;
  padding: .2rem .55rem;
  border-radius: 1rem;
  color: #fff;
  font-size: .75rem;
  font-weight: 600;
  white-space: nowrap;
}
.pm-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.pm-people { display: inline-flex; gap: 2px; }
.pm-timeline-bar {
  display: block;
  height: 4px;
  border-radius: 2px;
  background: #0d6efd;
  margin-bottom: 2px;
}
.pm-pct {
  position: relative;
  height: 18px;
  background: #e9ecef;
  border-radius: .25rem;
  overflow: hidden;
  min-width: 90px;
}
.pm-pct-fill  { height: 100%; background: #198754; }
.pm-pct-label {
  position: absolute;
  inset: 0;
  text-align: center;
  font-size: .72rem;
  line-height: 18px;
  font-weight: 600;
}
.pm-rating .bi { color: #ffc107; font-size: .8rem; }

/* ── popup editors ──────────────────────────────────────────────────── */
.pm-popup {
  position: fixed;
  z-index: 1080;
  min-width: 210px;
  max-height: 260px;
  overflow-y: auto;
}
.pm-popup .dropdown-item { border-radius: .25rem; }

.pm-toast {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1090;
  max-width: 22rem;
  margin: 0;
}

/* ── modals ─────────────────────────────────────────────────────────── */
.pm-type-tile input { display: none; }
.pm-type-tile span {
  display: block;
  border: 1px solid #dee2e6;
  border-radius: .35rem;
  padding: .45rem .6rem;
  font-size: .85rem;
  cursor: pointer;
}
.pm-type-tile input:checked + span {
  border-color: #0d6efd;
  background: #e7f1ff;
  font-weight: 600;
}
.pm-swatch {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  cursor: pointer;
  border: 2px solid transparent;
}
.pm-swatch input { display: none; }
.pm-swatch:has(input:checked) { border-color: #212529; }

/* Width lives with the record-panel rules further down. */

/* ── kanban ─────────────────────────────────────────────────────────── */
.pm-kanban {
  display: flex;
  gap: .75rem;
  align-items: flex-start;
  overflow-x: auto;
  padding-bottom: .75rem;
  min-height: 60vh;
}
.pm-lane {
  flex: 0 0 270px;
  background: #f4f5f7;
  border-radius: .5rem;
  padding: .55rem;
  max-height: calc(100vh - 260px);
  display: flex;
  flex-direction: column;
}
.pm-lane-head {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .15rem .25rem .5rem;
  font-size: .85rem;
}
.pm-lane-body {
  flex: 1 1 auto;
  overflow-y: auto;
  min-height: 2.5rem;
}
.pm-lane-unset { background: #fdf6f6; }
.pm-lane-add {
  border: 0;
  background: transparent;
  color: #6c757d;
  font-size: .82rem;
  text-align: left;
  padding: .4rem .25rem 0;
  width: 100%;
}
.pm-lane-add:hover { color: #0d6efd; }

.pm-card {
  background: #fff;
  border: 1px solid #e3e5e8;
  border-radius: .4rem;
  padding: .5rem .6rem;
  margin-bottom: .4rem;
  font-size: .87rem;
  cursor: grab;
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
}
.pm-card:hover     { border-color: #b6d4fe; }
.pm-card-ghost     { opacity: .4; }
.pm-card-name      { line-height: 1.3; }
.pm-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .4rem;
}
.pm-card-bit { font-size: .75rem; }
.pm-card-bit .pm-pct { min-width: 70px; height: 14px; }
.pm-card-bit .pm-pct-label { line-height: 14px; font-size: .65rem; }

/* ── timeline ───────────────────────────────────────────────────────── */
.pm-gantt-scroll {
  overflow: auto;
  max-height: calc(100vh - 250px);
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: .5rem;
}
.pm-gantt {
  border-collapse: collapse;
  font-size: .82rem;
  white-space: nowrap;
}
.pm-gantt th, .pm-gantt td {
  border: 1px solid #edf0f2;
  padding: 0;
}
.pm-gantt thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8f9fa;
  font-weight: 600;
  color: #6c757d;
  text-align: center;
  padding: .25rem .35rem;
}
.pm-gantt-month {
  font-size: .8rem;
  color: #212529;
  border-bottom: 1px solid #dee2e6 !important;
}
.pm-gantt-day  { width: 34px; min-width: 34px; font-weight: 500; }
.pm-gantt-name {
  position: sticky;
  left: 0;
  z-index: 3;
  background: #fff;
  min-width: 220px;
  max-width: 260px;
  padding: .35rem .6rem !important;
  border-right: 1px solid #dee2e6 !important;
}
.pm-gantt thead .pm-gantt-name { background: #f8f9fa; z-index: 4; }
.pm-gantt-cell { height: 32px; }
.pm-weekend    { background: #fafbfc; }
.pm-today      { background: #fff8e1; }
.pm-bar {
  height: 16px;
  margin: 0 2px;
  border-radius: 8px;
  background: #0d6efd;
}
.pm-bar-edit { cursor: pointer; }
.pm-bar-edit:hover { background: #0b5ed7; }

/* ── knowledge base ─────────────────────────────────────────────────── */
.pm-kb {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  background: #fff;
  border: 1px solid #dee2e6;
  border-radius: .5rem;
  padding: 1rem 1.25rem;
}
.pm-kb-tree {
  flex: 0 0 240px;
  max-height: calc(100vh - 280px);
  overflow-y: auto;
  border-right: 1px solid #eef0f2;
  padding-right: .75rem;
  font-size: .87rem;
}
.pm-kb-folder {
  padding: .3rem .35rem;
  font-weight: 600;
  color: #495057;
  text-transform: uppercase;
  font-size: .76rem;
  letter-spacing: .02em;
}
.pm-kb-item {
  display: block;
  padding: .3rem .35rem;
  border-radius: .25rem;
  color: #0d6efd;
  text-decoration: none;
}
.pm-kb-item:hover  { background: #f1f5fb; }
.pm-kb-item.active { background: #e7f1ff; font-weight: 600; }
.pm-kb-hidden      { opacity: .5; }

.pm-kb-page {
  flex: 1 1 auto;
  min-width: 0;
  max-height: calc(100vh - 280px);
  overflow-y: auto;
}

/* rendered markdown */
.pm-md            { line-height: 1.65; color: #212529; }
.pm-md h1         { font-size: 1.6rem; font-weight: 700; margin: 1.4rem 0 .8rem; }
.pm-md h2         { font-size: 1.3rem; font-weight: 700; margin: 1.3rem 0 .7rem; }
.pm-md h3         { font-size: 1.1rem; font-weight: 600; margin: 1.1rem 0 .6rem; }
.pm-md p          { margin-bottom: .9rem; }
.pm-md ul, .pm-md ol { margin-bottom: .9rem; padding-left: 1.4rem; }
.pm-md li         { margin-bottom: .25rem; }
.pm-md code {
  background: #f1f3f5;
  padding: .12rem .35rem;
  border-radius: .2rem;
  font-size: .875em;
}
.pm-md pre {
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: .35rem;
  padding: .8rem 1rem;
  overflow-x: auto;
  margin-bottom: 1rem;
}
.pm-md pre code { background: none; padding: 0; }
.pm-md blockquote {
  border-left: 3px solid #dee2e6;
  padding-left: 1rem;
  color: #6c757d;
  margin: 0 0 1rem;
}
.pm-md table {
  border-collapse: collapse;
  margin-bottom: 1rem;
  font-size: .9rem;
}
.pm-md th, .pm-md td { border: 1px solid #dee2e6; padding: .4rem .7rem; }
.pm-md th            { background: #f8f9fa; font-weight: 600; }
.pm-md img           { max-width: 100%; height: auto; }
.pm-md hr            { margin: 1.4rem 0; }

@media (max-width: 768px) {
  .pm-kb { flex-direction: column; }
  .pm-kb-tree { flex: 1 1 auto; width: 100%; border-right: 0; border-bottom: 1px solid #eef0f2; }
}

/* ── assessment ─────────────────────────────────────────────────────── */
.pm-assess { font-size: .87rem; }
.pm-assess thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8f9fa;
  font-size: .78rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6c757d;
}
.pm-assess-obj td {
  background: #212529;
  color: #fff;
  font-weight: 700;
  font-size: .82rem;
  letter-spacing: .04em;
  padding: .5rem .7rem;
}
.pm-assess-cat td {
  background: #f1f3f5;
  font-weight: 600;
  font-size: .82rem;
  color: #495057;
  padding: .35rem .7rem .35rem 1.4rem;
}
.pm-assess-row td { padding: .4rem .7rem; }
.pm-assess-row.pm-lv-1 { background: #fdf1f2; }
.pm-assess-row.pm-lv-2 { background: #fff8ec; }
.pm-assess-row.pm-lv-3 { background: #eefaf3; }
.pm-assess-row:hover   { background: #f4f8ff; }

.pm-lv-tile {
  display: block;
  border: 1px solid #dee2e6;
  border-radius: .4rem;
  padding: .6rem .75rem;
  margin-bottom: .5rem;
  cursor: pointer;
}
.pm-lv-tile.active   { border-color: #0d6efd; background: #f2f7ff; }
.pm-lv-tile input    { display: none; }
.pm-lv-head {
  display: flex;
  align-items: center;
  gap: .45rem;
  font-size: .9rem;
}
.pm-lv-desc, .pm-lv-ev {
  display: block;
  font-size: .82rem;
  color: #6c757d;
  margin-top: .35rem;
  line-height: 1.45;
}
.pm-lv-ev { color: #495057; }

/* ── risk registers ─────────────────────────────────────────────────── */
.pm-risk-table { font-size: .85rem; }
.pm-risk-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f8f9fa;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  color: #6c757d;
  white-space: nowrap;
}
.pm-risk-table td { padding: .4rem .6rem; }
.pm-risk-table tbody tr:hover { background: #f6f9ff; }

/* heat map */
.pm-heat { border-collapse: separate; border-spacing: 3px; }
.pm-heat th {
  font-size: .74rem;
  font-weight: 600;
  color: #6c757d;
  text-align: center;
  padding: .2rem .4rem;
  white-space: nowrap;
}
.pm-heat tbody th { text-align: right; }
.pm-heat td {
  width: 58px;
  height: 42px;
  border-radius: .25rem;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: .95rem;
}

.pm-barline {
  height: 12px;
  background: #e9ecef;
  border-radius: 6px;
  overflow: hidden;
}
.pm-barline > div { height: 100%; background: #0d6efd; }

/* ── visualization ──────────────────────────────────────────────────── */
.pm-chart { position: relative; height: 260px; }

.pm-heat td { position: relative; padding: .35rem; }
.pm-heat-n  { display: block; font-size: 1rem; line-height: 1.1; }
.pm-heat-u  { display: block; font-size: .62rem; font-weight: 400; opacity: .85; }
.pm-heat-dot { color: rgba(255,255,255,.75); font-size: 1rem; }

.pm-paired {
  display: flex;
  align-items: flex-end;
  gap: .5rem;
  height: 190px;
  padding-bottom: .25rem;
}
.pm-paired-group { flex: 1 1 0; display: flex; flex-direction: column; height: 100%; }
.pm-paired-bars {
  flex: 1 1 auto;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
}
.pm-paired-bar {
  width: 42%;
  min-height: 2px;
  border-radius: 2px 2px 0 0;
  position: relative;
}
.pm-paired-bar span {
  position: absolute;
  top: -1.1rem;
  left: 0;
  right: 0;
  text-align: center;
  font-size: .7rem;
  font-weight: 600;
  color: #495057;
}
.pm-paired-label {
  text-align: center;
  font-size: .72rem;
  color: #6c757d;
  padding-top: .3rem;
  border-top: 1px solid #e9ecef;
}

.pm-map-wrap {
  position: relative;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: .4rem;
  overflow: hidden;
}
.pm-map-wrap svg { width: 100%; height: 62vh; min-height: 380px; display: block; cursor: grab; }
.pm-node { cursor: pointer; }
.pm-node:hover { stroke: #212529; stroke-width: 2; }
.pm-map-tip {
  position: absolute;
  z-index: 5;
  background: #212529;
  color: #fff;
  font-size: .76rem;
  padding: .3rem .5rem;
  border-radius: .25rem;
  pointer-events: none;
  max-width: 20rem;
}
.pm-legend-diamond, .pm-legend-square {
  display: inline-block;
  width: 11px;
  height: 11px;
  margin-right: .35rem;
  vertical-align: -1px;
}
.pm-legend-diamond { transform: rotate(45deg); }
.pm-legend-square  { border-radius: 2px; }
.pm-legend-line {
  display: inline-block;
  width: 16px;
  height: 2px;
  margin-right: .35rem;
  vertical-align: 4px;
}

.pm-map-tip-fixed { position: fixed; z-index: 2000; line-height: 1.6; }
.pm-legend-round { display:inline-block; width:11px; height:11px; border-radius:50%;
                   margin-right:.35rem; vertical-align:-1px; }
.pm-legend-tri {
  display: inline-block;
  width: 0; height: 0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 11px solid #adb5bd;
  margin-right: .35rem;
  vertical-align: -1px;
}
.pm-legend-dash { background: transparent !important; border-top: 2px dashed #9e9e9e; height: 0; }

/* ── risk record panel and register tables ──────────────────────────── */
.pm-drawer {
  --bs-offcanvas-width: 50vw;
  width: 50vw;
  max-width: none;
}
@media (max-width: 992px) {
  .pm-drawer { --bs-offcanvas-width: 85vw; width: 85vw; }
}
@media (max-width: 576px) {
  .pm-drawer { --bs-offcanvas-width: 100%; width: 100%; }
}

.pm-rk-row { cursor: pointer; }
.pm-rk-row.table-active { box-shadow: inset 3px 0 0 #0d6efd; }

.pm-cia { display: inline-flex; gap: .3rem; font-weight: 700; font-size: .82rem; }
.pm-cia-part {
  display: inline-block;
  min-width: 1.15rem;
  text-align: center;
  border-radius: .2rem;
  background: rgba(0, 0, 0, .04);
}

.pm-chip {
  display: inline-block;
  padding: .2rem .5rem;
  margin: 0 .3rem .3rem 0;
  border-radius: 1rem;
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .01em;
}
.pm-chip:hover { color: #fff; filter: brightness(.92); }
.pm-related-list { line-height: 1.9; }

/* A subtask on a card view says what it belongs to. */
.pm-card-sub { border-left: 3px solid #ced4da; }
.pm-card-parent {
  font-size: .7rem;
  color: #868e96;
  margin-bottom: .2rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── sidebar reordering ─────────────────────────────────────────────── */
.pm-board-grip {
  cursor: grab;
  opacity: 0;
  color: inherit;
  flex-shrink: 0;
  transition: opacity .12s;
}
.pm-sidebar li:hover .pm-board-grip { opacity: .45; }
.pm-board-grip:hover { opacity: 1 !important; }
.pm-sidebar .sortable-ghost { opacity: .45; }
.pm-sidebar .sortable-chosen a { box-shadow: 0 0 0 2px #b6d4fe inset; }
@media (prefers-reduced-motion: reduce) { .pm-board-grip { transition: none; } }

/* ── assessment evidence ────────────────────────────────────────────── */
.pm-assess-row { cursor: pointer; }
.pm-assess-row:focus-visible { outline: 2px solid #0d6efd; outline-offset: -2px; }

.pm-evidence {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: .65rem;
}
.pm-ev-tile {
  position: relative;
  border: 1px solid #dee2e6;
  border-radius: .4rem;
  padding: .4rem;
  background: #fff;
  text-align: center;
  overflow: hidden;
}
.pm-ev-tile:hover { border-color: #b6d4fe; box-shadow: 0 2px 6px rgba(0, 0, 0, .07); }

.pm-ev-face {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 76px;
  background: #f8f9fa;
  border-radius: .25rem;
  overflow: hidden;
  text-decoration: none;
}
.pm-ev-face img { max-width: 100%; max-height: 76px; object-fit: contain; }
.pm-ev-face .bi { font-size: 2.1rem; }

.pm-ev-name {
  display: block;
  margin-top: .35rem;
  font-size: .72rem;
  line-height: 1.25;
  color: #0d6efd;
  text-decoration: none;
  word-break: break-word;
  /* two lines, then ellipsis — filenames are often long */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.pm-ev-name:hover { text-decoration: underline; }
.pm-ev-size { display: block; font-size: .66rem; color: #adb5bd; }

.pm-ev-del {
  position: absolute;
  top: .2rem;
  right: .2rem;
  border: 0;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  line-height: 1;
  font-size: .65rem;
  color: #fff;
  background: rgba(33, 37, 41, .6);
  opacity: 0;
  transition: opacity .12s;
}
.pm-ev-tile:hover .pm-ev-del { opacity: 1; }
.pm-ev-del:hover { background: #dc3545; }
@media (prefers-reduced-motion: reduce) { .pm-ev-del { transition: none; } }

/* Evidence shown inline on an assessment row: a small strip under the text. */
.pm-ev-strip {
  display: flex;
  flex-wrap: wrap;
  gap: .3rem;
  margin-top: .35rem;
}
.pm-ev-mini {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 1px solid #dee2e6;
  border-radius: .25rem;
  background: #f8f9fa;
  overflow: hidden;
  text-decoration: none;
  flex-shrink: 0;
}
.pm-ev-mini:hover { border-color: #0d6efd; box-shadow: 0 0 0 2px rgba(13, 110, 253, .15); }
.pm-ev-mini img { width: 100%; height: 100%; object-fit: cover; }
.pm-ev-mini .bi { font-size: 1.05rem; }
.pm-ev-more {
  align-self: center;
  font-size: .72rem;
  color: #6c757d;
  padding: 0 .2rem;
}

/* ── knowledge base editor ──────────────────────────────────────────── */
.pm-kb-list li { list-style: none; }
.pm-kb-item {
  display: flex;
  align-items: center;
  gap: .35rem;
  padding: .3rem .35rem;
  border-radius: .25rem;
  color: #0d6efd;
  text-decoration: none;
  font-size: .87rem;
}
.pm-kb-item:hover  { background: #f1f5fb; }
.pm-kb-item.active { background: #e7f1ff; font-weight: 600; }
.pm-kb-grip { cursor: grab; opacity: 0; font-size: .8rem; color: #adb5bd; }
.pm-kb-item:hover .pm-kb-grip { opacity: .6; }

.pm-kb-split {
  display: grid;
  grid-template-columns: 1fr 6px 1fr;
  gap: .5rem;
  height: calc(100vh - 340px);
  min-height: 22rem;
}
.pm-kb-drag {
  cursor: col-resize;
  border-radius: 3px;
  background: #e9ecef;
  transition: background .12s;
}
.pm-kb-drag:hover, .pm-kb-drag:active { background: #0d6efd; }
.pm-drop { outline: 2px dashed #0d6efd; outline-offset: -3px; }
.pm-kb-split textarea {
  height: 100%;
  resize: none;
  font-size: .85rem;
  line-height: 1.55;
}
.pm-kb-preview {
  height: 100%;
  overflow-y: auto;
  border: 1px solid #dee2e6;
  border-radius: .375rem;
  padding: .9rem 1.1rem;
  background: #fff;
}
@media (max-width: 992px) {
  .pm-kb-split { grid-template-columns: 1fr !important; height: auto; }
  .pm-kb-drag { display: none; }
  .pm-kb-split textarea { height: 18rem; }
  .pm-kb-preview { height: 18rem; }
}

/* ── project icons ──────────────────────────────────────────────────── */
/* The logo sits to the right of the card, out of the way of the text. */
.pm-project-body { flex: 1 1 auto; min-width: 0; }
.pm-project-logo {
  width: 52px;
  height: 52px;
  border-radius: .35rem;
  object-fit: contain;
  background: #fff;
  flex-shrink: 0;
  align-self: center;
}
.pm-icon-preview {
  width: 56px; height: 56px;
  border-radius: .4rem;
  object-fit: cover;
  border: 1px solid #dee2e6;
  flex-shrink: 0;
}
.pm-icon-empty {
  display: flex; align-items: center; justify-content: center;
  background: #f8f9fa; color: #ced4da; font-size: 1.4rem;
}

/* Right-hand panels for account admin. */
.pm-panel { --bs-offcanvas-width: 50vw; width: 50vw; max-width: none; }
@media (max-width: 1200px) { .pm-panel { --bs-offcanvas-width: 80vw; width: 80vw; } }
@media (max-width: 768px) { .pm-panel { width: 100%; } }

/* ── theme picker ───────────────────────────────────────────────────── */
.pm-theme-tile {
  display: block;
  border: 2px solid #dee2e6;
  border-radius: .5rem;
  padding: .75rem;
  cursor: pointer;
  height: 100%;
}
.pm-theme-tile.active,
.pm-theme-tile:has(input:checked) { border-color: #0d6efd; }
.pm-theme-tile input { display: none; }

.pm-theme-swatch {
  display: block;
  border-radius: .35rem;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, .12);
}
.pm-theme-bar  { display: block; height: 16px; }
.pm-theme-body { display: block; padding: 8px; display: flex; gap: 6px; }
.pm-theme-card { display: block; flex: 1; height: 34px; border-radius: 4px; }

.pm-theme-light .pm-theme-bar  { background: #fff; border-bottom: 1px solid #dee2e6; }
.pm-theme-light .pm-theme-body { background: #fbfbfc; }
.pm-theme-light .pm-theme-card { background: #fff; border: 1px solid #dee2e6; border-left: 3px solid #0d6efd; }

.pm-theme-dark .pm-theme-bar   { background: #0e1013; border-bottom: 1px solid #1e2329; }
.pm-theme-dark .pm-theme-body  { background: #08090a; }
.pm-theme-dark .pm-theme-card  { background: #0e1013; border: 1px solid #1e2329; border-left: 3px solid #caff33; }

/* ── two-factor ─────────────────────────────────────────────────────── */
.pm-code { letter-spacing: .35em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.pm-qr { display: inline-block; padding: .5rem; background: #fff; border-radius: .4rem; }
.pm-recovery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  gap: .5rem 1rem;
  padding: 1rem;
  border: 1px solid #dee2e6;
  border-radius: .4rem;
  background: #f8f9fa;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .95rem;
  letter-spacing: .05em;
}
@media print {
  .pm-nav, .pm-footer, .btn, .form-text, .alert { display: none !important; }
  .pm-recovery { border: 1px solid #000; }
}

/* ── roster grids ───────────────────────────────────────────────────── */
.pm-grid th { background: #f8f9fa; font-weight: 600; white-space: nowrap; }
.pm-grid-corner { min-width: 9rem; }
.pm-grid td { vertical-align: middle; }
.pm-grid-cell {
  width: 30px; height: 30px;
  border: 1px solid #dee2e6;
  border-radius: .25rem;
  background: #fff;
  color: #ced4da;
  line-height: 1;
}
.pm-grid-cell:hover:not(:disabled) { border-color: #0d6efd; color: #0d6efd; }
.pm-grid-cell.on { background: #198754; border-color: #198754; color: #fff; }
.pm-grid-cell:disabled { opacity: .5; cursor: default; }
.pm-grid-num { min-width: 4.5rem; }
.pm-grid-busy  { opacity: .45; }
.pm-grid-saved { box-shadow: 0 0 0 2px #198754; }

.pm-pattern { display: inline-flex; gap: 2px; }
.pm-pat {
  display: inline-block;
  min-width: 1.2rem;
  padding: 0 .2rem;
  text-align: center;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: .8rem;
  background: #eef1f4;
  border-radius: .2rem;
}
.pm-pat-bad { background: #f8d7da; color: #842029; }

/* ── sidebar navigation ─────────────────────────────────────────────────
   Only the entry you are actually on is filled in. Its parent gets a quiet
   tint instead, so a board and one of its sub-boards don't read as two
   separate selections. */
.pm-nav { color: #212529; transition: background-color .12s ease, color .12s ease; }
.pm-nav:hover { background: #eef2f7; color: #0d6efd; }
.pm-nav-sub { color: #6c757d; }

.pm-nav-on,
.pm-nav-on:hover { background: #0d6efd; color: #fff; }
.pm-nav-on .bi { color: #fff; }

.pm-nav-trail {
  background: #eaf1fe;
  color: #0a58ca;
  font-weight: 600;
  box-shadow: inset 3px 0 0 #0d6efd;
}
.pm-nav-trail:hover { background: #dfeafd; color: #0a58ca; }

.pm-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex: 0 0 8px;
}
.pm-dot-on  { background: #198754; box-shadow: 0 0 0 2px rgba(25, 135, 84, .18); }
.pm-dot-off { background: #dc3545; box-shadow: 0 0 0 2px rgba(220, 53, 69, .18); }
.pm-nav-on .pm-dot-on  { box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); }
.pm-nav-on .pm-dot-off { box-shadow: 0 0 0 2px rgba(255, 255, 255, .5); }

/* Grid cells that hold a choice rather than a switch. */
.pm-grid-pick { min-width: 7.5rem; font-size: .8rem; }
.pm-grid-pick.has-value { border-color: #198754; box-shadow: inset 0 0 0 1px #198754; }
.pm-grid-weekend { background: #f4f6f8; }

/* A run's log: read top to bottom, never queried. */
.pm-log {
  background: #14161a;
  color: #d7dbe0;
  padding: .85rem 1rem;
  margin: 0;
  font-size: .78rem;
  line-height: 1.6;
  max-height: 16rem;
  overflow: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ── solution reports ───────────────────────────────────────────────────── */
.pm-rep-scroll { max-height: 34rem; overflow: auto; }
.pm-rep1 th.pm-rep-sticky {
  position: sticky; left: 0; z-index: 3;
  background: #f8f9fa; min-width: 10rem; text-align: left;
}
.pm-rep1 thead th { position: sticky; top: 0; z-index: 2; background: #f8f9fa; }
.pm-rep1 thead th.pm-rep-sticky { z-index: 4; }
.pm-rep-dow { font-size: .65rem; color: #adb5bd; line-height: 1; }
.pm-rep-today { box-shadow: inset 0 0 0 2px #0d6efd; }

.pm-rep-badge {
  display: inline-block;
  min-width: 1.4rem;
  padding: .1rem .3rem;
  border-radius: .25rem;
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.3;
}

/* REP2 — a month per location */
.pm-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.pm-cal-head {
  text-align: center; font-size: .7rem; font-weight: 600;
  text-transform: uppercase; color: #6c757d; padding: .25rem 0;
}
.pm-cal-day {
  min-height: 5.5rem; border: 1px solid #e9ecef; border-radius: .25rem;
  padding: .25rem; background: #fff; font-size: .72rem;
}
.pm-cal-blank { border: none; background: transparent; }
.pm-cal-weekend { background: #f6f8fa; }
.pm-cal-outside { opacity: .45; }
.pm-cal-num { font-weight: 600; color: #6c757d; font-size: .7rem; }
.pm-cal-item {
  display: flex; align-items: center; gap: .2rem;
  margin-top: .15rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* KPIs */
.pm-kpi-icon {
  width: 2.6rem; height: 2.6rem; border-radius: .6rem;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem;
}
.pm-kpi-bar { height: .45rem; background: #e9ecef; border-radius: .25rem; overflow: hidden; }
.pm-kpi-bar span { display: block; height: 100%; }

.pm-copy { cursor: pointer; background: #f1f3f5; padding: .1rem .35rem; border-radius: .25rem; }
.pm-copy:hover { background: #e2e6ea; }

/* The board-type picker: two columns, because the list outgrew a dialogue. */
.pm-board-types .list-group-item { cursor: pointer; border: 1px solid #dee2e6; }
.pm-board-types .list-group-item:hover { border-color: #0d6efd; background: #f8f9ff; }
.pm-board-types input:checked + span .fw-semibold { color: #0d6efd; }
.pm-board-types .list-group-item:has(input:checked) {
  border-color: #0d6efd;
  box-shadow: inset 0 0 0 1px #0d6efd;
  background: #f5f8ff;
}

/* ── KPI dashboard ──────────────────────────────────────────────────── */
.pm-kpi-tabs { border-bottom: 2px solid #dee2e6; }
.pm-kpi-tabs .nav-link { border: none; color: #495057; padding: .5rem .9rem; }
.pm-kpi-tabs .nav-link.active {
  border: none;
  border-bottom: 2px solid #0d6efd;
  color: #0d6efd;
  font-weight: 600;
  background: transparent;
}

.pm-kpi-icon {
  width: 2.4rem; height: 2.4rem; border-radius: .5rem;
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: .95rem;
}
.pm-kpi-success { background: #e8f5ee; color: #1a7f4b; }
.pm-kpi-primary { background: #e7f0fe; color: #0d6efd; }
.pm-kpi-warning { background: #fdf4dc; color: #9a7400; }
.pm-kpi-danger  { background: #fdeaec; color: #b02a37; }
.pm-kpi-info    { background: #e4f6f9; color: #0a7c8c; }

.pm-kpi-box { border-radius: .5rem; padding: 1.1rem .75rem; }
.pm-kpi-box.pm-kpi-success { background: #e8f5ee; }
.pm-kpi-box.pm-kpi-warning { background: #fdf4dc; }
.pm-kpi-box.pm-kpi-danger  { background: #fdeaec; }
.pm-kpi-mark { font-size: 1.1rem; line-height: 1; margin-bottom: .35rem; }

.pm-kpi-track {
  height: 1.15rem; background: #e9ecef; border-radius: .3rem; overflow: hidden;
}
.pm-kpi-track-sm { height: .95rem; }
.pm-kpi-fill {
  display: block; height: 100%;
  color: #fff; font-size: .68rem; font-weight: 600;
  text-align: center; line-height: 1.15rem; white-space: nowrap;
}
.pm-kpi-fill.pm-kpi-success { background: #198754; }
.pm-kpi-fill.pm-kpi-warning { background: #fd7e14; }
.pm-kpi-fill.pm-kpi-danger  { background: #dc3545; }
.pm-kpi-fill.pm-kpi-primary { background: #0d6efd; }

.pm-kpi-split { display: flex; height: 1.15rem; border-radius: .3rem; overflow: hidden; }
.pm-kpi-split span {
  color: #fff; font-size: .68rem; font-weight: 600;
  text-align: center; line-height: 1.15rem;
}
.pm-kpi-wd { background: #0d6efd; }
.pm-kpi-we { background: #22c3d6; }

.pm-kpi-row { cursor: pointer; }
.pm-kpi-row:hover { background: #f8f9fa; }
.pm-kpi-detail > td { background: #f8f9fa; }

/* REP1 cells now carry the shift and where it is. */
.pm-rep-slot {
  display: block; min-width: 3.4rem;
  padding: .12rem .2rem;
  border: 1px solid #dee2e6; border-left-width: 3px;
  border-radius: .25rem; background: #fff; line-height: 1.15;
}
.pm-rep-code { display: block; font-size: .74rem; font-weight: 700; }
.pm-rep-loc  { display: block; font-size: .62rem; color: #6c757d; white-space: nowrap; }
.pm-rep-role { font-size: .66rem; color: #6c757d; font-weight: 400; }
.pm-rep1 th.pm-rep-sticky { min-width: 13rem; }

/* A person's timetable, in the panel and in the email. */
.pm-tt-wrap { overflow-x: auto; }
.pm-tt { font-size: .75rem; }
.pm-tt thead th { background: #2c3e50; color: #fff; text-align: center; font-weight: 600; }
.pm-tt-day { height: 4.5rem; vertical-align: top; }
.pm-tt-weekend { background: #f6f7f9; }
.pm-tt-num { color: #6c757d; font-size: .68rem; text-align: right; }
.pm-tt-slot {
  margin-top: .15rem; padding: .15rem .2rem;
  border-radius: .2rem; background: #e7f0fe; text-align: center; line-height: 1.2;
}

.pm-panel-wide { width: 30rem !important; max-width: 96vw; }
.pm-tt-list { max-height: 24rem; overflow-y: auto; }

/* ── CRM ────────────────────────────────────────────────────────────── */
.pm-crm-tile { color: inherit; transition: border-color .12s; }
.pm-crm-tile:hover { border-color: #0d6efd; }
.pm-crm-icon {
  width: 2.4rem; height: 2.4rem; border-radius: .5rem;
  background: #e7f0fe; color: #0d6efd;
  display: inline-flex; align-items: center; justify-content: center; font-size: 1.1rem;
}

/* The pipeline: lanes side by side, scrolling sideways rather than wrapping. */
.pm-crm-pipe { display: flex; gap: .75rem; overflow-x: auto; padding-bottom: .5rem; }
.pm-crm-lane {
  min-width: 15rem; flex: 0 0 15rem;
  background: #f6f7f9; border: 1px solid #e9ecef; border-radius: .5rem;
}
.pm-crm-lane-head {
  padding: .5rem .65rem; border-bottom: 1px solid #e9ecef;
  display: flex; align-items: center; gap: .4rem; flex-wrap: wrap;
}
.pm-crm-lane-head .small { width: 100%; }
.pm-crm-lane-body { padding: .5rem; min-height: 6rem; max-height: 34rem; overflow-y: auto; }
.pm-crm-over { border-color: #0d6efd; background: #eef4ff; }
.pm-crm-card {
  background: #fff; border: 1px solid #e9ecef; border-radius: .35rem;
  padding: .5rem .6rem; margin-bottom: .4rem; cursor: grab;
}
.pm-crm-card:hover { border-color: #adb5bd; }


/* Right-hand panels: half the width, because a record with tabs, a calendar or
   a message thread in it was cramped at a quarter. */
.pm-panel { width: 50vw !important; max-width: 96vw; min-width: 22rem; }
.pm-panel-wide { width: 60vw !important; max-width: 96vw; }
@media (max-width: 992px) {
  .pm-panel, .pm-panel-wide { width: 96vw !important; }
}

/* The builder: modules as draggable cards. */
.pm-crm-mod { cursor: default; }
.pm-crm-mod:hover { border-color: #adb5bd; }
.crm-fld:hover { background: #f8f9fa; }
.pm-crm-fixed { background: #f8f9fa; }
.pm-crm-band { border: 1px dashed #ced4da; border-radius: .35rem; margin-bottom: .5rem; }

/* Typeahead: the matches hang under the box rather than pushing the row down. */
.pm-type { position: relative; }
.pm-type-list {
  position: absolute; z-index: 20; top: 100%; left: 0;
  min-width: 100%; max-width: 22rem; max-height: 15rem; overflow-y: auto;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.12); display: none;
}

/* A long related list scrolls in place rather than pushing everything below it
   off the panel — a hundred incidents shouldn't hide the audits under them. */
.pm-rel-list { max-height: 22rem; overflow-y: auto; }
.pm-rel-list .badge { font-weight: 500; }

/* A note is written as typed — line breaks and all — and never reflowed. */
.pm-note-body { white-space: pre-wrap; word-break: break-word; }
.pm-build { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; opacity: .7; }

/* What somebody is there to do, beside their name on a location calendar.
   Small and quiet: the name is what you scan for, this is what you check. */
.pm-cal-doing {
  display: block; margin-left: 1.6rem;
  font-size: .72rem; line-height: 1.1; color: #6c757d;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
