/* Feed Motion Standard — Instagram-style tokens
 * Defines the motion, color, shadow, and radius tokens for all feed components.
 * All feed component transitions reference these variables for a single point of control.
 * Automatically respects prefers-reduced-motion via the media query override.
 */

:root {
    --bh-feed-easing: cubic-bezier(0.32, 0.72, 0, 1);
    --bh-feed-duration-fast: 150ms;
    --bh-feed-duration-standard: 200ms;
    --bh-feed-duration-slow: 300ms;

    --bh-feed-shadow-rest: none;
    --bh-feed-shadow-hover: 0 1px 3px rgba(0, 0, 0, 0.08);

    --bh-feed-bg-surface: #FFFFFF;
    --bh-feed-bg-muted: #FAFAFA;
    --bh-feed-bg-hover: #F5F5F5;
    --bh-feed-border-subtle: #EFEFEF;
    --bh-feed-text-primary: #262626;
    --bh-feed-text-secondary: #8E8E8E;
    --bh-feed-accent: #E11D74;
    --bh-feed-accent-soft: #BE185D;
    --bh-feed-accent-blue: #2563EB;
    --bh-feed-accent-red: #E11D74;
    --bh-feed-radius-card: 8px;
    --bh-feed-radius-input: 8px;
    --bh-feed-radius-chip: 999px;
    --bh-feed-radius-glass: 12px;
}

@media (prefers-reduced-motion: reduce) {
    :root {
        --bh-feed-duration-fast: 0ms;
        --bh-feed-duration-standard: 0ms;
        --bh-feed-duration-slow: 0ms;
    }
}

/* Global feed input overrides — remove MudBlazor default underlines
 * within feed components to enforce the clean input style. */
.bh-feed-widget .mud-input-underline:before,
.bh-feed-widget .mud-input-underline:after {
    border-bottom: none !important;
}

.bh-feed-widget .mud-input-filled:before,
.bh-feed-widget .mud-input-filled:after {
    border-bottom: none !important;
}