.settings-card.webhook-settings:not([hidden]){display:block}.webhook-settings[hidden]{display:none}.webhook-settings>.settings-card-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.webhook-settings h3{margin:0 0 16px;font-size:16px}.webhook-message:empty{display:none}.webhook-message{padding:12px 14px;border-radius:var(--radius-sm);background:var(--accent-soft);color:var(--accent)}.webhook-message[data-error="true"]{background:var(--danger-bg);color:var(--danger)}.webhook-list{display:grid;gap:10px;margin:20px 0}.webhook-row{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--inset)}.webhook-description{min-width:0;display:grid;gap:4px;overflow-wrap:anywhere}.webhook-description strong{font-size:14px}.webhook-delivery{font-size:12px;color:var(--muted)}.webhook-delivery[data-state="sent"]{color:var(--success)}.webhook-delivery[data-state="failed"]{color:var(--danger)}.webhook-delivery[data-state="retrying"]{color:var(--warning)}.webhook-empty{padding:24px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:var(--radius-sm)}.webhook-form{padding-top:22px;border-top:1px solid var(--border)}.webhook-form[hidden]{display:none}.webhook-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 24px}.webhook-grid .settings-field{margin:0;min-width:0}.webhook-grid input:not([type="checkbox"]),.webhook-grid select{width:100%;box-sizing:border-box}.webhook-grid input[type="checkbox"]{justify-self:start;width:18px;height:18px}.webhook-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 20px;padding:18px;border:1px solid var(--border);border-radius:var(--radius-sm);margin:22px 0}.webhook-options legend{font-size:13px;font-weight:650;padding:0 8px}.webhook-choice{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--text);cursor:pointer}.webhook-choice input{width:16px;height:16px;flex:0 0 16px;margin-top:3px}.webhook-advanced{border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 18px;margin:22px 0}.webhook-advanced summary{cursor:pointer;font-weight:600}.webhook-advanced .webhook-grid{padding-top:18px}.webhook-explanation{margin:20px 0}.webhook-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-top:18px;border-top:1px solid var(--border)}.webhook-actions>.hint{margin-left:auto;font-size:12px}.webhook-grid .webhook-choice{margin-top:8px}.webhook-actions .danger{color:var(--danger)}@media(max-width:800px){.webhook-options{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.webhook-grid{grid-template-columns:minmax(0,1fr)}.webhook-settings>.settings-card-heading{align-items:flex-start}.webhook-row{align-items:flex-start;flex-direction:column}.webhook-options{grid-template-columns:minmax(0,1fr)}.webhook-actions>.hint{margin-left:0;width:100%}}
.webhook-row-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.webhook-row-actions button{white-space:nowrap;font-size:12px;min-height:36px;padding:7px 11px}.webhook-row-actions .webhook-test-shortcut{color:var(--accent);border-color:var(--accent-border);background:var(--accent-soft)}.webhook-delivery[data-state="queued"]{color:var(--warning)}
.webhook-health{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:20px 0}.webhook-health[hidden]{display:none}.webhook-health-card{display:grid;gap:3px;padding:15px 18px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--inset)}.webhook-health-card strong{font-size:24px;line-height:1.3;font-variant-numeric:tabular-nums}.webhook-health-card span{font-size:11px;color:var(--muted)}.webhook-health-card[data-state="sent"] strong{color:var(--success)}.webhook-health-card[data-state="failed"] strong{color:var(--danger)}.webhook-health-card[data-state="queued"] strong{color:var(--warning)}.webhook-health>.hint{grid-column:1/-1;margin:0;font-size:11px;line-height:1.6}.webhook-delivery[data-state="unconfirmed"]{color:var(--warning)}.webhook-result-state[data-state="unconfirmed"]{color:var(--warning);background:var(--warning-bg)}@media(max-width:600px){.webhook-health{gap:7px}.webhook-health-card{padding:12px 10px}.webhook-health-card strong{font-size:21px}.webhook-health-card span{font-size:10px}.webhook-row-actions button{flex:1 1 100px}}
.webhook-service-hint{grid-column:1/-1;margin:0}.webhook-mode-summary{margin:0;font-size:11px}
.webhook-test-panel{padding:22px;margin:22px 0;border:1px solid var(--accent-border);border-radius:var(--radius);background:var(--inset)}.webhook-test-panel[hidden]{display:none}.webhook-test-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}.webhook-test-heading h3{margin:0;font-size:17px}.webhook-test-heading button{font-size:12px;min-height:32px;padding:5px 10px}.webhook-test-destination{margin:12px 0 6px;font-size:13px;font-weight:600;overflow-wrap:anywhere}.webhook-test-panel>.hint{margin:7px 0 0;line-height:1.6}.webhook-test-controls{display:flex;align-items:flex-end;gap:12px;margin-top:20px}.webhook-test-controls .settings-field{margin:0;flex:1;min-width:0;max-width:420px}.webhook-test-controls select{width:100%}.webhook-test-controls>button{flex:none;min-height:40px}.webhook-test-feedback{padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--panel);font-size:12px;line-height:1.6;color:var(--text);margin:18px 0}.webhook-test-feedback:empty{display:none}.webhook-test-feedback[data-error="true"]{color:var(--danger);background:var(--danger-bg);border-color:var(--danger-border)}
.webhook-results-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:18px;border-top:1px solid var(--border);margin-top:22px}.webhook-results-heading h4{margin:0;font-size:13px;font-weight:650}.webhook-results-heading .hint{font-size:11px;text-align:right}.webhook-results{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px;max-height:460px;overflow:auto;scrollbar-gutter:stable}.webhook-result{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:13px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm)}.webhook-result-description{min-width:0;display:grid;gap:4px}.webhook-result-title{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.webhook-result-title strong{font-size:12px;font-weight:600}.webhook-sample-label,.webhook-live-label{font-size:9px;font-weight:650;letter-spacing:.03em;text-transform:uppercase;padding:2px 6px;border-radius:5px;background:var(--accent-soft);color:var(--accent)}.webhook-live-label{background:var(--inset);color:var(--muted);border:1px solid var(--border)}.webhook-result-meta{display:flex;align-items:center;flex-wrap:wrap;gap:5px 10px;color:var(--muted);font-size:10px}.webhook-result-description>.hint{margin:0;font-size:11px;line-height:1.5;overflow-wrap:anywhere}.webhook-result-state{flex:none;font-size:10px;padding:3px 7px;border-radius:6px;color:var(--muted);background:var(--inset)}.webhook-result-state[data-state="sent"]{background:var(--success-bg);color:var(--success)}.webhook-result-state[data-state="failed"]{background:var(--danger-bg);color:var(--danger)}.webhook-result-state[data-state="queued"],.webhook-result-state[data-state="retrying"]{background:var(--warning-bg);color:var(--warning)}.webhook-results-empty{padding:22px 12px;text-align:center;font-size:12px;color:var(--muted);border:1px dashed var(--border);border-radius:var(--radius-sm)}
@media(max-width:800px){.webhook-row{align-items:flex-start}.webhook-row-actions{flex-direction:column;align-items:stretch}}@media(max-width:600px){.webhook-row-actions{flex-direction:row;flex-wrap:wrap;width:100%}.webhook-row-actions button{flex:1}.webhook-test-panel{padding:16px}.webhook-test-controls{flex-direction:column;align-items:stretch}.webhook-test-controls .settings-field{max-width:none}.webhook-results-heading{align-items:flex-start;flex-direction:column;gap:4px}.webhook-results-heading .hint{text-align:left}.webhook-result{gap:9px;padding:11px}.webhook-result-state{font-size:9px}}
