/* Console pages ported from the design review (2026-08): Services + API
   keys. The design's page-scoped <style> blocks, tokenised. Global patterns
   (card system, micro-label heads, density, pills, chips) live in
   dashboard.css and are not repeated here. No sticky-head backings, no
   !important, no inline styles or handlers (the design's inline onchange
   became the autosubmit Stimulus controller). */

/* ---- Services ---- */

/* Head: micro-label left, usage-window select hugging the right edge. */
.svc-window { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.svc-window label { margin: 0; font-size: 12.5px; color: var(--ink3); }
body:not(.landing) .svc-window select { font-size: 12.5px; padding: 4px 8px; }

body:not(.landing) .cap-input { width: 112px; box-sizing: border-box; padding: 5px 10px; font-size: 13px; font-variant-numeric: tabular-nums; }

/* "What it does" reads in full — it may take two lines; the meter and cap
   columns keep their one-line width so the table never scrolls. */
.svc-card td.svc-desc { white-space: normal; min-width: 18rem; max-width: 30rem; line-height: 1.4; }
.svc-card td.svc-meter { white-space: nowrap; }
.svc-card td.svc-cap { white-space: nowrap; }
.svc-card td.svc-cap .cell-dim { display: block; font-size: 11.5px; }

/* Month-to-date at or past its cap reads as the fence it is. */
.cell-warn { color: var(--warn); font-weight: 600; }

/* Save lives INSIDE the card, no hairline above (design: border-top 0,
   14px 0 0 padding). */
.svc-card .form-actions { border-top: 0; padding: 14px 0 0; margin: 0; }

/* ---- API keys ---- */
/* Nothing page-scoped beyond the global system: the design's api-keys
   page carries only the shared density block (already on main). */

/* A37/A38 support + feedback (console) */
.ticket-cols { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); gap: var(--space-4, 1.25rem); align-items: start; }
@media (max-width: 900px) { .ticket-cols { grid-template-columns: 1fr; } }
.ticket-side { display: grid; gap: var(--space-4, 1.25rem); }
.thread { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .75rem; }
.thread__msg { padding: .75rem 1rem; border-radius: .75rem; background: var(--surface-2, rgba(127,127,127,.08)); }
.thread__msg--operator { border-left: 3px solid var(--accent, #22d3ee); }
.thread__msg--system { opacity: .7; font-size: .9em; }
.thread__msg--internal { border-left: 3px solid var(--warn, #f59e0b); background: rgba(245,158,11,.08); }
.thread__meta { display: block; font-size: .8em; opacity: .7; margin-bottom: .25rem; }
.thread__msg p { margin: 0; white-space: pre-wrap; }
.found dt { font-weight: 600; margin-top: .5rem; }
.found dd { margin: 0 0 .25rem; }
.playbook { margin: 0 0 1rem; }
.playbook h3 { font-size: 1em; margin: 0 0 .25rem; }
.playbook ol { margin: 0; padding-left: 1.2rem; }
.ticket-actions { display: flex; align-items: center; gap: .75rem; margin-top: .75rem; flex-wrap: wrap; }
.ticket-actions form { margin: 0; display: inline; }