/* ===========================================================
   Account value 1 (docs/specs/account-value-1.md): пропозиція акаунта, «My lounge», шляхи.
   Спершу телефон: кнопки ≥ 44 px, без стрибків макета.
   =========================================================== */

/* ---------- Пропозиція акаунта (CTA) ---------- */
.ml-cta{
  margin-top:.8rem; padding:.85rem 1rem; border:1px solid var(--line); border-radius:12px;
  background:var(--panel); font-family:var(--font-sans); font-size:.92rem; line-height:1.5;
}
.ml-cta[hidden]{ display:none; }
.ml-cta-text{ margin:0 0 .7rem; color:var(--parchment); }
.ml-cta-actions{ display:flex; flex-wrap:wrap; gap:.5rem; margin:0; }
.ml-cta-btn{
  min-height:44px; padding:.45rem 1rem; border:1px solid var(--line); border-radius:999px;
  background:transparent; color:var(--parchment); font-size:.9rem;
}
.ml-cta-btn:hover{ border-color:var(--brass); }
.ml-cta-primary{ background:var(--brass); border-color:var(--brass); color:var(--ink); }
.ml-cta-primary:hover{ color:var(--ink); filter:brightness(1.08); }
.ml-cta-dismiss{ color:var(--muted); border-color:transparent; }

/* ---------- Три вигоди над формою реєстрації ---------- */
.acct-benefits{ list-style:none; margin:0 0 1.2rem; padding:0; font-size:.9rem; color:var(--parchment); }
.acct-benefits li{ position:relative; padding:.15rem 0 .15rem 1.3rem; }
.acct-benefits li::before{ content:"✓"; position:absolute; left:0; color:var(--brass); }

/* ---------- Сторінки «My lounge» ---------- */
.acct-tabs{ display:flex; gap:.4rem; margin:0 0 1.4rem; padding:0; list-style:none; overflow-x:auto; }
.acct-tabs a{
  display:inline-flex; align-items:center; min-height:44px; padding:.4rem 1rem; border:1px solid var(--line);
  border-radius:999px; color:var(--muted); text-decoration:none; white-space:nowrap; font-size:.92rem;
}
.acct-tabs a:hover{ color:var(--parchment); border-color:var(--brass); }
.acct-tabs a.is-active{ color:var(--parchment); border-color:var(--brass); background:rgba(193,144,63,.14); }

.acct-card{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:1rem 1.15rem; margin-bottom:1rem; }
.acct-card h2{ font-size:1.15rem; margin:0 0 .35rem; }
.acct-card h2 a{ color:var(--parchment); text-decoration:none; }
.acct-card h2 a:hover{ text-decoration:underline; }
.acct-meta{ display:flex; flex-wrap:wrap; gap:.3rem .8rem; color:var(--muted); font-size:.82rem; margin-bottom:.35rem; }
.acct-note{ color:var(--muted); font-style:italic; margin:.4rem 0 0; font-size:.92rem; overflow-wrap:anywhere; }
.acct-gone{ opacity:.65; }
.acct-actions{ display:flex; flex-wrap:wrap; gap:.6rem; align-items:center; margin-top:.6rem; }
.acct-linkbtn{
  min-height:44px; padding:.3rem .2rem; background:none; border:0; color:var(--muted); text-decoration:underline;
  font-size:.88rem;
}
.acct-linkbtn:hover{ color:var(--parchment); }
.acct-empty{ color:var(--muted); }
.acct-rating{ font-size:2.4rem; font-family:var(--font-display); line-height:1.1; margin:.1rem 0 .3rem; }

/* ---------- Шляхи ---------- */
.path-steps{ list-style:none; margin:0; padding:0; }
.path-step{
  display:flex; align-items:flex-start; gap:.8rem; padding:.8rem 0; border-top:1px solid var(--line);
}
.path-step:first-child{ border-top:0; }
.path-mark{
  flex:0 0 1.6rem; width:1.6rem; height:1.6rem; margin-top:.1rem; border-radius:50%;
  border:1.5px solid var(--line); display:inline-flex; align-items:center; justify-content:center;
  color:var(--ink); font-size:.9rem;
}
.path-step.is-done .path-mark{ background:var(--clock-green); border-color:var(--clock-green); }
.path-step.is-next .path-mark{ border-color:var(--brass); box-shadow:0 0 0 3px rgba(193,144,63,.2); }
.path-body{ min-width:0; flex:1; }
.path-title{ margin:0; color:var(--parchment); overflow-wrap:anywhere; }
.path-title a{ color:inherit; }
.path-sub{ color:var(--muted); font-size:.85rem; margin-top:.15rem; }
.path-step.is-done .path-title{ color:var(--muted); }
.path-next-tag{
  display:inline-block; margin-left:.4rem; padding:0 .5rem; border:1px solid var(--brass); border-radius:999px;
  color:var(--brass); font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; vertical-align:middle;
}
