/* Owned by package WEB-A (docs/ENTERPRISE.md): organizations, invitations, SSO sign-in, API keys, webhooks,
 * support and the status page. Builds on the tokens and components in /styles.css. */

/* ------------------------------------------------------------------------------ shared bits */
.copy-row { display: grid; grid-template-columns: minmax(120px, 190px) minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 9px; background: #fafbfc; margin: 8px 0; }
.copy-label { font-size: 11.5px; font-weight: 800; color: #45536a; }
.copy-row code { font-size: 12px; background: transparent; padding: 0; min-width: 0; }
.org-fieldset { border-top: 1px solid #edf0f3; padding-top: 14px; display: grid; gap: 10px; }
.org-fieldset:first-of-type { border-top: 0; padding-top: 0; }
.org-fieldset > legend { font-size: 13px; font-weight: 800; color: var(--ink); margin-bottom: 4px; float: left; width: 100%; }
.org-fieldset > legend + * { clear: both; }
.org-check, .org-radio { display: flex; align-items: flex-start; gap: 10px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 9px; background: #fff; cursor: pointer; }
.org-check:hover, .org-radio:hover { border-color: #c9d3de; }
.org-check:has(input:checked), .org-radio:has(input:checked) { border-color: #a9cd90; background: #f8fcf5; }
.org-check:has(input:disabled), .org-radio:has(input:disabled) { cursor: default; opacity: 0.85; }
.org-check input, .org-radio input { accent-color: #5c8a3c; width: 15px; height: 15px; margin-top: 2px; flex: none; }
.org-check > span, .org-radio > span { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12.5px; }
.org-check small, .org-radio small { color: var(--muted); font-size: 11.5px; line-height: 1.5; }
.org-check-note { margin: -4px 0 0 2px; }
.org-radio-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.org-checklist { list-style: none; padding: 0; margin: 0 0 0 4px; display: grid; gap: 6px; font-size: 12.5px; }
.org-checklist li { display: flex; align-items: flex-start; gap: 8px; }
.org-checklist li .icon { margin-top: 3px; }
.org-checklist li.done { color: #3a6f33; }
.org-checklist li.todo { color: #5b6779; }
.org-checklist li.todo .icon { color: #a7b1bf; }
.org-inline-btn { align-self: flex-start; margin-top: 4px; }
.org-add-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.org-add-row .field { flex: 1 1 220px; max-width: 360px; }
.org-narrow { max-width: 280px; }
.chip-list { list-style: none; padding: 0; margin: 6px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.chip-item { display: inline-flex; align-items: center; gap: 4px; padding: 4px 4px 4px 10px; border-radius: 999px; background: #eef5e8; border: 1px solid #d6e8c8; font-size: 12px; font-weight: 700; color: #36572a; }
.chip-item .muted { font-weight: 600; font-size: 10.5px; }
.chip-remove { display: inline-grid; place-items: center; width: 24px; height: 24px; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.chip-remove:hover { background: #d9ebcb; }
.org-facts { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 18px; margin: 4px 0; }
.org-facts dt { font-size: 10px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--muted); font-weight: 800; }
.org-facts dd { font-size: 12.5px; margin-top: 2px; min-width: 0; overflow-wrap: anywhere; }
.org-facts .span-all { grid-column: 1 / -1; }
.org-bullets { margin: 8px 0 14px; padding-left: 18px; font-size: 12.5px; color: #45536a; display: grid; gap: 5px; }
.org-tools { margin: 0 0 10px; gap: 8px; }
.org-toggle { padding: 0; }
.org-more { margin-top: 14px; }
.org-legend { margin-top: 14px; border: 1px solid var(--border); border-radius: 10px; padding: 0 14px; background: #fafbfc; }
.org-legend summary { cursor: pointer; padding: 10px 0; font-weight: 800; font-size: 12.5px; }
.org-legend[open] { padding-bottom: 12px; }
.org-legend dl { display: grid; gap: 8px; }
.org-legend dl > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px; font-size: 12.5px; }
.org-legend dt { font-weight: 800; }
.org-legend .table-wrap { margin-top: 4px; }
.org-steps { margin: 0 0 6px; padding-left: 20px; display: grid; gap: 14px; font-size: 12.5px; color: #45536a; }
.org-steps li > div { margin-top: 7px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.org-danger { border-color: #f0d3d1; }
.org-danger .panel-header { background: #fffafa; }
.org-test-error { overflow-wrap: anywhere; margin-top: 4px; }
.org-json summary { cursor: pointer; list-style-position: inside; }
.org-json summary code, .org-json-inline { font-size: 11px; background: transparent; padding: 0; }
.org-json pre { margin: 6px 0 0; padding: 8px 10px; background: #f5f7f9; border-radius: 7px; font: 11px/1.5 var(--mono); white-space: pre-wrap; overflow-wrap: anywhere; max-width: 420px; }
.org-details-cell { min-width: 180px; max-width: 360px; }
.org-filter-btns { align-self: flex-end; }
.small-link { font-size: 11.5px; }

/* --------------------------------------------------------------------------- organization */
.org-layout .dash-main { min-width: 0; }
.org-nav { padding: 8px; }
.org-nav a { padding: 9px 12px; }
.org-new-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 22px; align-items: start; padding-bottom: 60px; }
.org-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.org-list-link { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border: 1px solid var(--border); border-radius: 10px; color: var(--ink); }
.org-list-link:hover { border-color: #c9d3de; background: #fafbfc; }
.org-list-main { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.org-list-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.org-role-select { min-width: 120px; }
.org-role-row { flex: 0 1 180px !important; }
.org-domains { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.org-domain { border: 1px solid var(--border); border-radius: 11px; padding: 14px 15px; }
.org-domain-name { font-size: 14px; margin-right: 6px; overflow-wrap: anywhere; }
.org-domain .note { margin-top: 8px; }
.org-record { margin-top: 6px; }
.org-sso-status { margin-bottom: 12px; padding: 12px 14px; border-radius: 10px; background: #fafbfc; border: 1px solid var(--border); }
.org-sso-status .badge-row { margin: 0 0 6px; gap: 6px; }
.org-sso-part { display: grid; gap: 6px; }
.org-sso-part .form-grid { margin-top: 4px; }
.org-cert { margin-top: 10px; padding: 10px 12px; border: 1px dashed #c9d3de; border-radius: 9px; }

/* The shell hides the chip's label on small screens (enterprise-shell.css); keep its icon visible. */
@media (max-width: 630px) { .org-chip .icon { display: inline-flex; } .org-chip { padding: 6px 8px; } }

/* ------------------------------------------------------------------------- org banner */
.org-problem-banner { background: var(--warn-bg); border-bottom-color: var(--warn-border); }
.org-problem-banner .banner-row { flex-wrap: wrap; }

/* ----------------------------------------------------------------------------- sign-in */
.auth-sso-btn { margin-top: 2px; }
.auth-sso-prompt { display: flex; gap: 10px; align-items: flex-start; padding: 12px 13px; border-radius: 10px; background: #eef3fb; border: 1px solid #d3def0; color: #2a4a7a; font-size: 12.5px; margin: 2px 0 4px; }
.auth-sso-prompt .icon { margin-top: 2px; }
.auth-sso-prompt p { margin: 0 0 8px; }
#login-sso-hint:empty, #register-sso-hint:empty { display: none; }
.invite-card { max-width: 480px; }
.invite-actions { display: grid; gap: 10px; margin-top: 6px; }
.invite-facts { display: grid; gap: 8px; margin: 4px 0 18px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 11px; background: #fafbfc; }
.invite-facts > div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 10px; font-size: 13px; }
.invite-facts dt { color: var(--muted); font-weight: 700; }
.invite-card .btn-full + .btn-full { margin-top: 10px; }
.invite-card .dash-note { margin-top: 0; }

/* ----------------------------------------------------------------------------- API keys */
.key-access { display: grid; gap: 8px; }
.key-access > legend { font-size: 11.5px; color: #45536a; font-weight: 800; margin-bottom: 6px; }
.scope-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
.scope-name { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.scope-list code { font-size: 10.5px; }

/* ----------------------------------------------------------------------------- webhooks */
.wh-list { display: grid; gap: 0; }
.wh-head { min-width: 0; flex: 1 1 300px; }
.wh-url { font: 700 14px var(--mono); letter-spacing: 0; }
.wh-facts { margin-bottom: 14px; }
.wh-actions { gap: 8px; }
.wh-picker { display: grid; gap: 8px; }
.wh-picker > legend { font-size: 11.5px; color: #45536a; font-weight: 800; margin-bottom: 6px; }
.wh-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.wh-groups[hidden] { display: none; }
.wh-group { border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; min-width: 0; }
.wh-group > legend { font-size: 12px; font-weight: 800; padding: 0 4px; }
.wh-group .check-row { padding: 3px 0; }
.wh-group code { font-size: 11px; }
.wh-wild { font-weight: 700; }
.wh-types { display: grid; padding-left: 4px; }
.wh-optin { background: #fbfaf5; border-color: var(--warn-border); }
.wh-optin-area + .wh-optin-area { margin-top: 10px; border-top: 1px solid #efe7cf; padding-top: 8px; }
.wh-optin-area .note { margin: 0 0 2px; }
.wh-deliveries { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.wh-delivery { border: 1px solid var(--border); border-radius: 10px; padding: 11px 12px; display: grid; gap: 6px; }
.wh-delivery .history-meta { margin-top: 0; }
.wh-error { color: #8f302c; overflow-wrap: anywhere; margin: 0; }

/* ------------------------------------------------------------------------------- support */
.sup-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 22px; align-items: start; padding-bottom: 60px; }
.sup-layout > * { min-width: 0; }
.sup-filter { min-width: 170px; }
.sup-item .history-title a:hover { text-decoration: underline; }
.sup-item .badge-row { margin-top: 8px; }
.sup-targets { display: grid; gap: 6px; margin: 6px 0 4px; }
.sup-targets > div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid #f0f2f5; font-size: 12.5px; }
.sup-targets dt { font-weight: 800; }
.sup-targets dd { text-align: right; }
.sup-thread { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 12px; }
.sup-msg { border: 1px solid var(--border); border-radius: 11px; padding: 11px 13px; background: #fff; max-width: 92%; }
.sup-msg.mine { justify-self: end; background: #f3f9ee; border-color: #dcecd0; }
.sup-msg.support { background: #f2f6fd; border-color: #d9e3f4; }
.sup-msg-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 5px; font-size: 12.5px; }
.sup-msg-head .muted { margin-left: auto; }
.sup-msg-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; line-height: 1.6; }
.sup-facts { grid-template-columns: 1fr; margin-bottom: 14px; }
.sup-ticket .back-link { margin-bottom: 6px; }

/* ------------------------------------------------------------------------------- status */
.status-section { margin: 26px 0 0; }
.status-h2 { font-size: 18px; letter-spacing: -0.03em; margin-bottom: 12px; }
.status-foot { margin-top: 26px; }
.inc-card { background: #fff; border: 1px solid var(--border); border-left: 4px solid #a7b1bf; border-radius: 11px; padding: 14px 16px; margin-bottom: 12px; }
.inc-card.imp-minor { border-left-color: #e0b83c; }
.inc-card.imp-major { border-left-color: #e07a26; }
.inc-card.imp-critical { border-left-color: #c8413b; }
.inc-head h3 { font-size: 15px; letter-spacing: -0.02em; font-family: inherit; font-weight: 800; }
.inc-updates { list-style: none; padding: 0; margin: 10px 0 0; display: grid; gap: 10px; border-left: 2px solid #edf0f3; padding-left: 12px; }
.inc-updates p { margin: 3px 0 0; font-size: 12.5px; color: #45536a; white-space: pre-line; overflow-wrap: anywhere; }
.inc-update-head { font-size: 12.5px; }
.inc-more summary { cursor: pointer; font-size: 12px; font-weight: 700; color: var(--blue); margin-top: 8px; }
.up-list { list-style: none; padding: 0; margin: 0; background: #fff; border: 1px solid var(--border); border-radius: 13px; }
.up-row { padding: 14px 18px; border-top: 1px solid #eef1f5; display: grid; gap: 7px; }
.up-row:first-child { border-top: 0; }
.up-row strong { font-size: 13px; }
.up-pct { font-size: 12.5px; font-weight: 800; color: #3a6f33; }
.up-bars { display: grid; grid-template-columns: repeat(90, minmax(0, 1fr)); gap: 1px; height: 28px; }
.up-bar { display: block; border-radius: 1.5px; background: #6cc287; min-width: 0; }
.up-bar.imp-minor { background: #e9c552; }
.up-bar.imp-major { background: #ec8e3d; }
.up-bar.imp-critical { background: #d2524b; }
.up-axis { font-size: 10.5px; color: var(--muted); }
.up-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 11px; color: var(--muted); margin: 10px 2px 4px; }
.up-legend > span { display: inline-flex; align-items: center; gap: 6px; }
.up-legend .up-bar { width: 10px; height: 10px; }

/* ----------------------------------------------------------------------------- responsive */
@media (max-width: 960px) {
  .sup-layout { grid-template-columns: 1fr; }
  .org-new-grid { grid-template-columns: 1fr; }
}
@media (max-width: 630px) {
  .copy-row { grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; }
  .copy-row .copy-label { grid-column: 1 / -1; }
  .org-radio-row, .scope-list, .wh-groups { grid-template-columns: 1fr; }
  .org-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .org-legend dl > div, .invite-facts > div { grid-template-columns: 1fr; gap: 2px; }
  .up-row { padding: 12px 14px; }
  .up-bars { height: 24px; gap: 0.5px; }
  .sup-msg { max-width: 100%; }
  .org-add-row .field { max-width: none; }
}
