/* All original routes and controls remain available. */
.task-grid,.permission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:1rem;margin:1rem 0}
.task-card,.quota-shared,.new-user-guide{border:1px solid #d6dfea;border-radius:.65rem;padding:1rem;background:#fff}
.task-card h2{font-size:1.15rem;margin:0 0 .45rem}.task-card p,.form-text{color:#49576a;line-height:1.65}
.permission-choice{display:flex;align-items:flex-start;gap:.65rem;padding:.75rem;border:1px solid #d6dfea;border-radius:.4rem}
.permission-choice input{margin-top:.2rem;min-width:1.1rem;min-height:1.1rem}.validity-fields{display:flex;gap:.5rem}
.site-time{font-size:.9rem;color:#49576a}details>summary{cursor:pointer;padding:.65rem 0}
dialog{max-width:min(92vw,740px);max-height:85vh;overflow:auto;border:1px solid #ccd5e0;border-radius:.75rem;padding:1.5rem}
dialog::backdrop{background:#13264080}dialog dl,.quota-shared dl{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
[data-dirty-message]{padding:.6rem;background:#fff3cd}.date-presets{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0}
.new-user-guide p:last-child{margin-bottom:0}code,.mono{overflow-wrap:anywhere}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #2c73b9;outline-offset:3px}
@media(max-width:640px){.validity-fields{flex-direction:column}dialog dl{grid-template-columns:1fr}.engineering-filter-form label{width:100%}}

:root{--portal-space-1:4px;--portal-space-2:8px;--portal-space-3:12px;--portal-space-4:16px;--portal-space-6:24px;--portal-space-8:32px}
.application-page{font-size:1rem;line-height:1.5}.portal-content{min-width:0;overflow-wrap:anywhere}
.portal-content .btn,.portal-button{min-height:44px}.page-subtitle{max-width:75ch}
.task-card h2,.new-user-guide h3{font-size:1.15rem}.task-card p:last-child{margin-bottom:0}
.staff-editor-layout{container-type:inline-size}.staff-editor-columns{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.staff-editor-columns>section{min-width:0}.staff-picker>summary{font-weight:600;min-height:44px;padding:8px 0}
.staff-person{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.staff-person a{flex:1 1 100%;min-width:0;overflow-wrap:anywhere}
.staff-person .badge{white-space:normal;overflow-wrap:anywhere;max-width:100%;text-align:start;line-height:1.4}
.staff-picker .list-group{max-height:24rem;overflow-y:auto}.staff-edit>p{overflow-wrap:anywhere}
@container(min-width:960px){.staff-editor-columns{grid-template-columns:300px minmax(600px,1fr)}.staff-picker>summary{list-style:none;cursor:default}.staff-picker .list-group{max-height:none}}

.staff-edit .staff-policy-warning{color:#664d03}

/* One small native disclosure; required blockers remain adjacent and cannot hide in disabled controls. */
.contextual-guidance { margin-block: 0 12px; }
.page-guidance > summary { min-height: 44px; display: list-item; cursor: pointer; width: fit-content; padding: 10px 12px; }
.page-guidance-content { max-width: 72ch; padding: 0 12px 12px; }
.page-guidance-content > .portal-button { margin-inline-start: 12px; }
.guidance-blocker, .guidance-update { margin: 4px 0 8px; padding: 8px 12px; border-inline-start: 3px solid #86621c; }
.guidance-update:empty { display: none; }
.guidance-steps { margin-block: 8px; }

.table-scroll-hint { margin-block: 8px; color: #49576a; }
.portal-error-page { margin: 0; padding: 24px; font: 1rem/1.5 system-ui, sans-serif; color: #172638; background: #f5f7fa; }
.portal-error-page main { max-width: 64ch; margin: 8vh auto; padding: 24px; background: white; border: 1px solid #ccd5e0; border-radius: 8px; overflow-wrap: anywhere; }
.portal-error-page h1 { font-size: 1.5rem; line-height: 1.3; }
.portal-error-page a { display: inline-block; padding-block: 12px; color: #15528c; }
@media(max-width:640px) { .portal-error-page { padding: 12px; } .portal-error-page main { padding: 16px; margin-block: 24px; } }

/* MVC and jquery.validate.unobtrusive share these summary states. */
.validation-summary-valid { display: none; }

/* Long account labels and key material stay inside their local workspace. */
.portal-content select { max-width: 100%; min-width: 0; }
#l1-status { table-layout: fixed; width: 100%; min-width: 0; }
#l1-status th { white-space: normal; }
#station-install-id { font-size: 1.1rem; }
#fw-log { max-width: none; white-space: pre-wrap; }
#ota-scan-folders > summary h3 { display: inline; }

/* Permission tables retain all columns inside a keyboard-focusable local scroller. */
.engineering-grants { overflow-x: auto; max-width: 100%; min-width: 0; }

/* Only the affected permission scroller and customer request fields need containment. */
#access-title ~ .engineering-grants { position: relative; }
#request-form > .field { min-width: 0; max-width: 100%; }

/* Route-scoped readable permission words and separate result actions. */
#access-title ~ .engineering-grants { overflow-wrap: normal; word-break: normal; }
#access-title ~ .engineering-grants th, #access-title ~ .engineering-grants td { min-width: 7rem; }
#access-title ~ .engineering-grants th:first-child { min-width: 14rem; overflow-wrap: anywhere; }
#access-title ~ .engineering-grants button { white-space: nowrap; min-width: max-content; }
.issue-result { display: flex; flex-wrap: wrap; gap: 12px; }
.issue-result > .issue-summary { flex-basis: 100%; width: 100%; min-width: 0; }
.issue-result > .portal-button { display: inline-flex; align-items: center; max-width: 100%; overflow-wrap: normal; word-break: normal; }

/* Office administrator/action columns keep readable words in the local table. */
#office-table { min-width: 80rem; }
#office-table th, #office-table td { min-width: 6rem; overflow-wrap: normal; word-break: normal; }
#office-table td:nth-child(8) { min-width: 16rem; overflow-wrap: anywhere; }
#office-table td:last-child { min-width: 14rem; }
#office-table .portal-button { display: inline-flex; align-items: center; white-space: nowrap; }

/* Only confirmed narrow administrator tables need additional readable columns. */
.portal-local-table-scroll { overflow-x: auto; max-width: 100%; }
[data-readable-tables] table { min-width: 48rem; }
[data-readable-tables] th, [data-readable-tables] td { min-width: 7rem; overflow-wrap: normal; word-break: normal; }
[data-readable-tables] td:first-child { min-width: 14rem; overflow-wrap: anywhere; }
#legal-profile-form td { min-width: 16rem; }
#legal-profile-form input { width: 100%; }
#agent-table th, #agent-table td { min-width: 8rem; overflow-wrap: normal; word-break: normal; }
#agent-table td:nth-child(1), #agent-table td:nth-child(2) { min-width: 14rem; overflow-wrap: anywhere; }
#telemetry-events th, #telemetry-events td { min-width: 8rem; overflow-wrap: normal; word-break: normal; }
#telemetry-events th:first-child, #telemetry-events td:first-child { min-width: 14rem; }
.audit-table-wrap:has(.audit-time) th, .audit-table-wrap:has(.audit-time) td { min-width: 8rem; overflow-wrap: normal; word-break: normal; }
.audit-time { min-width: 14rem !important; }

/* Keep legal field labels inside their existing local table scroller. */
#legal-profile-form .table-responsive { position: relative; }

/* Member identity columns retain a visible gap even for long email addresses. */
#members-title ~ .portal-local-table-scroll th, #members-title ~ .portal-local-table-scroll td { padding-inline-end: var(--portal-space-3); }

/* Signing key headings retain natural words inside the existing local scroller. */
#keys-table { min-width: 56rem; }
#keys-table th, #keys-table td { min-width: 7rem; overflow-wrap: normal; word-break: normal; }
#keys-table th:first-child, #keys-table td:first-child { min-width: 4rem; }
#keys-table td:last-child { min-width: 14rem; }

/* 審查用表格的手機卡片版型：手機寬度（640px，與本檔其他手機規則同一個斷點）以下，
   每一列變成一張卡片，每個儲存格以「欄名：內容」各佔一行，操作放在卡片最後。
   欄名來自儲存格的 data-label（與表頭同一個多語資源）；超過斷點時表格完全維持原樣。 */
@media (max-width: 640px) {
    table.card-table { display: block; width: 100%; min-width: 0; }
    table.card-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
    table.card-table tbody, table.card-table tr, table.card-table td { display: block; }
    table.card-table tr { margin-block: 12px; padding: 6px 12px; border: 1px solid #d6dfea; border-radius: 8px; background: #fff; }
    table.card-table td { padding: 6px 0; border: 0; text-align: start; overflow-wrap: anywhere; word-break: normal; white-space: normal; }
    table.card-table td::before { content: attr(data-label); display: block; font-size: .8125rem; font-weight: 600; color: #49576a; }
    table.card-table td[data-label=""]::before, table.card-table td:not([data-label])::before { content: none; }
    table.card-table td.num { text-align: start; }
    /* ledger.css 讓申請表的客戶名稱不換行（#customer-requests td:first-child，含 ID 的選擇器權重較高），
       卡片裡名稱太長會撐出卡片；這裡用更高的權重改回可換行。縮短的憑證編號（td.mono）很短，維持不換行。 */
    #customer-requests.card-table td:first-child { white-space: normal; }
    table.card-table td.card-actions { margin-top: 6px; padding-top: 10px; border-top: 1px solid #e3e1dc; }
    table.card-table td.card-actions form { margin-bottom: 8px; }
    table.card-table td.card-actions input, table.card-table td.card-actions select { max-width: 100%; box-sizing: border-box; }
}

.portal-who .culture-switcher { display:flex; align-items:center; gap:.5rem; margin:0; width:auto; }
.portal-who .culture-switcher label { display:inline; width:auto; margin:0; white-space:nowrap; }
.portal-who .culture-switcher select { width:auto; flex:0 1 auto; }