/* SharkWorkspace — Comfort UI v1 (2026-10-24)
   Presentation-only overrides. No record, date, permissions, or save logic changes.
   Loaded AFTER styles.css. Remove this stylesheet link to revert. */
:root:not([data-theme]), html[data-theme="default"] {
  --bg-app: #f8f7f4;
  --surface-alt: #faf9f7;
  --border: #e7e3de;
  --border-strong: #d8d1ca;
  --text-muted: #746e74;
  --sidebar-bg: #49434f;
}
body { font-size: 14px; line-height: 1.5; }
button, input, select, textarea { font-family: var(--font-body); }
:where(button, input, select, textarea, a):focus-visible {
  outline: 2px solid var(--rust-600);
  outline-offset: 2px;
}
/* Keep page backgrounds quiet; retain existing theme support. */
.dashboard-page .panel, .dashboard-page .card { border-color: var(--border); }
/* Dense data table: reduce wasted width, without truncating mm/dd/yyyy. */
@media (min-width: 761px) {
  .im-tablewrap { scrollbar-gutter: stable; }
  .im-table { width: max-content; min-width: 100%; table-layout: auto; font-size: 12.5px; }
  .im-table td { padding: 7px 5px; line-height: 1.35; vertical-align: middle; }
  .im-table .im-date, .im-table .im-date--bare {
    box-sizing: border-box; width: 86px; min-width: 86px; max-width: 86px;
    padding: 5px 6px; font-size: 12px; letter-spacing: 0;
    font-variant-numeric: tabular-nums; line-height: 1.3;
  }
  .im-table .im-date--bare { width: 80px; min-width: 80px; max-width: 80px; padding-left: 2px; padding-right: 2px; }
  .im-table .im-sel { max-width: 94px; font-size: 12px; padding: 5px 4px; }
  .im-table .im-req { gap: 4px; padding: 3px 5px; font-size: 12px; }
  .im-table .im-req input[type="checkbox"] { width: 15px; height: 15px; flex-shrink: 0; }
  .im-table .im-result { font-size: 11px; padding: 4px 7px; }
  .im-table .im-notes-td { min-width: 150px; width: 230px; }
  .im-table .im-notes { min-width: 145px; font-size: 12px; line-height: 1.4; height: 42px; resize: none; overflow-y: auto; }
  .im-table .im-round { min-width: 32px; }
  .im-table .im-tname, .im-table .im-nm { font-weight: 650; }
  .im-table thead th { position: sticky; top: 0; z-index: 3; }
}
.im-tablewrap { border-color: var(--border); box-shadow: 0 1px 3px rgba(30,25,30,.035); }
.im-table .im-prop td { padding-top: 10px; padding-bottom: 10px; }
.im-table .im-date:focus-visible, .im-table .im-notes:focus-visible { outline-offset: 1px; }
/* Row hover (desktop): a soft tint across the whole row and a thin accent bar on the left.
   The tint sits on top of the row's own colour, so abated / on-hold / passed rows keep theirs. */
@media (hover: hover) and (min-width: 761px) {
  .im-table .im-row:hover td {
    box-shadow: inset 0 0 0 9999px rgba(146, 89, 74, 0.09);
    box-shadow: inset 0 0 0 9999px color-mix(in srgb, var(--rust-500) 11%, transparent);
  }
  .im-table .im-row:hover td:first-child {
    box-shadow: inset 4px 0 0 var(--rust-500), inset 0 0 0 9999px color-mix(in srgb, var(--rust-500) 11%, transparent);
  }
  .im-table .im-row.is-abated:hover td:first-child {
    box-shadow: inset 5px 0 0 #c0392b, inset 0 0 0 9999px color-mix(in srgb, var(--rust-500) 11%, transparent);
  }
}
/* Keep the phone card layout and dark theme's established contrast. */
@media (max-width: 760px) { body { font-size: 14px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}

/* Inspection Tracker header only — calm, single-row visual grouping.
   No changes to cell editors, status badges, property bars or data logic. */
@media (min-width: 761px) {
  .im-table thead th {
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0;
    white-space: nowrap;
    text-align: left;
    color: var(--text-secondary);
    background: var(--surface-alt);
    padding: 9px 4px;
    border-bottom: 1px solid var(--border);
  }
  /* Four tenant-info columns; six inspection/repair columns; four follow-up columns. */
  .im-table thead th:nth-child(n+5):nth-child(-n+10) {
    background: var(--surface);
  }
  .im-table thead th:nth-child(n+11) {
    background: var(--surface-alt);
  }
  .im-table thead th:nth-child(5),
  .im-table thead th:nth-child(11) {
    border-left: 1px solid var(--border-strong);
    padding-left: 7px;
  }
  /* Same two faint dividers carried down through the unit rows. */
  .im-table .im-row td:nth-child(5),
  .im-table .im-row td:nth-child(11) {
    border-left: 1px solid var(--border);
  }
}

/* Notes: fixed-size box; a small "More" link opens the full note. */
.im-notewrap .im-notes { width: 100%; display: block; }
.im-notewrap .im-notes[hidden], .im-noteview[hidden] { display: none; }
/* The note as text: fixed two lines, cut after the last word that fits. */
.im-noteview {
  box-sizing: border-box; height: 42px; overflow: hidden;
  padding: 3px 4px; border: 1px solid transparent; border-radius: 6px;
  font-size: 12px; line-height: 1.4; color: var(--text-secondary);
  white-space: pre-wrap; overflow-wrap: anywhere; cursor: text;
}
.im-noteview:hover { border-color: var(--border-strong); background: var(--surface); }
.im-noteview.is-empty { color: var(--text-muted); }
/* The "…" button right after the last visible word. */
.im-notes-more {
  display: inline-flex; align-items: center; justify-content: center;
  height: 14px; padding: 0 5px; margin: 0; vertical-align: baseline;
  border: 0; border-radius: 4px;
  background: var(--rust-100); color: var(--rust-700);
  font: inherit; font-size: 13px; font-weight: 800; line-height: 1; letter-spacing: 1px;
}
.im-notes-more:hover { background: var(--rust-500); color: #fff; }
.im-date::placeholder { font-weight: 400; }

/* Tracker date boxes: no colour when empty; red = date has passed, yellow = today, green = future.
   (The small date inside the Reinsp. Req. chip keeps that chip's own colour.) */
.im-date.is-today { background: #fff3c4; color: #7a5600; border-color: #e8cf74; }
html[data-theme="dusk"] .im-date.is-today { background: #4d4220; color: #f3dd9b; border-color: #6e5f2e; }

/* ---------- Phone: compact Tracker ---------- */
@media (max-width: 760px) {
  /* Search and + on the first row; the three filters share the second row. */
  .im-bar { gap: 6px; }
  .im-bar .im-spacer { display: none; }
  /* Search on its own line (sharing it with + only when + sits in this bar), then all three filters on one line. */
  #im-search { order: 0; flex: 1 1 100%; min-width: 0; }
  .im-bar:has(> #im-add-unit-btn:not([style*="none"])) #im-search { flex-basis: calc(100% - 44px); }
  .im-bar > #im-add-unit-btn { order: 1; flex: 0 0 auto; }
  #im-filter-prop, #im-filter-agency, #im-filter-result { order: 2; flex: 1 1 0; width: auto; min-width: 0; max-width: none; padding: 0 4px; font-size: 12.5px; text-overflow: ellipsis; }

  .im-card { padding: 9px 10px; margin-bottom: 8px; }
  /* Unit · tenant · agency · type · round on one line */
  .im-card__top { flex-wrap: nowrap; gap: 6px; margin-bottom: 4px; }
  .im-card__top .im-apt { flex: 0 0 auto; }
  .im-card__top .im-tname { flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; }
  .im-card__top .im-nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
  .im-card__agency { flex: 0 0 auto; font-size: 12px; }
  .im-card__top .im-sel { flex: 0 0 auto; max-width: 84px; font-size: 12px; padding: 3px 4px; }
  .im-card__round { margin-left: 0; flex: 0 0 auto; }
  .im-card__top .im-round { min-width: 28px; height: 26px; }

  .im-card__block { padding: 6px 7px; margin: 6px 0; }
  .im-card__bh { margin-bottom: 4px; font-size: 10.5px; }
  .im-card__grid { gap: 5px 10px; margin: 0; }
  .im-card__l { font-size: 10px; margin-bottom: 1px; }
  .im-card .im-date { width: 82px; font-size: 12px; padding: 3px 4px; font-variant-numeric: tabular-nums; }
  /* This round: date and status side by side */
  .im-card__line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
  .im-card__inl { display: flex; align-items: center; gap: 6px; }
  .im-card__inl .im-card__l { margin: 0; }
  /* Previous round: same box as This round, each label beside its value. */
  .im-card__block--prev { border-style: solid; background: var(--surface-alt); }
  .im-card__rows { display: grid; grid-template-columns: max-content max-content max-content minmax(0, 1fr); align-items: center; gap: 5px 5px; }
  .im-card__rows .im-card__l { letter-spacing: 0; }
  .im-card__rows .im-card__inl--b > .im-card__l { padding-left: 4px; }
  .im-card__rows > .im-card__inl--wide > :last-child { grid-column: span 3; justify-self: start; }
  .im-card__rows > .im-card__inl { display: contents; }
  .im-card__rows .im-result, .im-card__rows .im-req { justify-self: start; }
  .im-card .im-notes { height: 45px; resize: none; overflow-y: auto; font-size: 13px; line-height: 1.4; }
  .im-card .im-noteview { height: 45px; font-size: 13px; }
}
/* Very narrow phones: one label/value pair per line in Previous round. */
@media (max-width: 379px) {
  .im-card__rows { grid-template-columns: max-content 1fr; }
  .im-card__rows > .im-card__inl--wide > :last-child { grid-column: auto; }
  .im-card__rows .im-card__inl--b > .im-card__l { padding-left: 0; }
}

/* Pop-up notes boxes (Previous rounds, full note): no drag handle, height follows the text. */
.notes-textarea.im-autogrow { resize: none; overflow: hidden; min-height: 40px; }
#detail-popup-overlay .popup .notes-textarea.im-autogrow { max-height: 60vh; overflow-y: auto; }

/* Notice field (pop-ups): type, link and buttons on one line. */
.im-nf { display: flex; align-items: center; gap: 6px; flex-wrap: nowrap; }
.im-nf .im-nf__title { flex: 0 0 auto; width: auto; min-width: 82px; margin: 0; }
.im-nf > .popup-input { flex: 1 1 auto; min-width: 0; }
.im-nf .im-nf__row { flex: 0 0 auto; margin: 0; flex-wrap: nowrap; gap: 6px; }
.im-nf .im-nf__row .im-btn { height: 32px; padding: 0 10px; font-size: 12px; white-space: nowrap; }
.im-nf .im-nf__status:empty { display: none; }
/* Phones: type and link on the first line, buttons on the next. */
@media (max-width: 520px) {
  .im-nf { flex-wrap: wrap; }
  .im-nf > .popup-input { flex-basis: calc(100% - 96px); }
}

/* Previous rounds pop-up: compact, labels beside values (matches the phone cards). */
.im-pcard { padding: 10px 12px; margin-bottom: 10px; border-color: var(--border); background: var(--surface-alt); }
.im-pcard__h { margin: 0 0 8px; font-size: 13px; }
.im-pgrid { gap: 6px 18px; }
.im-pcard .im-pf { display: flex; align-items: center; gap: 8px; min-width: 0; }
.im-pcard .im-pf > label { flex: 0 0 82px; margin: 0; font-size: 10.5px; letter-spacing: 0; }
.im-pcard .im-pf > :not(label) { flex: 1 1 auto; min-width: 0; }
.im-pcard .popup-input, .im-pcard .popup-select { padding: 6px 8px; font-size: 12px; }
.im-pcard .im-pf > .im-date-box { flex: 0 0 112px; width: 112px; }
.im-pcard .im-pf > .popup-select { flex: 0 0 132px; }
.im-pcard .im-pf > .im-req-edit { flex: 0 0 auto; padding: 2px 8px; }
.im-pcard .im-req-edit .im-date-box { width: 104px; flex: 0 0 auto; padding: 4px 2px; }
.im-pcard .im-pf--wide:has(textarea) { align-items: flex-start; }
.im-pcard .im-pf--wide:has(textarea) > label { padding-top: 8px; }
.im-pcard .notes-textarea.im-autogrow { min-height: 32px; }
@media (max-width: 760px) {
  #detail-popup-overlay.im-wide .popup { padding: 16px 14px; }
  .im-pgrid { gap: 6px; }
  .im-pcard { padding: 9px 10px; }
  .im-pcard .im-nf { flex-wrap: wrap; }
}
/* Previous rounds pop-up on phones: same layout as the phone cards —
   two label/value pairs per line, longer fields below, all labels in one column. */
@media (max-width: 760px) {
  .im-pcard .im-pgrid { grid-template-columns: max-content max-content max-content minmax(0, 1fr); gap: 6px 5px; align-items: center; }
  .im-pcard .im-pgrid > .im-pf { display: contents; }
  .im-pcard .im-pgrid > .im-pf > label { font-size: 10px; }
  .im-pcard .im-pgrid > .im-pf--b > label { padding-left: 4px; }
  .im-pcard .im-pgrid > .im-pf--wide > :not(label) { grid-column: 2 / -1; min-width: 0; }
  .im-pcard .im-pf > .im-date-box { width: 82px; padding: 5px 4px; }
  .im-pcard .im-pf > .popup-select { width: 90px; padding: 5px 4px; }
  .im-pcard .im-pf > .im-req-edit { justify-self: start; }
  .im-pcard .im-pf--wide:has(textarea) > label { align-self: start; padding-top: 7px; }
  .im-pcard .im-nf > .popup-input { flex-basis: calc(100% - 92px); }
}
@media (max-width: 379px) {
  .im-pcard .im-pgrid { grid-template-columns: max-content minmax(0, 1fr); }
  .im-pcard .im-pgrid > .im-pf--b > label { padding-left: 0; }
}

@media (max-width: 760px) {
  .im-card__block--now .im-inspcell { display: block; }
  .im-card__rows .im-notice { white-space: nowrap; }
  .im-card > .im-notewrap { margin-top: 4px; }
}
/* Phone cards: small "View notes" button at the right end of the Reinsp. req. line. */
.im-card__rows > .im-card__inl--wide > .im-card__reqrow { justify-self: stretch; display: flex; align-items: center; justify-content: space-between; gap: 6px; min-width: 0; }
.im-roundnotes-btn {
  flex: 0 0 auto; height: 22px; padding: 0 8px;
  border: 1px dashed var(--border-strong); border-radius: 6px; background: transparent;
  color: var(--text-muted); font: inherit; font-size: 10.5px; font-weight: 700; letter-spacing: 0; white-space: nowrap; cursor: pointer;
}
.im-roundnotes-btn.has-notes { border: 1px solid #b5d0f5; background: #e3eefc; color: #1d5fae; }
html[data-theme="dusk"] .im-roundnotes-btn.has-notes { border-color: #35557c; background: #20344d; color: #bcd5f5; }

/* Bell (top bar): soft gold, filled, in each theme's own gold. */
#notif-trigger { color: var(--tan-700); }
#notif-trigger .icon { fill: var(--tan-500); }
/* The "needs attention" dot is always the brightest thing on the bell: pure red, a bit bigger, ringed in the bar's colour. */
#notif-dot {
  width: 8px; height: 8px; top: 3px; right: 3px;
  background: #ff2d2d; border: 2px solid var(--surface);
  box-shadow: 0 0 0 1px rgba(255, 45, 45, 0.25);
}
html[data-theme="dusk"] #notif-dot { background: #ff4747; }

/* Inspection Tracker (desktop): the column header always stays at the top of the table box,
   and each property's name bar stays just under it until the next property's bar pushes it up. */
@media (min-width: 761px) {
  .im-tablewrap { max-height: max(360px, calc(100vh - 180px)); overflow: auto; scrollbar-gutter: auto; }
  .im-table { border-collapse: separate; border-spacing: 0; }
  .im-table thead th { z-index: 4; }
  .im-table .im-prop td { position: sticky; top: var(--im-head-h, 35px); z-index: 3; }
}

/* ---------- Cancelled status (goes to history like Passed) ---------- */
.im-result.is-cancelled { background: #e9ecef; color: #4b5563; border-color: #cfd5db; }
.im-menu__item.is-cancelled b { color: #4b5563; }
.im-row.is-cancelled td { background: #f4f5f6; color: var(--text-muted); }
.im-card.is-cancelled { background: #f4f5f6; border-left-color: #9aa3ad; }
html[data-theme="dusk"] .im-result.is-cancelled { background: #33373c; color: #c9ced4; border-color: #4a5058; }
html[data-theme="dusk"] .im-menu__item.is-cancelled b { color: #c9ced4; }
html[data-theme="dusk"] .im-row.is-cancelled td, html[data-theme="dusk"] .im-card.is-cancelled { background: #26292d; }

/* ---------- Create report: button under the table, form in a pop-up ---------- */
#im-report.im-report-bar { margin-top: 16px; padding: 0; border: 0; background: none; box-shadow: none; }
.im-report-btn { height: 38px; gap: 8px; }
.popup-overlay.im-report-ov .popup { max-width: 640px; width: calc(100% - 32px); max-height: 92vh; padding: 22px 24px 18px; }
.imr__hint { font-size: 12.5px; color: var(--text-muted); margin: -10px 0 2px; }
.imr__step { padding: 14px 0; }
.imr__step + .imr__step { border-top: 1px solid var(--border); }
.imr__q { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 700; color: var(--text-primary); margin-bottom: 10px; }
.imr__num { width: 22px; height: 22px; border-radius: 50%; background: var(--rust-600); color: #fff; font-size: 12px; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.imr__tl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--text-muted); }
.imr__link { border: 0; background: none; color: var(--rust-600); font: inherit; font-size: 12px; font-weight: 700; padding: 0 0 0 10px; cursor: pointer; }
.imr__link:hover { text-decoration: underline; }

/* Property (tick boxes) and Agency */
.imr__filters { display: flex; flex-wrap: wrap; gap: 14px; }
.imr__fl { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.imr__fl .im-select { min-width: 180px; }
.imr__ms { position: relative; }
.imr__msbtn { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 210px; text-align: left; cursor: pointer; }
.imr__mstext { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imr__caret { font-size: 11px; color: var(--text-muted); flex-shrink: 0; }
.imr__mspanel { position: absolute; z-index: 5; top: calc(100% + 4px); left: 0; min-width: 230px; max-height: 300px; overflow-y: auto; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 10px; box-shadow: var(--shadow-lg); padding: 6px; }
.imr__mspanel label { display: flex; align-items: center; gap: 8px; padding: 7px 8px; border-radius: 7px; font-size: 13px; font-weight: 600; color: var(--text-primary); cursor: pointer; }
.imr__mspanel label:hover { background: var(--surface-alt); }
.imr__mspanel input { width: 16px; height: 16px; margin: 0; accent-color: var(--rust-600); }
.imr__mspanel .imr__msall { border-bottom: 1px solid var(--border); border-radius: 7px 7px 0 0; margin-bottom: 2px; }
.imr__msfoot { display: flex; justify-content: space-between; align-items: center; padding: 6px 4px 2px; border-top: 1px solid var(--border); margin-top: 2px; }
.imr__msfoot .imr__link { padding: 0; }
.imr__msfoot .btn { height: 30px; padding: 0 14px; font-size: 12px; }

/* Show + Details toggles */
.imr__showrow { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.imr__tog { display: flex; flex-wrap: wrap; gap: 8px; }
.imr__t { display: inline-flex; align-items: center; gap: 7px; padding: 7px 12px 7px 9px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); font: inherit; font-size: 12.5px; font-weight: 600; color: var(--text-secondary); cursor: pointer; }
.imr__t i { width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid var(--border-strong); display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-size: 11px; color: #fff; flex-shrink: 0; }
.imr__t.is-on { border-color: var(--rust-500); color: var(--text-primary); background: var(--rust-100); }
.imr__t.is-on i { background: var(--rust-600); border-color: var(--rust-600); }
.imr__t:disabled { opacity: .5; cursor: not-allowed; }

/* Matching units */
.imr__units { margin-top: 12px; padding: 10px 12px; border: 1px dashed var(--border-strong); border-radius: 10px; background: var(--surface-alt); }
.imr__units-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 12px; color: var(--text-secondary); margin-bottom: 8px; }
.imr__units-top b { color: var(--text-primary); }
.imr__pg { font-size: 11px; font-weight: 700; color: var(--text-muted); margin: 8px 0 5px; }
.imr__units-top + .imr__pg { margin-top: 0; }
.imr__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.imr__chip { border: 1px solid var(--border-strong); background: var(--surface); border-radius: 999px; padding: 4px 11px; font: inherit; font-size: 12px; font-weight: 700; color: var(--text-primary); cursor: pointer; }
.imr__chip.is-on { background: var(--rust-600); border-color: var(--rust-600); color: #fff; }
.imr__chip.is-on::before { content: "✓ "; }
.imr__empty { font-size: 12px; color: var(--text-muted); }

.imr__sum { padding: 10px 12px; border-radius: 9px; background: var(--surface-alt); font-size: 12.5px; color: var(--text-secondary); }
.imr__sum b { color: var(--text-primary); }
.imr__actions { align-items: center; margin-top: 14px; }
.imr__actions .resolve-btn { margin-right: auto; }
.imr__dl { font-size: 12px; font-weight: 700; color: var(--text-secondary); }
.imr__actions .btn { height: 36px; min-width: 84px; }

@media (max-width: 760px) {
  .popup-overlay.im-report-ov { padding: 0; align-items: stretch; }
  .popup-overlay.im-report-ov .popup { max-width: none; width: 100%; max-height: none; height: 100%; border-radius: 0; padding: 18px 16px; display: flex; flex-direction: column; }
  .popup-overlay.im-report-ov .popup-body { flex: 1; display: flex; flex-direction: column; }
  .imr { flex: 1; display: flex; flex-direction: column; }
  .imr__filters { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .imr__fl { flex-direction: column; align-items: stretch; gap: 4px; font-size: 11px; }
  .imr__fl .im-select, .imr__msbtn { min-width: 0; width: 100%; font-size: 16px; }
  .imr__mspanel { min-width: 0; width: calc(200% + 8px); }
  .imr__mspanel label { font-size: 14px; padding: 9px 8px; gap: 10px; }
  .imr__showrow { flex-direction: column; align-items: stretch; gap: 6px; }
  .imr__tog { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .imr__tog--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; }
  .imr__t { justify-content: center; gap: 5px; padding: 7px 4px; font-size: 12px; white-space: nowrap; min-width: 0; }
  .imr__t i { width: 14px; height: 14px; font-size: 10px; }
  .imr__tog--4 .imr__t { font-size: 11.5px; padding: 7px 2px; }
  .imr__tog--4 .imr__t i { display: none; }
  .imr__tog--4 .imr__t.is-on { background: var(--rust-600); border-color: var(--rust-600); color: #fff; }
  .imr__actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: auto; padding-top: 14px; }
  .imr__dl { grid-column: 1 / -1; }
  .imr__actions .btn { min-width: 0; padding: 0 6px; height: 42px; }
  .imr__actions .resolve-btn { grid-column: 1 / -1; order: 9; margin: 0; }
}
@media (max-width: 379px) {
  .imr__tog { gap: 5px; }
  .imr__t { font-size: 11.5px; gap: 4px; padding: 7px 2px; }
}

/* ---------- E-Sign: typed signatures in Allura ---------- */
.tpl-sigpad__typed { font-family: "Allura", "Segoe Script", "Snell Roundhand", "Apple Chancery", cursive; font-size: 40px; color: #000; }

/* ---------- E-Sign: reviewing a signed copy (signatures shown on the pages) ---------- */
.lpdf-box.is-signed { border: 0; background: transparent; padding: 0 2px; color: #000; font-weight: 500; cursor: default; }
.lpdf-box.is-signed img { display: block; height: 100%; max-width: 100%; object-fit: contain; object-position: left center; }
.lpdf-box--signature.is-signed img { height: 80%; max-width: 80%; }
.tpl-signed-note { margin: 0 0 8px; padding: 8px 12px; border-radius: 8px; background: var(--sage-100); color: var(--sage-700); font-size: 12.5px; font-weight: 600; }

/* ---------- Pages fill the screen width (no fixed cap on wide screens) ---------- */
.dashboard-content,
.dashboard-content:has(#page-inspection-monitor.dashboard-page--active) { max-width: none; }
/* Wide screens: the Tracker gets the same side spacing as the other pages. */
@media (min-width: 1400px) {
  .dashboard-content:has(#page-inspection-monitor.dashboard-page--active) { padding-left: var(--space-8); padding-right: var(--space-8); }
}
/* Tracker (desktop): every column keeps its natural width; only Notes grows to use the extra space. */
@media (min-width: 761px) {
  .im-table thead th:last-child, .im-table .im-notes-td { width: 100%; min-width: 230px; }
  .im-table .im-row td:not(.im-notes-td) { white-space: nowrap; }
  .im-table .im-notes-td > * { contain: inline-size; }
}

/* ---------- E-Sign: narrow list on the left, the document gets the rest of the width ---------- */
@media (min-width: 861px) {
  .tpl-layout { grid-template-columns: minmax(200px, 250px) minmax(0, 1fr); }
}
/* E-Sign: thinner "Upload PDF" button in the Documents list. */
#tpl-list .tpl-add-email { padding: 5px var(--space-3); min-height: 0; line-height: 1.3; }
/* E-Sign: hint under your Date box in the Authorized Representative pop-up. */
#tpl-rep-datefield + .popup-hint { margin: 6px 0 0; }
/* E-Sign "Link ready": the email preview, with the link built in. */
.tpl-sign-mail--html { height: auto; max-height: 280px; overflow-y: auto; white-space: normal; font-size: 12.5px; line-height: 1.5; padding: 10px 12px; cursor: text; user-select: text; }
.tpl-sign-mail--html p { margin: 0 0 8px; }
.tpl-sign-mail--html p:last-child { margin-bottom: 0; }
.tpl-sign-mail--html a { color: #1d5fae; text-decoration: underline; font-weight: 600; }
html[data-theme="dusk"] .tpl-sign-mail--html a { color: #9cc3f5; }
@media (max-width: 520px) { .tpl-sign-mail--html { font-size: 14px; max-height: 320px; } }
/* E-Sign: what each signer did with the link (opened / downloaded / signed). */
.tpl-activity { list-style: none; margin: 8px 0 0; padding: 8px 10px; border-radius: 8px; background: rgba(255,255,255,.6); border: 1px solid var(--border); display: grid; gap: 6px; }
.tpl-activity li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; font-size: 12px; line-height: 1.4; }
.tpl-activity li b { color: var(--text-primary); min-width: 120px; }
.tpl-activity__tags { display: flex; flex-wrap: wrap; gap: 4px; }
.tpl-activity__tag { padding: 2px 8px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); color: var(--text-secondary); font-size: 11.5px; white-space: nowrap; }
.tpl-activity__tag.is-signed { background: var(--sage-100); border-color: var(--sage-500); color: var(--sage-700); }
.tpl-activity__tag.is-none { border-style: dashed; color: var(--text-muted); font-style: italic; }
html[data-theme="dusk"] .tpl-activity { background: rgba(0,0,0,.15); }

/* E-Sign list: "Documents" title with a small Upload PDF button in the top-right corner. */
#tpl-list .tpl-list-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0 0 4px; }
#tpl-list .tpl-list-head__title { font-size: 13px; font-weight: 700; color: var(--text-primary); }
#tpl-list .tpl-upload-btn { display: inline-flex; align-items: center; gap: 5px; flex: 0 0 auto; height: 30px; padding: 0 11px; border: 0; border-radius: 8px; background: var(--rust-600); color: #fff; font: inherit; font-size: 12.5px; font-weight: 700; white-space: nowrap; cursor: pointer; }
#tpl-list .tpl-upload-btn .icon { width: 14px; height: 14px; fill: currentColor; stroke: currentColor; }
#tpl-list .tpl-upload-btn:hover { background: var(--rust-700); }
#tpl-list .tpl-list-head + .tpl-list-label { margin-top: 6px; }

/* E-Sign: the document's title (its PDF name) above the pages. */
.tpl-doc-title { margin: 4px 0 10px; font-size: 18px; font-weight: 700; line-height: 1.3; color: var(--text-primary); overflow-wrap: anywhere; }

/* E-Sign upload pop-up: file picker, a little space, the hint, then the buttons. */
.tpl-upload-field { margin: 4px 0 0; }
.tpl-upload-field .tpl-pdf-file { display: block; width: 100%; box-sizing: border-box; height: auto; padding: 10px 12px; line-height: 1.4; }
.tpl-upload-field .popup-hint { margin: 8px 0 0; line-height: 1.45; }
.tpl-upload-field + .popup-actions { margin-top: 20px; }

/* E-Sign: the PDF pages scroll in their own box (one page tall), page by page. */
#tpl-editor .tpl-pdf-pages { overflow-y: auto; overscroll-behavior: contain; scroll-snap-type: y proximity; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-alt); padding: 0; scrollbar-gutter: stable; }
#tpl-editor .tpl-pdf-pages .lpdf-page { scroll-snap-align: start; }
#tpl-editor .tpl-pdf-pages .lpdf-page:last-child { margin-bottom: 0; }

/* E-Sign status bar: buttons on two lines (unlock / phone, then Sign as Company Signer). */
.tpl-signbar__btns.tpl-signbar__btns--stack { flex-direction: column; align-items: stretch; flex-wrap: nowrap; gap: 8px; }
.tpl-signbar__btns.tpl-signbar__btns--stack > * { width: 100%; justify-content: center; margin: 0; }
@media (max-width: 760px) {
  .tpl-signbar:has(.tpl-signbar__btns--stack) { flex-wrap: wrap; }
  .tpl-signbar__btns.tpl-signbar__btns--stack { flex: 1 1 100%; width: 100%; }
  .tpl-signbar__btns.tpl-signbar__btns--stack > * { white-space: normal; }
}

/* E-Sign: placing the Company Signer boxes before signing. */
.tpl-repmode { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin: 0 0 10px; padding: 12px 14px; border: 1px solid var(--rust-500, #a86b5a); border-radius: 10px; background: var(--rust-100, #f7ebe7); }
.tpl-repmode__text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 260px; min-width: 0; font-size: 12.5px; color: var(--text-secondary); }
.tpl-repmode__text strong { font-size: 13.5px; color: var(--text-primary); }
.tpl-repmode__count { font-size: 12px; font-weight: 700; color: var(--text-secondary); white-space: nowrap; }
.tpl-repmode__btns { display: flex; gap: 8px; margin-left: auto; }
.tpl-pdf-pages.is-repmode .lpdf-page__layer { cursor: crosshair; }
.lpdf-box--repmode { cursor: move; }
.tpl-link-btn { border: 0; background: none; padding: 0; font: inherit; font-weight: 700; color: var(--rust-600); text-decoration: underline; cursor: pointer; }
@media (max-width: 760px) { .tpl-repmode__btns { width: 100%; } .tpl-repmode__btns > * { flex: 1 1 0; } }

/* Second line of the status bar: Sign as Company Signer · Mark as completed. */
.tpl-signbar__btns--stack .tpl-signbar__row { display: flex; gap: 8px; }
.tpl-signbar__btns--stack .tpl-signbar__row > * { flex: 1 1 0; justify-content: center; margin: 0; white-space: nowrap; }
@media (max-width: 420px) { .tpl-signbar__btns--stack .tpl-signbar__row { flex-direction: column; } }
