/* ログインの画面だけの見た目。前の管理画面のログイン（main の css/admin.css の a-login）と同じ形 */
:root {
  --a-bg: #f0f2f5; --a-white: #ffffff; --a-border: #e2e8f0; --a-text: #1e293b;
  --a-soft: #64748b; --a-blue: #3a7fc1; --a-blue-h: #2d6aa8; --a-red: #dc2626;
  --a-font: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Meiryo', sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
.a-login-body { background: var(--a-bg); color: var(--a-text); font-family: var(--a-font); }
.a-login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 16px; }
.a-login-card {
  background: var(--a-white); border-radius: 14px; border: 1px solid var(--a-border);
  box-shadow: 0 8px 32px rgba(0,0,0,0.10); padding: 40px; width: 100%; max-width: 380px;
}
/* 前はここに絵文字があった。会社のきまりで絵文字は使わないので、同じ大きさの丸い印にした */
.a-login-logo { display: flex; justify-content: center; margin-bottom: 8px; }
.a-login-logo span { width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--a-blue); position: relative; }
.a-login-logo span::after { content: ""; position: absolute; inset: 7px; border-radius: 50%; background: var(--a-blue); }
.a-login-title { font-size: 18px; font-weight: 700; text-align: center; margin: 0 0 28px; color: var(--a-text); }
.a-field { margin-bottom: 20px; }
.a-label { display: block; font-size: 13px; font-weight: 700; color: var(--a-soft); margin-bottom: 6px; }
.a-input {
  display: block; width: 100%; padding: 11px 14px; font-size: 15px; font-family: var(--a-font); color: var(--a-text);
  background: var(--a-white); border: 1px solid var(--a-border); border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}
.a-input:focus { outline: none; border-color: var(--a-blue); box-shadow: 0 0 0 3px rgba(58,127,193,0.15); }
.a-btn-submit {
  display: block; width: 100%; padding: 14px; margin-top: 8px; font-size: 15px; font-weight: 700; letter-spacing: 0.04em;
  color: #fff; background: var(--a-blue); border: none; border-radius: 8px; cursor: pointer;
  box-shadow: 0 4px 14px rgba(58,127,193,0.35); transition: background .2s, transform .15s; white-space: nowrap;
}
.a-btn-submit:hover { background: var(--a-blue-h); transform: translateY(-1px); }
.a-login-home { display: block; text-align: center; margin-top: 20px; font-size: 13px; color: var(--a-soft); transition: color .2s; }
.a-login-home:hover { color: var(--a-blue); }
.a-error-msg, .a-info-msg { font-size: 13px; padding: 10px 14px; border-radius: 6px; margin: 0 0 14px; }
.a-error-msg { color: var(--a-red); background: #fef2f2; border: 1px solid #fecaca; }
.a-info-msg { color: var(--a-soft); background: var(--a-bg); border: 1px solid var(--a-border); }
@media (max-width: 420px) { .a-login-card { padding: 28px 20px; } }