/* ============================================================
   認証ページ専用CSS（Phase3-C）
   対象: lib/views/pages/{login,signup,forgot,reset,register}.php
        + layout/members/header-login.php（signup/管理ログインの外殻）
   方針: Tabler既定の見た目をRescueWP（LP）トークンで再スキン。
        表示(display)制御やフォーム構造には一切関与しない。
   スコープ: このファイルは上記ビュー/レイアウトからのみ読み込まれるため、
        公開マーケページ・会員/管理ダッシュボードには影響しない。
============================================================ */

/* ---- ページ背景：クリーンな背景（Tablerのpage-centerを上書き） ---- */
.page.page-center {
    background: linear-gradient(180deg, var(--paper-50, #F6F8FB) 0%, var(--paper-0, #FFFFFF) 60%);
    min-height: 100vh;
}
body.theme-light {
    background: linear-gradient(180deg, var(--paper-50, #F6F8FB) 0%, var(--paper-0, #FFFFFF) 60%);
}

/* ---- ブランド（カード上部のロゴ。LPの.brandとは独立したスコープ） ---- */
.auth-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    text-decoration: none;
}
.auth-brand-mark { width: 30px; height: 30px; flex: none; }
.auth-brand-word {
    font-family: var(--font-disp, 'Sora', sans-serif);
    font-weight: 700;
    font-size: 19px;
    letter-spacing: -.01em;
    color: var(--ink-900, #0B1220);
}
.auth-brand-word b { color: var(--emerald-600, #059669); font-weight: 800; }

/* ---- カード ---- */
.page-center .card.card-md {
    border: 1px solid var(--border-color, #E4E9F0);
    border-radius: var(--radius-md, 14px);
    box-shadow: var(--shadow-soft, 0 1px 2px rgba(16,24,40,.04), 0 8px 24px -8px rgba(16,24,40,.10));
    font-family: var(--font-jp, 'Noto Sans JP', sans-serif);
}
.page-center .card-title {
    font-family: var(--font-disp, 'Sora', sans-serif);
    color: var(--ink-900, #0B1220);
    font-weight: 700;
}

/* ---- ラベル / 入力欄 / セレクト ---- */
.page-center .form-label {
    color: var(--text-color, #101828);
    font-weight: 600;
    font-size: .92rem;
}
.page-center .form-label-description a {
    color: var(--emerald-600, #059669);
    font-weight: 600;
    font-size: .85em;
}
.page-center .form-control,
.page-center .form-select {
    border: 2px solid var(--border-color, #E4E9F0);
    border-radius: var(--border-radius, 14px);
    padding: 10px 14px;
    font-family: var(--font-jp, 'Noto Sans JP', sans-serif);
    transition: var(--transition, all .3s ease);
    background: #fff;
    color: var(--text-color, #101828);
}
.page-center .form-control::placeholder { color: #adb5bd; }
.page-center .form-control:focus,
.page-center .form-select:focus {
    border-color: var(--primary-color, #10B981);
    box-shadow: 0 0 0 3px rgba(16,185,129,.12);
    outline: none;
}

/* ---- ボタン（emerald pill。表示/非表示や type/name等の属性には触れない） ---- */
.page-center .btn-primary {
    background: linear-gradient(180deg, var(--emerald-400, #34D399), var(--emerald-500, #10B981) 60%);
    color: var(--ink-950, #080D18);
    border: none;
    border-radius: 999px;
    font-weight: 700;
    font-family: var(--font-jp, 'Noto Sans JP', sans-serif);
    padding: 12px 20px;
    box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 10px 24px -8px rgba(16,185,129,.55);
    transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}
.page-center .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 1px 0 rgba(255,255,255,.35) inset, 0 16px 30px -8px rgba(16,185,129,.7);
    color: var(--ink-950, #080D18);
}
.page-center .btn-primary:active { transform: translateY(0); }
.page-center .btn-primary:disabled { opacity: .6; box-shadow: none; transform: none; }

/* ---- リンク ---- */
.page-center a { color: var(--emerald-600, #059669); }
.page-center a:hover { color: var(--emerald-700, #047857); }
.page-center .text-secondary { color: var(--text-light, #74839c); }
.page-center .text-secondary a { font-weight: 600; }

/* ---- エラー / 通知（表示・非表示の判定=display制御はTabler/JSのまま。配色のみ） ---- */
.page-center .alert-danger,
.page-center .invalid-feedback.alert-danger {
    background: rgba(239, 90, 90, .08);
    color: #B42318;
    border: 1px solid rgba(239, 90, 90, .25);
    border-radius: var(--radius-sm, 10px);
    padding: 10px 14px;
    font-size: .9rem;
}
.page-center .alert-info {
    background: rgba(16, 185, 129, .08);
    color: var(--emerald-700, #047857);
    border: 1px solid rgba(16, 185, 129, .25);
    border-radius: var(--radius-sm, 10px);
    padding: 10px 14px;
    font-size: .9rem;
}

/* ---- signup用ミニフッター（商標ディスクレーマ + UIARB） ---- */
.auth-minifooter {
    text-align: center;
    margin-top: 26px;
    padding: 0 16px;
    font-size: 11.5px;
    line-height: 1.7;
    color: var(--text-light, #74839c);
}

@media (max-width: 480px) {
    .page-center .container-tight { padding-left: 8px; padding-right: 8px; }
    .auth-brand-word { font-size: 18px; }
}