/* moveUP portal prototype, round 1. Builds on the live site's styles (css/styles.css),
   so colours, fonts, buttons, header and footer match DESIGN.md exactly. Only portal pieces are here. */

/* PROTOTYPE STRIP: reminds everyone this is fake data */
.proto { background: rgba(231,111,81,.12); border-bottom: 1px solid rgba(231,111,81,.35); text-align: center; padding: 6px 16px;
  font: 600 var(--fs-label) "IBM Plex Mono", monospace; letter-spacing: .06em; color: var(--draft-ink); }
.proto a { color: inherit; }

/* HEADER extras: who is signed in */
.who { display: flex; align-items: center; gap: 12px; font-size: var(--fs-small); color: var(--muted); }
.who strong { color: var(--navy); }
.who a { color: var(--teal-ink); font-weight: 700; }

.page-head.portal-head { padding: 36px 0 18px; text-align: left; }
.portal-head h1 { font-size: var(--fs-h2); margin: 4px 0 0; max-width: none; }
.portal-head p { margin: 4px 0 0; color: var(--muted); }

/* THREE COLUMNS: path · step · folder */
.portal { display: grid; grid-template-columns: 250px minmax(0, 1fr) 340px; gap: 18px; align-items: start; margin-bottom: 56px; }
/* the site styles every input and select as a full-width form field; undo that for the portal's small controls */
.checklist input, .sort, td select, .admin-tools input { width: auto; }
.checklist input { flex: none; padding: 0; }
.checklist label { margin: 0; font-size: var(--fs-body); font-weight: 400; }

.portal > .panel { padding: 20px 22px; min-width: 0; }
.col-label { display: block; margin-bottom: 12px; }

/* LEFT: the 10-step path, vertical, joined by a dotted teal line */
.trail { list-style: none; margin: 0; padding: 0; position: relative; }
.trail::before { content: ""; position: absolute; left: 17px; top: 18px; bottom: 18px; width: 1px;
  background: repeating-linear-gradient(180deg, rgba(18,184,176,.6) 0 6px, transparent 6px 11px); }
.trail button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 6px 8px 6px 0; border: 0; background: none;
  border-radius: 10px; cursor: pointer; text-align: left; font: 500 var(--fs-small) "Space Grotesk", sans-serif; color: var(--muted); }
.trail button:hover { background: rgba(18,184,176,.08); }
.trail button[aria-current] { background: rgba(18,184,176,.14); color: var(--navy); font-weight: 700; }
.trail .n { margin-left: 0; }
.trail .done .n { background: var(--tint); color: var(--teal-ink); }
.trail .label { flex: 1; }
.trail .state { font: 600 var(--fs-micro) "IBM Plex Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.trail .now .state { color: var(--tag-ink); }
@media (prefers-reduced-motion: no-preference) {
  .trail .now .n { animation: pulse 2.4s ease-in-out infinite; }
  @keyframes pulse { 50% { box-shadow: 0 0 0 8px rgba(18,184,176,.08), 0 0 22px rgba(108,207,230,.9); } }
}

/* MIDDLE: the chosen step */
.step-view h2 { margin: 2px 0 10px; }
.step-view .desc { color: var(--muted); margin: 0 0 18px; }
.here { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 6px; background: rgba(245,166,35,.18);
  font: 600 var(--fs-micro) "IBM Plex Mono", monospace; color: var(--tag-ink); letter-spacing: .06em; vertical-align: middle; }
.sub { margin: 20px 0 8px; padding-top: 14px; border-top: 1px dashed var(--edge); }
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.checklist label { display: flex; gap: 10px; align-items: flex-start; padding: 8px 10px; border-radius: 8px; background: var(--tint); cursor: pointer; }
.checklist input { margin-top: 5px; accent-color: var(--teal); }
.checklist .t { flex: 1; }
.checklist .us { cursor: default; background: none; border: 1px dashed var(--edge); }
.who-tag { font: 600 var(--fs-micro) "IBM Plex Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); white-space: nowrap; margin-top: 4px; }
.checked .t { text-decoration: line-through; color: var(--muted); }
.samples { display: flex; flex-wrap: wrap; gap: 8px; }
.chip-btn { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 8px; border: 1px solid var(--edge);
  background: var(--surface); color: var(--navy); font: 500 var(--fs-small) "Space Grotesk", sans-serif; cursor: pointer; }
.chip-btn:hover { border-color: var(--teal); }
.note { font-size: var(--fs-small); color: var(--muted); margin: 14px 0 0; }
.note a { color: var(--teal-ink); font-weight: 700; }

/* NESTED ITEMS (Offer, Due diligence): folded, with progress on the right */
.nest { border-radius: 8px; background: var(--tint); }
.nest summary { display: flex; gap: 10px; align-items: center; padding: 8px 10px; cursor: pointer; font-weight: 700; list-style: none; }
.nest summary::-webkit-details-marker { display: none; }
.nest summary::before { content: "▸"; color: var(--teal-ink); transition: transform .15s; }
.nest[open] summary::before { transform: rotate(90deg); }
.nest summary.checked .t { color: var(--muted); }
.nest-body { padding: 0 10px 10px 30px; }
.nest-body .checklist label { background: var(--surface); }
.nest-body .link-btn { margin-top: 6px; }
.chip-btn.on { border-color: var(--teal); background: rgba(18,184,176,.12); }

/* HOUSES: when a client made offers on more than one house, each house gets a divider and a label;
   earlier houses are greyed out but still open and download as normal */
.house { padding-top: 10px; margin-top: 10px; border-top: 2px solid var(--edge); }
.house:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.house-head { display: block; margin-bottom: 8px; font: 600 var(--fs-label) "IBM Plex Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--teal-ink); }
.house.past { opacity: .55; transition: opacity .2s; }
.house.past:hover, .house.past:focus-within { opacity: 1; }
.house.past .house-head { color: var(--muted); }

/* RIGHT: the step's numbered document folder */
.folder-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.folder-head h2 { font-size: var(--fs-h3); margin: 2px 0 12px; }
.sort { font: 500 var(--fs-small) "Space Grotesk", sans-serif; color: var(--navy); background: var(--surface); border: 1px solid var(--input-edge); border-radius: 8px; padding: 4px 6px; }
.docs { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.doc { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; padding: 10px; border-radius: 10px;
  border: 1px solid var(--edge); background: var(--surface); cursor: pointer; text-align: left; width: 100%; font: inherit; color: inherit; }
.doc:hover { border-color: var(--teal); box-shadow: 0 4px 14px rgba(18,184,176,.15); }
.doc .ico { width: 34px; height: 40px; border-radius: 4px; border: 1px solid var(--edge); background: var(--tint); display: grid; place-items: center;
  font: 600 var(--fs-micro) "IBM Plex Mono", monospace; color: var(--muted); }
.doc .title { font-weight: 700; font-size: var(--fs-small); line-height: 1.3; display: block; }
.doc .meta { font-size: var(--fs-micro); font-family: "IBM Plex Mono", monospace; color: var(--muted); letter-spacing: .03em; }
.badge { display: inline-block; padding: 1px 6px; border-radius: 5px; margin-right: 6px; font: 600 var(--fs-micro) "IBM Plex Mono", monospace; letter-spacing: .04em; text-transform: uppercase; }
.badge.signed   { background: rgba(18,184,176,.16); color: var(--teal-ink); }
.badge.received { background: rgba(108,207,230,.2); color: var(--navy); }
.badge.upload   { background: rgba(245,166,35,.2); color: var(--tag-ink); }
.empty { padding: 18px 12px; text-align: center; border: 1px dashed var(--edge); border-radius: 10px; color: var(--muted); font-size: var(--fs-small); margin-bottom: 14px; }
.drop { display: block; padding: 16px; text-align: center; border: 2px dashed rgba(18,184,176,.5); border-radius: 10px; background: rgba(18,184,176,.06);
  font-size: var(--fs-small); cursor: pointer; }
.drop:hover, .drop.over { background: rgba(18,184,176,.14); }
.drop strong { color: var(--teal-ink); }
.drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.folder-actions { margin-top: 14px; }
.folder-actions .mono { display: block; margin-bottom: 6px; }
/* the three save options on one line, as one segmented bar */
.seg { display: flex; border: 2px solid var(--navy); border-radius: 10px; overflow: hidden; }
.seg button { flex: 1 1 0; min-width: 0; padding: 8px 6px; border: 0; background: var(--surface); color: var(--navy); cursor: pointer;
  font: 600 var(--fs-small) "Space Grotesk", sans-serif; white-space: nowrap; }
.seg button + button { border-left: 2px solid var(--navy); }
.seg button:first-child { background: var(--teal); color: #fff; }
.seg button:hover:not(:disabled) { background: rgba(18,184,176,.16); color: var(--navy); }
.seg button:disabled { color: var(--muted); cursor: not-allowed; }
.btn-sm { padding: 7px 14px; font-size: var(--fs-small); border-width: 2px; }

/* DOCUMENT POP-UP (modal) */
dialog { border: 1px solid var(--edge); border-radius: 16px; padding: 0; width: min(760px, 100% - 32px); max-height: calc(100vh - 48px);
  background: var(--bg); color: var(--navy); box-shadow: 0 24px 80px rgba(23,50,77,.35); }
dialog::backdrop { background: rgba(11,22,32,.5); backdrop-filter: blur(3px); }
.dlg-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; padding: 18px 22px 12px; border-bottom: 1px solid var(--edge); }
.dlg-head h2 { font-size: var(--fs-h3); margin: 4px 0 2px; }
.dlg-head .meta { font-size: var(--fs-small); color: var(--muted); margin: 0; }
.x { flex: none; width: 36px; height: 36px; border-radius: 8px; border: 1px solid var(--edge); background: var(--tint); color: var(--navy); font-size: 1.2rem; cursor: pointer; }
.dlg-body { padding: 18px 22px; overflow: auto; max-height: calc(100vh - 260px); }
.signed-note { margin: 0 0 14px; padding: 10px 12px; border-radius: 8px; background: rgba(18,184,176,.1); border: 1px solid rgba(18,184,176,.35); font-size: var(--fs-small); }
.paper { position: relative; overflow: hidden; background: #fff; color: #17324D; border: 1px solid rgba(23,50,77,.14); border-radius: 6px;
  padding: 36px 40px; min-height: 420px; box-shadow: 0 4px 16px rgba(23,50,77,.08); }
.paper::after { content: "SAMPLE · FAKE DATA"; position: absolute; inset: 0; display: grid; place-items: center; transform: rotate(-24deg);
  font: 700 2.4rem "IBM Plex Mono", monospace; color: rgba(231,111,81,.16); pointer-events: none; letter-spacing: .08em; white-space: nowrap; }
.paper h3 { margin-bottom: 4px; }
.paper .small { font-size: var(--fs-small); color: #4A6278; margin: 0 0 18px; }
.paper .line { height: 9px; border-radius: 4px; background: rgba(23,50,77,.1); margin: 10px 0; }
.paper .gap { height: 14px; }
.paper iframe, .paper img.file { width: 100%; min-height: 420px; border: 0; }
.dlg-foot { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; padding: 14px 22px 18px; border-top: 1px solid var(--edge); }
.dlg-foot .spacer { flex: 1; }
.dlg-foot label { font-size: var(--fs-small); color: var(--muted); display: flex; gap: 6px; align-items: center; }

/* TOAST: short messages ("in the real portal, this would…") */
.toast { position: fixed; left: 50%; bottom: 24px; transform: translateX(-50%) translateY(20px); opacity: 0; transition: .25s; z-index: 50;
  background: var(--navy); color: var(--bg); padding: 12px 18px; border-radius: 10px; max-width: min(520px, 100% - 32px); font-size: var(--fs-small); box-shadow: 0 10px 30px rgba(23,50,77,.3); }
.toast.show { opacity: 1; transform: translateX(-50%); }

/* ACCESS ENDED screen */
.ended { max-width: 560px; margin: 48px auto; padding: 32px; text-align: center; }

/* ADMIN */
.admin-tools { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.admin-tools input { font: inherit; padding: 9px 12px; border: 1px solid var(--input-edge); border-radius: 8px; background: var(--surface); color: var(--navy); min-width: 240px; }
.table-wrap { overflow-x: auto; padding: 6px 8px; }
table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); }
th { text-align: left; font: 600 var(--fs-label) "IBM Plex Mono", monospace; letter-spacing: .08em; text-transform: uppercase; color: var(--teal-ink); padding: 12px 10px; border-bottom: 1px solid var(--edge); white-space: nowrap; }
td { padding: 12px 10px; border-bottom: 1px dashed var(--edge); vertical-align: middle; }
tr:last-child td { border-bottom: 0; }
td .email { display: block; color: var(--muted); font-size: var(--fs-micro); font-family: "IBM Plex Mono", monospace; }
td select { font: inherit; padding: 6px 8px; border: 1px solid var(--input-edge); border-radius: 8px; background: var(--surface); color: var(--navy); }
.acc-active { border-color: var(--teal) !important; }
.acc-view   { border-color: var(--orange) !important; }
.acc-closed { border-color: var(--coral) !important; color: var(--muted) !important; }
.row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.link-btn { border: 1px solid var(--edge); background: var(--tint); color: var(--navy); border-radius: 8px; padding: 6px 10px; font: 500 var(--fs-small) "Space Grotesk", sans-serif; cursor: pointer; white-space: nowrap; text-decoration: none; }
.link-btn:hover { border-color: var(--teal); }
.legend { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0 56px; }
.legend .panel { padding: 16px 18px; font-size: var(--fs-small); color: var(--muted); }
.legend strong { color: var(--navy); display: block; margin-bottom: 2px; }
form.add { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
form.add label { font-size: var(--fs-small); font-weight: 500; display: grid; gap: 4px; }
form.add input, form.add select { font: inherit; padding: 10px 12px; border: 1px solid var(--input-edge); border-radius: 8px; background: var(--surface); color: var(--navy); }

/* WIDE SCREENS: the three columns keep one fixed height, so the page never jumps between steps;
   a column with more than fits scrolls inside its own box */
@media (min-width: 1081px) {
  .portal { height: max(560px, calc(100vh - 230px)); }
  .portal > .panel { max-height: 100%; overflow-y: auto; }
}
.checklist label:has(input:not(:disabled)) { cursor: pointer; }

/* NARROWER SCREENS */
@media (max-width: 1080px) {
  .portal { grid-template-columns: 220px minmax(0, 1fr); }
  .portal .folder { grid-column: 1 / -1; }
}
@media (max-width: 760px) {
  .portal { grid-template-columns: 1fr; }
  /* the path becomes a row of chips you can swipe sideways */
  .trail { display: flex; flex-direction: row; gap: 6px; overflow-x: auto; padding-bottom: 6px; }
  .trail::before { display: none; }
  .trail li { flex: 0 0 auto; width: auto; }
  .trail button { flex-direction: column; gap: 4px; width: auto; min-width: 74px; padding: 6px; text-align: center; font-size: var(--fs-micro); }
  .trail .state { display: none; }
  .who span.long, .who strong { display: none; }
  .legend, form.add { grid-template-columns: 1fr; }
  .paper { padding: 24px 20px; }
}

/* SAVE AS PDF / PRINT: only the open document prints */
@media print {
  body > *:not(dialog) { display: none !important; }
  dialog { position: static; box-shadow: none; border: 0; max-height: none; width: 100%; }
  .dlg-foot, .x { display: none; }
  .dlg-body { max-height: none; overflow: visible; }
}

/* "PICK ONE" SETS: pre-approvals, vendor quotes, offer versions */
.set { margin-bottom: 12px; padding: 8px; border: 1px dashed var(--edge); border-radius: 10px; }
.set .docs { margin-bottom: 0; }
.set-head { display: block; margin: 0 2px 6px; font: 600 var(--fs-micro) "IBM Plex Mono", monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.not-chosen { opacity: .55; transition: opacity .2s; }
.not-chosen:hover, .not-chosen:focus-within { opacity: 1; }
.badge.chosen { background: rgba(245,166,35,.25); color: var(--tag-ink); }

/* INTAKE FORM (step 1 short form) */
.form-link { margin-left: 6px; padding: 2px 8px; font-size: var(--fs-micro); vertical-align: 1px; }
.intake form { display: contents; }
.intake fieldset { border: 0; border-top: 1px solid var(--edge); margin: 0; padding: 14px 0 6px; }
.intake fieldset:first-child { border-top: 0; padding-top: 0; }
.intake legend { padding: 0 0 8px; }
.intake label { margin-bottom: 10px; }
.intake input:not([type=radio]):not([type=checkbox]), .intake select, .intake textarea { padding: 9px 11px; margin-top: 4px; }
.intake textarea { min-height: 0; }
.grid3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 0 12px; }
.q { margin-bottom: 12px; }
.ql { display: block; font-weight: 500; font-size: var(--fs-small); margin-bottom: 6px; }
.hint { margin: -4px 0 12px; font-size: var(--fs-micro); color: var(--muted); }
/* radio and check-box answers as tappable chips */
.opts { display: flex; flex-wrap: wrap; gap: 6px; }
.opts label { margin: 0; }
.opts input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opts span { display: inline-block; padding: 6px 12px; border: 1px solid var(--input-edge); border-radius: 999px; background: var(--surface); font-size: var(--fs-small); cursor: pointer; }
.opts input:checked + span { background: var(--teal); border-color: var(--teal); color: #fff; }
.opts input:focus-visible + span { outline: 2px solid var(--navy); outline-offset: 2px; }
.opts input:disabled + span { cursor: default; opacity: .7; }
[data-show][hidden], [data-hide][hidden] { display: none !important; }
.drop .upload-note { color: var(--draft-ink); font-size: var(--fs-micro); }

/* CARRY-OVER: unticked items from earlier steps */
.carry { background: rgba(245,166,35,.1); border: 1px solid rgba(245,166,35,.4); border-radius: 10px; padding: 6px 8px; }
.carry li { display: flex; align-items: center; gap: 8px; }
.carry li > label { flex: 1; min-width: 0; }
.na-btn { flex: none; padding: 2px 8px; font-size: var(--fs-micro); }
.reminder { margin: 0 0 12px; padding: 8px 12px; border-left: 3px solid var(--teal); background: rgba(18,184,176,.08); border-radius: 0 8px 8px 0; font-size: var(--fs-small); }

/* UPLOAD "ADD TO GROUP" and the owner's group controls */
#grp-new-wrap { margin-top: 12px; }
#grp-new-wrap[hidden] { display: none; }
.text-btn { border: 0; background: none; padding: 0 2px; color: var(--teal-ink); font: inherit; text-decoration: underline; cursor: pointer; text-transform: none; }
.add-group { display: block; margin: 0 0 12px; }
.dlg-foot select.sort { width: auto; }

/* THE LOOP: steps 3 and 4 share a tinted block in the left column, closed by a "repeat" note */
.trail li.loop { background: rgba(18,184,176,.07); border-left: 2px solid var(--teal); border-right: 2px solid var(--teal); }
.trail li.loop-first { border-top: 2px solid var(--teal); border-radius: 10px 10px 0 0; }
.trail li.loop-note { padding: 3px 8px 5px; border-bottom: 2px solid var(--teal); border-radius: 0 0 10px 10px; margin-bottom: 2px;
  font: 600 var(--fs-micro) "IBM Plex Mono", monospace; color: var(--teal-ink); }
.loop-tools { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; margin-bottom: 12px; font-size: var(--fs-small); }
.wants-flag { background: rgba(245,166,35,.2); border-color: var(--orange); font-weight: 700; }
.intake-fields label { margin-bottom: 10px; }
.intake-fields textarea { min-height: 0; margin-top: 4px; }
@media (max-width: 760px) {
  .trail li.loop { border: 0; background: none; }
  .trail li.loop-note { align-self: center; font-size: 1rem; padding: 0 2px; }
  .trail li.loop-note .long { display: none; }
}
/* TOUR ROUNDS */
.tour-homes { list-style: none; margin: 4px 0 8px; padding: 0; }
.tour-home { padding: 6px 0; border-bottom: 1px dashed var(--edge); font-size: var(--fs-small); }
.tour-home:last-child { border-bottom: 0; }
.tour-home .fb { display: flex; gap: 6px; margin: 6px 0; }
.tour-home .fb-note { min-height: 0; padding: 6px 10px; font-size: var(--fs-small); }
.tour-line { margin: 0 0 8px; }
.intake-fields input { padding: 9px 11px; margin-top: 4px; }
.reminders { margin-bottom: 12px; font-size: var(--fs-small); }
.reminders summary { cursor: pointer; font-weight: 600; color: var(--teal-ink); margin-bottom: 6px; }
.reminders .reminder { margin-bottom: 6px; }

/* DUE DILIGENCE END DATE: steps 6 and 7 */
.dd-banner { margin: 0 0 12px; padding: 8px 12px; border-left: 3px solid var(--orange); background: rgba(245,166,35,.12); border-radius: 0 8px 8px 0; font-size: var(--fs-small); }
.dd-banner label { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 0 8px; font-size: var(--fs-micro); }
.dd-banner input { width: auto; padding: 3px 6px; }

/* WHAT YOU'RE GETTING: concessions negotiated, prominent and additive */
.getting { margin: 0 0 14px; padding: 12px 14px; border: 2px solid var(--teal); border-radius: 12px; background: rgba(18,184,176,.1); }
.getting summary { cursor: pointer; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.getting-total { font-size: var(--fs-h3); font-weight: 700; color: var(--teal-ink); }
.getting summary .mono { flex-basis: 100%; }
.getting ul { list-style: none; margin: 10px 0 0; padding: 0; }
.getting li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; padding: 5px 0; border-top: 1px dashed var(--edge); font-size: var(--fs-small); }
.getting .what { flex: 1 1 180px; font-weight: 600; }
.getting .kind { font-size: var(--fs-micro); color: var(--muted); }
.getting .val { font-weight: 700; min-width: 56px; text-align: right; }
.getting li.changed .what { font-weight: 400; color: var(--muted); text-decoration: line-through; }
.con-tools { font-size: var(--fs-micro); }
.con-add { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.con-add input { flex: 1 1 120px; width: auto; padding: 6px 10px; }
.con-add select { width: auto; }

/* SUBMIT / REFRESH, under the left column */
.submit-refresh { display: block; width: 100%; margin-top: 14px; padding: 10px 8px; white-space: nowrap; }
/* STAR RATINGS, and homes marked No: out of focus */
.fb .star { border: 0; background: none; padding: 0 2px; font-size: 1.4rem; line-height: 1; color: var(--orange); cursor: pointer; }
.fb .star:disabled { cursor: default; }
.fb .chip-btn { margin-right: 8px; }
.tour-home.struck > strong, .set.struck .set-head, tr.struck td:first-child { text-decoration: line-through; }
.tour-home.struck, .set.struck, tr.struck { opacity: .5; }
.tours-table .rating { color: var(--orange); white-space: nowrap; }
.virtual-pick { display: flex; align-items: center; gap: 8px; margin: 10px 0; }
.virtual-pick input { width: auto; }
/* ALL MY TOURS */
dialog.tours { max-width: min(960px, calc(100vw - 32px)); width: 100%; }
.tours-scroll { overflow-x: auto; }
.tours-table { width: 100%; border-collapse: collapse; font-size: var(--fs-small); text-align: left; }
.tours-table th, .tours-table td { padding: 6px 8px; border-bottom: 1px solid var(--edge); vertical-align: top; }
/* OWNER-ADDED CHIPS: step 9 */
.chip-add { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 8px; }
.chip-add input { flex: 1 1 220px; width: auto; padding: 6px 10px; }
.chip-add select { width: auto; }
#submit-close[hidden] { display: none; }