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

/* Prep list types (shared/prep-lists.js, owner 2026-10-04): For everyone / For anyone / One traveller. Web + app. */
.prep-kind-tag {
  display: inline-block;
  padding: 0.05rem 0.5rem;
  border-radius: 999px;
  background: #eef2ec;
  color: #2d5a45;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.5;
  white-space: nowrap;
}
.prep-kind-tag.is-anyone {
  background: #fff1d1;
  color: #7a5310;
}
.prep-kind-tag.is-traveller {
  background: #ece9f6;
  color: #4a3f7a;
}
.prep-kind-tag.is-mine {
  background: #2d5a45;
  color: #fff;
}
.prep-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin: -0.15rem 0 0.35rem;
}
.prep-list-card h3 {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}
.prep-list-card .prep-card-title {
  min-width: 0;
  overflow-wrap: anywhere;
}
.prep-list-card h3 small {
  flex: none;
}
.prep-pool-warn {
  margin: 0 0 0.4rem;
  padding: 0.35rem 0.6rem;
  border-radius: 8px;
  background: #fff6e3;
  color: #7a5310;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.35;
}
.prep-list-empty {
  margin: 0;
  color: #6c776f;
  font-size: 0.85rem;
  line-height: 1.4;
}

/* One fixed row on both platforms (the website's prep rows wrap by default). */
.prep-list-card .check-row.is-pool,
.prep-list-card .check-row.is-readonly,
.prep-list-card .check-row.is-taken-item {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.prep-list-card .check-row .prep-item-wrap {
  display: grid;
  /* the column is the row's width, never the 📎 chip's (owner's phone 2026-10-14: a long link chip pushed every line
     of the list off the card's right edge) */
  grid-template-columns: minmax(0, 1fr);
  flex: 1 1 auto;
  gap: 1px;
  min-width: 0;
  max-width: 100%;
}
.prep-list-card .check-row,
.prep-list-card .prep-rows {
  min-width: 0;
  max-width: 100%;
}
.prep-list-card .check-row .prep-file-chip,
.prep-list-card .check-row .check-link {
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.prep-list-card .prep-text {
  overflow-wrap: anywhere;
}
.prep-pool-dot {
  flex: none;
  width: 0.55rem;
  height: 0.55rem;
  border: 1.5px solid #c9861b;
  border-radius: 50%;
}
.check-row.is-pool.is-taken .prep-pool-dot {
  border-color: #2d5a45;
  background: #2d5a45;
}
.check-row.is-pool.is-taken .prep-text {
  color: #6c776f;
}
.prep-taken-by {
  flex: none;
  color: #2d5a45;
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
}
.prep-taken-by.is-edit {
  align-self: center;
  margin: 0 0.25rem;
  font-size: 0.75rem;
}
.prep-take-btn,
.prep-return-btn {
  flex: none;
  min-height: 1.9rem;
  padding: 0 0.7rem;
  border: 1px solid #2d5a45;
  border-radius: 999px;
  background: #fff;
  color: #2d5a45;
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
  white-space: nowrap;
  cursor: pointer;
}
/* Outlined, not solid (W-43, 2026-10-21): three solid buttons on one card were the loudest thing on Prep. */
.prep-take-btn {
  background: #fff;
  color: #2d5a45;
}
.prep-take-btn:hover { background: #eef5f0; }
.prep-return-btn {
  border-color: #d8cfbd;
  color: #5d6b63;
  max-width: 45%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.prep-take-btn:disabled,
.prep-return-btn:disabled {
  opacity: 0.55;
  cursor: progress;
}
.prep-from {
  color: #6c776f;
  font-size: 0.74rem;
  line-height: 1.3;
}
.prep-taken-check {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  cursor: pointer;
}
.prep-done-mark {
  display: inline-grid;
  flex: none;
  place-items: center;
  width: 1.15rem;
  height: 1.15rem;
  border: 1.5px solid #c9d8cf;
  border-radius: 5px;
  color: #fff;
  font-size: 0.72rem;
  font-weight: 800;
}
.check-row.is-done .prep-done-mark {
  border-color: #2d5a45;
  background: #2d5a45;
}
.check-row.is-readonly.is-done .prep-text {
  color: #6c776f;
  text-decoration: line-through;
}

/* Edit mode: the tag opens "Edit list". */
.prep-kind-btn {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 0.2rem;
  padding: 0.1rem 0.25rem;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #5d6b63;
  font: inherit;
  font-size: 0.75rem;
  cursor: pointer;
}
.prep-kind-btn:focus-visible {
  outline: 2px solid #e6c98e;
}
.prep-title-static {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.35rem 0.2rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

/* The New list / Edit list sheet (LakbayConfirm.custom). */
.prep-sheet {
  display: grid;
  gap: 0.75rem;
  text-align: left;
}
.prep-sheet-name[hidden],
.prep-sheet-who[hidden],
.prep-sheet-becomes[hidden],
.prep-sheet-error[hidden] {
  display: none !important;
}
.prep-sheet-kinds {
  display: grid;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  border: 0;
}
.prep-sheet-kinds legend {
  margin-bottom: 0.4rem;
  padding: 0;
  color: #44544a;
  font-size: 0.85rem;
  font-weight: 600;
}
.prep-sheet-kind {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.55rem 0.7rem;
  border: 1px solid #e4dccb;
  border-radius: 0.8rem;
  background: #fff;
  cursor: pointer;
}
.prep-sheet-kind:has(input:checked) {
  border-color: #2d5a45;
  background: #f3f8f4;
}
.prep-sheet-kind input {
  margin-top: 0.2rem;
  accent-color: #2d5a45;
}
.prep-sheet-kind span {
  display: grid;
  gap: 1px;
}
.prep-sheet-kind b {
  color: #1f3d30;
  font-size: 0.92rem;
}
.prep-sheet-kind small {
  color: #6c776f;
  font-size: 0.8rem;
}
.prep-sheet-who {
  display: grid;
  gap: 0.45rem;
}
.prep-who-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
}
.prep-who-chip {
  max-width: 100%;
  min-height: 2.2rem;
  padding: 0 0.85rem;
  overflow: hidden;
  border: 1px solid #d8cfbd;
  border-radius: 999px;
  background: #fff;
  color: #1f3d30;
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.prep-who-chip[aria-pressed="true"] {
  border-color: #1f3d30;
  background: #1f3d30;
  color: #fbf6ec;
}
.prep-sheet-becomes,
.prep-sheet-note {
  margin: 0;
  color: #44544a;
  font-size: 0.85rem;
}
.prep-sheet-error {
  margin: 0;
  color: #b3261e;
  font-size: 0.86rem;
  font-weight: 700;
}
.prep-list-card label.check-row {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  cursor: pointer;
}
.prep-list-card .prep-check {
  flex: none;
}

/* ——— Folding lists (shared/prep-lists.js foldMount, owner 2026-10-12). Web + app, view mode only. ——— */
.prep-fold-head {
  min-width: 0;
}
.prep-fold-btn {
  display: flex;
  flex: 1 1 auto;
  align-items: baseline;
  gap: 0.45rem;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 8px;
  background: none;
  color: inherit;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.prep-fold-btn::before {
  content: "▾";
  flex: none;
  align-self: center;
  width: 1em;
  color: #6c776f;
  font: 700 0.7em/1 system-ui, -apple-system, "Segoe UI", sans-serif;
  text-align: center;
  transition: transform 0.15s ease;
}
.prep-fold-card.is-folded:not(.is-search-hit) .prep-fold-btn::before,
.prep-fold-card.is-search-hit.is-search-shut .prep-fold-btn::before {
  transform: rotate(-90deg);
}
.prep-fold-btn > small {
  flex: none;
  margin-left: auto;
}
.prep-fold-btn > .prep-card-title,
.prep-fold-btn > .my-list-title {
  min-width: 0;
}
.prep-fold-card.is-all-done .prep-fold-btn > small:not(.prep-search-count)::after {
  content: " ✓";
  color: #2e7d4f;
}
.prep-fold-btn:focus-visible {
  outline: 2px solid #1e3a2f;
  outline-offset: 3px;
}
/* Folded: the header and its bar stay; the items, tags and notes hide. */
.prep-fold-card.is-folded:not(.is-search-hit) > :not(h3):not(.nu-bar),
.prep-fold-card.is-search-hit.is-search-shut > :not(h3):not(.nu-bar) {
  display: none !important;
}
.nu-prep-grid > .prep-fold-card.is-folded {
  align-self: start;
}
/* The row above the lists: search on the left, Fold all on the right (search wraps above it when narrow). */
.prep-fold-all {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem 0.75rem;
  margin: 0 0 0.5rem;
}
.prep-fold-all-btn {
  min-height: 2rem;
  padding: 0.2rem 0.35rem;
  border: 0;
  border-radius: 8px;
  background: none;
  color: #1e5a3c;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.prep-fold-all-btn[hidden] {
  display: none !important;
}
.prep-fold-all-btn:focus-visible {
  outline: 2px solid #1e3a2f;
  outline-offset: 2px;
}
/* List titles read as titles (owner 2026-10-13): the same weight as Library lists (library.css .lib-group-head h3),
   each platform's own display serif. */
.prep-fold-head > .prep-fold-btn {
  font-weight: 600;
}
.prep-fold-head .my-list-only {
  font-weight: 400;
}

/* ——— Search your lists (shared/prep-lists.js searchPaint, owner 2026-10-13). View mode only. ——— */
.prep-search {
  position: relative;
  display: flex;
  flex: 1 1 13rem;
  align-items: center;
  min-width: 0;
  max-width: 24rem;
  margin-right: auto;
}
.prep-search-icon {
  position: absolute;
  left: 0.75rem;
  color: #6c776f;
  pointer-events: none;
}
.prep-search-input {
  width: 100%;
  min-width: 0;
  height: 2.5rem;
  margin: 0;
  padding: 0 2.6rem 0 2.35rem;
  border: 1px solid #d8cfbd;
  border-radius: 999px;
  background: #fff;
  color: #1f3d30;
  font: inherit;
  font-size: 0.92rem;
  -webkit-appearance: none;
  appearance: none;
}
.prep-search-input::placeholder {
  color: #7a847c;
  opacity: 1;
}
.prep-search-input::-webkit-search-cancel-button,
.prep-search-input::-webkit-search-decoration {
  display: none;
  -webkit-appearance: none;
}
.prep-search-input:focus-visible {
  border-color: #2d5a45;
  outline: 2px solid #1e3a2f;
  outline-offset: 1px;
}
.prep-search-clear {
  position: absolute;
  right: 0.2rem;
  display: grid;
  place-items: center;
  width: 2.1rem;
  height: 2.1rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: none;
  color: #5d6b63;
  font: 700 0.9rem/1 system-ui, -apple-system, "Segoe UI", sans-serif;
  cursor: pointer;
}
.prep-search-clear[hidden] {
  display: none !important;
}
.prep-search-clear:hover {
  background: #f1ece1;
}
.prep-search-clear:focus-visible {
  outline: 2px solid #1e3a2f;
  outline-offset: 1px;
}
.prep-search-status {
  flex: 1 0 100%;
  margin: 0.1rem 0 0;
  color: #44544a;
  font-size: 0.9rem;
  font-weight: 600;
}
.prep-search-status:empty {
  display: none;
}
.prep-search-status.is-sr {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
/* While searching: lists with no match and items that don't match hide; the header shows "2 of 12". */
.nu-prep-grid.is-prep-searching > .prep-fold-card.is-search-miss,
.nu-prep-grid.is-prep-searching .check-row.is-search-miss {
  display: none !important;
}
.prep-fold-card.is-search-hit .prep-fold-btn > small:not(.prep-search-count) {
  display: none;
}
.prep-fold-btn > .prep-search-count {
  color: #1e5a3c;
}
mark.prep-search-mark {
  padding: 0 1px;
  border-radius: 3px;
  background: #fde7a6;
  color: inherit;
}

/* Phones: a 44 px tap target on every header, on Fold all and on the search box. */
@media (pointer: coarse), (max-width: 767px) {
  .prep-fold-btn,
  .prep-fold-all-btn {
    min-height: 44px;
  }
  .prep-fold-btn {
    align-items: center;
  }
  .prep-search-input {
    height: 44px;
    font-size: 1rem;
  }
  .prep-search-clear {
    width: 40px;
    height: 40px;
  }
}
@media (prefers-reduced-motion: reduce) {
  .prep-fold-btn::before {
    transition: none;
  }
}

/* ——— Edit: drag to organise, paste a whole list (owner 2026-10-14) ——— */
.prep-drag {
  flex: none;
  align-self: center;
  width: 28px;
  height: 34px;
  margin: 0 2px 0 -4px;
  padding: 0;
  border: 1px solid rgba(31, 61, 48, 0.16);
  border-radius: 8px;
  background: #f4efe3;
  color: #4a5a50;
  font: 800 0.95rem/32px system-ui, sans-serif;
  letter-spacing: -0.14em;
  text-indent: -0.14em;
  cursor: grab;
  touch-action: none; /* a phone drags the row, not the page */
  user-select: none;
  -webkit-user-select: none;
}
.prep-drag:hover, .prep-drag:focus-visible { background: #e7f0e9; border-color: #2f7a52; color: #1f3d30; }
html.prep-drag-on, html.prep-drag-on * { cursor: grabbing !important; user-select: none !important; -webkit-user-select: none !important; }
.prep-dragging { opacity: 0.45; }
[data-prep-row].prep-drop-before { box-shadow: 0 -3px 0 0 #2f7a52; }
[data-prep-row].prep-drop-after { box-shadow: 0 3px 0 0 #2f7a52; }
[data-prep-list].prep-drop-before { box-shadow: 0 -4px 0 0 #2f7a52; }
[data-prep-list].prep-drop-after { box-shadow: 0 4px 0 0 #2f7a52; }
[data-prep-list].prep-drop-into { outline: 2px dashed #2f7a52; outline-offset: 2px; }

/* + Add item · 📋 Paste a list, side by side (owner 2026-10-14: "the paste list — where?") */
.prep-add-row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 6px; }
.prep-add-row .prep-add-item { margin: 0; }
.prep-paste-list { min-height: 34px; padding: 0 12px; border: 1px dashed rgba(31, 61, 48, 0.35); border-radius: 999px; background: transparent; color: #1f3d30; font: 600 0.82rem system-ui, sans-serif; cursor: pointer; }
.prep-paste-list:hover { background: #eef5f0; border-style: solid; }
.prep-paste-box { width: 100%; box-sizing: border-box; margin: 6px 0 10px; padding: 10px; border: 1px solid rgba(31, 61, 48, 0.25); border-radius: 10px; font: 0.9rem/1.45 system-ui, sans-serif; resize: vertical; }
/* the app's edit row on one line (owner 2026-10-14 "why is this stacked"): ⋮⋮ · ☐ · text · 🔗 · 📎 · × */
.prep-row.check-row.is-edit { grid-template-columns: auto auto minmax(0, 1fr) auto auto auto; }
.prep-row.check-row.is-edit:not(:has(> .prep-drag)) { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
.prep-row.check-row.is-edit > .prep-drag { align-self: center; }
/* the edit card's one column never grows past the card (owner 2026-10-15: the × was off the phone's edge) */
.prep-card[data-prep-list] { grid-template-columns: minmax(0, 1fr); }
.prep-card[data-prep-list] > * { min-width: 0; }
/* drag: the row rides under your finger (a copy), its place stays open where it was */
.prep-drag-ghost {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  margin: 0;
  box-sizing: border-box;
  border-radius: 12px;
  background: #fffdf8;
  box-shadow: 0 12px 30px rgba(20, 30, 25, 0.28), 0 0 0 2px #2f7a52;
  opacity: 0.96;
  transform: scale(1.02);
}
.prep-dragging { opacity: 0.25; }
[data-prep-row].prep-drop-before { box-shadow: 0 -4px 0 0 #2f7a52; }
[data-prep-row].prep-drop-after { box-shadow: 0 4px 0 0 #2f7a52; }
.prep-drag { width: 32px; height: 40px; font-size: 1.05rem; }
/* the phone's edit row: tighter so the item's text box keeps room (⋮⋮ · ☐ · text · 🔗 · 📎 · ×) */
.prep-card[data-prep-list] .prep-row.check-row.is-edit { column-gap: 4px; }
.prep-row.check-row.is-edit > :is(.prep-link-btn, .prep-file-btn) { width: 32px; min-width: 32px; height: 32px; }
.prep-row.check-row.is-edit > .prep-remove { width: 32px; min-width: 32px; }

/* while dragging: lists fold to their title bars (a list drag: all; an item drag: all but its own) — owner 2026-10-15.
   Each bar keeps its title and count on a ~44 px row (its type chip just under) so you can tell the lists apart (2026-10-21: the h3
   title was hidden with the items, and the old class names clashed with the "Fold all" row's .prep-fold-all). */
.prep-drag-fold [data-prep-list] > :not(h3):not(.prep-card-head):not(.wb-head):not(.prep-card-tags),
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home) > :not(h3):not(.prep-card-head):not(.wb-head):not(.prep-card-tags) {
  display: none !important;
}
.prep-drag-fold [data-prep-list],
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home) {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center;
  align-self: start;
  gap: 0 8px;
  min-height: 44px;
  box-sizing: border-box;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
.prep-drag-fold [data-prep-list] > :is(h3, .prep-card-head, .wb-head),
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home) > :is(h3, .prep-card-head, .wb-head) {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0 !important;
}
.prep-drag-fold [data-prep-list] > .prep-card-tags,
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home) > .prep-card-tags {
  flex: 1 0 100%;
  margin: -4px 0 4px !important;
  padding-left: 2.6rem;
}
.prep-drag-fold [data-prep-list] > :is(h3, .prep-card-head, .wb-head),
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home) > :is(h3, .prep-card-head, .wb-head) {
  flex-basis: 100%;
}
:is(.prep-drag-fold, .prep-drag-fold-others) [data-prep-list] {
  transition: box-shadow 0.15s ease;
}
.prep-drag-fold-others [data-prep-list]:not(.prep-drag-home).prep-drop-into {
  outline-offset: 0;
  background: #eef5f0;
}
/* the drop line between bars: thick and clear */
.prep-drag-fold [data-prep-list].prep-drop-before { box-shadow: 0 -5px 0 0 #2f7a52; }
.prep-drag-fold [data-prep-list].prep-drop-after { box-shadow: 0 5px 0 0 #2f7a52; }

/* …and the automatic Travel documents card folds too (it isn't a list: a drop over it goes after the last list) */
:is(.prep-drag-fold, .prep-drag-fold-others) .prep-auto-card > :not(h3) {
  display: none !important;
}
/* A pool item with a link / file chip under its words: the dot stays on the words' first line (W-41, web + app). */
.prep-list-card .check-row.is-pool > .prep-pool-dot { align-self: flex-start; margin-top: 0.5rem; }

/* Public read-only rows (owner 2026-10-21, web + app, publicRowHtml): the dot beside the FIRST line, the text
   left-aligned, chips / notes under the text, Open on the right. A grid, so nothing can wrap the dot onto its own line. */
.check-row.is-public-row,
html.wb-new .nu-prep-items .check-row.is-public-row,
.prep-list-card .check-row.is-public-row {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start !important;
  justify-items: start;
  column-gap: 0.6rem;
  row-gap: 0;
  flex-wrap: nowrap !important;
  text-align: left;
}
.check-row.is-public-row > .prep-bullet {
  grid-column: 1;
  display: block;
  flex: none;
  width: 0.45rem;
  height: 0.45rem;
  /* the middle of the first line (rows are line-height 1.4) */
  margin: calc((1.4em - 0.45rem) / 2) 0 0 0.1rem;
  border-radius: 50%;
  background: color-mix(in srgb, var(--ink, #1f2a24) 35%, transparent);
}
.check-row.is-public-row > .prep-item-wrap {
  grid-column: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  min-width: 0;
  width: 100%;
  line-height: 1.4;
}
.check-row.is-public-row > .prep-item-wrap > .prep-text {
  min-width: 0;
  overflow-wrap: anywhere;
}
.check-row.is-public-row > .prep-link {
  grid-column: 3;
  align-self: start;
}