/* BCP基礎研修 証跡テンプレート集 - 印刷最適化CSS */

@media print {
    /* 基本設定 */
    * {
        -webkit-print-color-adjust: exact !important;
        color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    body {
        background: white !important;
        font-size: 12pt !important;
        line-height: 1.4 !important;
        margin: 0 !important;
        padding: 10mm !important;
    }

    /* ナビゲーションを隠す */
    .navigation,
    .nav-container,
    .action-buttons {
        display: none !important;
    }

    /* ページ区切り */
    .page-content {
        page-break-before: always;
    }

    .page-content:first-child {
        page-break-before: avoid;
    }

    /* テンプレートカード */
    .template-card {
        background: white !important;
        box-shadow: none !important;
        border: 2px solid #333 !important;
        border-radius: 8px !important;
        margin-bottom: 20mm !important;
        page-break-inside: avoid;
    }

    /* テーブル */
    table {
        border-collapse: collapse !important;
        width: 100% !important;
        font-size: 10pt !important;
    }

    th, td {
        border: 1px solid #333 !important;
        padding: 4mm !important;
        text-align: left !important;
    }

    th {
        background-color: #f0f0f0 !important;
        font-weight: bold !important;
    }

    /* 入力フィールド */
    input, textarea, select {
        border: none !important;
        border-bottom: 1px solid #333 !important;
        background: transparent !important;
        font-family: inherit !important;
        font-size: inherit !important;
        box-shadow: none !important;
        outline: none !important;
    }

    /* チェックボックス・ラジオボタン */
    input[type="checkbox"], input[type="radio"] {
        border: 1px solid #333 !important;
        border-bottom: none !important;
        width: 4mm !important;
        height: 4mm !important;
    }

    /* ヘッダー */
    .header-gradient {
        background: #4f46e5 !important;
        color: white !important;
        -webkit-print-color-adjust: exact !important;
    }

    /* 優先度カラー */
    .priority-a {
        background-color: #fef2f2 !important;
        border-left: 4px solid #ef4444 !important;
    }

    .priority-b {
        background-color: #fefce8 !important;
        border-left: 4px solid #f59e0b !important;
    }

    .priority-c {
        background-color: #f0f9ff !important;
        border-left: 4px solid #3b82f6 !important;
    }

    /* チートシート */
    .cheat-card {
        background: #f8fafc !important;
        border: 2px dashed #333 !important;
        width: 85mm !important;
        height: 54mm !important;
        font-size: 8pt !important;
        page-break-inside: avoid;
        margin: 5mm !important;
    }

    /* フォントサイズ調整 */
    h1 { font-size: 18pt !important; }
    h2 { font-size: 16pt !important; }
    h3 { font-size: 14pt !important; }
    h4 { font-size: 12pt !important; }

    /* アイコンの代替表示 */
    .fas::before, .far::before, .fab::before {
        font-family: "Font Awesome 6 Free" !important;
    }

    /* 改ページ制御 */
    .template-section {
        break-inside: avoid;
        page-break-inside: avoid;
        margin-bottom: 15mm !important;
    }

    /* リンクの色 */
    a {
        color: #333 !important;
        text-decoration: none !important;
    }

    /* 不要な要素を隠す */
    .no-print {
        display: none !important;
    }

    /* 署名欄の強調 */
    .signature-field {
        background-color: #fffbeb !important;
        border-bottom: 2px solid #333 !important;
    }

    /* 記入例の表示 */
    .print-example {
        display: inline-block !important;
        color: #666 !important;
        font-style: italic !important;
        font-size: 9pt !important;
    }

    /* ページヘッダー・フッター */
    @page {
        margin: 15mm;
        @top-left {
            content: "BCP基礎研修 証跡テンプレート集";
            font-size: 10pt;
            color: #666;
        }
        @top-right {
            content: "作成日: " counter(page);
            font-size: 10pt;
            color: #666;
        }
        @bottom-center {
            content: "- " counter(page) " -";
            font-size: 10pt;
            color: #666;
        }
    }

    /* 特定要素の印刷時調整 */
    .bg-gradient-to-br {
        background: white !important;
        border: 1px solid #333 !important;
    }

    /* 入力済みデータの強調 */
    input[value]:not([value=""]) {
        font-weight: bold !important;
        background-color: #f9f9f9 !important;
    }
}

/* 印刷プレビュー用スタイル */
.print-preview {
    background: white;
    box-shadow: 0 0 10px rgba(0,0,0,0.1);
    margin: 20px;
    padding: 20mm;
    max-width: 210mm;
    min-height: 297mm;
}

/* 印刷ボタンのスタイル */
.print-btn {
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 500;
    transition: all 0.2s ease;
}

.print-btn:hover {
    background: linear-gradient(135deg, #047857 0%, #059669 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(5, 150, 105, 0.3);
}

/* 保存・読込ボタンのスタイル */
.save-btn {
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 500;
    transition: all 0.2s ease;
    margin-right: 8px;
}

.save-btn:hover {
    background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.load-btn {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 500;
    transition: all 0.2s ease;
}

.load-btn:hover {
    background: linear-gradient(135deg, #d97706 0%, #f59e0b 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}