/* Guest account page. The base (tokens, top bar, flags, cards, fields,
   buttons) comes from /register/register.css so both guest-facing pages
   read as one site; this file only adds what the account needs. */

a.brand { color: inherit; text-decoration: none; }

.wrap > .card + .card { margin-top: 14px; }

.lead { margin-top: 6px; }

.signin { display: grid; gap: 14px; }
.signin h1 { margin-top: 2px; }

.stack-form { display: grid; gap: 10px; margin-top: 4px; }
.stack-form label { margin-bottom: -4px; }
.stack-form input { margin-top: 0; }
.stack-form .primary, .stack-form .secondary { justify-self: start; min-width: 160px; }

.sent-to { margin: 0; font-size: 0.92rem; color: var(--muted); overflow-wrap: anywhere; }
.sent-to strong { color: var(--ink); }

/* One-time code: big, spaced, easy to check against the e-mail. */
.code-input {
  font-size: 1.5rem !important;
  font-weight: 650;
  letter-spacing: 0.35em;
  text-align: center;
  font-variant-numeric: tabular-nums;
  max-width: 260px;
}

.row-links { display: flex; flex-wrap: wrap; gap: 6px 18px; }
button.link {
  min-height: 0;
  padding: 4px 0;
  background: none;
  color: var(--primary-dark);
  font-size: 0.86rem;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  box-shadow: none;
}

.fine { font-size: 0.8rem; color: var(--faint); margin: 2px 0 0; }

.section-h {
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--faint);
  margin: 0 0 12px;
}

/* Returning-guest discount */
.loyalty { border-color: #bfe5cb; background: linear-gradient(180deg, var(--ok-soft), #fff 70%); }
.loyalty .section-h { color: var(--ok); }
.loyalty__pct { margin: 0; font-size: 1.5rem; font-weight: 750; color: var(--ok); }
.loyalty__line { margin: 6px 0 0; color: var(--ink); font-size: 0.92rem; }
.loyalty__note { margin: 10px 0 0; padding: 8px 12px; border-radius: 10px; background: #fff7e6; color: #8a5a00; font-size: 0.84rem; }
.loyalty__note[hidden] { display: none; }

/* Stays */
.stays { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.stay {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 12px;
  padding: 14px 16px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fbfcfe;
}
.stay__name { font-weight: 700; }
.stay__when { color: var(--ink); font-size: 0.92rem; }
.stay__meta { grid-column: 1 / -1; color: var(--muted); font-size: 0.84rem; }
.stay__side { text-align: right; display: grid; gap: 6px; justify-items: end; align-content: start; }
.stays__empty { color: var(--muted); font-size: 0.9rem; }

.pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.74rem;
  font-weight: 650;
  padding: 3px 10px;
  border-radius: 999px;
  background: #f1f4f8;
  color: #475569;
  white-space: nowrap;
}
.pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.85; }
.pill--confirmed { background: var(--ok-soft); color: var(--ok); }
.pill--pending { background: #fff4dc; color: var(--warn); }
.pill--completed { background: var(--primary-soft); color: var(--primary-dark); }
.pill--cancelled, .pill--rejected { background: #f4f5f7; color: #8a92a3; }
.reg { font-size: 0.78rem; color: var(--muted); }
.reg--todo { color: var(--warn); font-weight: 600; }

.account-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.account-actions .fine { flex-basis: 100%; }
button.danger-link {
  min-height: 0;
  padding: 8px 4px;
  margin-left: auto;
  background: none;
  color: var(--danger);
  font-size: 0.86rem;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
  box-shadow: none;
}

@media (max-width: 480px) {
  .stay { grid-template-columns: 1fr; }
  .stay__side { text-align: left; justify-items: start; grid-auto-flow: column; justify-content: start; }
  .stack-form .primary, .stack-form .secondary { justify-self: stretch; }
  button.danger-link { margin-left: 0; }
}

/* Saved details */
.profile .lead { margin-bottom: 10px; }
.profile-state { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; background: #fff7e6; color: #8a5a00; font-size: 0.88rem; }
.profile-state--ok { background: var(--ok-soft); color: var(--ok); }
.profile-state[hidden] { display: none; }
.profile-form { display: grid; gap: 12px; }
.sub-h { margin: 10px 0 0; font-size: 1rem; font-weight: 700; }
.companions { display: grid; gap: 10px; }
.companion { border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; background: #fbfcfe; }
.companion--open { background: #fff; }
.add-companion { justify-self: start; }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 0.9rem; }
.check[hidden] { display: none; }
.check input { margin-top: 3px; width: auto; }
.invoice-box { border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px; }
.invoice-box summary { cursor: pointer; font-weight: 650; }
.invoice-box[open] summary { margin-bottom: 10px; }
.profile-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.profile-actions .danger-link { margin-left: auto; }
.profile-actions .danger-link[hidden] { display: none; }
