/* Buyer accounts: the page where the seller's own logins at the shops they buy from are set up, and the small "bought with ..." lines on the Orders page. */
.by-tabs{display:flex;gap:6px;margin:0 0 14px;padding:4px;border-radius:11px;background:var(--pc-e7ebf3,#e7ebf3);width:max-content;max-width:100%}
.by-tabs button{border:0;background:none;padding:7px 14px;border-radius:8px;font-weight:600;color:var(--muted)}
.by-tabs button.on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(var(--pcr-14-16-20,14,16,20),.14)}
.by-tabs small{font-weight:500;opacity:.75}
.by-warn{margin-bottom:14px}
.by-line input[type=checkbox],.by-mode input[type=radio],.by-line input[type=radio]{width:auto;flex:none}
.by-h{margin:22px 0 10px;font-size:17px}
.by-grid{margin-top:14px;gap:14px}
.grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){.grid.g3{grid-template-columns:minmax(0,1fr)}}
.by-line{display:flex;gap:10px;align-items:flex-start;margin:0;text-transform:none;letter-spacing:0;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer}
.by-line input{margin-top:3px}
.by-line b{font-weight:650}
.by-line small{display:block;font-size:12.5px;color:var(--muted);font-weight:400;margin-top:2px}
.by-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0 8px}
@media (max-width:900px){.by-modes{grid-template-columns:minmax(0,1fr)}}
.by-mode{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border:1px solid var(--line);border-radius:11px;text-transform:none;letter-spacing:0;font-size:14px;font-weight:500;color:var(--ink);cursor:pointer;margin:0;background:#fff}
.by-mode.on{border-color:var(--brand);background:var(--brand-wash)}
.by-mode input{margin-top:3px}
.by-mode b{display:block;font-weight:650}
.by-mode small{display:block;font-size:12.5px;color:var(--muted);font-weight:400;margin-top:3px}
.by-ack{margin:6px 0 4px;padding:10px 14px;border-radius:10px;background:var(--amber-wash)}
.by-checks{display:grid;gap:10px;margin-top:14px}
.by-acct{padding:0}
.by-acct.off{opacity:.65}
.by-acct-top{display:flex;gap:14px;align-items:center;padding:14px 16px 0}
.by-name{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.by-label{font-weight:650;font-size:15.5px;border-color:transparent;background:transparent;padding:3px 6px;margin-left:-6px;max-width:320px}
.by-label:hover,.by-label:focus{border-color:var(--line);background:#fff}
.by-today{text-align:right;display:flex;flex-direction:column;line-height:1.15}
.by-today b{font-size:22px}
.by-acct .by-grid,.by-acct .by-actions{padding:0 16px}
.by-actions{padding-bottom:14px!important;margin-top:12px}
.by-actions .grow{flex:1}
.by-flags{display:grid;gap:8px;align-content:end}
.by-table{width:100%;border-collapse:collapse;font-size:13.5px}
.by-table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);padding:9px 12px;border-bottom:1px solid var(--line)}
.by-table td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.by-steps{margin:0 0 6px;padding-left:20px;display:grid;gap:8px}
.by-help summary{cursor:pointer;padding:12px 16px}
.hidden{display:none!important}

/* the Orders page: what bought an order, and the button to buy one */
.buy-box{margin:12px 0 0;padding:11px 13px;border-radius:10px;background:var(--brand-wash);color:var(--pc-16276e,#16276e);font-size:13.5px}
.buy-box.good{background:var(--green-wash);color:var(--green)}
.buy-box.warn{background:var(--amber-wash);color:var(--amber)}
.buy-box.bad{background:var(--red-wash);color:var(--red)}
.buy-box b{font-weight:650}
.buy-box .row{margin-top:8px}
.buy-box small{display:block;font-weight:400;opacity:.85;margin-top:2px}
.ord-bought{white-space:nowrap}

/* the tracking page card, and the delivery photo waiting for a decision */
.ph-box{display:flex;gap:14px;align-items:flex-start;margin-top:10px;padding:10px;border-radius:10px;background:var(--surface,#fff);border:1px solid var(--line,var(--pc-e2e6ee,#e2e6ee))}
.ph-box img{width:150px;max-height:150px;object-fit:cover;border-radius:8px;flex:none;background:var(--pc-eef1f6,#eef1f6)}
.ph-box small{display:block;margin:4px 0 8px}
@media (max-width:620px){.ph-box{flex-direction:column}.ph-box img{width:100%;max-height:220px}}

/* ---- the "what works and what does not" board ---- */
.by-gift label { display: block; font-weight: 600; margin-bottom: 4px; }

/* ---- the Tracking page: one card per order, the parcel's four steps, one clear button ---- */
.tp-list { border-top: 1px solid var(--line); }
.tp-row { display: grid; grid-template-columns: minmax(180px, 1.1fr) minmax(280px, 1.6fr) minmax(170px, auto); gap: 18px; padding: 16px 18px; border-bottom: 1px solid var(--line); align-items: start; }
.tp-row:last-child { border-bottom: 0; }
.tp-item b { display: block; line-height: 1.35; }
.tp-item.has-ph { display: flex; gap: 14px; align-items: flex-start; }
.tp-it { min-width: 0; flex: 1; }
.tp-ph { position: relative; flex: none; width: 84px; height: 84px; padding: 0; border: 2px dashed var(--accent, var(--pc-6d5efc,#6d5efc)); border-radius: 12px; overflow: hidden; cursor: zoom-in; background: var(--pc-eef1f6,#eef1f6); display: block; }
.tp-ph.on { border: 2px solid #22a06b; }
.tp-ph img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tp-phtag { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 4px; font-weight: 700; font-size: 10px; line-height: 1.3; letter-spacing: .03em; text-align: center; color: #fff; background: rgba(var(--pcr-15-18-30,15,18,30),.72); }
.tp-phc { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.tp-phc small { max-width: 46ch; }
.tp-lightbox { position: fixed; inset: 0; z-index: 10000; background: rgba(var(--pcr-10-14-28,10,14,28),.78); display: grid; place-items: center; padding: 24px; cursor: zoom-out; }
.tp-lbbox { position: relative; max-width: min(94vw, 980px); max-height: 92vh; display: flex; flex-direction: column; align-items: center; gap: 10px; cursor: default; }
.tp-lbbox img { max-width: 100%; max-height: 82vh; border-radius: 12px; background: #fff; display: block; }
.tp-steps { list-style: none; margin: 0 0 8px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.tp-steps li { position: relative; padding-top: 10px; font-size: 11.5px; letter-spacing: .02em; color: var(--muted); }
.tp-steps li i { position: absolute; top: 0; left: 0; right: 0; height: 4px; border-radius: 4px; background: var(--line); }
.tp-steps li.done i { background: #22a06b; }
.tp-steps li.now i { background: var(--accent, var(--pc-6d5efc,#6d5efc)); }
.tp-steps li.done, .tp-steps li.now { color: var(--ink); }
.tp-steps li.now { font-weight: 700; }
.tp-line { font-weight: 600; margin-bottom: 2px; }
.tp-act { display: flex; flex-direction: column; align-items: stretch; gap: 8px; }
.tp-act .primary { align-self: flex-start; }
.tp-view { font-size: 12.5px; }
.tp-hand summary { cursor: pointer; font-size: 12.5px; color: var(--muted); }
.tp-hand select { max-width: 150px; }
@media (max-width: 900px) { .tp-row { grid-template-columns: 1fr; gap: 10px; } }

.by-h3{margin:22px 0 4px;font-size:15px}