/* =====================================================
   draft_restore.css — 下書き復元プロンプト（3択モーダル）
   D70-DRAFT-CANCELKILLS (2026-07-30)

   window.confirm は2択しか持てず、「キャンセル」が
   「後で」と「捨てて」の両方の意味を背負っていた（＝誤タップで
   クラッシュ復旧用の下書きが取り消し不能に消えていた）。
   3択（復元／後で／破棄）にして曖昧さを消すための専用モーダル。

   両モード必須（罠12）。⚠️ 共有の .btn-danger はライトモードの
   上書きが無く、.modal-content のライト背景 #f5f5f5 の上では
   2.56:1 で AA 未達になる（D68-AUTH-LIGHTMSG と同型）。
   共有変数は他所でも使うので触らず、この面だけ上書きする
   （D67 で ai-chat の削除ボタンに使ったのと同じ手当て）。

   本ファイルは 5_themes.css より後に読み込む（tutorial.css と同じ
   自己完結方式）＝ライト規則が source order で勝つ。
   ===================================================== */

.draft-restore-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.75);
    z-index: var(--z-modal, 1000);
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

/* .modal-content を土台に使う（両モードの背景/枠は既存実績のまま借りる）。
   下書き確認は情報量が少ないので幅だけ絞る。 */
.draft-restore-card {
    max-width: 460px;
}

.draft-restore-card h2 {
    margin: 0 0 14px;
    font-size: 18px;
    line-height: 1.4;
}

.draft-restore-meta {
    margin: 0 0 6px;
    font-size: 13px;
    /* 両モード共通で安全な表現（opacity ベース・罠12） */
    opacity: 0.7;
}

.draft-restore-body {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.7;
}

.draft-restore-actions {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* 3つとも同じ幅で縦に並べる（モバイルの誤タップを減らす。
   横並びだと狭い画面で「破棄」が「後で」の隣に詰まる）。 */
.draft-restore-actions .btn {
    width: 100%;
    /* 指で押せる最小サイズ（a11y・iOS の 44px 基準） */
    min-height: 44px;
}

/* 破棄だけは取り消せない操作なので、色でも語でも区別する。
   ダーク: #ff4444 on #0c1018 = 5.58:1（AA 合格） */
.draft-restore-discard {
    background: transparent;
    color: #ff4444;
    border: 1px solid #ff4444;
}

.draft-restore-discard:hover {
    background: rgba(255, 68, 68, 0.12);
}

/* ライト: #b91c1c on #f5f5f5 = 5.99:1（AA 合格）。
   共有 .btn-danger の #ff4444 だと 2.56:1 で読めない。 */
body.light-mode .draft-restore-discard {
    color: #b91c1c;
    border-color: #b91c1c;
}

body.light-mode .draft-restore-discard:hover {
    background: rgba(185, 28, 28, 0.08);
}

/* 狭い画面でもカード内でスクロールして全ボタンに到達できる
   （.modal-content の max-height:90vh + overflow-y:auto を継承）。 */
@media (max-height: 460px) {
    .draft-restore-card {
        padding: 20px;
    }
    .draft-restore-body {
        margin-bottom: 14px;
    }
}