/**
 * 報名端（FarmersApplyWeb）表單與表格視覺系統
 *
 * 使用方式（不影響 Visible／後端邏輯，僅樣式；**版面請在 .aspx 標記與報名頁一致之 class**）：
 * 1. 主表單外層請與 fas2012／fas2013 相同，使用 `card fas-apply-scope`（置中選考流程可再加 `fas-apply-shell`）。
 * 2. 區塊標題：`h5.card-title…` 或 `label.card-title`／`h2|h3|h4.card-title`／`span|div.card-title` 皆會套用淡色漸層底線；**需底線橫滿卡片寬**時加 **`w-100`**（首頁專區標題、長表名等）。勿對主標加 **`d-block`**，否則底線會被撐成整欄寬。小節：`label.card-description`／`p.card-description`。
 * 3. 按鈕語意：
 *    - 送出／同意／儲存／下一步：btn btn-info（勿加 fas-btn-nav），或加 fas-btn-commit；btn-primary 請加 fas-btn-commit 以對齊主色。
 *    - 上一步／返回／取消：加 fas-btn-nav（可與 btn-info 或 btn-outline-secondary 併用，會改為外框樣式）。
 */

/* ------------------------------------------------------------------ 頁面情境（考試選擇） */
.fas-apply-shell {
    min-height: 70vh;
    padding-top: clamp(1rem, 4vw, 2.5rem);
    padding-bottom: clamp(1rem, 4vw, 2.5rem);
    background: linear-gradient(165deg, #f0fdfa 0%, #f8fafc 38%, #eef2ff 100%);
}

/* ------------------------------------------------------------------ 設計權杖 */
:is(.fas-apply-scope, .fas-apply-ui) {
    --fas-font: "Segoe UI", "Microsoft JhengHei", "PingFang TC", "Noto Sans TC", sans-serif;
    --fas-radius-xl: 1rem;
    --fas-radius: 0.65rem;
    --fas-radius-sm: 0.45rem;
    --fas-ink: #0f172a;
    --fas-ink-soft: #334155;
    --fas-muted: #64748b;
    --fas-line: rgba(15, 23, 42, 0.1);
    --fas-line-soft: rgba(15, 23, 42, 0.06);
    --fas-surface: #f8fafc;
    --fas-surface-2: #f1f5f9;
    --fas-accent: #0f766e;
    --fas-accent-2: #0d9488;
    --fas-accent-contrast: #fff;
    --fas-accent-glow: rgba(15, 118, 110, 0.22);
    --fas-card-max: min(98vw, 88rem);
    --fas-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.06), 0 12px 32px -8px rgba(15, 23, 42, 0.12);
    font-family: var(--fas-font);
    color: var(--fas-ink);
    -webkit-font-smoothing: antialiased;
}

/* 主卡片：層次、頂部色帶（不裁切下拉，避免 overflow:hidden） */
:is(.fas-apply-scope, .fas-apply-ui).card {
    position: relative;
    border: 1px solid var(--fas-line-soft);
    border-radius: var(--fas-radius-xl);
    box-shadow: var(--fas-shadow);
    max-width: var(--fas-card-max);
    margin-left: auto;
    margin-right: auto;
    background: #fff;
}

:is(.fas-apply-scope, .fas-apply-ui).card::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 4px;
    border-radius: var(--fas-radius-xl) var(--fas-radius-xl) 0 0;
    background: linear-gradient(90deg, var(--fas-accent) 0%, #6366f1 55%, #38bdf8 100%);
    pointer-events: none;
}

:is(.fas-apply-scope, .fas-apply-ui)>.card-body:first-of-type {
    padding-top: 1.5rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body {
    padding-left: clamp(0.85rem, 3.2vw, 1.75rem);
    padding-right: clamp(0.85rem, 3.2vw, 1.75rem);
}

/* 多段 card-body 區隔 */
:is(.fas-apply-scope, .fas-apply-ui) .card-body+.card-body {
    border-top: 1px solid var(--fas-line-soft);
    margin-top: 0.35rem;
    padding-top: 1.85rem;
    background: linear-gradient(180deg, rgba(248, 250, 252, 0.65) 0%, transparent 12rem);
}

/* 主標：字重（非主標之 p.card-title 等仍繼承此基礎） */
:is(.fas-apply-scope, .fas-apply-ui) .card-title {
    font-weight: 800;
    letter-spacing: 0.03em;
    line-height: 1.3;
}

/*
 * 漸層底線主標（深青字色 + 淡細漸層條；寬度預設隨標題文字）
 * 含 label／h2–h5／asp:Label 之 span／區塊用 div
 */
:is(.fas-apply-scope, .fas-apply-ui) h2.card-title,
:is(.fas-apply-scope, .fas-apply-ui) h3.card-title,
:is(.fas-apply-scope, .fas-apply-ui) h4.card-title,
:is(.fas-apply-scope, .fas-apply-ui) h5.card-title,
:is(.fas-apply-scope, .fas-apply-ui) label.card-title,
:is(.fas-apply-scope, .fas-apply-ui) div.card-title,
:is(.fas-apply-scope, .fas-apply-ui) span.card-title {
    border-bottom: none !important;
    border-color: transparent !important;
    padding-bottom: 0.75rem !important;
    margin-bottom: 1.5rem !important;
    position: relative;
    color: var(--fas-accent) !important;
    display: inline-flex;
    flex-direction: column;
    align-items: stretch;
    width: fit-content;
    max-width: 100%;
    font-size: clamp(1.08rem, 2.4vw, 1.35rem);
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) h2.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) h3.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) h4.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) h5.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) label.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) div.card-title::after,
:is(.fas-apply-scope, .fas-apply-ui) span.card-title::after {
    content: "";
    display: block;
    flex-shrink: 0;
    height: 2px;
    width: 100%;
    min-width: 2.25rem;
    margin-top: 0.4rem;
    border-radius: 999px;
    background: linear-gradient(90deg,
            rgba(15, 118, 110, 0.42) 0%,
            rgba(13, 148, 136, 0.34) 45%,
            rgba(99, 102, 241, 0.4) 100%);
}

/* 置中主標：整列寬度 + 漸層條略窄於版面 */
:is(.fas-apply-scope, .fas-apply-ui) .card-title.text-center {
    width: 100%;
    max-width: 100%;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-title.text-center::after {
    width: min(18rem, 92%);
}

/* 滿寬主標：w-100 時容器與漸層條橫跨整欄（試卷複查／試題釋疑標題、首頁專區標題等） */
:is(.fas-apply-scope, .fas-apply-ui) .card-title.w-100 {
    width: 100% !important;
    max-width: 100%;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-title.w-100::after {
    width: 100% !important;
    min-width: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-title.w-100.text-center {
    text-align: center;
}

/* 小節標（label 或 p，與 fas2012/2013 一致） */
:is(.fas-apply-scope, .fas-apply-ui) label.card-description,
:is(.fas-apply-scope, .fas-apply-ui) p.card-description {
    display: block;
    margin-top: 1.4rem;
    margin-bottom: 0.6rem;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--fas-muted);
    padding: 0.45rem 0.75rem;
    background: var(--fas-surface);
    border-radius: var(--fas-radius-sm);
    border: 1px solid var(--fas-line-soft);
    border-left: 4px solid var(--fas-accent-2);
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body>label.card-description:first-of-type,
:is(.fas-apply-scope, .fas-apply-ui) .card-body>p.card-description:first-of-type {
    margin-top: 0;
}

/* 無資料／期間內無可執行項目（列表為空時提示，取代單調紅字 Label） */
:is(.fas-apply-scope, .fas-apply-ui) .fas-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    max-width: 32rem;
    margin-left: auto;
    margin-right: auto;
    padding: 1.35rem 1.25rem 1.25rem;
    border-radius: var(--fas-radius);
    border: 1px solid rgba(203, 213, 225, 0.95);
    background: linear-gradient(165deg, #f8fafc 0%, #ffffff 52%, #f0fdfa 100%);
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-empty-state-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.1rem;
    height: 3.1rem;
    margin-bottom: 0.75rem;
    border-radius: 999px;
    color: #0f766e;
    background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%);
    border: 1px solid rgba(13, 148, 136, 0.22);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-empty-state-icon svg {
    display: block;
    opacity: 0.92;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-empty-state-title {
    display: block;
    font-size: 1rem;
    font-weight: 800;
    color: #0f172a;
    letter-spacing: 0.02em;
    line-height: 1.45;
    margin-bottom: 0.4rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-empty-state-desc {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--fas-ink-soft);
    line-height: 1.55;
    max-width: 26rem;
    margin-bottom: 0;
}

/* 欄位標籤（與 fas2012/2013 一致：含未加 font-weight-bold 之 <label>、Panel 內 label） */
:is(.fas-apply-scope, .fas-apply-ui) label.font-weight-bold:not(.card-description):not(.card-title),
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>label:not(.btn):not(.form-check-label):not(.card-title):not(.card-description):not(.col-form-label),
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>div>label:not(.btn):not(.form-check-label):not(.card-title):not(.card-description):not(.col-form-label) {
    display: block;
    margin-bottom: 0.4rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--fas-ink-soft);
    line-height: 1.35;
}

/* 報名專區「選擇年度」／報名狀況「每頁筆數」：同列標題與內文同級字級（覆寫上方欄位 label 0.9rem；含 span 之 asp:Label） */
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .d-inline-flex.flex-column.flex-sm-row.align-items-sm-center>label.font-weight-bold,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .d-inline-flex.flex-column.flex-sm-row.align-items-sm-center>span.font-weight-bold {
    font-size: 1rem;
    font-weight: 700;
    color: var(--fas-ink);
    line-height: 1.45;
}

:is(.fas-apply-scope, .fas-apply-ui) .form-text {
    margin-top: 0.35rem;
    line-height: 1.5;
    color: var(--fas-muted);
    font-size: 0.875rem;
}

/* 考試選擇／一般列：col-form-label（排除 fas-date-row，由下方日期列規則專管） */
:is(.fas-apply-scope, .fas-apply-ui) .card-body>.form-group>.col-form-label,
:is(.fas-apply-scope, .fas-apply-ui) .form-group .row:not(.fas-date-row) .col-form-label {
    display: block;
    width: 100%;
    max-width: 100%;
    padding-bottom: 0.25rem;
    margin-bottom: 0;
    font-weight: 700;
    color: var(--fas-ink-soft);
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body>.form-group>.form-control,
:is(.fas-apply-scope, .fas-apply-ui) .card-body>.form-group>select,
:is(.fas-apply-scope, .fas-apply-ui) .card-body>.form-group>.form-control-plaintext,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .form-control:not(.w-auto),
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group select.form-control:not(.w-auto) {
    width: 100%;
    max-width: 100%;
}

/*
 * input-group 內欄位：勿沿用上一段 width:100%，否則 flex 子項無法分配寬度，
 * 「驗證碼輸入 + 更新按鈕」會斷行、與圖片欄錯位（還原 Bootstrap 4 慣例）。
 */
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .input-group>.form-control,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .input-group>select.form-control {
    width: 1%;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group .input-group {
    flex-wrap: nowrap;
}

/* 驗證碼列（fas-captcha-row）：欄可縮、圖與輸入區垂直對齊 */
:is(.fas-apply-scope, .fas-apply-ui) .fas-captcha-row {
    align-items: center;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-captcha-row>[class*="col-"] {
    min-width: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-captcha-row .input-group-append .btn {
    white-space: nowrap;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-captcha-row img.img-fluid {
    width: auto;
    max-height: 3rem;
    object-fit: contain;
}

/* 驗證碼等：input-group 與主題一致 */
:is(.fas-apply-scope, .fas-apply-ui) .input-group>.form-control {
    min-height: 2.7rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .input-group-append .btn,
:is(.fas-apply-scope, .fas-apply-ui) .input-group-prepend .btn {
    min-height: 2.7rem;
    padding-left: 1rem;
    padding-right: 1rem;
    font-weight: 700;
    border-color: #cbd5e1;
}

:is(.fas-apply-scope, .fas-apply-ui) .input-group-append .btn.btn-primary,
:is(.fas-apply-scope, .fas-apply-ui) .input-group-prepend .btn.btn-primary {
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 55%, #6366f1 130%);
    border: none;
    color: #fff !important;
}

/* 輸入元件 */
:is(.fas-apply-scope, .fas-apply-ui) .form-control,
:is(.fas-apply-scope, .fas-apply-ui) select.form-control {
    border-radius: var(--fas-radius-sm);
    border-color: #cbd5e1;
    min-height: 2.7rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

:is(.fas-apply-scope, .fas-apply-ui) .form-control:hover,
:is(.fas-apply-scope, .fas-apply-ui) select.form-control:hover {
    border-color: #94a3b8;
}

:is(.fas-apply-scope, .fas-apply-ui) .form-control:focus,
:is(.fas-apply-scope, .fas-apply-ui) select.form-control:focus {
    border-color: var(--fas-accent-2);
    box-shadow: 0 0 0 0.2rem var(--fas-accent-glow);
}

:is(.fas-apply-scope, .fas-apply-ui) .form-control.bg-light,
:is(.fas-apply-scope, .fas-apply-ui) span.form-control.bg-light,
:is(.fas-apply-scope, .fas-apply-ui) label.form-control.bg-light {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
    border: 1px dashed #94a3b8 !important;
    color: var(--fas-ink-soft) !important;
}

:is(.fas-apply-scope, .fas-apply-ui) .form-control-sm {
    min-height: 2.35rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .form-control-file {
    padding: 0.5rem 0;
    font-size: 0.9rem;
}

/* fas3011 試題釋疑：附件兩步驟說明 + Bootstrap custom-file 選檔 */
:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-attach-zone {
    padding: 1rem clamp(0.85rem, 2.2vw, 1.25rem);
    border: 1px solid var(--fas-line-soft);
    border-radius: var(--fas-radius);
    background: linear-gradient(180deg, #fafbfc 0%, #fff 55%);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-attach-steps {
    line-height: 1.55;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-attach-stepnum {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 1.65rem;
    height: 1.65rem;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 65%, #6366f1 130%);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-custom-file .custom-file-input:focus ~ .custom-file-label {
    border-color: var(--fas-accent-2);
    box-shadow: 0 0 0 0.2rem rgba(13, 148, 136, 0.18);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-custom-file .custom-file-label {
    min-height: 2.75rem;
    line-height: 1.4;
    display: flex;
    align-items: center;
    color: var(--fas-ink-soft);
    border-color: #cbd5e1;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-custom-file .custom-file-input {
    min-height: 2.75rem;
    cursor: pointer;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-attach-zone>.btn.fas-btn-commit {
    width: 100%;
}

@media (min-width: 576px) {
    :is(.fas-apply-scope, .fas-apply-ui) .fas-dispel-attach-zone>.btn.fas-btn-commit {
        width: auto;
    }
}

/* ------------------------------------------------------------------ 內層表單項通用（與 fas2012/2013 對齊；僅樣式） */
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group {
    margin-bottom: 1.05rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group:last-child {
    margin-bottom: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group.form-row,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-row {
    margin-bottom: 1rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>span+select,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>span+.form-control,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>label+select,
:is(.fas-apply-scope, .fas-apply-ui) .card-body .form-group>label+.form-control {
    margin-top: 0.3rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body textarea.form-control {
    min-height: 6.5rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body img:not([width="1"]):not([height="1"]) {
    max-width: 100%;
    height: auto;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body .table-responsive {
    margin-bottom: 0.5rem;
}

/* WebForms RadioButtonList / CheckBoxList（未包 fas-check-stack 時與加分區選項列一致） */
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="RadioButtonList"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="CheckBoxList"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="rblist"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="cbxlist"] {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 0.4rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="RadioButtonList"] td,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="CheckBoxList"] td,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="rblist"] td,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="cbxlist"] td {
    vertical-align: middle;
    padding: 0.6rem 0.85rem !important;
    border: 1px solid var(--fas-line-soft) !important;
    border-radius: var(--fas-radius-sm);
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="RadioButtonList"] input[type="radio"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="CheckBoxList"] input[type="checkbox"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="rblist"] input[type="radio"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="cbxlist"] input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    margin-right: 0.5rem;
    accent-color: var(--fas-accent);
    cursor: pointer;
    vertical-align: middle;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="RadioButtonList"] label,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="CheckBoxList"] label,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="rblist"] label,
:is(.fas-apply-scope, .fas-apply-ui) .card-body table[id*="cbxlist"] label {
    display: inline !important;
    width: auto !important;
    margin: 0 !important;
    margin-bottom: 0 !important;
    font-weight: 600;
    color: var(--fas-ink-soft);
    cursor: pointer;
    vertical-align: middle;
    font-size: inherit;
    line-height: inherit;
}

/* 卡片內 Bootstrap row／col 與多卡並排 */
:is(.fas-apply-scope, .fas-apply-ui) .card-body>.row {
    margin-left: -0.45rem;
    margin-right: -0.45rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body>.row>[class*="col-"] {
    padding-left: 0.45rem;
    padding-right: 0.45rem;
}

@media (max-width: 767.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .card-body>.row>[class*="col-md"] {
        margin-bottom: 0.75rem;
    }
}

/* 置中區塊（常見於標題＋下拉） */
:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align: center"],
:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align:center"] {
    padding: 0.35rem 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align: center"] .form-control,
:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align:center"] .form-control,
:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align: center"] select,
:is(.fas-apply-scope, .fas-apply-ui) .card-body div[style*="text-align:center"] select {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    max-width: min(100%, 28rem);
}

/* 大頭貼區塊 */
:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field {
    padding: 1rem 1.15rem;
    border-radius: var(--fas-radius);
    border: 1px solid var(--fas-line-soft);
    background: linear-gradient(180deg, #fafbfc 0%, #ffffff 100%);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-current {
    text-align: center;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-current img {
    border-radius: var(--fas-radius) !important;
    box-shadow: 0 6px 24px rgba(15, 23, 42, 0.12);
    border: 3px solid #fff !important;
    outline: 1px solid var(--fas-line-soft);
    max-width: 100%;
    height: auto;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-upload input[type="file"]#upload-photo,
:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-upload input[type="file"] {
    width: 100%;
    max-width: 100%;
    padding: 0.85rem 1rem;
    margin-top: 0.4rem;
    border: 2px dashed rgba(13, 148, 136, 0.5);
    border-radius: var(--fas-radius-sm);
    background: rgba(240, 253, 250, 0.55);
    cursor: pointer;
    font-size: 0.875rem;
    color: var(--fas-ink-soft);
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-upload input[type="file"]::file-selector-button,
:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-upload input[type="file"]::-webkit-file-upload-button {
    margin-right: 1rem;
    padding: 0.5rem 1.15rem;
    border: none;
    border-radius: var(--fas-radius-sm);
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 100%);
    color: #fff;
    font-weight: 700;
    font-size: 0.8125rem;
    cursor: pointer;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-field-upload input[type="file"]:hover {
    border-color: var(--fas-accent-2);
    background: rgba(240, 253, 250, 0.9);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-preview {
    margin-top: 1rem !important;
    padding: 0.85rem;
    border-radius: var(--fas-radius-sm);
    background: var(--fas-surface-2);
    border: 1px solid var(--fas-line-soft);
    text-align: center;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-photo-preview #cropped-result {
    box-shadow: 0 4px 18px rgba(15, 23, 42, 0.12);
}

/* 主行為按鈕：送出／同意／儲存／下一步 — 使用 btn-info，或加 fas-btn-commit（勿加 fas-btn-nav） */
:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-info:not(.fas-btn-nav) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 45%, #6366f1 130%);
    border: none;
    color: var(--fas-accent-contrast) !important;
    box-shadow: 0 4px 14px rgba(15, 118, 110, 0.35);
    border-radius: var(--fas-radius-sm);
    padding: 0 1.35rem;
    min-height: 2.75rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-info:not(.fas-btn-nav):hover {
    filter: brightness(1.05);
    box-shadow: 0 6px 18px rgba(15, 118, 110, 0.4);
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-info:not(.fas-btn-nav):focus {
    box-shadow: 0 0 0 0.2rem var(--fas-accent-glow), 0 4px 14px rgba(15, 118, 110, 0.35);
}

/* 導覽／返回／取消／上一步 — 加 class="fas-btn-nav"（可與 btn-info、btn-outline-secondary 併用） */
:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-nav,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-nav {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    color: var(--fas-accent) !important;
    border: 1px solid var(--fas-accent) !important;
    box-shadow: none !important;
    font-weight: 700;
    min-height: 2.75rem;
    padding: 0 1.2rem;
    line-height: 1.25;
    letter-spacing: 0.03em;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-nav:hover,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-nav:hover {
    background: rgba(15, 118, 110, 0.09) !important;
    filter: none;
    color: var(--fas-accent) !important;
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-nav:focus,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-nav:focus {
    box-shadow: 0 0 0 0.2rem var(--fas-accent-glow) !important;
}

/* 明確「確認送出」類：Bootstrap btn-primary 可再加 fas-btn-commit 與 btn-info 視覺對齊 */
:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-commit,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-commit,
:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-primary.fas-btn-commit,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.btn-primary.fas-btn-commit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 45%, #6366f1 130%) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 4px 14px rgba(15, 118, 110, 0.35);
    border-radius: var(--fas-radius-sm);
    padding: 0 1.35rem;
    min-height: 2.75rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.04em;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-commit:hover,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-commit:hover,
:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-primary.fas-btn-commit:hover,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.btn-primary.fas-btn-commit:hover {
    filter: brightness(1.05);
    box-shadow: 0 6px 18px rgba(15, 118, 110, 0.4);
}

:is(.fas-apply-scope, .fas-apply-ui) .btn.fas-btn-commit:focus,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.fas-btn-commit:focus,
:is(.fas-apply-scope, .fas-apply-ui) .btn.btn-primary.fas-btn-commit:focus,
:is(.fas-apply-scope, .fas-apply-ui) a.btn.btn-primary.fas-btn-commit:focus {
    box-shadow: 0 0 0 0.2rem var(--fas-accent-glow), 0 4px 14px rgba(15, 118, 110, 0.35);
}

:is(.fas-apply-scope, .fas-apply-ui) .form-inline {
    gap: 0.6rem;
}

@media (max-width: 575.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .form-inline {
        flex-direction: column;
        align-items: stretch !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .form-inline .btn {
        width: 100%;
        margin: 0 !important;
    }
}

/* 日期列：年／月／日與「年」「月」「日」標籤一律垂直置中（form-row 或 Bootstrap row 皆可） */
:is(.fas-apply-scope, .fas-apply-ui) .fas-date-row.form-row,
:is(.fas-apply-scope, .fas-apply-ui) .fas-date-row.row {
    align-items: center;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>.col-form-label {
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    display: flex;
    align-items: center;
    align-self: center;
    min-height: 2.7rem;
    line-height: 1.2;
    color: var(--fas-muted);
    font-weight: 700;
}

@media (min-width: 768px) {
    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>[class*="col-"] {
        display: flex;
        align-items: center;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>[class*="col-"]>.form-control,
    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>[class*="col-"] select {
        width: 100%;
    }
}

@media (max-width: 767.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row.form-row,
    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row.row {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto;
        align-items: center;
        column-gap: 0.25rem;
        row-gap: 0.45rem;
        margin-left: 0;
        margin-right: 0;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>[class*="col-"] {
        width: 100% !important;
        max-width: none !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        display: block;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .fas-date-row>.col-form-label {
        min-height: 0;
        align-self: center;
        justify-content: center;
    }
}

@media (max-width: 767.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) .form-group>.col-md-2.pl-0,
    :is(.fas-apply-scope, .fas-apply-ui) .form-group>div.col-md-2 {
        flex: 0 0 100%;
        max-width: 100%;
        width: 100%;
        padding-left: 0 !important;
    }
}

/* 核取／單選區（加分資格、特殊試場、應具證照等） */
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 1rem 1.15rem;
    border-radius: var(--fas-radius);
    border: 1px solid var(--fas-line-soft);
    background: linear-gradient(165deg, #fafafa 0%, #ffffff 55%);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack>label.font-weight-bold:first-child {
    margin-top: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table input[type="radio"],
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table input[type="checkbox"] {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0.1rem 0.5rem 0 0 !important;
    vertical-align: middle;
    display: inline-block;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table input[type="radio"]+label,
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table input[type="checkbox"]+label {
    display: inline !important;
    width: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    font-weight: 600;
    vertical-align: middle;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack>.fas-check-item {
    padding: 0.65rem 0.9rem;
    border: 1px solid var(--fas-line-soft);
    border-radius: var(--fas-radius-sm);
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

/* WebForms 控制項 Visible=false 時不會輸出，但外層靜態 div 仍會留下 — 隱藏無內容的列 */
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item:empty,
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item:not(:has(input, select, textarea)) {
    display: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    min-height: 0 !important;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item-select .form-control {
    width: 100%;
    max-width: none;
    margin: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item input[type="checkbox"],
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item input[type="radio"] {
    width: 1.15rem;
    height: 1.15rem;
    margin: 0.15rem 0.65rem 0 0;
    accent-color: var(--fas-accent);
    cursor: pointer;
    vertical-align: top;
    flex-shrink: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item>span {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.45rem;
    width: 100%;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item input[type="checkbox"]+label,
:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item input[type="radio"]+label {
    display: inline !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    font-weight: 600;
    color: var(--fas-ink-soft);
    line-height: 1.45;
    cursor: pointer;
    vertical-align: top;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-item span label {
    font-weight: 600;
    color: var(--fas-ink-soft);
    line-height: 1.45;
    cursor: pointer;
    margin: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 0.45rem;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table tr {
    display: block;
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table td {
    display: block;
    width: 100% !important;
    padding: 0.65rem 0.9rem !important;
    border: 1px solid var(--fas-line-soft) !important;
    border-radius: var(--fas-radius-sm);
    background: #fff;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
}

:is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack table td label {
    font-weight: 600;
    color: var(--fas-ink-soft);
    margin: 0;
    cursor: pointer;
    line-height: 1.45;
}

@media (max-width: 767.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .fas-check-stack {
        padding: 0.85rem 0.9rem;
    }
}

/* 表格 */
:is(.fas-apply-scope, .fas-apply-ui) .table-responsive {
    -webkit-overflow-scrolling: touch;
    border-radius: var(--fas-radius);
    border: 1px solid var(--fas-line-soft);
    margin-bottom: 0.6rem;
    background: #fff;
    scrollbar-width: thin;
}

@media (min-width: 768px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive .table thead th {
        position: sticky;
        top: 0;
        z-index: 2;
        box-shadow: 0 1px 0 var(--fas-line-soft);
    }
}

:is(.fas-apply-scope, .fas-apply-ui) .table {
    margin-bottom: 0;
}

:is(.fas-apply-scope, .fas-apply-ui) .table thead th {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--fas-ink-soft);
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
    border-color: var(--fas-line-soft);
    white-space: nowrap;
}

:is(.fas-apply-scope, .fas-apply-ui) .table-bordered th,
:is(.fas-apply-scope, .fas-apply-ui) .table-bordered td {
    border-color: #e2e8f0;
}

:is(.fas-apply-scope, .fas-apply-ui) .dropdown-cell .form-control+.form-control,
:is(.fas-apply-scope, .fas-apply-ui) .textbox-cell .form-control+.form-control {
    margin-top: 0.4rem;
}

@media (max-width: 767.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive {
        box-shadow: inset -14px 0 14px -14px rgba(15, 23, 42, 0.1);
    }
}

/*
 * 「主要經歷」等：窄螢幕改為以 data-label 與內容對齊（僅 .fas-responsive-stack）。
 * 勿用於雙表頭／多年度考核表；升等考核表請用 .fas-assessment-table + 橫向捲動。
 */
@media (max-width: 767.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive>.responsive-table.fas-responsive-stack {
        display: block;
        width: 100%;
        overflow-x: visible;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack thead,
    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack tbody,
    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack tr {
        display: block;
        width: 100%;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack thead tr {
        margin-bottom: 0.35rem;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack thead th {
        display: block;
        text-align: center;
        border-radius: var(--fas-radius-sm);
        background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 55%, #6366f1 130%);
        color: #fff !important;
        font-weight: 800;
        padding: 0.5rem 0.75rem;
        border-color: transparent !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack thead th:not(:first-child) {
        display: none;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack tbody tr {
        margin-bottom: 0.65rem;
        padding-bottom: 0.35rem;
        border-bottom: 1px solid var(--fas-line-soft);
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack tbody tr:last-child {
        margin-bottom: 0;
        padding-bottom: 0;
        border-bottom: none;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-end;
        gap: 0.45rem 0.65rem;
        text-align: right;
        border-color: #e2e8f0 !important;
        border-radius: var(--fas-radius-sm);
        margin-bottom: 0.4rem;
        padding: 0.55rem 0.65rem !important;
        background: #fff;
        min-height: 2.75rem;
        box-sizing: border-box;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td::before {
        content: attr(data-label);
        flex: 1 1 auto;
        text-align: left;
        color: var(--fas-accent);
        font-weight: 800;
        float: none;
        margin-right: 0;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td:not([data-label])::before,
    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td[data-label=""]::before {
        display: none;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td[data-label="經歷"]::before {
        content: "經歷：";
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td[data-label="服務年資"]::before {
        content: "服務年資：";
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.fas-exp-separator {
        justify-content: center;
        text-align: center;
        min-height: 2.25rem;
        font-weight: 700;
        color: var(--fas-ink-soft);
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.fas-exp-separator::before {
        display: none !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.dropdown-cell,
    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.textbox-cell {
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        text-align: left;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.dropdown-cell::before,
    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td.textbox-cell::before {
        flex: 0 0 auto;
        width: 100%;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .responsive-table.fas-responsive-stack td .form-control {
        width: 100% !important;
        max-width: 100%;
        min-width: 0;
    }
}

/* 升等／職等：考核評定年度表 — 窄螢幕維持表格式，以 .table-responsive 橫向捲動承載多欄 */
@media (max-width: 1199.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive>table.fas-assessment-table {
        min-width: 62rem;
    }

    /* 覆寫頁內 .dropdown-cell 固定 150px，縮短橫向捲動距離但仍可點選 */
    :is(.fas-apply-scope, .fas-apply-ui) .fas-assessment-table .dropdown-cell {
        min-width: 6.85rem;
    }
}

/* DataGrid 報名狀況（fas2013 dg_applydata：表頭／表身；儲存格內列印連結等不套 fas-btn；底部分頁數字與表外上下頁套用主題） */
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table {
    font-size: 0.875rem;
    width: 100%;
    margin-bottom: 0;
    table-layout: auto;
}

/* 中小螢幕：維持「一列一筆」表格語意，以 .table-responsive 橫向捲動承載欄寬（勿強制壓縮成直排） */
@media (max-width: 1199.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive>table.dg-applydata-table {
        min-width: 56rem;
    }
}

/* DataGrid 准考證列印／成績單列印（fas2015、fas2016：與報名狀況表同主題；動作鈕用 btn-info + fas-btn-commit） */
:is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table {
    font-size: 0.875rem;
    width: 100%;
    margin-bottom: 0;
    table-layout: auto;
}

@media (max-width: 1199.98px) {
    :is(.fas-apply-scope, .fas-apply-ui) .table-responsive>table.dg-admissprint-table {
        min-width: 44rem;
    }
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table thead th,
:is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table tbody td {
    padding: 0.65rem 0.55rem;
    vertical-align: middle;
    border-color: #e2e8f0;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table tbody td .dg-admissprint-actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table tbody td .dg-admissprint-actions>a.btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    max-width: 100%;
    margin: 0 !important;
    box-sizing: border-box;
    white-space: normal;
    text-align: center;
    line-height: 1.25;
}

@media (max-width: 767.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table tbody td .dg-admissprint-actions {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 0.25rem 0.35rem;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-admissprint-table tbody td .dg-admissprint-actions>a.btn {
        width: auto !important;
        flex: 0 1 auto;
    }
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table thead th,
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) td {
    padding: 0.65rem 0.55rem;
    vertical-align: middle;
    border-color: #e2e8f0;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table thead th.dg-applydata-printcell,
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) td.dg-applydata-printcell {
    min-width: 15rem;
    box-sizing: border-box;
}

/*
 * 表單列印欄（.dg-applydata-printstack）：直向堆疊、每顆按鈕全寬（寬／窄螢幕一致，避免侵入鄰欄）。
 */
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.35rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>a.btn,
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>input[type="submit"].btn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    vertical-align: middle !important;
    line-height: 1.25 !important;
    box-sizing: border-box;
    height: auto !important;
    min-height: 2.35rem;
    padding: 0.42rem 0.65rem !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100%;
    white-space: normal !important;
    text-align: center;
}

/* 寬螢幕：表單列印欄已設 min-width，按鈕單行顯示較易讀 */
@media (min-width: 768px) {

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>a.btn,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>input[type="submit"].btn {
        white-space: nowrap !important;
    }
}

/* DataGrid 內建分頁列（頁碼為主題小鈕；PagerStyle 可能套在 tr 或 td） */
:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table tr.dg-applydata-pager td,
:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table td.dg-applydata-pager {
    padding: 0.65rem 0.5rem !important;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%) !important;
    border-top: 1px solid var(--fas-line-soft);
    text-align: center;
    vertical-align: middle;
}

/*
 * 數字頁碼：目前頁常為 Disabled LinkButton → 輸出 <span>，故勿只寫 a.dg-pager-num。
 * 以 .dg-pager-num / .dg-pager-num-current 選取；並補上未加上 class 的 __doPostBack 連結。
 */
:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table .dg-applydata-pager .dg-pager-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.15rem;
    min-height: 2.15rem;
    padding: 0.28rem 0.5rem;
    margin: 0.12rem;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    border-radius: var(--fas-radius-sm);
    border: 1px solid #cbd5e1;
    background: #fff;
    color: var(--fas-ink-soft) !important;
    text-decoration: none !important;
    box-sizing: border-box;
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table .dg-applydata-pager a.dg-pager-num:hover {
    border-color: var(--fas-accent-2);
    color: var(--fas-accent) !important;
    background: #f0fdfa;
}

:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table .dg-applydata-pager .dg-pager-num-current {
    background: linear-gradient(135deg, var(--fas-accent) 0%, #0d9488 55%, #6366f1 130%);
    border-color: transparent;
    color: #fff !important;
    font-weight: 800;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.08);
}

/* ItemDataBound 未套上 class 時，分頁列內仍顯示數字連結 */
:is(.fas-apply-scope, .fas-apply-ui) table.dg-applydata-table .dg-applydata-pager a[href*="__doPostBack"]:not([class*="dg-pager-num"]) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.15rem;
    min-height: 2.15rem;
    padding: 0.28rem 0.5rem;
    margin: 0.12rem;
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.2;
    border-radius: var(--fas-radius-sm);
    border: 1px solid #cbd5e1;
    background: #fff;
    color: var(--fas-ink-soft) !important;
    text-decoration: none !important;
    box-sizing: border-box;
}

/* 表格外：上一頁／頁數徽章／下一頁（與全站 fas-btn-nav 一致；此處僅補版面與 disabled） */
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav {
    margin-top: 0.85rem;
    padding: 0.6rem 0.75rem;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    border: 1px solid var(--fas-line-soft);
    border-radius: var(--fas-radius-sm);
    gap: 0.6rem;
    width: 100%;
    box-sizing: border-box;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav a.btn.btn-sm.fas-btn-nav.dg-applydata-navbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 5.5rem;
    min-height: 2.65rem;
    padding: 0 0.85rem;
    line-height: 1.25;
    text-decoration: none !important;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav .dg-applydata-navbtn.aspNetDisabled,
:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav a.dg-applydata-navbtn[disabled] {
    opacity: 0.42;
    pointer-events: none;
    cursor: not-allowed;
}

:is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav .dg-pager-info-badge {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--fas-ink-soft);
    background: #fff;
    border: 1px solid var(--fas-line-soft);
    border-radius: 999px;
    padding: 0.35rem 0.95rem;
    white-space: nowrap;
}

@media (max-width: 767.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table td,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table th {
        vertical-align: middle !important;
        padding: 0.55rem 0.45rem !important;
    }

    /*
     * 表單列印（.dg-applydata-printstack）：窄螢幕仍一列一顆、全寬（與寬螢幕相同直向堆疊）；其餘欄位若有 .form-control 仍適用下列規則。
     */
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table .form-control,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table a.form-control {
        display: inline-flex !important;
        width: auto !important;
        max-width: 100%;
        margin: 0.18rem 0.35rem 0.18rem 0 !important;
        text-align: center;
        white-space: nowrap;
        height: auto !important;
        min-height: 2.05rem;
        font-size: 0.78rem;
        padding: 0.38rem 0.55rem !important;
        line-height: 1.25 !important;
        box-sizing: border-box;
        vertical-align: middle !important;
        align-items: center;
        justify-content: center;
        border-radius: var(--fas-radius-sm);
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack {
        flex-direction: column;
        flex-wrap: nowrap;
        align-items: stretch;
        align-content: stretch;
        justify-content: flex-start;
        gap: 0.4rem;
        width: 100%;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>a.btn,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr:not(.dg-applydata-pager) .dg-applydata-printstack>input[type="submit"].btn {
        width: 100% !important;
        max-width: 100%;
        flex: 0 0 auto;
        min-width: 0;
        margin: 0 !important;
        white-space: normal !important;
        overflow-wrap: anywhere;
        word-break: break-word;
        text-align: center;
        box-sizing: border-box;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody tr.dg-applydata-pager td,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table tbody td.dg-applydata-pager {
        padding: 0.5rem 0.35rem !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table .dg-applydata-pager .dg-pager-num,
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-table .dg-applydata-pager .dg-pager-num-current {
        min-width: 1.85rem;
        min-height: 1.85rem;
        padding: 0.22rem 0.35rem;
        font-size: 0.75rem;
        margin: 0.08rem;
    }

    /* 報名狀況表格外：窄螢幕時上一頁／下一頁貼齊表格區塊左右兩側（覆寫 Bootstrap justify-content-center） */
    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav {
        flex-direction: row !important;
        flex-wrap: wrap;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 0.45rem 0.25rem;
        width: 100%;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav>div {
        width: auto !important;
        flex: 0 0 auto;
        margin-bottom: 0 !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav .dg-pager-info-badge {
        flex: 1 0 100%;
        width: 100%;
        text-align: center;
        order: 3;
    }

    :is(.fas-apply-scope, .fas-apply-ui) .dg-applydata-bottom-nav .dg-applydata-navbtn.btn {
        display: inline-flex;
        width: auto !important;
    }
}

:is(.fas-apply-scope, .fas-apply-ui) .card-footer {
    background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
    border-top: 1px solid var(--fas-line-soft);
    padding: 1.1rem clamp(0.85rem, 3.2vw, 1.75rem);
}

/* 大頭貼 */
@media (max-width: 575.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) #cropped-result,
    :is(.fas-apply-scope, .fas-apply-ui) #preview-cropped img {
        width: min(248px, 100%) !important;
        max-width: 100% !important;
        height: auto !important;
        aspect-ratio: 248 / 320;
        object-fit: cover;
        border-radius: var(--fas-radius) !important;
    }

    :is(.fas-apply-scope, .fas-apply-ui) img[id*="imgVerifyPreview"] {
        max-width: 100% !important;
        width: min(248px, 100%) !important;
        height: auto !important;
        aspect-ratio: 248 / 320;
        object-fit: cover;
        border-radius: var(--fas-radius) !important;
    }
}

@media (max-width: 767.98px) {

    :is(.fas-apply-scope, .fas-apply-ui) input.form-control,
    :is(.fas-apply-scope, .fas-apply-ui) select.form-control,
    :is(.fas-apply-scope, .fas-apply-ui) textarea.form-control {
        font-size: 16px;
    }
}

/* 最後確認 */
.lastcheck-review:is(.fas-apply-scope, .fas-apply-ui) {
    max-width: min(var(--fas-card-max), 100%);
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(0.4rem, 2.2vw, 0.85rem) !important;
    padding-right: clamp(0.4rem, 2.2vw, 0.85rem) !important;
}

.lastcheck-review:is(.fas-apply-scope, .fas-apply-ui) .alert {
    border-radius: var(--fas-radius);
    border: 1px solid rgba(13, 148, 136, 0.25);
    background: linear-gradient(135deg, #ecfdf5 0%, #f0fdfa 50%, #eef2ff 100%);
    color: var(--fas-ink-soft);
}

.lastcheck-review:is(.fas-apply-scope, .fas-apply-ui) .lc-kv-label {
    background: var(--fas-surface) !important;
    color: var(--fas-ink-soft) !important;
    border-color: var(--fas-line-soft) !important;
}

.lastcheck-review:is(.fas-apply-scope, .fas-apply-ui) .lc-section-card {
    border-color: var(--fas-line-soft) !important;
    border-radius: var(--fas-radius) !important;
}