/* share-tracking.css — share-link view badge, the "Mark as lost" sheet and
   the "just opened" pop-up (share tracking + lost reason, 2026-09-30).
   Shell tokens only (deckcalcshell.css). Kiosk rule: 48px touch targets. */

/* The view badge on a dashboard row / card / Quote card. */
.share-views {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 12px;
  color: var(--ink-2);
  white-space: nowrap;
}
.share-views svg { flex: none; opacity: .75; }
.share-views.is-viewed { color: #2B5C8A; font-weight: var(--w-semi); }
.share-views.is-hot { color: var(--accent, #2D6A6A); }
.share-views.is-hot svg { opacity: 1; }
.dash-pill-lost.has-reason { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.dash-status-stack { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }

/* The Lost sheet: a centred question sheet (ask-sheet) with six tiles. */
.lost-sheet .sheet { width: 520px; }
.lost-sheet .sheet-head { height: auto; min-height: 56px; padding-top: 12px; padding-bottom: 12px; }
.lost-sheet-titles { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.lost-sheet-sub { font-size: var(--t-xs); color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lost-reasons { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
/* Out-specifies the shell's `.touch label:has(input…)` 44px rule. */
.sheet-scrim.lost-sheet .sheet .lost-reasons label.lost-reason {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: var(--r-md, 8px);
  background: var(--surface);
  font-size: var(--t-sm);
  color: var(--ink);
  cursor: pointer;
}
.lost-reason input { width: 18px; height: 18px; margin: 0; accent-color: var(--tuds-navy, #133A52); flex: none; }
.sheet-scrim.lost-sheet .sheet .lost-reasons label.lost-reason.is-checked { border-color: var(--tuds-navy, #133A52); background: #EEF3F7; box-shadow: inset 0 0 0 1px var(--tuds-navy, #133A52); }
.lost-reason:focus-within { outline: 2px solid var(--accent, #2D6A6A); outline-offset: 2px; }
.lost-note { margin-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.lost-note-label { display: flex; justify-content: space-between; font-size: var(--t-xs); font-weight: var(--w-semi); color: var(--ink-2); }
.lost-note-count { font-weight: var(--w-reg); color: var(--ink-3); }
.lost-note textarea {
  width: 100%;
  min-height: 72px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: var(--r-md, 8px);
  font: inherit;
  font-size: var(--t-sm);
  resize: vertical;
  box-sizing: border-box;
}
.lost-sheet-error { min-height: 18px; margin-top: 8px; font-size: var(--t-xs); color: var(--err, #B3261E); }
.sheet-scrim.lost-sheet .sheet .sheet-foot .btn { height: auto; min-height: 48px; padding: 0 20px; }
@media (max-width: 560px) {
  .lost-reasons { grid-template-columns: 1fr; }
}
/* Portrait kiosk: bigger tiles, the sheet sits mid-screen. */
@media (pointer: coarse), (min-height: 1500px) and (orientation: portrait) {
  .lost-sheet .sheet { width: 640px; }
  .sheet-scrim.lost-sheet .sheet .lost-reasons label.lost-reason { min-height: 64px; font-size: var(--t-md); }
  .lost-sheet .sheet-foot { height: 80px; }
  .sheet-scrim.lost-sheet .sheet .sheet-foot .btn { min-height: 56px; font-size: var(--t-md); }
}

/* "Jane Smith just opened their proposal · Open project" */
.view-alert-stack {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 10070;
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-width: calc(100vw - 32px);
}
.view-alert {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 8px 8px 8px 16px;
  border-radius: var(--r-lg, 12px);
  background: var(--tuds-navy, #133A52);
  color: #fff;
  box-shadow: 0 8px 24px rgba(9, 29, 41, .28);
  font-size: var(--t-sm);
  animation: viewAlertIn .2s ease-out;
}
@keyframes viewAlertIn { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
.view-alert-icon { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 50%; background: rgba(255, 255, 255, .14); flex: none; }
.view-alert-text { flex: 1; min-width: 0; font-weight: var(--w-semi); }
.view-alert-stack .view-alert .view-alert-open.btn { height: auto; min-height: 48px; padding: 0 16px; background: #fff !important; color: var(--tuds-navy, #133A52) !important; border: 0 !important; white-space: nowrap; }
.view-alert-close {
  width: 48px; height: 48px; flex: none;
  border: 0; border-radius: 50%;
  background: transparent; color: rgba(255, 255, 255, .8);
  font-size: 24px; line-height: 1; cursor: pointer;
}
.view-alert-close:hover, .view-alert-close:focus-visible { background: rgba(255, 255, 255, .12); color: #fff; }
@media (max-width: 640px) {
  .view-alert-stack { left: 16px; right: 16px; bottom: 16px; }
}
/* Touch kiosk: a bigger card and bigger targets. */
@media (pointer: coarse) {
  .view-alert { min-height: 72px; font-size: var(--t-md); }
  .view-alert-stack .view-alert .view-alert-open.btn { min-height: 56px; font-size: var(--t-md); }
  .view-alert-stack .view-alert .view-alert-close { width: 56px; height: 56px; }
}