/* 國立臺東大學校友系統：校徽色系主題（以 CSS 變數覆寫 Bootstrap 5.3） */
:root {
    --alumni-primary: #187A77;
    --alumni-primary-hover: #136461;
    --alumni-primary-tint: #E6F3F2;
    --alumni-brand: #2A9D9A;
    --alumni-accent: #E8772E;
    --alumni-bg: #F6F4EF;
    --alumni-surface: #FFFFFF;
    --alumni-border: #E4E0D8;
    --alumni-text: #1F2A2E;
    --alumni-muted: #5B6770;
    --alumni-success: #1F7A4D;
    --alumni-success-bg: #E3F1E9;
    --alumni-danger: #B42318;
    --alumni-warn-bg: #FDEBDD;
    --alumni-warn-text: #8A4210;
    --alumni-radius: 12px;
    --alumni-radius-sm: 8px;
    --alumni-shadow: 0 1px 2px rgba(31, 42, 46, .06), 0 4px 12px rgba(31, 42, 46, .06);

    --bs-body-font-family: "Noto Sans TC", "Microsoft JhengHei", "PingFang TC", sans-serif;
    --bs-body-color: var(--alumni-text);
    --bs-body-bg: var(--alumni-bg);
    --bs-body-line-height: 1.7;
    --bs-border-color: var(--alumni-border);
    --bs-secondary-color: var(--alumni-muted);
    --bs-link-color: var(--alumni-primary);
    --bs-link-color-rgb: 24, 122, 119;
    --bs-link-hover-color: var(--alumni-primary-hover);
    --bs-link-hover-color-rgb: 19, 100, 97;
    --bs-primary: var(--alumni-primary);
    --bs-primary-rgb: 24, 122, 119;
    --bs-focus-ring-color: rgba(24, 122, 119, .35);
}

/* ---------- 基本元件 ---------- */
body { background: var(--alumni-bg); min-height: 100vh; display: flex; flex-direction: column; }
:focus-visible { outline: 3px solid var(--alumni-primary); outline-offset: 2px; }

.btn { min-height: 44px; border-radius: var(--alumni-radius-sm); font-weight: 500; display: inline-flex; align-items: center; justify-content: center; gap: .4rem; }
.btn-primary {
    --bs-btn-bg: var(--alumni-primary); --bs-btn-border-color: var(--alumni-primary);
    --bs-btn-hover-bg: var(--alumni-primary-hover); --bs-btn-hover-border-color: var(--alumni-primary-hover);
    --bs-btn-active-bg: var(--alumni-primary-hover); --bs-btn-active-border-color: var(--alumni-primary-hover);
    --bs-btn-disabled-bg: var(--alumni-primary); --bs-btn-disabled-border-color: var(--alumni-primary);
    --bs-btn-focus-shadow-rgb: 24, 122, 119;
}
.btn-outline-secondary {
    --bs-btn-color: var(--alumni-text); --bs-btn-border-color: #B9C2C6;
    --bs-btn-hover-color: var(--alumni-text); --bs-btn-hover-bg: #EEF0F1; --bs-btn-hover-border-color: #8A959B;
    --bs-btn-active-color: var(--alumni-text); --bs-btn-active-bg: #E2E6E8; --bs-btn-active-border-color: #8A959B;
    background: #fff;
}
.form-control { border-radius: var(--alumni-radius-sm); border-color: #C9C4BA; min-height: 44px; }
.form-control:focus, .form-check-input:focus { border-color: var(--alumni-primary); box-shadow: 0 0 0 .2rem var(--bs-focus-ring-color); }
.form-check-input:checked { background-color: var(--alumni-primary); border-color: var(--alumni-primary); }
.modal-content { border-radius: var(--alumni-radius); border: 0; box-shadow: var(--alumni-shadow); }
.alert { border-radius: var(--alumni-radius-sm); }

/* ---------- 版型 ---------- */
.alumni-header { background: #fff; border-top: 3px solid var(--alumni-brand); border-bottom: 1px solid var(--alumni-border); position: sticky; top: 0; z-index: 1020; }
.alumni-header .container-lg { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 60px; }
.alumni-header .btn { min-height: 38px; }
.alumni-brand { display: flex; align-items: center; gap: .6rem; color: var(--alumni-text); text-decoration: none; font-weight: 700; font-size: 1.05rem; line-height: 1.2; }
.alumni-brand:hover { color: var(--alumni-text); }
.alumni-brand img { width: 36px; height: 36px; }
.alumni-brand small { display: block; font-weight: 400; font-size: .75rem; color: var(--alumni-muted); }
.alumni-env { background: var(--alumni-warn-bg); color: var(--alumni-warn-text); border: 1px solid var(--alumni-accent); border-radius: 999px; padding: 0 .6rem; font-size: .8rem; white-space: nowrap; }
.alumni-main { flex: 1 0 auto; padding: 1.5rem 0 2.5rem; }
.alumni-footer { background: #fff; border-top: 1px solid var(--alumni-border); color: var(--alumni-muted); font-size: .875rem; padding: 1rem 0; }
.alumni-narrow { max-width: 820px; margin: 0 auto; }
.alumni-card { background: var(--alumni-surface); border: 1px solid var(--alumni-border); border-radius: var(--alumni-radius); box-shadow: var(--alumni-shadow); }
.alumni-card-body { padding: 1.25rem; }
@media (min-width: 768px) { .alumni-card-body { padding: 1.5rem 1.75rem; } }
.alumni-page-title { font-size: 1.5rem; font-weight: 700; margin: 0; }
.alumni-page-subtitle { color: var(--alumni-muted); margin: .25rem 0 0; }

/* ---------- 首頁 ---------- */
.alumni-landing { max-width: 880px; margin: 0 auto; }
.alumni-hero { position: relative; display: flex; align-items: flex-end; min-height: 200px; border-radius: var(--alumni-radius); overflow: hidden; background: #9DBF8E center / cover no-repeat; }
@media (min-width: 768px) { .alumni-hero { min-height: 280px; } }
.alumni-hero::after, .alumni-auth-photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15, 50, 48, 0) 35%, rgba(15, 50, 48, .78) 100%); }
.alumni-hero-text { position: relative; z-index: 1; color: #fff; padding: 1.25rem 1.5rem; }
.alumni-hero-text h1 { font-size: 1.75rem; font-weight: 700; margin: 0; }
.alumni-choice-grid { display: grid; gap: 1rem; }
@media (min-width: 768px) { .alumni-choice-grid { grid-template-columns: 1fr 1fr; } }
.alumni-choice { display: flex; align-items: center; gap: 1rem; padding: 1.25rem; color: var(--alumni-text); text-decoration: none; transition: border-color .15s ease; }
.alumni-choice:hover { border-color: var(--alumni-primary); color: var(--alumni-text); }
.alumni-choice-icon { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--alumni-primary-tint); color: var(--alumni-primary); font-size: 1.5rem; }
.alumni-choice-title { display: block; font-size: 1.25rem; font-weight: 700; }
.alumni-choice-desc { display: block; color: var(--alumni-muted); font-size: .95rem; }
.alumni-choice > .bi-chevron-right { margin-left: auto; color: var(--alumni-muted); }

/* ---------- 校友登入 ---------- */
.alumni-auth { display: grid; grid-template-columns: 1fr; min-height: 100vh; }
@media (min-width: 992px) { .alumni-auth { grid-template-columns: 1.1fr 1fr; } }
.alumni-auth-photo { position: relative; display: flex; align-items: flex-end; min-height: 180px; background: #9DBF8E center / cover no-repeat; }
@media (min-width: 992px) { .alumni-auth-photo { min-height: 100vh; } }
.alumni-auth-panel { display: flex; justify-content: center; align-items: flex-start; padding: 0 1rem 2rem; }
@media (min-width: 992px) { .alumni-auth-panel { align-items: center; padding: 2rem; } }
.alumni-auth-card { position: relative; z-index: 1; width: 100%; max-width: 420px; margin-top: -1.5rem; }
@media (min-width: 992px) { .alumni-auth-card { margin-top: 0; } }
.alumni-birthday { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: .5rem; }

/* ---------- 問卷列表 ---------- */
.alumni-survey-grid { display: grid; gap: 1rem; }
@media (min-width: 768px) { .alumni-survey-grid { grid-template-columns: 1fr 1fr; } }
.alumni-survey { display: flex; flex-direction: column; gap: .5rem; padding: 1.25rem; }
.alumni-survey.is-pending { border-left: 4px solid var(--alumni-accent); }
.alumni-survey-title { font-size: 1.125rem; font-weight: 700; margin: 0; }
.alumni-survey-meta { display: flex; flex-wrap: wrap; gap: .25rem 1rem; color: var(--alumni-muted); font-size: .9rem; }
.alumni-survey > .btn { margin-top: auto; }
.alumni-badge { display: inline-block; border-radius: 6px; padding: .1rem .5rem; font-size: .8rem; font-weight: 500; }
.alumni-badge-todo { background: #EEF0F1; color: #3E4A50; }
.alumni-badge-pending { background: var(--alumni-warn-bg); color: var(--alumni-warn-text); border: 1px solid var(--alumni-accent); }
.alumni-badge-done { background: var(--alumni-success-bg); color: #1F5C3D; }
.alumni-empty { text-align: center; padding: 3rem 1rem; color: var(--alumni-muted); }
.alumni-empty .bi { font-size: 2.5rem; color: var(--alumni-brand); }

/* ---------- 填答頁 ---------- */
.alumni-prose { overflow-wrap: anywhere; }
.alumni-prose img { max-width: 100%; height: auto; }
.alumni-prose table { display: block; max-width: 100%; overflow-x: auto; }
.alumni-prose p:last-child { margin-bottom: 0; }
.alumni-section { margin-top: 1rem; }
.alumni-subsection { margin-top: 1rem; padding-left: .75rem; border-left: 3px solid var(--alumni-primary-tint); }
.alumni-section-title { margin: 0; font-size: 1.125rem; font-weight: 700; color: var(--alumni-primary); }
.topicArea p.accordion-button { width: 100%; padding: .25rem 0; background: transparent; box-shadow: none; color: var(--alumni-primary); font-weight: 700; font-size: 1.125rem; cursor: pointer; }
.topicArea p.accordion-button:not(.collapsed) { background: transparent; color: var(--alumni-primary); box-shadow: none; }
.alumni-question { margin: 0; padding: 1rem 0; border-top: 1px solid var(--alumni-border); }
.alumni-question.has-error { border-left: 3px solid var(--alumni-danger); padding-left: .75rem; }
.alumni-question-title { font-size: 1.125rem; font-weight: 700; }
.alumni-question-title p:last-child { margin-bottom: 0; }
.alumni-required { margin-right: .15rem; }
.alumni-option { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; min-height: 44px; margin-top: .5rem; padding: .6rem .75rem; background: #fff; border: 1px solid var(--alumni-border); border-radius: var(--alumni-radius-sm); }
.alumni-option:hover { border-color: #B9C2C6; }
.alumni-option:has(.form-check-input:checked) { border-color: var(--alumni-primary); background: var(--alumni-primary-tint); }
.alumni-option .form-check-input { flex: none; float: none; width: 1.25em; height: 1.25em; margin: 0; }
.alumni-option .form-check-label { cursor: pointer; }
.alumni-option .form-input { flex: 1 1 10rem; min-width: 8rem; min-height: 36px; padding: .25rem .5rem; border: 1px solid #C9C4BA; border-radius: 6px; }
.alumni-option .answer-error { flex-basis: 100%; }
/* 整列可點：把緊接在核取／選取鈕後的選項名稱 label 用 ::after 撐滿整列（相對於 .alumni-option）；
   自填框、後綴 label（不是緊接在輸入鈕之後的那個 label）、錯誤訊息與輸入鈕本身墊高一層，照樣可點、可選取文字 */
.alumni-option .form-check-input + .form-check-label::after { content: ""; position: absolute; inset: 0; }
.alumni-option .form-check-input,
.alumni-option .form-input,
.alumni-option .form-check-input + .form-check-label ~ .form-check-label,
.alumni-option .answer-error { position: relative; z-index: 1; }
.alumni-option:has(.form-check-input:disabled) { opacity: .55; }
.alumni-option:has(.form-check-input:disabled) .form-check-label { cursor: default; }
.alumni-suffix { margin-left: .5rem; align-self: center; white-space: nowrap; }
.alumni-actionbar { position: sticky; bottom: 0; z-index: 1010; display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin-top: 1.5rem; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .97); border: 1px solid var(--alumni-border); border-radius: var(--alumni-radius) var(--alumni-radius) 0 0; box-shadow: 0 -4px 12px rgba(31, 42, 46, .06); }
.alumni-save-status { flex: 1 1 100%; font-size: .875rem; color: var(--alumni-muted); }
@media (min-width: 576px) { .alumni-save-status { flex: 1 1 auto; } }
.alumni-save-status[data-state="saved"] { color: var(--alumni-success); }
.alumni-save-status[data-state="error"], .alumni-save-status[data-state="locked"] { color: var(--alumni-danger); font-weight: 500; }
.alumni-reminder { margin-top: 1rem; padding: .75rem 1rem; background: var(--alumni-warn-bg); color: var(--alumni-warn-text); border-left: 4px solid var(--alumni-accent); border-radius: 0 var(--alumni-radius-sm) var(--alumni-radius-sm) 0; }
/* 檢視模式：欄位停用但要清楚可讀，不整片灰掉 */
.is-readonly .alumni-option:has(.form-check-input:disabled) { opacity: 1; }
.is-readonly .form-check-input:disabled ~ .form-check-label { opacity: 1; }
.is-readonly .form-control:disabled { background: #fff; color: var(--alumni-text); }

/* ---------- 矩陣（量表）題：Views/Questionnaire/_Matrix.cshtml ---------- */
.alumni-matrix-grid { margin-top: .5rem; }
.alumni-matrix-headrow { border-bottom: 2px solid var(--alumni-border); }
.alumni-matrix-head { padding: .5rem .25rem; text-align: center; font-size: .875rem; font-weight: 700; color: var(--alumni-muted); overflow-wrap: anywhere; }
.alumni-matrix-row { align-items: center; padding: .5rem 0; border-top: 1px solid var(--alumni-border); }
.alumni-matrix-row:nth-child(even of .alumni-matrix-row) { background: rgba(31, 42, 46, .025); }
.alumni-matrix-row.has-error { border-left: 3px solid var(--alumni-danger); padding-left: .75rem; }
.alumni-matrix-title { padding-right: .75rem; font-weight: 700; }
.alumni-matrix-title p:last-child { margin-bottom: 0; }
/* 整格可點；手機版選項文字接在選取鈕後面，桌機版只留選取鈕對齊表頭 */
.alumni-matrix-choice { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; margin: 0; padding: .25rem .75rem .25rem 0; cursor: pointer; }
.alumni-matrix-choice .form-check-input { flex: none; float: none; width: 1.25em; height: 1.25em; margin: 0; }
.alumni-matrix-choice:has(.form-check-input:checked) span { color: var(--alumni-primary); font-weight: 700; }
.alumni-matrix-choice:has(.form-check-input:disabled) { opacity: .55; cursor: default; }
.is-readonly .alumni-matrix-choice:has(.form-check-input:disabled) { opacity: 1; }
@media (min-width: 768px) {
    .alumni-matrix-choice { display: flex; justify-content: center; padding: .25rem; }
}

/* ---------- 完成頁 ---------- */
.alumni-done { text-align: center; padding: 2rem 1.25rem; }
.alumni-done > .bi { font-size: 3rem; color: var(--alumni-success); }
.alumni-done img { max-width: 100%; height: auto; margin: 1.5rem 0 1rem; border-radius: var(--alumni-radius-sm); }