// Top bar — the editor header bits that survive the chrome-stripping (the
// inserter toggle, undo/redo/list-view, View/Options, and command palette are
// all removed in _editor-chrome.scss + the disable-* plugins). What's left on
// the right is our Preview button and the native Save button.
//
// Preview button → the mockup's "secondary / link" button: white surface, a
// strong-border outline, primary text, trailing ↗ glyph, hover to accent. It's
// a `<Button variant="secondary">` (FormPreviewButton.js) so it already has the
// border/white base; this aligns its colors/radius to the tokens. Save stays
// the native accent publish button (already correct). Tokens: _tokens.scss.
.wppb-fb-preview-button.components-button {
    border-radius: var(--wppb-fb-radius-sm);
    color: var(--wppb-fb-text-primary);

    // The `variant="secondary"` outline uses the admin theme color by default;
    // pin it to the neutral strong border like the mockup's secondary button.
    box-shadow: inset 0 0 0 1px var(--wppb-fb-border-strong);

    &:hover,
    &:focus {
        color: var(--wppb-fb-accent);
        box-shadow: inset 0 0 0 1px var(--wppb-fb-accent);
    }

    svg {
        fill: currentColor;
    }
}