/* ═══════════════════════════════════════════════════════════════════════════
   KY MOTORS — account.css · 로그인 · 가입 · 내 정보 (v4.7.0 · 2026-10-14)
   v4.css 공용 부품(.f .inp .chip .btn .bnr .ckb .empty .kytoast) + booking.css(.bk .bk-h .bk-wait .ic .tbtn)를 그대로 쓰고,
   여기엔 이 화면에만 있는 것만 둔다.
   ═══════════════════════════════════════════════════════════════════════════ */

.acc .bk__wrap{ width:min(640px,calc(100% - 2*var(--gutter))); }
.acc-sec{ animation:kyRowIn 250ms ease-out; }
.acc-join{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-top:28px; padding-top:22px; border-top:1px solid var(--n2); font-size:14px; color:var(--n6); }
.acc-gap{ margin-top:22px; }
.acc-car{ animation:kyRowIn 250ms ease-out; }

/* 직원 로그인 — 일부러 아주 작게(사장님: 얼핏 보면 차주 로그인만 있는 것처럼). 누르는 자리는 44px */
.acc-staffrow{ display:flex; justify-content:flex-end; margin-top:28px; }
.acc-staff{
  display:inline-flex; align-items:center; min-height:44px; min-width:44px; justify-content:flex-end; padding:0 2px;
  font-size:11px; color:var(--n5); letter-spacing:.02em;
}
.acc-staff:hover,.acc-staff:focus-visible{ color:var(--n7); text-decoration:underline; text-underline-offset:3px; }

.acc-consent-sub{ display:block; margin-top:2px; font-size:12px; color:var(--n5); }

/* 로그인 뒤 */
.acc-acts{ display:flex; gap:10px; flex-wrap:wrap; margin-top:8px; }
.acc-logout{ margin-top:18px; color:var(--n6); }
.acc-card{ margin-top:18px; padding:20px; border:1px solid var(--n2); border-radius:var(--radius-lg); background:#fff; }
.acc-card__h{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:12px; }
.acc-card__h h2{ margin:0; font-size:17px; font-weight:600; letter-spacing:-.02em; }
.acc-card__s{ font-size:12px; color:var(--n5); }
.acc-list{ list-style:none; margin:0; padding:0; }
.acc-list li{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:12px 0; border-top:1px solid var(--n1); min-width:0; }
.acc-list li:first-child{ border-top:0; padding-top:4px; }
.acc-list b{ font-weight:600; font-variant-numeric:tabular-nums; }
.acc-list span{ font-size:14px; color:var(--n6); min-width:0; }
.acc-tag{ font-style:normal; font-size:12px; font-weight:600; padding:3px 8px; border-radius:999px; background:var(--n1); color:var(--n6); }
.acc-tag.is-ok{ background:#e5f0e8; color:#2f7a4b; }
.acc-tag.is-wait{ background:#f6efdc; color:#8f6312; }
.acc-tag.is-off{ background:var(--n1); color:var(--n5); }

/* 예약 기록 */
.acc-log{ list-style:none; margin:0; padding:0; }
.acc-log li{ display:grid; grid-template-columns:142px 1fr auto; gap:4px 12px; align-items:start; padding:12px 0; border-top:1px solid var(--n1); }
.acc-log li:first-child{ border-top:0; padding-top:4px; }
.acc-log li > *{ min-width:0; }
.acc-log__k{ font-size:12px; font-weight:600; color:var(--n6); padding-top:2px; white-space:nowrap; }
.acc-log__m b{ display:block; font-size:15px; font-weight:600; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.acc-log__m span{ display:block; font-size:12.5px; color:var(--n5); margin-top:2px; line-height:1.55; }
@media (max-width:520px){
  .acc-log li{ grid-template-columns:1fr auto; }
  .acc-log__k{ grid-column:1 / -1; }
}
.acc-skel{ display:flex; flex-direction:column; gap:10px; }
.acc-skel i{ display:block; height:44px; border-radius:var(--radius); background:var(--n1); animation:kyBlink 1.2s ease-in-out infinite; }

/* 내 정보 줄 */
.acc-rows{ display:flex; flex-direction:column; }
.acc-row{ display:grid; grid-template-columns:96px 1fr; gap:8px 16px; align-items:start; padding:14px 0; border-top:1px solid var(--n1); }
.acc-row:first-child{ border-top:0; padding-top:2px; }
.acc-row > *{ min-width:0; }
.acc-row__k{ font-size:13px; font-weight:500; color:var(--n6); padding-top:14px; }
.acc-row:first-child .acc-row__k{ padding-top:0; }
.acc-row__v{ font-size:15px; }
.acc-row__v small{ margin-left:6px; font-size:12px; color:var(--n5); }
.acc-inl{ display:flex; gap:8px; align-items:center; }
.acc-inl .inp{ flex:1 1 auto; min-width:0; }
.acc-inl .btn{ flex:none; }
.acc-pw{ display:flex; flex-direction:column; gap:8px; align-items:flex-start; }
.acc-pw .inp{ width:100%; }
@media (max-width:520px){
  .acc-row{ grid-template-columns:1fr; }
  .acc-row__k{ padding-top:0; }
}
.acc-foot{ display:flex; gap:16px; flex-wrap:wrap; margin-top:20px; }
.acc .bnr--ok{ background:#e5f0e8; color:#2f7a4b; }

/* 가입 → 「로그인 화면으로」 (v4.7.0) */
.acc-go{ color:inherit; font-weight:700; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }