/* Account area — reuses the ordering page's tokens and controls. */
.tb-link{color:#fff;text-decoration:none;font-size:.85rem;font-weight:700;opacity:.85;
  border:1px solid rgba(255,255,255,.28);padding:7px 14px;border-radius:100px}
.tb-link:hover{opacity:1;background:rgba(255,255,255,.1)}

.acct{max-width:760px;margin:0 auto;padding:26px clamp(14px,4vw,32px) 70px}
.acct-hero{margin-bottom:20px}
.acct-hero.row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.acct-hero h1{font-size:clamp(1.5rem,4vw,2rem)}
.acct-hero p{margin:6px 0 0;color:var(--ink-70)}
.muted{color:var(--ink-45)}
.acct-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;
  padding:22px;box-shadow:var(--sh);margin-bottom:16px}

.authtabs,.acct-tabs{display:flex;gap:6px;margin-bottom:18px;background:var(--bg);
  border:1px solid var(--line);border-radius:100px;padding:4px}
.authtabs button,.acct-tabs button{flex:1;border:none;background:none;padding:9px;border-radius:100px;
  cursor:pointer;font-weight:700;font-size:.87rem;color:var(--ink-45)}
.authtabs button.on,.acct-tabs button.on{background:var(--ink);color:#fff}
.acct-tabs{max-width:420px}

.moreaddr{margin:4px 0 14px}
.moreaddr summary{cursor:pointer;font-size:.85rem;font-weight:700;color:var(--ink-70);padding:6px 0}
.ok{background:#e6f5ec;border:1px solid #b6dfc7;color:#1d6b45;padding:10px 13px;border-radius:11px;font-size:.86rem}
.btn-ghost.small{width:auto;margin:0;padding:9px 18px;font-size:.85rem}
.acct-note{text-align:center;color:var(--ink-45);font-size:.88rem}
.acct-note a{color:var(--chili);font-weight:700}

/* --------------------------- order history ---------------------------- */
.ocard{background:var(--paper);border:1px solid var(--line);border-radius:16px;
  padding:16px 18px;margin-bottom:12px;box-shadow:var(--sh)}
.ocard-hd{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;flex-wrap:wrap}
.ocard-no{font-weight:800}
.ocard-date{font-size:.8rem;color:var(--ink-45)}
.ocard-items{font-size:.86rem;color:var(--ink-70);margin:0 0 10px;line-height:1.6}
.ocard-ft{display:flex;justify-content:space-between;align-items:center;gap:10px;
  border-top:1px solid var(--line);padding-top:10px;flex-wrap:wrap}
.ocard-total{font-weight:800}
.badge{display:inline-block;font-size:.7rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.05em;padding:4px 10px;border-radius:100px}
.b-new,.b-preparing{background:#fff2d9;color:#b8770f}
.b-ready,.b-out_for_delivery{background:#e2edfa;color:#2563b0}
.b-delivered{background:#e6f5ec;color:#2e7d51}
.b-cancelled{background:#eee;color:var(--ink-45)}
.b-paid{background:#e6f5ec;color:#2e7d51}
.b-unpaid{background:#fff2d9;color:#b8770f}

/* progress rail for a live order */
.track{display:flex;align-items:center;gap:0;margin:12px 0 4px}
.track-step{flex:1;text-align:center;position:relative;font-size:.68rem;color:var(--ink-45);font-weight:700}
.track-step::before{content:"";display:block;width:14px;height:14px;border-radius:50%;
  background:var(--line);margin:0 auto 6px;position:relative;z-index:1}
.track-step::after{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:var(--line);z-index:0}
.track-step:first-child::after{display:none}
.track-step.done{color:var(--green)}
.track-step.done::before{background:var(--green)}
.track-step.done::after{background:var(--green)}
.empty-orders{text-align:center;padding:44px 20px;color:var(--ink-45)}
.empty-orders span{display:block;font-size:2.2rem;margin-bottom:10px;opacity:.5}
@media (max-width:520px){ .acct-hero.row{flex-direction:column} }