@charset "utf-8";

/* ==================================================
   丹後MC検証委員会 ポータル・医師用画面 統合CSS
   ※ 共通スタイルは common.css で管理しています
   ================================================== */

/* ==========================================
   1. ログイン画面 (index.php)
   ========================================== */
body.login-body {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
}
body.login-body .login-container {
    background-color: #ffffff;
    padding: 40px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    text-align: center;
    max-width: 400px;
    width: 90%;
}
body.login-body .login-container h1 { color: #333; font-size: 1.8em; margin-bottom: 25px; }
body.login-body .login-container p { color: #666; margin-bottom: 30px; line-height: 1.6; }
body.login-body .password-group { position: relative; width: 100%; margin-bottom: 20px; }
body.login-body input#password {
    width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px;
    font-size: 1em; box-sizing: border-box; text-align: center;
}
body.login-body input[type="submit"] {
    width: 100%; padding: 12px; background-color: #3498db; color: white;
    border: none; border-radius: 8px; font-size: 1.1em; cursor: pointer; transition: 0.3s;
}
body.login-body input[type="submit"]:hover { background-color: #2980b9; }
body.login-body .toggle-password {
    position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
    cursor: pointer; color: #999; display: flex; align-items: center; z-index: 10;
}
body.login-body .error-message { color: #e74c3c; margin-top: 15px; font-weight: bold; }


/* ==========================================
   2. ポータル画面 (portal_content.php)
   ========================================== */
body.portal-body .main-content { padding: 40px 50px; flex: 1; }
body.portal-body .section-card {
    background: #fff; border: 1px solid #e1e8ed; border-radius: 10px;
    margin-bottom: 35px; overflow: hidden; box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}
body.portal-body .section-header { padding: 12px 25px; color: #fff; font-weight: bold; font-size: 18px; }
body.portal-body .section-body { padding: 25px 30px; font-size: 16px; }

/* 見出しカラー */
body.portal-body .head-intro { background-color: #34495e; }
body.portal-body .head-notice { background-color: #2980b9; }
body.portal-body .head-target { background-color: #16a085; }
body.portal-body .head-deadline { background-color: #d35400; }
body.portal-body .head-contact { background-color: #7f8c8d; }

/* 検証開始＆リンクボタンエリア */
body.portal-body .btn-start-area {
    display: flex; justify-content: center; align-items: stretch; gap: 15px;
    margin: 30px 0 50px; flex-wrap: nowrap;
}
body.portal-body .sub-box { flex: 1; display: flex; flex-direction: column; }
body.portal-body .protocol-side-box {
    flex: 1; background: #eef6fb; border: 2px solid #3498db; border-radius: 12px;
    display: flex; flex-direction: column; justify-content: center; padding: 15px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
body.portal-body .protocol-label { font-size: 14px; font-weight: bold; color: #2c3e50; margin-bottom: 8px; text-align: center; }
body.portal-body .recent-result-box { border-color: #27ae60; background: #e9f7ef; }
body.portal-body .recent-label { color: #27ae60; }
body.portal-body .archive-box { border-color: #2c3e50; background: #f8fafb; }

body.portal-body .btn-protocol-small {
    background: #3498db; color: #fff !important; text-decoration: none; padding: 15px;
    border-radius: 8px; font-size: 15px; font-weight: bold; text-align: center;
    box-shadow: 0 4px 0 #2980b9; transition: 0.2s; display: flex; align-items: center; justify-content: center; flex: 1;
}
body.portal-body .btn-protocol-small:hover { transform: translateY(2px); box-shadow: 0 2px 0 #1c5980; }
body.portal-body .btn-recent { background-color: #27ae60; box-shadow: 0 4px 0 #219150; }
body.portal-body .btn-recent:hover { box-shadow: 0 2px 0 #219150; }
body.portal-body .btn-archive { background: #2c3e50; box-shadow: 0 4px 0 #1a252f; }

body.portal-body .btn-start-red {
    flex: 2.2; display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: linear-gradient(to bottom, #e74c3c 0%, #c0392b 100%);
    color: #fff !important; padding: 25px 15px; border-radius: 12px; text-decoration: none;
    font-size: 26px; font-weight: bold; text-align: center;
    box-shadow: 0 8px 0 #962d22, 0 10px 20px rgba(0,0,0,0.25); border: 1px solid #c0392b; transition: 0.1s;
}
body.portal-body .btn-start-red:hover { transform: translateY(2px); box-shadow: 0 6px 0 #962d22; }

/* 連絡先エリア */
body.portal-body .info-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-bottom: 35px; }
body.portal-body .contact-flex { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; margin-top: 20px; }
body.portal-body .contact-method { background: #f8fafb; border: 1px solid #eee; padding: 25px; border-radius: 8px; text-align: center; }
body.portal-body .label-urgent { color: #e74c3c; font-weight: bold; font-size: 20px; display: block; margin-bottom: 12px; }
body.portal-body .label-normal { color: #333; font-weight: bold; font-size: 20px; display: block; margin-bottom: 12px; }
body.portal-body .tel-number { font-size: 28px; font-weight: bold; color: #2c3e50; }
body.portal-body .btn-contact-trigger {
    width: 100%; max-width: 280px; background: #3498db; color: #fff; border: none; padding: 15px;
    border-radius: 6px; cursor: pointer; font-weight: bold; font-size: 16px; margin: 0 auto; display: block; transition: 0.2s;
}

/* モーダル */
body.portal-body .modal {
    display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.6); align-items: center; justify-content: center;
}
body.portal-body .modal.is-visible { display: flex !important; }
body.portal-body .modal-content {
    background: #fff; padding: 30px 40px; width: 90%; max-width: 550px; border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3); max-height: 90vh; overflow-y: auto;
}
body.portal-body .modal-content h3 { margin-top: 0; border-bottom: 2px solid #2c3e50; padding-bottom: 10px; color: #2c3e50; }
body.portal-body .form-group { margin-bottom: 15px; }
body.portal-body .form-group label { display: block; font-weight: bold; margin-bottom: 5px; color: #333; }
body.portal-body .form-group input, body.portal-body .form-group textarea {
    width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 6px; box-sizing: border-box; font-size: 16px;
}
body.portal-body .btn-submit-modal {
    width: 100%; background: #27ae60; color: #fff; padding: 15px; border: none; border-radius: 6px; cursor: pointer; font-weight: bold; font-size: 16px; transition: 0.3s;
}
body.portal-body .btn-submit-modal:hover { background: #219150; }
body.portal-body .btn-close-modal {
    width: 100%; background: #eee; color: #333; padding: 10px; border: none; border-radius: 6px; margin-top: 15px; cursor: pointer; transition: 0.3s;
}
body.portal-body .btn-close-modal:hover { background: #ddd; }


/* ==========================================
   3. 医師選択画面 (doctor_select.php)
   ========================================== */
body.page-doctor-select main { padding: 40px 50px; }
body.page-doctor-select .page-title-area {
    border-left: 6px solid #3498db; padding-left: 20px; margin-bottom: 40px;
}
body.page-doctor-select .page-title-area h2 { margin: 0; font-size: 24px; color: #2c3e50; }
body.page-doctor-select .page-title-area p { color: #7f8c8d; font-size: 16px; margin: 8px 0 0 0; }
body.page-doctor-select .doctor-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-bottom: 50px; }
body.page-doctor-select .doctor-card {
    display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;
    background: #fff; border: 1px solid #e1e8ed; border-radius: 12px; padding: 40px 20px;
    text-decoration: none; transition: 0.3s ease; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}
body.page-doctor-select .doctor-card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1); border-color: #3498db; background-color: #f0f7fd; }
body.page-doctor-select .doc-hospital { display: block; font-size: 14px; color: #7f8c8d; margin-bottom: 5px; }
body.page-doctor-select .doc-name { display: block; font-size: 24px; font-weight: bold; color: #2c3e50; margin-bottom: 15px; }
body.page-doctor-select .case-count-badge { display: inline-block; background-color: #e74c3c; color: #fff; padding: 8px 20px; border-radius: 25px; font-weight: bold; }
body.page-doctor-select .case-count-badge.count-zero { background-color: #bdc3c7; }


/* ==========================================
   4. 担当事案一覧画面 (doctor_cases.php)
   ========================================== */
body.page-doctor-cases main { padding: 40px 50px; }
body.page-doctor-cases .doctor-info-bar {
    background: #fff; padding: 20px 25px; border-radius: 8px; margin-bottom: 30px;
    border-left: 6px solid #3498db; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
body.page-doctor-cases .case-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; align-items: start; }
body.page-doctor-cases .month-column { background: #fdfdfe; border: 1px solid #e1e8ed; border-radius: 10px; overflow: hidden; }
body.page-doctor-cases .month-header { background: #34495e; color: white; padding: 15px; text-align: center; font-weight: bold; font-size: 18px; }
body.page-doctor-cases .case-list { padding: 20px; min-height: 450px; background: #fcfcfc; }
body.page-doctor-cases .case-card {
    border: 1px solid #e1e8ed; border-radius: 8px; padding: 18px; margin-bottom: 15px;
    background: #fff; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04); transition: 0.2s;
}
body.page-doctor-cases .case-card:hover { transform: translateY(-2px); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08); }
body.page-doctor-cases .case-no { font-weight: bold; border-left: 4px solid #3498db; padding-left: 10px; margin-bottom: 15px; color: #2c3e50; font-size: 1.1em; }
body.page-doctor-cases .case-links { display: flex; flex-direction: column; gap: 10px; }
body.page-doctor-cases .alert-error {
    background: #fff5f5; color: #e74c3c; border: 2px solid #feb2b2; padding: 10px;
    border-radius: 6px; text-align: center; font-weight: bold; font-size: 0.95em;
}
body.page-doctor-cases .btn-view { background: #7f8c8d; color: white; text-decoration: none; padding: 10px; border-radius: 6px; text-align: center; font-size: 0.9em; transition: 0.2s; }
body.page-doctor-cases .btn-view:hover { background: #95a5a6; }
body.page-doctor-cases .btn-edit { background: #3498db; color: white; text-decoration: none; padding: 12px; border-radius: 6px; text-align: center; font-weight: bold; transition: 0.2s; }
body.page-doctor-cases .btn-edit:hover { opacity: 0.8; }
body.page-doctor-cases .badge.done { background: #e8f8f0; color: #27ae60; border: 1px solid #27ae60; padding: 10px; border-radius: 6px; text-align: center; font-weight: bold; }
body.page-doctor-cases .no-case { color: #bdc3c7; text-align: center; margin-top: 60px; font-style: italic; }


/* ==========================================
   5. 検証入力フォーム (result_form.php)
   ========================================== */
html.page-result-form-html, body.page-result-form { height: 100vh; overflow: hidden; margin: 0; }
body.page-result-form #container {
    width: 100%; max-width: 100%; height: 100vh; margin: 0;
    display: flex; flex-direction: column; overflow: hidden; border-radius: 0;
}
body.page-result-form #header { padding: 0 20px; height: 50px; border-bottom: 3px solid #3498db; display: flex; align-items: center; border-radius: 0; }
body.page-result-form .work-area { display: flex; gap: 10px; padding: 10px; background: #e0e6ed; flex: 1; min-height: 0; }
body.page-result-form #pdf-pane { flex: 1; background: #fff; border-radius: 6px; border: 1px solid #bdc3c7; display: flex; flex-direction: column; }
body.page-result-form .pdf-controls { background: #34495e; padding: 8px 12px; display: flex; align-items: center; gap: 8px; color: #fff; font-size: 11px; }
body.page-result-form .btn-tool { background: #fff; border: 1px solid #ccc; padding: 3px 6px; font-size: 10px; border-radius: 3px; cursor: pointer; }
body.page-result-form .btn-external-blue { background: #007bff; color: #fff; padding: 4px 10px; border-radius: 4px; text-decoration: none; font-weight: bold; }
body.page-result-form .pdf-content { flex: 1; width: 100%; }
body.page-result-form .pdf-content iframe { width: 100%; height: 100%; border: none; }
body.page-result-form #form-pane { flex: 1; background: #fff; border-radius: 6px; border: 1px solid #bdc3c7; padding: 20px; overflow-y: auto; }
body.page-result-form .case-title { background: #f8f9fa; border-left: 5px solid #3498db; padding: 10px 15px; margin-bottom: 20px; }
body.page-result-form .form-group { margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px solid #eee; }
body.page-result-form .label-title { font-weight: bold; font-size: 15px; color: #2c3e50; }
body.page-result-form .required-tag { color: #e74c3c; font-size: 11px; margin-left: 8px; font-weight: bold; }
body.page-result-form .eval-grid-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 10px; margin-top: 10px; }
body.page-result-form .eval-container label {
    display: flex; align-items: center; justify-content: center; height: 45px; border: 1px solid #ddd;
    border-radius: 5px; cursor: pointer; background: #f9f9f9; font-size: 12px; font-weight: bold; transition: 0.2s;
}

/* ★ 修正箇所：非表示にするのはラジオボタンだけ！ */
body.page-result-form .eval-container input[type="radio"] { display: none; }

body.page-result-form .eval-container label:has(input:checked) { background: #3498db; color: #fff; border-color: #2980b9; }

body.page-result-form .eval-section {
    border-radius: 8px;
    margin-bottom: 25px;
    padding: 0;
    border: 1px solid #ddd;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}
body.page-result-form .eval-section .eval-header {
    padding: 12px 15px;
    font-weight: bold;
    display: flex;
    align-items: center;
}
body.page-result-form .eval-section .eval-container {
    padding: 15px;
    background: #fff;
}

/* 観察: クリアブルー */
body.page-result-form .theme-obs { border-color: #90caf9; }
body.page-result-form .theme-obs .eval-header { background: #e3f2fd; border-bottom: 1px solid #90caf9; }
body.page-result-form .theme-obs .eval-header .label-title { color: #0d47a1; }
body.page-result-form .theme-obs .eval-container label:has(input:checked) { background: #1976d2; color: #fff; border-color: #1565c0; }

/* 判断: ミントグリーン */
body.page-result-form .theme-ass { border-color: #a5d6a7; }
body.page-result-form .theme-ass .eval-header { background: #e8f5e9; border-bottom: 1px solid #a5d6a7; }
body.page-result-form .theme-ass .eval-header .label-title { color: #1b5e20; }
body.page-result-form .theme-ass .eval-container label:has(input:checked) { background: #2e7d32; color: #fff; border-color: #1b5e20; }

/* 処置: ソフトティール */
body.page-result-form .theme-trt { border-color: #80cbc4; }
body.page-result-form .theme-trt .eval-header { background: #e0f2f1; border-bottom: 1px solid #80cbc4; }
body.page-result-form .theme-trt .eval-header .label-title { color: #004d40; }
body.page-result-form .theme-trt .eval-container label:has(input:checked) { background: #00695c; color: #fff; border-color: #004d40; }

/* 医療機関: ソフトインディゴ */
body.page-result-form .theme-hosp { border-color: #9fa8da; }
body.page-result-form .theme-hosp .eval-header { background: #e8eaf6; border-bottom: 1px solid #9fa8da; }
body.page-result-form .theme-hosp .eval-header .label-title { color: #1a237e; }
body.page-result-form .theme-hosp .eval-container label:has(input:checked) { background: #283593; color: #fff; border-color: #1a237e; }

/* 検証日: スレートグレー */
body.page-result-form .theme-date { border-color: #b0bec5; }
body.page-result-form .theme-date .eval-header { background: #eceff1; border-bottom: 1px solid #b0bec5; }
body.page-result-form .theme-date .eval-header .label-title { color: #455a64; }

body.page-result-form .theme-date .eval-container input[type="date"] {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 6px;
    box-sizing: border-box;
    font-size: 16px;
    font-family: inherit;
    color: #333;
    background-color: #fff;
    cursor: pointer;
    display: block;
}

/* 所見: ソフトアンバー */
body.page-result-form .theme-comment { border-color: #ffe082; }
body.page-result-form .theme-comment .eval-header { background: #fff8e1; border-bottom: 1px solid #ffe082; }
body.page-result-form .theme-comment .eval-header .label-title { color: #f57f17; }

body.page-result-form textarea { width: 100%; height: 120px; border: 1px solid #ccc; border-radius: 4px; padding: 10px; box-sizing: border-box; font-size: 14px; margin-top: 5px; }
body.page-result-form .email-box { background: #fff9e6; border: 1px solid #f1c40f; padding: 15px; border-radius: 6px; margin-top: 10px; }
body.page-result-form .email-input { width: 100%; padding: 8px; border: 1px solid #ccc; border-radius: 4px; margin-top: 5px; box-sizing: border-box; }
body.page-result-form .form-actions { display: flex; gap: 10px; margin-top: 20px; }
body.page-result-form .btn-draft { flex: 1; padding: 15px; background: #e67e22; color: #fff; border: none; border-radius: 6px; font-size: 15px; font-weight: bold; cursor: pointer; }
body.page-result-form .btn-confirm-half { flex: 1; padding: 15px; background: #27ae60; color: #fff; border: none; border-radius: 6px; font-size: 15px; font-weight: bold; cursor: pointer; }
body.page-result-form .confirm-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
body.page-result-form .confirm-table th, body.page-result-form .confirm-table td { padding: 12px; border: 1px solid #ddd; text-align: left; font-size: 14px; }
body.page-result-form .confirm-table th { background: #f8f9fa; width: 30%; color: #34495e; }


/* ==========================================
   6. 完了・ステータス画面・問い合わせ画面
   ========================================== */
body.page-submit-result, body.page-submit-status, body.page-send-contact {
    display: flex; justify-content: center; align-items: center; min-height: 100vh;
}
.card, .status-box, .confirm-box, .result-box {
    background: white; padding: 40px; border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); text-align: center; max-width: 500px; width: 90%;
}
.check-icon { display: inline-block; width: 80px; height: 80px; border-radius: 50%; background-color: #27ae60; color: white; line-height: 80px; font-size: 50px; margin-bottom: 24px; font-weight: bold; }
.case-number { display: inline-block; background-color: #eef2ff; color: #3498db; padding: 6px 16px; border-radius: 20px; font-weight: bold; margin-bottom: 24px; }

/* 問い合わせ確認用 */
body.page-send-contact table { width: 100%; border-collapse: collapse; margin: 20px 0; }
body.page-send-contact th, body.page-send-contact td { text-align: left; padding: 12px; border-bottom: 1px solid #eee; }
body.page-send-contact th { width: 30%; background: #f9f9f9; }
body.page-send-contact .btn-group { display: flex; gap: 10px; margin-top: 20px; }
body.page-send-contact .btn-send { flex: 1; background: #27ae60; color: white; padding: 15px; border: none; border-radius: 6px; font-weight: bold; cursor: pointer; }
body.page-send-contact .btn-back { flex: 1; background: #eee; color: #333; padding: 15px; border: none; border-radius: 6px; font-weight: bold; cursor: pointer; }


/* ==========================================
   7. アーカイブ / 直近倉庫画面
   ========================================== */
body.page-recent-store main { background: #fff; padding: 20px; border-radius: 8px; }
.archive-store-container { padding: 20px; max-width: 1200px; margin: 0 auto; }
.store-header-box { background: #27ae60; color: white; padding: 20px; border-radius: 8px; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; }
.store-header-box.archive-mode { background: #2c3e50; }
.archive-table { width: 100%; border-collapse: collapse; margin-top: 20px; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.archive-table th, .archive-table td { border: 1px solid #ddd; padding: 12px; text-align: left; }
.archive-table th { background-color: #f8f9fa; cursor: pointer; color: #2c3e50; }

/* DataTables微調整 */
.dataTables_wrapper { padding: 20px; background: #fff; border-radius: 8px; }
table.dataTable thead th { background-color: #2c3e50; color: white; border: 1px solid #ddd; white-space: nowrap; }
table.dataTable tbody td { border: 1px solid #ddd; white-space: nowrap; padding: 8px; }
.btn-pdf-view { background-color: #e74c3c; color: white; padding: 5px 15px; border-radius: 4px; text-decoration: none; font-weight: bold; display: inline-block; }


/* ==========================================
   8. レスポンシブ用まとめ（画面が狭い場合）
   ========================================== */
@media screen and (max-width: 768px) {
    /* ポータル */
    body.portal-body .btn-start-area { flex-direction: column; }
    body.portal-body .info-grid, body.portal-body .contact-flex { grid-template-columns: 1fr; }
    body.portal-body .main-content { padding: 20px; }
    
    /* 医師選択 */
    body.page-doctor-select .doctor-grid { grid-template-columns: 1fr; gap: 20px; }
    body.page-doctor-select main { padding: 20px; }
    
    /* 事案一覧 */
    body.page-doctor-cases .case-container { grid-template-columns: 1fr; }
    body.page-doctor-cases .doctor-info-bar { flex-direction: column; align-items: flex-start; gap: 15px; }
    
    /* 検証フォーム */
    html.page-result-form-html, body.page-result-form { overflow: visible !important; height: auto !important; }
    body.page-result-form #container { height: auto !important; width: 100% !important; margin: 0 !important; border-radius: 0 !important; }
    body.page-result-form .work-area { flex-direction: column; }
    body.page-result-form #pdf-pane { height: 500px !important; flex: none; }
    body.page-result-form .eval-grid-3 { grid-template-columns: 1fr 1fr; }
    body.page-result-form .form-actions { flex-direction: column; }
}