/* First-run setup wizard (admin module). Builds on the sign-in card styles in shell.css. */
.setup-backdrop[hidden] { display: none !important; }
.setup-backdrop:not([hidden]) { display: flex; overflow-y: auto; }
.setup-card { max-width: 460px; gap: 16px; padding: 28px 24px; margin: auto; }
.setup-steps { display: flex; gap: 6px; justify-content: center; list-style: none; margin-top: 12px; }
.setup-steps li { width: 28px; height: 4px; border-radius: var(--radius-pill); background: var(--border); }
.setup-steps li.active, .setup-steps li.done { background: var(--accent); }
.setup-steps li.done { opacity: 0.55; }
.setup-step { display: flex; flex-direction: column; gap: 14px; }
.setup-step[hidden], .setup-note[hidden] { display: none; }
.setup-help { font-size: 13px; color: var(--text-muted); line-height: 1.5; }
.setup-help strong { color: var(--text-main); font-weight: 600; }
.setup-hint { font-size: 12px; color: var(--text-dim); line-height: 1.4; }
.setup-note {
    padding: 12px 14px;
    border-radius: var(--radius-sm);
    background: rgba(217, 119, 6, 0.12);
    border: 1px solid rgba(217, 119, 6, 0.3);
    color: var(--warning-text);
    font-size: 13px;
    line-height: 1.5;
}
.setup-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.setup-actions { display: flex; gap: 10px; align-items: stretch; }
.setup-actions .setup-back { flex: 0 0 auto; padding: 0 18px; min-height: 44px; }
.setup-actions .auth-submit-btn { flex: 1; }
.auth-input[readonly] { color: var(--text-muted); cursor: default; }
.setup-colours { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.setup-colour { display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 11px; color: var(--text-muted); cursor: pointer; }
.setup-colour input[type="color"] {
    width: 44px; height: 32px; padding: 2px; border-radius: var(--radius-sm);
    border: 1px solid var(--border); background: var(--surface-2); cursor: pointer;
}
.setup-brand-preview {
    flex: 1; min-width: 120px; height: 44px; border-radius: var(--radius-sm);
    display: flex; align-items: center; padding: 0 12px;
    font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 15px; color: #f8fafc;
    border: 1px solid var(--border); overflow: hidden; white-space: nowrap; text-overflow: ellipsis;
}
.setup-hosts { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px; background: var(--surface-1); }
.setup-hosts summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text-main); }
.setup-hosts[open] { display: flex; flex-direction: column; gap: 10px; }
.setup-hosts[open] summary { margin-bottom: 2px; }
.setup-modules { display: flex; flex-direction: column; gap: 8px; }
.setup-module {
    display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px;
    border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2);
    font-size: 14px; color: var(--text-main); cursor: pointer;
}
.setup-module input { width: 16px; height: 16px; accent-color: var(--accent); }
@media (max-width: 480px) {
    .setup-card { padding: 22px 16px; }
    .setup-grid-2 { grid-template-columns: 1fr; }
}