/* ---------- API y webhooks (modules/developers.js) ---------- */
.dev-tabs { margin-bottom: 16px; }
.dev-new { margin-bottom: 16px; }
.dev-form { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 12px; }
.dev-form .dev-grow { min-width: 0; }
.dev-scopes { margin-top: 14px; border-top: 1px solid var(--border); }
.dev-scope-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--border); font-size: 13.5px; }
.dev-scope-row > span { color: var(--text2); }
.segmented.sm button { height: 26px; font-size: 12px; padding: 0 10px; }
.dev-check { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.dev-check input { width: 16px; height: 16px; accent-color: var(--accent); flex-shrink: 0; }
.dev-scope-row.dev-check { flex-direction: row-reverse; justify-content: flex-end; }
.dev-events { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px 16px; margin-top: 14px; font-size: 13.5px; }
.dev-events code { font-size: 11.5px; color: var(--text3); background: none; padding: 0; }
.dev-form-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; flex-wrap: wrap; }
.dev-hint { color: var(--text3); font-size: 12.5px; }
.dev-secret { margin-bottom: 16px; border-color: var(--border-strong); }
.dev-secret-h { display: flex; justify-content: space-between; align-items: center; }
.dev-secret-h h3 { margin: 0; font-size: 15px; }
.dev-secret p { color: var(--text2); font-size: 13px; margin: 6px 0 12px; max-width: 70ch; }
.dev-secret-row { display: flex; gap: 8px; }
.dev-secret-row input { flex: 1; font-family: var(--font-mono); font-size: 12.5px; }
.dev-key { font-size: 12px; }
.dev-chips { display: flex; flex-wrap: wrap; gap: 6px; }
#devKeys tr.is-revoked td { opacity: .55; }
.dev-hook { margin-bottom: 12px; }
.dev-hook.is-off { opacity: .7; }
.dev-hook-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 10px; }
.dev-hook-main { min-width: 0; }
.dev-url { font-size: 13px; word-break: break-all; background: none; padding: 0; }
.dev-hook-actions { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; }
.dev-log { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 10px; }
.dev-log table { font-size: 13px; }
@media (max-width: 720px) {
  .dev-form { grid-template-columns: 1fr; }
  .dev-scope-row { flex-direction: column; align-items: flex-start; gap: 6px; }
  .dev-scope-row.dev-check { flex-direction: row-reverse; align-items: center; }
}