/* meetings.css — the 2.0 Meetings library (boards Main + MainGrid).
 * Loaded after shell.css. Same rules as shell.css: 2.0 token names only, no
 * raw hex, no prefers-color-scheme, no fixed phone-width px widths
 * (OPEN-QUESTIONS #24), every selector rooted in a v2- class (legacy shared
 * nodes — .ptr, .avatar, .confirm — are only restyled UNDER a v2- ancestor).
 */

.v2-lib {
  position: relative; /* the pull-to-refresh disc hangs above it */
}

/* ---------- pull-to-refresh disc, in 2.0 dress ---------- */
.v2-lib .ptr__disc {
  background: var(--s-card);
  border: 1px solid var(--raised-line);
  box-shadow: var(--sh-raised);
  color: var(--accent);
}
.v2-lib .ptr__label {
  color: var(--accent-ink);
}

/* ---------- quiet states ---------- */
.v2-lib__quiet {
  margin: 8px 2px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--t-muted);
}
.v2-lib__retry {
  align-self: flex-start;
  height: 40px;
  padding: 0 18px;
  border-radius: var(--r2-round);
  border: 1px solid var(--raised-line);
  background: var(--s-card);
  box-shadow: var(--sh-raised);
  color: var(--accent-ink);
  font: inherit;
  font-size: 14px;
  font-weight: 620;
}

/* ---------- empty state (first run) ---------- */
.v2-lib__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  padding: 12vh 6% 0;
}
.v2-lib__orb {
  width: 5.5rem;
  height: 5.5rem;
  border-radius: 50%;
  border: 0;
  background: var(--accent);
  color: var(--on-accent);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 18px var(--accent-glow), inset 0 1px 0 var(--glow-inset);
  margin-bottom: 10px;
}
.v2-lib__emptyh {
  margin: 0;
  font-size: 25px;
  font-weight: 720;
  letter-spacing: -0.7px;
  line-height: 1.2;
  color: var(--t-primary);
}
.v2-lib__emptyp {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.45;
  color: var(--t-muted);
}
.v2-lib__emptyhint {
  margin: 4px 0 0;
  font-size: 12.5px;
  color: var(--t-label);
}

/* ---------- dashboard (list view, unfiltered) ---------- */
.v2-lib__dash {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.v2-lib__dash[hidden] {
  display: none;
}
.v2-lib__date {
  margin: 0;
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.2px;
  color: var(--t-label);
}
.v2-lib__headline {
  margin: 0;
  font-size: 26px;
  font-weight: 720;
  letter-spacing: -0.75px;
  line-height: 1.17;
  color: var(--t-primary);
}
.v2-lib__num {
  color: var(--accent-ink);
}

/* ---------- sections ---------- */
.v2-lib__results {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.v2-lib__section {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v2-lib__cards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v2-lib__ghead {
  display: flex;
  align-items: center;
  gap: 8px;
}
.v2-lib__seeall {
  margin-left: auto;
  padding: 6px 0 6px 12px;
  border: 0;
  background: none;
  color: var(--accent-ink);
  font: inherit;
  font-size: 12.5px;
  font-weight: 620;
}
.v2-lib__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

/* ---------- swipe container (verbatim geometry from the legacy card) ---------- */
.v2-mswipe {
  position: relative;
  border-radius: var(--r2-bigcard);
  overflow: hidden;
  /* Transparent at rest: an always-on accent backing anti-aliases through
   * the rounded corners as a 1px peek; JS adds .is-swiping while displaced. */
  background: transparent;
}
.v2-mswipe.is-swiping,
.v2-mswipe.is-open {
  background: var(--accent);
}
.v2-mswipe .v2-mcard {
  position: relative;
  z-index: 1;
  transition: transform 0.2s ease;
  will-change: transform;
}
/* Direct in-app delete = the skill's pink (decision 5); the CONFIRM is red. */
.v2-mswipe__action {
  visibility: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0;
  border: 0;
  background: var(--accent);
  color: var(--on-accent);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
}
.v2-mswipe.is-swiping .v2-mswipe__action,
.v2-mswipe.is-open .v2-mswipe__action {
  visibility: visible;
}
.v2-mswipe__action svg {
  transition: transform 130ms ease;
}
.v2-mswipe__label {
  line-height: 1;
}
.v2-mswipe.is-armed .v2-mswipe__action svg {
  transform: scale(1.18);
}

/* ---------- memo card (board Main) ---------- */
.v2-mcard {
  display: flex;
  flex-direction: column;
  gap: 11px;
  padding: 14px;
  border-radius: var(--r2-bigcard);
  background: var(--s-card);
  border: 1px solid var(--raised-line);
  box-shadow: var(--sh-raised);
  color: var(--t-primary);
  text-decoration: none;
  min-width: 0;
  box-sizing: border-box;
}
/* Unviewed: a 1px accent border, same width as the hairline — zero shift. */
.v2-mcard.is-unviewed {
  border-color: var(--accent-tint-line);
}
.v2-mcard.is-jumped {
  animation: v2-lib-jump 1.6s ease;
}
.v2-mcard__row,
.v2-mcard__top {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.v2-mcard__type {
  height: 23px;
  padding: 0 9px;
  border-radius: 12px;
  background: var(--s-chip);
  color: var(--t-nav);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  display: flex;
  align-items: center;
  flex: none;
}
.v2-mcard__pin {
  display: flex;
  color: var(--accent-ink);
  flex: none;
}
.v2-mcard__new {
  height: 23px;
  padding: 0 9px;
  border-radius: 12px;
  background: var(--accent);
  color: var(--on-accent);
  font-size: 10.5px;
  font-weight: 750;
  letter-spacing: 0.7px;
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  flex: none;
}
.v2-mcard__new--tile {
  height: 18px;
  padding: 0 7px;
  font-size: 9.5px;
  vertical-align: 1px;
}
.v2-mcard__meta {
  margin-left: auto;
  font-size: 12px;
  color: var(--t-label);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  flex: none;
}
/* Item 27: the time of day on its own line under the title
   ("Today · 2:30 PM"); the length stays on the right of the top row. */
.v2-mcard__when {
  margin: -0.3em 0 0;
  font-size: 0.78rem;
  color: var(--t-label);
  font-variant-numeric: tabular-nums;
}
.v2-mcard__title {
  margin: 0;
  font-size: 15.5px;
  font-weight: 650;
  letter-spacing: -0.25px;
  line-height: 1.26;
  min-width: 0;
  overflow-wrap: anywhere;
}
.v2-mcard__title--big {
  font-size: 17.5px;
  font-weight: 680;
  letter-spacing: -0.4px;
  line-height: 1.24;
}
.v2-mcard__top .v2-mcard__title {
  flex: 1 1 auto;
}
.v2-mcard__sub {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--t-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.v2-mcard__photos {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11.5px;
  color: var(--t-muted);
}
.v2-mcard__foot {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 26px;
}
.v2-mcard__foot .v2-prog,
.v2-mcard__foot .v2-mcard__count {
  margin-left: auto;
}
.v2-mcard__count {
  font-size: 12px;
  font-weight: 620;
  color: var(--accent-ink);
}
.v2-lib .avatar--ring {
  box-shadow: 0 0 0 2px var(--s-card);
}
.v2-lib .avatar--more {
  background: var(--s-chip);
  color: var(--t-muted);
}

/* ---------- status cards (processing / pending / held / failed / recovery) ---------- */
.v2-mcard--status {
  gap: 8px;
}
.v2-mcard__status {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--accent-ink);
}
.v2-mcard.is-held .v2-mcard__status {
  color: var(--t-muted);
}
.v2-mcard__dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  flex: none;
}
.v2-mcard__dot.is-pulsing {
  animation: v2-lib-pulse 1.4s ease-in-out infinite;
}
.v2-mcard__spin {
  color: var(--accent);
  flex: none;
  animation: v2-lib-spin 0.9s linear infinite;
}
.v2-mcard--recover {
  cursor: pointer;
}
.v2-mcard__badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 23px;
  padding: 0 9px;
  border-radius: 12px;
  background: var(--s-chip);
  color: var(--danger);
  font-size: 11px;
  font-weight: 700;
  flex: none;
}
.v2-mcard__actions {
  display: flex;
  gap: 8px;
}
.v2-mcard__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
  border-radius: var(--r2-round);
  border: 1px solid var(--accent-tint-line);
  background: var(--accent-tint);
  color: var(--accent-ink);
  font: inherit;
  font-size: 13.5px;
  font-weight: 640;
}
.v2-mcard__btn:disabled {
  opacity: 0.55;
}

/* ---------- task progress ---------- */
.v2-prog {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: none;
}
.v2-prog__track {
  width: 4.1rem;
  height: 5px;
  border-radius: 3px;
  background: var(--s-track);
  overflow: hidden;
}
.v2-prog__fill {
  display: block;
  height: 100%;
  border-radius: 3px;
  background: var(--accent);
}
.v2-prog.is-complete .v2-prog__fill {
  background: var(--done); /* green means complete, nothing else */
}
.v2-prog__label {
  font-size: 12px;
  font-weight: 620;
  color: var(--t-muted);
  font-variant-numeric: tabular-nums;
}
.v2-prog--tile {
  gap: 5px;
  margin-left: auto;
}
.v2-prog--tile .v2-prog__track {
  width: 2.1rem;
  height: 4px;
}
.v2-prog--tile .v2-prog__label {
  font-size: 11px;
  font-weight: 640;
}

/* ---------- grid tile (board MainGrid) ---------- */
.v2-tile {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-height: 7rem;
  padding: 12px;
  border-radius: var(--r2-card);
  background: var(--s-card);
  border: 1px solid var(--raised-line);
  box-shadow: var(--sh-raised);
  box-sizing: border-box;
  color: var(--t-primary);
  text-decoration: none;
  min-width: 0;
}
.v2-tile.is-unviewed {
  border-color: var(--accent-tint-line);
}
.v2-tile__meta {
  display: flex;
  align-items: center;
  gap: 0.4em;
  font-size: 11px;
  color: var(--t-label);
  font-variant-numeric: tabular-nums;
}
/* Item 27: length on the right, time of day under the title. */
.v2-tile__dur {
  margin-left: auto;
  white-space: nowrap;
}
.v2-tile__when {
  margin-top: -0.2em;
  font-size: 0.72rem;
  color: var(--t-label);
  font-variant-numeric: tabular-nums;
}
.v2-tile__title {
  flex-grow: 1;
  font-size: 14.5px;
  font-weight: 650;
  letter-spacing: -0.25px;
  line-height: 1.28;
  overflow-wrap: anywhere;
}
.v2-tile__foot {
  display: flex;
  align-items: center;
  gap: 9px;
}
.v2-tile__foot .v2-mcard__photos {
  font-size: 11px;
}

/* ---------- the red confirm (memo delete / recovery remove) in 2.0 dress ---------- */
.v2-confirm .confirm__box {
  background: var(--s-panel);
  border: 1px solid var(--raised-line);
  border-radius: var(--r2-card);
  color: var(--t-primary);
}
.v2-confirm .confirm__body {
  color: var(--t-muted);
}
.v2-confirm .confirm__btn--cancel {
  background: var(--s-chip);
  color: var(--t-nav);
}
.v2-confirm .confirm__btn--danger {
  background: var(--danger);
  color: var(--on-accent);
}

@keyframes v2-lib-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.35;
  }
}
@keyframes v2-lib-spin {
  to {
    transform: rotate(360deg);
  }
}
@keyframes v2-lib-jump {
  0%,
  100% {
    box-shadow: var(--sh-raised);
  }
  30% {
    box-shadow: 0 0 0 3px var(--accent-tint-line), var(--sh-raised);
  }
}
@media (prefers-reduced-motion: reduce) {
  .v2-mcard__dot.is-pulsing,
  .v2-mcard__spin,
  .v2-mcard.is-jumped {
    animation: none;
  }
}

/* ---------- Projects (Randy 2026-10-04) ---------- */
/* The library switch sits under the search bar. */
.v2-lib__switch {
  margin: 0 0 14px;
}
/* Projects: sort acts on meetings only — the pill keeps just the grid /
 * list toggle (Randy 2026-10-05). */
.v2-lib.is-projects .v2-toolbar [data-act="sort"],
.v2-lib.is-projects .v2-toolbar .v2-tool__rule {
  display: none;
}
.v2-plist__intro {
  margin: 2px 4px 14px;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--t-muted);
}
.v2-plist {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.v2-pcard {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 14px 13px;
  text-decoration: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}
.v2-pcard:active {
  transform: scale(0.985);
}
/* The folder glyph (item 24, Randy 2026-10-06): small, pink (the Meetings
 * accent), no background — top-right corner on a grid card, before the name
 * on a list row. */
.v2-pcard__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
  color: var(--meetings-ink);
  background: none;
  border: 0;
}
.v2-pcard > .v2-pcard__icon {
  position: absolute;
  top: 0.8rem;
  inset-inline-end: 0.8rem;
}
.v2-pcard__name {
  font-size: 0.97rem;
  font-weight: 660;
  letter-spacing: -0.3px;
  line-height: 1.25;
  color: var(--t-primary);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
  /* the corner glyph's space: the title never runs under it */
  padding-inline-end: 1.5rem;
}
.v2-pcard__count,
.v2-pcard__tasks {
  font-size: 0.78rem;
  color: var(--t-muted);
  font-variant-numeric: tabular-nums;
}
.v2-pcard__bar {
  display: block;
  height: 4px;
  margin: 8px 0 3px;
  border-radius: var(--r2-round);
  background: var(--s-track);
  overflow: hidden;
}
.v2-pcard__fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: var(--accent);
}
/* List view: one row per project — folder, name, "N meetings · N open
 * tasks", a slim bar. */
.v2-plist--rows {
  grid-template-columns: minmax(0, 1fr);
  gap: 10px;
}
.v2-prow {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 12px 12px 14px;
  text-decoration: none;
  color: inherit;
  -webkit-tap-highlight-color: transparent;
}
.v2-prow:active {
  transform: scale(0.99);
}
.v2-prow__icon {
  flex: none;
}
.v2-prow__body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.v2-prow__name {
  font-size: 0.97rem;
  font-weight: 660;
  letter-spacing: -0.3px;
  line-height: 1.25;
  color: var(--t-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.v2-prow__line {
  font-size: 0.78rem;
  color: var(--t-muted);
  font-variant-numeric: tabular-nums;
}
.v2-prow__bar {
  height: 3px;
  margin: 6px 0 1px;
}
.v2-prow__chev {
  flex: none;
  display: flex;
  color: var(--t-chevron);
}
.v2-pcard-new.v2-prow-new {
  flex-direction: row;
  min-height: 3.25rem;
}
.v2-pcard-new {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 9.5rem;
  border-radius: var(--r2-card);
  background: transparent;
  border: 1px dashed var(--accent-tint-line);
  color: var(--accent-ink);
  font: inherit;
  font-size: 0.86rem;
  font-weight: 620;
  cursor: pointer;
}