.sync-status-pill{min-height:44px;padding:0 10px;display:inline-flex;align-items:center;gap:7px;border:1px solid #bae6fd;border-radius:999px;background:#f0f9ff;color:#075985;font:inherit;font-size:.78rem;font-weight:800;white-space:nowrap;cursor:pointer}
.sync-status-pill>span:first-child{width:9px;height:9px;border-radius:50%;background:#64748b;flex:0 0 auto}
.sync-status-pill[data-sync-state="synced"]{background:#ecfdf5;border-color:#bbf7d0;color:#166534}
.sync-status-pill[data-sync-state="synced"]>span:first-child{background:#22c55e}
.sync-status-pill[data-sync-state="pending"],.sync-status-pill[data-sync-state="syncing"]{background:#eff6ff;border-color:#bfdbfe;color:#1d4ed8}
.sync-status-pill[data-sync-state="pending"]>span:first-child,.sync-status-pill[data-sync-state="syncing"]>span:first-child{background:#3b82f6}
.sync-status-pill[data-sync-state="offline"],.sync-status-pill[data-sync-state="conflict"],.sync-status-pill[data-sync-state="error"]{background:#fff7ed;border-color:#fed7aa;color:#9a3412}
.sync-status-pill[data-sync-state="offline"]>span:first-child,.sync-status-pill[data-sync-state="conflict"]>span:first-child,.sync-status-pill[data-sync-state="error"]>span:first-child{background:#f97316}
.sync-status-pill:active{filter:brightness(.95)}
.itinerary-sync-box{margin:10px 0;padding:10px;border:1px solid #dbeaf0;border-radius:10px;background:#fff}
.itinerary-sync-box h4{margin:0 0 5px;color:#075985;font-size:.84rem}
.itinerary-sync-box>p,.itinerary-conflict p,.itinerary-recovery p{margin:0;color:#526575;font-size:.78rem;line-height:1.5}
.itinerary-conflict,.itinerary-recovery-details{margin-top:8px;padding:9px;border:1px solid #fed7aa;border-radius:9px;background:#fff7ed}
.itinerary-conflict .family-code-actions{margin-top:8px}
.itinerary-conflict .family-code-actions button,.itinerary-recovery-details button{min-height:46px;white-space:normal}
.itinerary-recovery-toggle{width:100%;min-height:46px;margin-top:8px;text-align:left;white-space:normal}
.itinerary-recovery-details{border-color:#bbf7d0;background:#f0fdf4}
.itinerary-recovery-details button{display:block;width:100%;margin-top:8px}
.sync-status-pill:focus-visible,.itinerary-conflict button:focus-visible,.itinerary-recovery button:focus-visible{outline:3px solid #111;outline-offset:2px}
/* Kept itinerary copies (#10 item 2): a short list, newest first, the time in bold and one large restore button each. */
@media(min-width:1001px),(min-width:761px) and (min-height:601px){
  .itinerary-recovery-list{margin:8px 0 0;padding:0;list-style:none}
  .itinerary-recovery-list li+li{margin-top:10px;padding-top:10px;border-top:1px solid #bbf7d0}
  .itinerary-recovery-list li p{color:#14532d;font-size:.84rem}
  .itinerary-recovery .itinerary-copy-diff{margin-top:2px;color:#334155;font-size:.8rem;font-weight:700}
  .itinerary-default-recovery{margin-top:16px;padding:10px;border:2px solid #86efac;border-radius:10px;background:#fff}
  .itinerary-default-recovery h5{margin:0 0 4px;color:#14532d;font-size:.9rem}
  .itinerary-restore-confirm{margin-top:8px;padding:10px;border:2px solid #f59e0b;border-radius:10px;background:#fffbeb}
  .itinerary-recovery .itinerary-restore-confirm p{color:#78350f;font-size:.86rem;font-weight:700}
}
@media(max-width:760px),(max-width:1000px) and (max-height:600px){
  .itinerary-recovery-list{margin:8px 0 0;padding:0;list-style:none}
  .itinerary-recovery-list li+li{margin-top:12px;padding-top:12px;border-top:1px solid #bbf7d0}
  .itinerary-recovery-list li p{color:#14532d;font-size:1rem;line-height:1.45}
  .itinerary-recovery-list li button{min-height:52px;font-size:1rem}
  .itinerary-recovery .itinerary-copy-diff{margin-top:2px;color:#334155;font-size:.95rem;font-weight:700}
  .itinerary-default-recovery{margin-top:18px;padding:12px;border:2px solid #86efac;border-radius:12px;background:#fff}
  .itinerary-default-recovery h5{margin:0 0 6px;color:#14532d;font-size:1.05rem}
  .itinerary-recovery .itinerary-default-recovery p{color:#14532d;font-size:1rem;line-height:1.45}
  .itinerary-default-recovery button,.itinerary-restore-confirm button{min-height:52px;font-size:1rem}
  .itinerary-restore-confirm{margin-top:10px;padding:12px;border:2px solid #f59e0b;border-radius:12px;background:#fffbeb}
  .itinerary-recovery .itinerary-restore-confirm p{color:#78350f;font-size:1rem;font-weight:700;line-height:1.5}
  .sync-status-pill{min-height:42px;padding:0 8px;font-size:.72rem}
  .itinerary-conflict .family-code-actions{display:grid;grid-template-columns:1fr}
  .itinerary-conflict .family-code-actions button{width:100%}
}