/* "Set up Avori" (public/setup-hub.js): Settings and Plugins. Rows follow the
   Settings cards: hairline dividers, quiet icon tiles, one solid action. */
.setup-hub { margin:0 0 var(--space-8, 40px); }
.setup-hub > h2 { margin:0 0 var(--space-2, 8px); font-size:16px; font-weight:500; color:var(--ink-3); }
.setup-hub-list { list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.setup-item { display:grid; grid-template-columns:36px minmax(0,1fr) auto; align-items:center; gap:var(--space-2, 8px) var(--space-4, 16px); padding:var(--space-5, 20px) var(--space-2, 8px); border-bottom:1px solid var(--line); }
.setup-item-icon { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:var(--quiet, var(--gray-soft)); color:var(--ink); align-self:start; }
.setup-item-icon svg { width:18px; height:18px; }
.setup-item-text { min-width:0; }
.setup-item-name { display:inline-block; font-size:var(--text-lg, 15px); font-weight:600; color:var(--ink); text-decoration:none; }
a.setup-item-name:hover { text-decoration:underline; text-underline-offset:3px; }
.setup-item-text p { margin:2px 0 0; font-size:var(--text-md, 14px); line-height:1.5; color:var(--ink-2); }
.setup-item-status { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-2, 8px); margin-top:var(--space-1, 4px); }
.setup-item-detail { font-size:var(--text-sm, 13px); color:var(--ink-3); }
.setup-item-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:var(--space-2, 8px); }
.setup-item-accounts { grid-column:2 / -1; }
/* Done rows are compact: no sentence, smaller padding. */
.setup-item[data-status="done"] { padding-block:var(--space-3, 12px); }
.setup-item[data-status="done"] .setup-item-icon { width:30px; height:30px; align-self:center; }
.setup-item[data-status="done"] .setup-item-name { font-size:var(--text-md, 14px); }
.setup-item[data-status="unavailable"] .setup-item-name { color:var(--ink-2); }

/* AI subscriptions: one line per vendor. */
.setup-ai-list { list-style:none; margin:0; padding:0; }
.setup-ai-row { display:flex; align-items:center; gap:var(--space-3, 12px); min-height:var(--row-h, 48px); padding:var(--space-1, 4px) 0; border-top:1px solid var(--line); }
.setup-ai-row:first-child { border-top:0; }
.setup-ai-name { font-size:var(--text-md, 14px); font-weight:500; color:var(--ink); }
.setup-ai-plan { font-size:var(--text-sm, 13px); color:var(--ink-3); }
.setup-ai-action { margin-left:auto; display:flex; align-items:center; gap:var(--space-2, 8px); }
.setup-soon { font-size:var(--text-sm, 13px); color:var(--ink-3); }
.setup-ai-row[data-ai-state="soon"] .setup-ai-name { color:var(--ink-2); }

/* Plugins with everything done: one line. */
.setup-hub-done { display:flex; flex-wrap:nowrap; align-items:center; gap:var(--space-3, 12px); padding:var(--space-3, 12px) 0; border-bottom:1px solid var(--line); margin-bottom:var(--space-6, 24px); }
.setup-hub-line { flex:1 1 auto; min-width:0; font-size:var(--text-md, 14px); color:var(--ink-2); }
.setup-hub-done .btn { flex:none; margin-left:auto; }
.integration-marketplace .setup-hub:not(.setup-hub-done) { margin-bottom:var(--space-7, 32px); }

/* Settings › AI subscriptions page: the vendor rows above the details. */
.settings-panel > .setup-ai-accounts { margin-bottom:var(--space-6, 24px); }

@media (max-width:680px) {
  .setup-item { grid-template-columns:36px minmax(0,1fr); }
  .setup-item-actions { grid-column:2; justify-content:flex-start; }
  .setup-item-accounts { grid-column:2; }
  .setup-ai-row { flex-wrap:wrap; }
  .setup-ai-plan { flex-basis:100%; order:3; margin-top:-4px; }
}