/* GENERATED FILE - DO NOT EDIT.
   Source: shared/day-view.css - run `npm run sync:shared` after editing. */

/*
 * Day view (owner 2026-10-10, mock "Day view mock"; shared/day-view.js) — web (html.wb-new) + app (.is-workbook).
 * time | a timeline rail with the stop's status dot | the card; the status in words on the card; the way
 * between stops; the day strip's progress; the review nudge; the yellow lock banner.
 */
:is(html.wb-new, .is-workbook) .agenda-list .nu-ag-row.dv-row {
  grid-template-columns: 4.2rem 1.6rem minmax(0, 1fr);
  column-gap: 0.6rem;
  position: relative;
}
:is(html.wb-new, .is-workbook) .agenda-list .dv-row::before {
  content: "";
  position: absolute;
  top: -0.65rem;
  bottom: -0.65rem;
  left: calc(4.2rem + 0.6rem + 0.8rem - 1px);
  width: 2px;
  background: #ddd2bc;
  z-index: 0;
}
:is(html.wb-new, .is-workbook) .agenda-list .dv-row:first-child::before { top: 1rem; }
.dv-dot {
  --c: #7a8076;
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 1.45rem;
  height: 1.45rem;
  margin-top: 0.85rem;
  border-radius: 50%;
  box-sizing: border-box;
  background: var(--c);
  color: #fff;
  justify-self: center;
}
.dv-dot svg { width: 0.8rem; height: 0.8rem; }
.dv-dot.dv-type-transpo { --c: #3e6d8e; }
.dv-dot.dv-type-food { --c: #8c4646; }
.dv-dot.dv-type-attraction,
.dv-dot.dv-type-see { --c: #8c3d3d; }
.dv-dot.dv-type-rest { --c: #6b5b8e; }
.dv-dot.dv-type-activity { --c: #2f7d57; }
.dv-dot.dv-type-tour { --c: #a16207; }
.dv-dot.dv-type-shop { --c: #4338ca; }
.dv-dot.is-upcoming { background: #fffdf8; border: 2.5px solid var(--c); }
/* a public trip (guide): the stop's number, filled in its type colour — the same numbers as the Map of the day */
.dv-dot.is-guide { background: var(--c); border: 2px solid #fffdf8; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22); font: 700 0.68rem/1 "DM Sans", system-ui, sans-serif; font-variant-numeric: tabular-nums; }
.dv-dot.is-skipped { background: #a39d90; }
.dv-dot.is-late { background: #fffdf8; border: 2px solid #c98a12; color: #c98a12; }
.dv-dot.is-blocked { background: #b3261e; }
.dv-dot.is-now { box-shadow: 0 0 0 0.35rem rgba(224, 169, 31, 0.3); animation: dv-pulse 1.8s ease-out infinite; }
@keyframes dv-pulse {
  0% { box-shadow: 0 0 0 0 rgba(224, 169, 31, 0.55); }
  100% { box-shadow: 0 0 0 0.6rem rgba(224, 169, 31, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .dv-dot.is-now { animation: none; }
}
/* The card by status */
:is(html.wb-new, .is-workbook) .agenda-item.nu-ag-card.dv-skipped { opacity: 0.62; }
:is(html.wb-new, .is-workbook) .agenda-item.nu-ag-card.dv-skipped b { text-decoration: line-through; text-decoration-color: #9a9488; }
:is(html.wb-new, .is-workbook) .agenda-item.nu-ag-card.dv-now { box-shadow: inset 0 0 0 2px #e0a91f; }
.dv-status {
  display: inline-flex;
  width: fit-content;
  margin-top: 0.2rem;
  padding: 0.18rem 0.6rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  line-height: 1.3;
}
.dv-status.is-done { background: #e1f0e6; color: #23633a; }
.dv-status.is-now { background: #fbefcf; color: #6b4a00; }
.dv-status.is-late { background: #fbefcf; color: #6b4a00; }
.dv-status.is-skipped { background: #e6e1d6; color: #4a463e; }
.dv-status.is-blocked { background: #fbe1de; color: #8e1f18; }
/* The note's first line on a card (owner 2026-10-10: the full-width box broke the look) — a quiet line like the
   time and place, 📝 in front, cut with … ; the whole note is in the stop's panel. */
.dv-note {
  display: block;
  max-width: 100%;
  margin-top: 0.1rem;
  overflow: hidden;
  font-size: 0.78rem;
  color: #6b6a62;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.dv-note::before { content: "📝 "; }
/* The way between stops */
:is(html.wb-new, .is-workbook) .agenda-list .dv-leg {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  margin: -0.2rem 0;
  padding: 0 0 0 calc(4.2rem + 1.6rem + 1.2rem);
  font-size: 0.76rem;
  color: #6b6a62;
  list-style: none;
}
.dv-leg svg { width: 0.9rem; height: 0.9rem; flex: none; }
/* Two stops at the same time (China sim 2026-10-17 B-5) */
.dv-leg.is-overlap { color: #b45309; font-weight: 600; }
/* The heading */
:is(html.wb-new, .is-workbook) .dv-kicker {
  margin: 0 0 0.2rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #8a6a1f;
}
html.wb-new .nu-ag-title.dv-title { font-weight: 700; color: var(--forest, #1f3d30); }
/* The app's day header is dark: the title keeps its light colour there. */
.is-workbook .nu-ag-title.dv-title { font-weight: 700; }
/* The day strip's progress bar */
.dv-prog { display: flex; gap: 2px; margin-top: 0.3rem; }
.dv-prog span { height: 4px; flex: 1; border-radius: 2px; background: #e6dcc8; }
.dv-prog .is-done { background: #2d7a46; }
.dv-prog .is-skipped { background: #b9b3a6; }
.dv-prog .is-now,
.dv-prog .is-late { background: #e0a91f; }
.dv-prog .is-blocked { background: #b3261e; }
:is(html.wb-new, .is-workbook) .nu-day.is-on .dv-prog span { background: rgba(255, 255, 255, 0.28); }
:is(html.wb-new, .is-workbook) .nu-day.is-on .dv-prog .is-done { background: #8fd1a6; }
:is(html.wb-new, .is-workbook) .nu-day.is-on .dv-prog .is-skipped { background: rgba(255, 255, 255, 0.55); }
:is(html.wb-new, .is-workbook) .nu-day.is-on .dv-prog .is-now,
:is(html.wb-new, .is-workbook) .nu-day.is-on .dv-prog .is-late { background: #f3c64f; }
/* "How was Day 2 so far? Review N places" */
.dv-review {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.6rem 0.7rem;
  align-items: center;
  margin-top: 0.8rem;
  padding: 0.85rem;
  border-radius: 14px;
  background: #fffdf8;
  border: 1px solid #ebe2cf;
}
.dv-review-face {
  display: grid;
  place-items: center;
  width: 2.4rem;
  height: 2.4rem;
  overflow: hidden;
  border-radius: 50%;
  background: #fbf1dc;
}
/* LakBi's own face (owner 2026-10-10: the "LB" letters meant nothing) */
.dv-review-face img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dv-review b { display: block; font-size: 0.9rem; }
.dv-review small { display: block; font-size: 0.78rem; color: #55544c; }
.dv-review-go {
  grid-column: 1 / -1;
  min-height: 44px;
  border: 0;
  border-radius: 999px;
  background: #e9b52f;
  color: #1f3d30;
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}
.dv-review-go:hover { background: #dfa81f; }
@media (max-width: 560px) {
  :is(html.wb-new, .is-workbook) .agenda-list .nu-ag-row.dv-row { grid-template-columns: 3.3rem 1.3rem minmax(0, 1fr); column-gap: 0.45rem; }
  :is(html.wb-new, .is-workbook) .agenda-list .dv-row::before { left: calc(3.3rem + 0.45rem + 0.65rem - 1px); }
  :is(html.wb-new, .is-workbook) .agenda-list .dv-leg { padding-left: calc(3.3rem + 1.3rem + 0.9rem); }
  .dv-dot { width: 1.2rem; height: 1.2rem; }
}

/* The app's rows are two columns (time | card): the dot takes its own column there too. */
.is-workbook .nu-agenda .agenda-list .nu-ag-row.dv-row { grid-template-columns: 3.3rem 1.3rem minmax(0, 1fr); column-gap: 0.45rem; }
.is-workbook .nu-agenda .agenda-list .dv-row::before { left: calc(3.3rem + 0.45rem + 0.65rem - 1px); }
.is-workbook .nu-agenda .agenda-list .dv-leg { padding-left: calc(3.3rem + 1.3rem + 0.9rem); }
.is-workbook .dv-dot { width: 1.2rem; height: 1.2rem; }

/* After the trip: "Itinerary is locked. Reviews, the Recap and costs stay open until 15 Oct." (lockNoteHtml) */
.itin-lock-banner {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 1rem;
  padding: 0.7rem 0.95rem;
  border: 1px solid #f0dfaa;
  border-radius: 12px;
  background: #fbf0d0;
  color: #4a3d1c;
  font-size: 0.86rem;
  line-height: 1.4;
}
.itin-lock-banner svg { flex: none; color: #7a5c1c; }
.itin-lock-banner p { margin: 0; }
.itin-lock-banner b { font-weight: 700; color: #3a2e10; }
.itin-lock-banner.is-open { border-color: #cfe1d5; background: #e8f2eb; color: #1f3d30; }
.itin-lock-banner.is-open svg,
.itin-lock-banner.is-open b { color: #1f3d30; }

/* ——— A calm card (owner 2026-10-13: "an unhealthy amount of labels") — day view + planner, web + app ———
   LakBi's pick / Group's choice: a tiny mark on the tile's corner (the words go to screen readers). */
.nu-agc-tile { position: relative; }
.nu-agc-tile .dv-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  display: grid;
  place-items: center;
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 50%;
  background: #f5d27a;
  color: #5a3a06;
  font-size: 0.58rem;
  font-style: normal;
  font-weight: 800;
  line-height: 1;
  box-shadow: 0 0 0 1.5px #fff;
}
.nu-agc-tile .dv-badge.is-group { background: #fde0cf; color: #9a3d12; font-size: 0.5rem; }
.dv-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
/* The day card's right edge: 🎫 / 📎 (a tap opens it) and 🔒 (a stop a traveller fixed), outside the card's button. */
:is(html.wb-new, .is-workbook) .agenda-list .dv-row > .dv-edge {
  position: absolute;
  top: 50%;
  right: 0.35rem;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 0.05rem;
  transform: translateY(-50%);
}
:is(html.wb-new, .is-workbook) .agenda-list .dv-row > .dv-edge .lb-plan-lock-icon { width: 1.4rem; opacity: 0.75; }
/* Room for the edge (beats the web's #panel-itinerary card rule and the app's .nu-agenda one). */
:is(html.wb-new, .is-workbook) :is(#panel-itinerary, .nu-agenda) .agenda-list .agenda-item.nu-ag-card.nu-ag-compact.has-edge { padding-right: 2.6rem; }
:is(html.wb-new, .is-workbook) :is(#panel-itinerary, .nu-agenda) .agenda-list .agenda-item.nu-ag-card.nu-ag-compact.has-edge:has(~ .dv-edge .lb-plan-file-icon + .lb-plan-lock-icon) { padding-right: 4rem; }
/* The name gets the room the chips had: two lines before it is cut (a phone at 360 with 🎫 + 🔒 at the edge). */
:is(html.wb-new, .is-workbook) :is(#panel-itinerary, .nu-agenda) .agenda-list .nu-ag-compact .nu-agc-body > b {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Up next: the whole name — two lines clamped spilled the third over the line below (2026-10-21, a long stop name) */
:is(html.wb-new, .is-workbook) :is(#panel-itinerary, .nu-agenda) .agenda-list .nu-ag-compact .nu-agc-body.is-next > b.nu-agc-title {
  display: block;
  -webkit-line-clamp: unset;
  line-clamp: none;
  overflow: visible;
}