/* Shared installer, upgrader and required-configuration surface. */
body,
body.setup-page {
    min-width: 320px;
    min-height: 100dvh;
    margin: 0;
    background: #f5f5f5 !important;
    color: #18181b !important;
    font-family: var(--ui-font-sans) !important;
}

.setup-shell {
    display: grid !important;
    min-height: 100dvh !important;
    place-items: center !important;
    padding: 32px 16px !important;
}

.setup-panel,
.install-card {
    width: min(960px, 100%) !important;
    overflow: hidden !important;
    border: 1px solid #dedee1 !important;
    border-radius: 8px !important;
    background: #fff !important;
    box-shadow: 0 18px 50px rgba(24, 24, 27, .08) !important;
}

.setup-head,
.install-head {
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 24px 28px 20px !important;
    border-bottom: 1px solid #e4e4e7 !important;
    background: #fafafa !important;
}

.setup-icon,
.install-icon {
    display: grid !important;
    width: 42px !important;
    height: 42px !important;
    place-items: center !important;
    border: 1px solid #dedee1 !important;
    border-radius: 7px !important;
    background: #fff !important;
    color: #27272a !important;
    font-size: 19px !important;
}

.setup-title,
.install-head h1 {
    margin: 0 !important;
    color: #18181b !important;
    font-size: 21px !important;
    font-weight: 680 !important;
    line-height: 1.3 !important;
}

.setup-subtitle,
.install-subtitle {
    max-width: 720px;
    margin-top: 6px !important;
    color: #71717a !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
}

.setup-body,
.install-body {
    padding: 24px 28px 28px !important;
}

.install-steps {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    margin-top: 14px !important;
}

.install-steps span {
    display: inline-flex !important;
    min-height: 26px !important;
    align-items: center !important;
    padding: 3px 8px !important;
    border: 1px solid #e4e4e7 !important;
    border-radius: 5px !important;
    background: #fff !important;
    color: #71717a !important;
    font-size: 11px !important;
}

.install-steps span.active {
    border-color: #a1a1aa !important;
    background: #ededee !important;
    color: #18181b !important;
    font-weight: 650 !important;
}

.setup-footer {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    padding: 16px 28px !important;
    border-top: 1px solid #e4e4e7 !important;
    background: #fafafa !important;
}

.setup-file { color: #71717a !important; font-size: 11px !important; }

.issue-box,
.config-note {
    margin-bottom: 18px !important;
    padding: 12px 14px !important;
    border: 1px solid #e4e4e7 !important;
    border-radius: 6px !important;
    background: #fafafa !important;
    color: #52525b !important;
}

.issue-box { border-color: #efd8aa !important; background: #fffbeb !important; color: #92400e !important; }
.form-section-title { margin: 22px 0 12px !important; font-size: 13px !important; font-weight: 680 !important; }
.setup-body .card,
.install-body .card { box-shadow: none !important; }

@media (max-width: 720px) {
    .setup-shell { align-items: start !important; padding: 12px !important; }
    .setup-head,
    .install-head { grid-template-columns: 1fr !important; padding: 20px 18px 17px !important; }
    .setup-body,
    .install-body { padding: 20px 18px 22px !important; }
    .setup-footer { align-items: stretch !important; flex-direction: column !important; padding: 15px 18px !important; }
    .setup-footer .btn { width: 100%; }
}