/* Botoes e acoes no conteudo — host001, apps001, edge001
 * Escopo .content evita sobrescrever .logout-form na sidebar.
 * Carregar depois de panel.css. */

.content .topbar {
    flex-wrap: wrap;
    gap: 12px 18px;
}

.content .topbar > div:first-child {
    flex: 1 1 200px;
    min-width: 0;
}

.content .topbar .user-pill,
.content .topbar .inline-apply {
    flex-shrink: 0;
}

.content .btn,
.content .btn-primary,
.content .btn-secondary,
.content .btn-danger,
.content .btn-ghost,
.content .form-actions button,
.content .inline-apply button,
.content .apply-banner button[type="submit"],
.content .panel-section button[type="submit"]:not(.button-secondary):not(.danger-button),
.content .preview-toolbar button:not(.button-secondary) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 40px;
    padding: 0 14px;
    border: 0;
    border-radius: var(--radius, 12px);
    font: inherit;
    font-size: 14px;
    font-weight: 850;
    color: #fff;
    cursor: pointer;
    white-space: nowrap;
    width: auto;
    max-width: 100%;
    overflow: visible;
    text-overflow: unset;
    background: linear-gradient(135deg, var(--brand-800), var(--brand-600));
    box-shadow: 0 8px 18px rgba(35, 130, 223, 0.18);
}

.content .btn:hover,
.content .btn-primary:hover,
.content .form-actions button:hover,
.content .inline-apply button:hover,
.content .apply-banner button[type="submit"]:hover,
.content .panel-section button[type="submit"]:not(.button-secondary):not(.danger-button):hover,
.content .preview-toolbar button:not(.button-secondary):hover {
    background: linear-gradient(135deg, var(--brand-900), var(--brand-700));
}

.content .btn-secondary,
.content .button-secondary {
    background: #eef4fb;
    color: var(--brand-800);
    box-shadow: none;
    border: 1px solid rgba(35, 130, 223, 0.18);
}

.content .btn-secondary:hover,
.content .button-secondary:hover {
    background: #e5eef9;
}

.content .btn-danger,
.content .danger-button {
    background: linear-gradient(135deg, #d2453c, var(--danger, #c0362c));
    box-shadow: 0 12px 24px rgba(192, 54, 44, 0.18);
}

.content .btn-danger:hover,
.content .danger-button:hover {
    background: linear-gradient(135deg, #b52e25, #93221b);
}

.content .btn-ghost {
    background: transparent;
    color: var(--muted);
    box-shadow: none;
    border: 1px solid rgba(217, 228, 240, 0.95);
}

.content .btn-ghost:hover {
    background: #f3f8ff;
    color: var(--ink);
}

.content .table-action-form,
.content .security-list-row form,
.content .domain-inline-form {
    display: inline-flex;
    margin: 0;
    flex-shrink: 0;
}

.content .table-action-form button,
.content .security-list-row button {
    min-height: 32px;
    border-radius: 999px;
    padding: 0 11px;
    font-size: 12px;
    min-width: auto;
}

.content .section-heading .table-action-form {
    flex-shrink: 0;
}

.content .routes-table th:last-child,
.content .routes-table td:last-child {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

@media (max-width: 720px) {
    .content .section-heading {
        flex-wrap: wrap;
        gap: 12px;
    }

    .content .security-list-form {
        grid-template-columns: 1fr;
    }

    .content .form-actions button,
    .content .inline-apply button {
        width: 100%;
    }
}