/* Interaction states shared by the account and administration workspaces. */
[hidden] { display: none !important; }
.field-error { color: var(--dg); display: block; }
[aria-invalid='true'] { border-color: var(--dg); outline: 1px solid var(--dg); }
.discard-check { margin: 14px 20px; }
.remote-picker-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.remote-picker-actions [role='status'] { font-size: 13px; color: var(--mu); }
.favorite-app { align-self: flex-start; margin: 0 16px; min-height: 36px; }
.favorite-app[aria-pressed='true'] { color: var(--ac); font-weight: 600; }
.notification-list { list-style: none; margin: 0; padding: 0; }
.notification-list li { padding: 16px 20px; border-bottom: 1px solid var(--ln); display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.notification-list li.unread { border-inline-start: 3px solid var(--ac); background: color-mix(in srgb, var(--ac) 5%, var(--sf)); }
.notification-list small { display: block; margin-top: 4px; color: var(--tx2, #56627a); }
.permission-search { width: 100%; margin-bottom: 12px; }
.dialog-head { flex-wrap: wrap; }
.dialog-head > div:first-child { flex: 1; min-width: 180px; }
@media (max-width: 600px) {
  .notification-list li { align-items: stretch; flex-direction: column; padding: 14px; }
  .notification-list .row-actions { justify-content: flex-start; }
  .remote-picker-actions > button { min-height: 44px; }
  .discard-check { margin: 10px; }
  .favorite-app { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { .favorite-app { transition: none; } }


.import-progress > .stats, .import-progress > .notice, .import-progress > .form-actions { margin: 14px; }
.import-history { margin-top: 14px; }

/* These editors include full-width sections, beyond the shared label-only rule. */
:is(.import-mapping-form, .import-row-form, .membership-form) { align-items: start; }
:is(.import-mapping-form, .import-row-form, .membership-form) > * { min-width: 0; }
:is(.import-mapping-form, .import-row-form, .membership-form) > .full { grid-column: 1 / -1; }
:is(.import-mapping-form, .import-row-form, .membership-form) > label { align-self: start; }
.import-mapping-form select { height: 44px; min-height: 44px; align-self: start; }
.import-mapping-form [data-mapping-preview], .import-mapping-form .table-wrap { width: 100%; min-width: 0; }
.membership-form > .remote-picker-actions { grid-column: 1 / -1; }

.integration-editor { align-items: start; }
.integration-editor > * { min-width: 0; }
.integration-editor > .full { grid-column: 1 / -1; }
.integration-editor label { display: grid; gap: 6px; align-self: start; }
.integration-editor .checkbox-field { display: flex; }
.integration-editor textarea { width: 100%; resize: vertical; }
.integration-client { margin: 0 0 18px; padding: 16px; border: 1px solid var(--ln); border-radius: 12px; }
.integration-client legend { padding: 0 8px; font-weight: 600; overflow-wrap: anywhere; }
.integration-client label + label { margin-top: 14px; }
.integration-review { margin: 0; display: grid; gap: 12px; }
.integration-review > div { display: grid; gap: 4px; }
.integration-review dt { color: var(--tx2, var(--mu)); font-size: 13px; }
.integration-review dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.integration-client .integration-review { margin-bottom: 14px; }
.integration-status { display: grid; justify-items: start; gap: 8px; }
.integration-actions { min-width: 190px; }
[data-integration-comparison] { margin-top: 14px; }
@media (max-width: 600px) {
  .integration-editor.form-grid.two { grid-template-columns: 1fr; }
  .integration-client { padding: 12px; }
  .integration-editor .form-actions { flex-wrap: wrap; }
}

/* Beginner integration flow; technical details remain available on demand. */
.integration-onboarding{margin-bottom:var(--space-5,20px)}
.integration-roadmap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;padding:0 20px;list-style:none}
.integration-roadmap li{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--border,#dce1ea);border-radius:10px}
.integration-roadmap span,.connection-help{font-size:13px;line-height:1.7;color:var(--text-muted,#586579)}
.integration-onboarding>.muted{padding:0 20px 16px}
.integration-guide-nav{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}
.integration-guide-chapter{border:1px solid var(--border,#dce1ea);border-radius:10px;padding:14px;margin:12px 0;line-height:1.8}
.integration-guide-chapter summary{cursor:pointer;font-weight:650}
.integration-guide-chapter li{margin:12px 0;padding-inline-start:4px}
.integration-guide-chapter article{margin:16px 0}
.integration-guide-chapter h4{margin-bottom:4px}
.integration-guide-chapter p,.connection-help{margin:8px 0}
.integration-json-dictionary>div{padding:12px 0;border-bottom:1px solid var(--border,#dce1ea)}
.integration-json-dictionary dt{overflow-wrap:anywhere;font-weight:600}
.integration-json-dictionary dd{margin:6px 0;line-height:1.7}
@media(max-width:900px){.integration-roadmap{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-onboarding .panel-head{flex-wrap:wrap}}
@media(max-width:520px){.integration-roadmap{grid-template-columns:1fr}.integration-guide-nav{flex-direction:column}}

.integration-workbook { padding: 1rem; border: 1px solid var(--bd); border-radius: 12px; margin-bottom: 1.5rem; min-width: 0; }
.integration-workbook article { margin-block: 1rem; }
.integration-workbook pre { max-width: 100%; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 1rem; background: var(--bg); border: 1px solid var(--bd); border-radius: 8px; }
.integration-workbook code, .integration-workbook dd { overflow-wrap: anywhere; }
.integration-workbook li { margin-block: .75rem; }
.workbook-picker { display: grid; gap: .5rem; margin-block: 1.25rem; }
.workbook-picker select { width: 100%; min-width: 0; }
.workbook-result { border-inline-start: 3px solid var(--ac); padding-inline-start: 1rem; }
.integration-workbook [hidden] { display: none; }

.workbook-controls { display: flex; gap: .75rem; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-block: 1rem; }
@media (max-width: 600px) { .workbook-controls { display: grid; grid-template-columns: 1fr 1fr; } .workbook-controls [role="status"] { grid-row: 1; grid-column: 1 / -1; text-align: center; } }

/* Shared progressive disclosure: secondary explanations stay available on demand. */
.context-help { margin-top: .25rem; max-width: 64rem; }
.context-help > summary { display: list-item; width: fit-content; cursor: pointer; color: var(--tx2); font-size: 12px; padding: .35rem .25rem; border-radius: 4px; }
.context-help[open] { padding: .5rem .75rem; background: var(--sf2); border: 1px solid var(--bd); border-radius: 8px; }
.context-help p { margin: .5rem 0; color: var(--tx2); }
.clean-tabs { margin-bottom: 1rem; overflow-x: auto; flex-wrap: nowrap; }
.clean-tabs button { white-space: nowrap; }
.help-trigger { font-weight: 500; }
.application-workspace > [hidden] { display: none; }

.row-more { min-width: 5rem; }
.row-more > summary { cursor: pointer; padding: .5rem; color: var(--tx2); border-radius: 6px; }
.row-more[open] { border: 1px solid var(--bd); border-radius: 6px; padding: .25rem; }
.row-more[open] > button { display: block; margin: .25rem; }

.table-options { position: relative; align-self: end; }
.table-options > summary { cursor: pointer; padding: .5rem .75rem; border: 1px solid var(--bd); border-radius: 6px; white-space: nowrap; }
.table-options-body { display: flex; flex-wrap: wrap; gap: .75rem; padding: .75rem 0; }
.table-options[open] { flex-basis: 100%; }
.page-heading .topbar-actions button span { display: inline; }
@media (max-width:600px) {
  .page-heading .topbar-actions { display: flex; flex-direction: row; flex-wrap: wrap; }
  .page-heading .topbar-actions > button { width: auto; flex: 1 1 auto; }
  .page-heading .topbar-actions > .primary-button { flex-basis: 100%; }
  .table-options { width: 100%; }
  .table-options-body > label { flex: 1 1 120px; }
}
.page-heading .primary-button span:last-child { display: inline; }

.personnel-field-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 1rem 0; }
.personnel-field-grid > div { min-width: 0; padding: .75rem; border: 1px solid var(--bd); border-radius: 8px; }
.personnel-field-grid dt { font-weight: 600; color: var(--tx); }
.personnel-field-grid dd { margin: .5rem 0 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.personnel-field-grid dd small { display:block; color:var(--tx2); margin-top:.5rem; }
.personnel-detail-tools { margin-bottom: 1rem; }
@media(max-width:600px) { .personnel-field-grid { grid-template-columns:1fr; } }

/* Application registry: fit the content width on desktop instead of scrolling sideways.
   Long identifiers truncate (full value stays in the copy button and title), badges and
   actions wrap. Below 1280px the shared horizontally scrollable table is kept so identifiers stay readable. */
@media (min-width: 1280px) {
  .table-wrap .application-table { min-width: 0; table-layout: fixed; }
  .application-table th:nth-child(1) { width: 19%; }
  .application-table th:nth-child(2) { width: 96px; }
  .application-table th:nth-child(3) { width: 14%; }
  .application-table th:nth-child(5) { width: 17%; }
  .application-table th:nth-child(6) { width: 184px; }
  .application-table th, .application-table td { padding-inline: 12px; }
  .application-table th { white-space: normal; }
  .application-table td { overflow-wrap: anywhere; }
  .application-table .copyable-value { min-width: 0; }
  .application-table .copyable-value > span { flex: 0 1 auto; max-width: none; }
  .application-table .badge { max-width: 100%; white-space: normal; line-height: 1.45; padding-block: 2px; border-radius: var(--radius-sm); }
  .application-table .integration-actions { min-width: 0; flex-direction: column; align-items: stretch; }
  .application-table .integration-actions .compact-button { min-height: 30px; padding-block: 4px; white-space: normal; text-align: left; justify-content: flex-start; line-height: 1.35; }
}