/* ============================================================================
   LongActingSDM 個管師端元件（只放 sdm-bk-*）
   先載入前台 /LongActingSDM/site.css（色彩變數 --sdm-*、頁首、卡片、按鈕、提示框），再載入本檔。
   顏色一律使用前台的 CSS 變數；平板橫向為主，360px 寬也可完整操作。
   ============================================================================ */

/* ---- 版面：後台內容較寬（平板橫向 1024／1180） ---- */
.sdm-bk .sdm-shell {
    max-width: 1120px;
}

/* 角色切換的「個案端」是連結（前台是 button） */
.sdm-bk a.sdm-role-item {
    text-decoration: none;
}

.sdm-bk a.sdm-role-item:focus-visible {
    outline-offset: 1px;
}

/* ---- 使用者列 ---- */
.sdm-bk-userbar {
    background: var(--sdm-surface);
    border-bottom: 1px solid var(--sdm-line);
}

.sdm-bk-userbar-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 16px;
    padding-top: 8px;
    padding-bottom: 8px;
}

.sdm-bk-user {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    min-width: 0;
    font-size: 14px;
}

.sdm-bk-user-label {
    color: var(--sdm-muted);
}

.sdm-bk-user-id {
    font-family: var(--sdm-mono);
    font-weight: 600;
    color: var(--sdm-ink);
    overflow-wrap: anywhere;
}

.sdm-bk-badge {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--sdm-primary-soft);
    color: var(--sdm-primary);
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    white-space: nowrap;
}

.sdm-bk-usernav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* 「登出」是表單送出鈕（Review L3），外觀與連結相同 */
.sdm-bk-usernav a,
.sdm-bk-usernav .sdm-bk-logout {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 14px;
    border: 1px solid var(--sdm-line);
    border-radius: 999px;
    background: var(--sdm-surface);
    color: var(--sdm-primary);
    font-size: 14.3px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.sdm-bk-usernav .sdm-bk-logout {
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    font-family: inherit;
    line-height: 1;
    color: var(--sdm-ink);
    cursor: pointer;
}

@media (hover: hover) {
    .sdm-bk-usernav a:hover,
    .sdm-bk-usernav .sdm-bk-logout:hover,
    .sdm-bk a.sdm-role-item:not(.is-active):hover {
        background: var(--sdm-hover);
    }
}

/* ---- 窄卡片（登入、修改密碼） ---- */
.sdm-bk-narrow {
    max-width: 480px;
    margin: 0 auto;
}

/* ---- 表單 ---- */
.sdm-bk-field {
    margin: 0 0 16px;
}

.sdm-bk-field label {
    display: block;
    margin: 0 0 6px;
    font-size: 14.3px;
    font-weight: 600;
    color: var(--sdm-ink);
}

.sdm-bk-input {
    display: block;
    width: 100%;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid var(--sdm-input-line-strong);
    border-radius: 10px;
    background: #fff;
    font-size: 16px;
    line-height: 24px;
}

.sdm-bk-input:focus {
    outline: 2px solid var(--sdm-primary);
    outline-offset: 2px;
    border-color: var(--sdm-primary);
}

.sdm-bk-field-hint {
    margin: 6px 0 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--sdm-muted);
}

.sdm-bk-actions {
    margin: 22px 0 0;
}

.sdm-bk-note {
    margin: 16px 0 0;
    font-size: 13.5px;
    line-height: 1.6;
    color: var(--sdm-muted);
}

/* ---- 首頁 ---- */
.sdm-bk-welcome {
    margin: 0 0 6px;
    font-size: 17px;
    line-height: 1.6;
}

.sdm-bk-welcome b {
    font-family: var(--sdm-mono);
    overflow-wrap: anywhere;
}

.sdm-bk-section-title {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 700;
    color: var(--sdm-ink);
}

.sdm-bk-hospitals {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sdm-bk-hospitals li {
    padding: 6px 14px;
    border: 1px solid var(--sdm-line);
    border-radius: 999px;
    background: #fff;
    font-size: 15px;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

.sdm-bk-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sdm-bk-tile {
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 100%;
    min-height: 44px;
    padding: 14px 16px;
    border: 1px solid var(--sdm-line);
    border-radius: 14px;
    background: #fff;
    color: var(--sdm-ink);
    text-decoration: none;
}

.sdm-bk-tile b {
    color: var(--sdm-primary);
    font-size: 16px;
}

.sdm-bk-tile small {
    color: var(--sdm-muted);
    font-size: 13.5px;
    line-height: 1.5;
}

/* 建置中的功能：純文字，不是連結 */
.sdm-bk-tile.is-soon {
    background: var(--sdm-surface);
    border-style: dashed;
}

.sdm-bk-tile.is-soon b {
    color: var(--sdm-muted);
}

@media (hover: hover) {
    a.sdm-bk-tile:hover {
        border-color: var(--sdm-primary);
        background: var(--sdm-primary-soft);
    }
}

/* ---- Enter 防護鈕（不顯示，見 master 註解） ---- */
.sdm-bk-enter-guard {
    display: none;
}

/* ---- 系統管理（P3b） ---- */
.sdm-bk-adminnav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 16px;
}

.sdm-bk-adminnav a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 16px;
    border: 1px solid var(--sdm-line);
    border-radius: 999px;
    background: var(--sdm-surface);
    color: var(--sdm-primary);
    font-size: 14.3px;
    font-weight: 600;
    text-decoration: none;
}

.sdm-bk-adminnav a[aria-current="page"] {
    background: var(--sdm-primary);
    border-color: var(--sdm-primary);
    color: #fff;
}

.sdm-bk-note-top {
    margin: -6px 0 14px;
}

.sdm-bk-table-wrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.sdm-bk-table {
    width: 100%;
    /* 窄螢幕時表格在 .sdm-bk-table-wrap 內左右捲動，頁面本身不出現水平捲軸 */
    min-width: 640px;
    border-collapse: collapse;
    font-size: 14.5px;
    line-height: 1.5;
}

.sdm-bk-table th,
.sdm-bk-table td {
    padding: 10px 10px;
    border-bottom: 1px solid var(--sdm-line);
    text-align: left;
    vertical-align: middle;
}

.sdm-bk-table thead th {
    background: var(--sdm-primary-soft);
    color: var(--sdm-ink);
    font-weight: 700;
    white-space: nowrap;
}

.sdm-bk-table-compact th,
.sdm-bk-table-compact td {
    padding: 8px 8px;
    font-size: 13.5px;
}

.sdm-bk-mono {
    font-family: var(--sdm-mono);
    overflow-wrap: anywhere;
}

.sdm-bk-table td.sdm-bk-mono:not(.sdm-bk-break) {
    white-space: nowrap;
    overflow-wrap: normal;
}

.sdm-bk-muted {
    color: var(--sdm-muted);
    font-size: 12.5px;
}

.sdm-bk-nowrap {
    white-space: nowrap;
}

.sdm-bk-break {
    word-break: break-all;
}

.sdm-bk-cell-actions {
    white-space: nowrap;
}

.sdm-bk-btn-sm {
    min-height: 44px;
    padding: 6px 14px;
    font-size: 14px;
}

.sdm-bk-cell-actions .sdm-bk-btn-sm + .sdm-bk-btn-sm {
    margin-left: 6px;
}

/* 狀態標籤：顏色之外都有文字 */
.sdm-bk-status {
    display: inline-block;
    padding: 1px 10px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    line-height: 22px;
    white-space: nowrap;
}

.sdm-bk-status.is-on {
    background: var(--sdm-green-bg);
    color: var(--sdm-green);
}

.sdm-bk-status.is-off {
    background: var(--sdm-hover);
    color: var(--sdm-muted);
}

.sdm-bk-status.is-warn {
    background: var(--sdm-amber-bg);
    color: var(--sdm-amber);
}

.sdm-bk-status.is-info {
    background: var(--sdm-primary-soft);
    color: var(--sdm-primary);
}

.sdm-bk-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 0 18px;
}

.sdm-bk-span-all {
    grid-column: 1 / -1;
}

.sdm-bk-fieldset {
    min-width: 0;
    margin: 0 0 16px;
    padding: 0;
    border: 0;
}

.sdm-bk-fieldset legend {
    margin: 0 0 6px;
    padding: 0;
    font-size: 14.3px;
    font-weight: 600;
}

.sdm-bk-radios {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 18px;
}

.sdm-bk-radios input,
.sdm-bk-checks input {
    width: 20px;
    height: 20px;
    margin: 0 8px 0 0;
    vertical-align: middle;
    accent-color: var(--sdm-primary);
}

.sdm-bk-radios label,
.sdm-bk-checks label {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    cursor: pointer;
}

.sdm-bk-radios > span,
.sdm-bk-radios > input {
    display: inline-flex;
    align-items: center;
}

.sdm-bk-checks {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sdm-bk-checks li {
    display: flex;
    align-items: center;
    overflow-wrap: anywhere;
}

.sdm-bk-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.sdm-bk-temp {
    font-weight: 500;
}

.sdm-bk-temp-pwd {
    display: inline-block;
    margin: 4px 0;
    padding: 4px 10px;
    border-radius: 8px;
    background: #fff;
    color: var(--sdm-ink);
    font-family: var(--sdm-mono);
    font-size: 20px;
    letter-spacing: .08em;
}

.sdm-bk-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 14px 0 0;
}

.sdm-bk-pager-info,
.sdm-bk-count {
    color: var(--sdm-muted);
    font-size: 14px;
    font-weight: 400;
}

.sdm-bk-pager .sdm-btn[disabled] {
    color: var(--sdm-muted);
    cursor: default;
    opacity: .6;
}

/* ---- 窄螢幕 ---- */
@media (max-width: 400px) {
    .sdm-bk-usernav a {
        padding: 0 12px;
    }

    .sdm-bk-tiles {
        grid-template-columns: 1fr;
    }
}
/* ============================================================================
   P4a 個案作業（case.aspx）
   ============================================================================ */

.sdm-bk [hidden] {
    display: none !important;
}

/* ---- 案號輸入與掃描 ---- */
.sdm-bk-case-lookup {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0 14px;
}

.sdm-bk-case-lookup .sdm-bk-field {
    flex: 1 1 260px;
    max-width: 420px;
}

.sdm-bk-case-lookup .sdm-bk-actions {
    margin: 0 0 16px;
}

.sdm-bk-case-scan {
    margin-top: 8px;
}

.sdm-bk-filebtn {
    cursor: pointer;
}

.sdm-bk-filehidden {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}

.sdm-bk-filehidden:focus + .sdm-bk-filebtn,
.sdm-bk-filebtn:focus-within {
    outline: 2px solid var(--sdm-primary);
    outline-offset: 2px;
}

.sdm-bk-scan-reader {
    width: 100%;
    max-width: 360px;
    margin: 12px 0 0;
}

/* ---- 閒置提醒 ---- */
.sdm-bk-idle {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 50;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    max-width: min(520px, calc(100vw - 32px));
    padding: 14px 16px;
    border: 1px solid var(--sdm-amber-line);
    border-radius: 12px;
    background: var(--sdm-amber-bg);
    color: var(--sdm-amber);
    box-shadow: 0 6px 20px rgba(38, 36, 30, .18);
}

.sdm-bk-idle p {
    margin: 0;
    flex: 1 1 240px;
    font-size: 14.5px;
    line-height: 1.6;
}

/* ---- 個案標頭 ---- */
.sdm-bk-casecode {
    font-size: 1.15em;
    letter-spacing: .08em;
}

.sdm-bk-case-meta {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px 18px;
    margin: 0 0 14px;
}

.sdm-bk-case-meta dt {
    margin: 0;
    font-size: 13px;
    color: var(--sdm-muted);
}

.sdm-bk-case-meta dd {
    margin: 2px 0 0;
    font-size: 15px;
    font-weight: 600;
    overflow-wrap: anywhere;
}

/* ---- 燈號（顏色之外一律附文字） ---- */
.sdm-bk-light {
    display: inline-block;
    min-width: 2.2em;
    padding: 1px 10px;
    border: 1px solid currentColor;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.6;
    text-align: center;
}

.sdm-bk-light-green {
    background: var(--sdm-green-bg);
    color: var(--sdm-green);
}

.sdm-bk-light-amber {
    background: var(--sdm-amber-bg);
    color: var(--sdm-amber);
}

.sdm-bk-light-red {
    background: var(--sdm-red-bg);
    color: var(--sdm-red);
}

.sdm-bk-light-none {
    background: #fff;
    color: var(--sdm-muted);
}

/* ---- 儀表板 ---- */
.sdm-bk-dash-overall {
    margin: 0 0 14px;
    font-size: 16px;
    font-weight: 600;
}

.sdm-bk-dash-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 14px 22px;
}

.sdm-bk-dash-wide {
    grid-column: 1 / -1;
}

.sdm-bk-dash-block h3 {
    margin: 0 0 6px;
    font-size: 14.3px;
    font-weight: 700;
    color: var(--sdm-primary);
}

.sdm-bk-dash-block p {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
}

.sdm-bk-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sdm-bk-chips li {
    padding: 3px 12px;
    border: 1px solid var(--sdm-line);
    border-radius: 999px;
    background: #fff;
    font-size: 14px;
    line-height: 1.6;
}

.sdm-bk-scales {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.sdm-bk-scales li {
    display: grid;
    grid-template-columns: minmax(130px, 220px) minmax(80px, 1fr) 52px auto;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
}

.sdm-bk-bar {
    display: block;
    height: 10px;
    border-radius: 999px;
    background: var(--sdm-primary-soft);
    overflow: hidden;
}

.sdm-bk-bar-fill {
    display: block;
    height: 100%;
    background: var(--sdm-primary);
}

.sdm-bk-scale-val {
    font-family: var(--sdm-mono);
    font-size: 13.5px;
    text-align: right;
}

.sdm-bk-freetext {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.sdm-bk-lean {
    margin: 12px 0 6px;
}

.sdm-bk-leanbar {
    position: relative;
    height: 12px;
    border-radius: 999px;
    background: linear-gradient(to right, var(--sdm-primary-soft), var(--sdm-lean-end));
}

.sdm-bk-leanmark {
    position: absolute;
    top: -3px;
    width: 4px;
    height: 18px;
    margin-left: -2px;
    border-radius: 2px;
    background: var(--sdm-ink);
}

.sdm-bk-leanlabels {
    display: flex;
    justify-content: space-between;
    margin: 4px 0 0;
    font-size: 12.5px;
    color: var(--sdm-muted);
}

/* ---- 評估表單 ---- */
.sdm-bk-subtitle {
    margin: 20px 0 10px;
    padding-top: 14px;
    border-top: 1px solid var(--sdm-line);
    font-size: 15px;
    font-weight: 700;
    color: var(--sdm-primary);
}

.sdm-bk-subtitle:first-of-type {
    border-top: 0;
    padding-top: 0;
}

.sdm-bk-bmi {
    display: block;
    min-height: 44px;
    padding: 9px 0;
    font-family: var(--sdm-mono);
    font-size: 18px;
    font-weight: 700;
}

.sdm-bk-doses {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 0 18px;
}

.sdm-bk-textarea {
    min-height: 96px;
    resize: vertical;
}

.sdm-bk-narrow-field {
    max-width: 420px;
}

.sdm-bk-passcount {
    margin: 0 0 10px;
    font-size: 16px;
}

.sdm-bk-conds {
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

.sdm-bk-cond {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 12px;
    padding: 8px 0;
    border-bottom: 1px solid var(--sdm-line);
}

.sdm-bk-cond label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    cursor: pointer;
}

.sdm-bk-cond input {
    width: 20px;
    height: 20px;
    margin: 0;
    accent-color: var(--sdm-primary);
    flex: 0 0 auto;
}

.sdm-bk-cond input[disabled] {
    cursor: not-allowed;
}

.sdm-bk-cond-label {
    font-size: 15px;
    line-height: 1.5;
}

.sdm-bk-cond-state {
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}

.sdm-bk-cond-p .sdm-bk-cond-state {
    color: var(--sdm-green);
}

.sdm-bk-cond-f .sdm-bk-cond-state {
    color: var(--sdm-red);
}

.sdm-bk-cond-u .sdm-bk-cond-state {
    color: var(--sdm-muted);
}

.sdm-bk-cond-why {
    font-size: 13.5px;
    color: var(--sdm-muted);
    overflow-wrap: anywhere;
}

.sdm-bk-cond-hint {
    font-size: 13px;
    font-weight: 600;
    color: var(--sdm-accent-dark);
}

.sdm-alert ul {
    margin: 6px 0 0;
    padding-left: 20px;
    font-weight: 400;
}

@media (max-width: 400px) {
    .sdm-bk-scales li {
        grid-template-columns: 1fr 52px;
    }

    .sdm-bk-scales .sdm-bk-bar {
        grid-column: 1 / -1;
        grid-row: 2;
    }
}

#SdmCaseForm .sdm-bk-form-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
}

#SdmCaseForm .sdm-bk-radios {
    min-width: 0;
}

#SdmCaseForm .sdm-bk-radios label {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* ---- 送 CDC 審查文件（P4b） ---- */
.sdm-bk-cdc {
    margin-top: 14px;
}

.sdm-bk-cdc-meta {
    margin: 0 0 6px;
    color: var(--sdm-muted);
    font-size: 13.5px;
}

.sdm-bk-cdc-pre {
    margin: 0;
    padding: 14px 16px;
    max-height: 70vh;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    background: var(--sdm-bg);
    border: 1px solid var(--sdm-line);
    border-radius: 10px;
    color: var(--sdm-ink);
    font-family: var(--sdm-font);
    font-size: 14px;
    line-height: 1.75;
}

.sdm-bk-cdc-copymsg {
    align-self: center;
    color: var(--sdm-muted);
    font-size: 13.5px;
}

/* ---- 歷史紀錄（P5）：9 項結果符號（顏色之外一律附文字：title 與明細的文字標示） ---- */
.sdm-bk-res {
    display: inline-block;
    min-width: 1.1em;
    margin-right: 2px;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    cursor: help;
}

.sdm-bk-res.sdm-bk-cond-p {
    color: var(--sdm-green);
}

.sdm-bk-res.sdm-bk-cond-f {
    color: var(--sdm-red);
}

.sdm-bk-res.sdm-bk-cond-u {
    color: var(--sdm-muted);
}

#SdmHistTable td {
    vertical-align: top;
}