/* Shared Watchlist proposal and owner inbox use the app's existing theme. */
#shared-watchlist .c { position:relative; }
#shared-watchlist .shared-proposal-check { display:inline-flex; align-items:center; gap:6px; min-height:44px; cursor:pointer; font-size:14px; }
#shared-watchlist .c > .shared-proposal-check { position:absolute; z-index:4; inset:0; align-items:flex-start; padding:8px; border-radius:10px; }
#shared-watchlist .c > .shared-proposal-check input { flex:none; margin:0; box-shadow:0 0 0 4px var(--bg-2); }
#shared-watchlist .c > .shared-proposal-check > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
#shared-watchlist .c:has([data-proposal-key]:checked) { outline:2px solid var(--accent); outline-offset:-2px; background:var(--selected); }
#shared-watchlist .c:has([data-proposal-key]:focus-visible) { outline:3px solid var(--focus); outline-offset:2px; }
#shared-watchlist .c:has([data-proposal-key]:disabled) > .shared-proposal-check { cursor:not-allowed; }
#shared-watchlist .c:has([data-proposal-key=""]) > .shared-proposal-check > span { position:static; width:auto; height:auto; clip-path:none; background:var(--bg-2); font-size:12px; }
#sharedProposal #proposalReview { scroll-margin-top:calc(var(--shell-header-height,120px) + 12px); }
#sharedProposal #proposalReview:not([open]) > summary { display:none; }
#sharedProposal[data-selected="false"] .proposal-summary > :not(#proposalStatus) { display:none; }
#sharedProposal[data-selected="true"] .proposal-summary { position:fixed; z-index:40; bottom:calc(8px + env(safe-area-inset-bottom, 0px)); left:max(12px, env(safe-area-inset-left, 0px)); right:max(12px, env(safe-area-inset-right, 0px)); width:auto; max-width:1100px; margin-inline:auto; padding:10px; background:var(--bg-2); border:1px solid var(--control-line); border-radius:12px; box-shadow:0 6px 28px #0007; }
#sharedProposal .proposal-summary #proposalStatus:not(:empty) { flex-basis:100%; margin:0; }
#sharedProposal #proposalOpenReview { background:var(--action); color:var(--on-action); }
@media screen { #shared-watchlist:has(#sharedProposal[data-selected="true"]:not([hidden])) { padding-bottom:190px; } }
#sharedProposal { margin:12px 0; padding:12px; border:1px solid var(--line,#334664); border-radius:12px; background:var(--bg-2,#19253b); color:var(--ink,#edf2ff); }
#sharedProposal[hidden] { display:none; }
.proposal-summary { display:flex; align-items:center; flex-wrap:wrap; gap:8px 16px; }
.proposal-summary > span,.proposal-privacy { font-size:12px; color:var(--ink-2,#b7c4da); }
.proposal-totals { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; margin-left:auto; }
.proposal-totals button { display:flex; align-items:center; justify-content:center; text-align:center; min-width:0; overflow-wrap:anywhere; gap:12px; min-height:44px; padding:6px 10px; color:inherit; background:transparent; border:1px solid var(--line,#334664); border-radius:8px; font-size:14px; }
#sharedProposal .proposal-totals button.is-active { background:var(--action,#3b65df); color:#fff; border-color:transparent; }
.proposal-tools { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin:8px 0; font-size:12px; }
#sharedProposal button:not([data-proposal-rate]) { min-height:44px; padding:6px 12px; border:1px solid var(--line,#334664); border-radius:8px; background:transparent; color:inherit; font-size:14px; font-weight:600; }
#sharedProposal #proposalSend { background:var(--action,#3b65df); color:#fff; }
#sharedProposal summary { min-height:44px; display:flex; align-items:center; cursor:pointer; font-size:14px; font-weight:600; }
#sharedProposal summary::before { content:'›'; margin-right:8px; }
#sharedProposal details[open] > summary::before { transform:rotate(90deg); }
#sharedProposal p { margin:8px 0; font-size:14px; }
#sharedProposal #proposalStatus:empty { display:none; }
#sharedProposal fieldset { border:0; padding:0; margin:0; min-width:0; }
.proposal-contact { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
#sharedProposal label { display:grid; gap:4px; margin:6px 0; font-size:14px; }
#sharedProposal input,#sharedProposal textarea { box-sizing:border-box; width:100%; min-width:0; min-height:44px; font:inherit; font-size:16px; color:inherit; background:var(--bg,#101a2d); border:1px solid var(--line,#334664); border-radius:8px; padding:8px 10px; }
#proposalReviewCards { max-height:220px; overflow:auto; }
.proposal-rows { border:1px solid var(--line,#334664); border-radius:12px; overflow:hidden; }
.proposal-row { display:flex; align-items:center; gap:10px; min-height:64px; padding:6px 12px; border-bottom:1px solid var(--line,#334664); cursor:pointer; color:var(--ink,#edf2ff); background:var(--bg-2,#19253b); }
.proposal-row:last-child { border-bottom:0; }
.proposal-row.is-selected { background:var(--bg-3,#22324d); box-shadow:inset 3px 0 var(--action,#3b65df); }
.proposal-row input { width:20px; height:20px; flex:none; margin:12px; accent-color:var(--action,#3b65df); }
.proposal-thumb { width:34px; height:48px; flex:none; overflow:hidden; border-radius:3px; }
.proposal-thumb img { width:34px; height:48px; object-fit:contain; }
.proposal-card-copy { display:grid; gap:4px; min-width:0; font-size:14px; }
.proposal-card-copy small { font-size:12px; color:var(--ink-2,#b7c4da); overflow-wrap:anywhere; }
.proposal-row-price { margin-left:auto; white-space:nowrap; font-size:14px; font-variant-numeric:tabular-nums; }
.watch-proposal-item { padding:14px 0; border-top:1px solid var(--line,#334664); overflow-wrap:anywhere; }
.watch-proposal-item header { display:flex; justify-content:space-between; gap:12px; }
.watch-proposal-item p { margin:6px 0; white-space:pre-wrap; }
.watch-proposal-item small { font-size:12px; color:var(--ink-2,#b7c4da); }
.watch-proposal-totals { display:flex; flex-wrap:wrap; gap:8px 20px; font-variant-numeric:tabular-nums; font-size:14px; }
.watch-proposal-item details { margin-top:8px; }
.watch-proposal-item summary { cursor:pointer; min-height:44px; align-content:center; }
.watch-proposal-cards { max-height:300px; overflow:auto; }
.watch-proposal-cards p { font-size:14px; }
@media(max-width:700px) {
  #shared-watchlist #sharedViewSwitch { display:grid; grid-template-columns:1fr 1fr; width:100%; min-width:0; }
  #shared-watchlist #sharedViewSwitch button { white-space:normal; }
  .proposal-totals { width:100%; margin-left:0; }
  .proposal-totals button { flex-direction:column; gap:2px; padding:6px 3px; }
  .proposal-contact { grid-template-columns:1fr; gap:0; }
  .proposal-row { gap:6px; padding:6px; }
  .proposal-row input { margin:10px 6px; }
  .proposal-row-price { font-size:12px; }
}
@media print { #sharedProposal,.proposal-rows { display:none !important; } }
.proposal-notification:not([hidden]) { position:fixed; z-index:90; right:16px; bottom:calc(76px + env(safe-area-inset-bottom)); max-width:calc(100vw - 32px); min-height:44px; padding:8px 14px; border:1px solid var(--accent); background:var(--action); color:var(--on-action); border-radius:10px; font-size:14px; line-height:1.4; white-space:normal; box-shadow:0 4px 16px #0004; }
@media print { .proposal-notification { display:none !important; } }
/* Owner replies (accept / counter offer / decline) and the guest's reply panel. */
.watch-proposal-reply { margin-top:10px; padding:10px 12px; border:1px solid var(--line,#334664); border-radius:10px; background:var(--bg,#101a2d); }
.watch-proposal-reply-status { margin:0 0 8px; font-size:14px; }
.watch-proposal-reply-message { color:var(--ink-2,#b7c4da); }
.watch-proposal-actions { display:flex; flex-wrap:wrap; gap:8px; }
.watch-proposal-actions .btn { min-height:40px; }
.watch-proposal-reply-form { display:grid; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--line,#334664); }
.watch-proposal-reply-form label { display:grid; gap:4px; font-size:13px; }
.watch-proposal-reply-form textarea,.watch-proposal-reply-form input { box-sizing:border-box; width:100%; min-height:40px; font:inherit; font-size:16px; color:inherit; background:var(--bg-2,#19253b); border:1px solid var(--line,#334664); border-radius:8px; padding:8px 10px; }
.watch-proposal-rates { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.watch-proposal-rates .btn { display:flex; flex-direction:column; gap:2px; min-height:44px; padding:6px 4px; font-size:13px; }
.watch-proposal-rates .btn[aria-pressed="true"] { background:var(--action,#3b65df); color:#fff; border-color:transparent; }
.watch-proposal-custom { grid-column:1 / -1; }
.watch-proposal-reply-note { margin:0; font-size:12px; color:var(--ink-2,#b7c4da); }
.watch-proposal-reply-form > div { display:flex; gap:8px; flex-wrap:wrap; }
.watch-proposal-item[data-proposal-status="accepted"] .watch-proposal-reply { border-color:var(--accent,#5fd18a); }
.watch-proposal-item[data-proposal-status="declined"] .watch-proposal-reply { opacity:.85; }
.shared-proposal-replies { margin:12px 0; padding:12px; border:1px solid var(--line,#334664); border-radius:12px; background:var(--bg-2,#19253b); color:var(--ink,#edf2ff); }
.shared-proposal-replies[hidden] { display:none; }
.shared-proposal-replies h2 { margin:0 0 8px; font-size:15px; }
.shared-proposal-reply { padding:8px 0; border-top:1px solid var(--line,#334664); }
.shared-proposal-reply header { display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap; font-size:14px; }
.shared-proposal-reply header small { font-size:12px; color:var(--ink-2,#b7c4da); }
.shared-proposal-reply p { margin:6px 0 0; font-size:14px; }
.shared-proposal-reply-message { color:var(--ink-2,#b7c4da); }
.shared-proposal-reply[data-reply-status="accepted"] header strong { color:var(--accent,#5fd18a); }
.shared-proposal-reply[data-reply-status="countered"] header strong { color:var(--warn,#f2c14e); }
/* Money, contact handles and card names can be much wider than the demo data.
   Allow their own rows to grow instead of clipping them behind adjacent CTAs. */
@media screen {
  .proposal-summary > *, .proposal-totals > *, .proposal-contact > *, .watch-proposal-rates > * { min-width:0; max-width:100%; }
  .proposal-summary, .proposal-tools, .proposal-card-copy, .watch-proposal-item, .shared-proposal-reply { overflow-wrap:anywhere; }
  #proposalReviewCards > p { min-width:0; overflow-wrap:anywhere; }
  .proposal-totals { flex:1 1 30rem; margin-left:0; grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
  .proposal-totals button { flex-wrap:wrap; gap:2px 8px; height:auto; white-space:normal; line-height:1.35; }
  .proposal-totals button strong { max-width:100%; font-variant-numeric:tabular-nums; }
  #sharedProposal[data-selected="true"] .proposal-summary { max-height:45dvh; overflow-y:auto; overscroll-behavior:contain; }
  #shared-watchlist:has(#sharedProposal[data-selected="true"]:not([hidden])) { padding-bottom:max(190px,calc(45dvh + 24px + env(safe-area-inset-bottom,0px))); }
  #sharedProposal :is(button,summary), .watch-proposal-actions .btn, .watch-proposal-reply-form .btn { height:auto; min-height:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; line-height:1.35; }
  .proposal-contact { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .proposal-row { display:grid; grid-template-columns:44px 34px minmax(0,1fr) auto; }
  .proposal-row input { margin:12px; }
  .proposal-row-price { max-width:100%; }
  .watch-proposal-item header { flex-wrap:wrap; }
  .watch-proposal-item header > * { min-width:0; max-width:100%; }
  .watch-proposal-item header > span { font-variant-numeric:tabular-nums; }
  .watch-proposal-reply-form :is(label,input,textarea) { min-width:0; max-width:100%; }
  .watch-proposal-reply-form :is(input,textarea) { min-height:44px; }
  .watch-proposal-rates { grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr)); }
  .watch-proposal-reply-form > .watch-proposal-rates { display:grid; }
  .watch-proposal-rates .btn { align-items:center; text-align:center; }
  .watch-proposal-rates .btn strong { max-width:100%; font-variant-numeric:tabular-nums; }
}
@media screen and (max-width:700px) {
  .proposal-contact { grid-template-columns:minmax(0,1fr); }
  .proposal-row { grid-template-columns:44px 34px minmax(0,1fr); gap:4px 6px; }
  .proposal-row > input, .proposal-row > .proposal-thumb { grid-row:1 / span 2; }
  .proposal-row-price { grid-column:3; justify-self:start; margin-left:0; white-space:normal; overflow-wrap:anywhere; }
}
@media print { .shared-proposal-replies { display:none !important; } }
