/**
 * Vesktop / Vencord theme — matugen + DMS wallpaper colors.
 * Derived from pywal-vencord-style mapping (NixOS-New templates/colors-discord.css).
 */

* {
    /* Surfaces */
    --background-primary: {{colors.background.default.hex}};
    --background-secondary: {{colors.surface.default.hex}};
    --background-tertiary: {{colors.surface_dim.default.hex}};

    --background-primary-alt: {{colors.background.default.hex}};
    --background-secondary-alt: {{colors.surface.default.hex}};
    --background-tertiary-alt: {{colors.surface_dim.default.hex}};

    --channeltextarea-background: {{colors.surface.default.hex}};
    --custom-channel-members-bg: {{colors.surface.default.hex}};

    --profile-gradient-primary-color: {{colors.surface.default.hex}};
    --profile-gradient-secondary-color: {{colors.surface_variant.default.hex}};

    --__header-bar-background: {{colors.surface.default.hex}} !important;

    --bg-base-tertiary: {{colors.background.default.hex}};

    --card-primary-bg: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --input-background: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --autocomplete-bg: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --background-nested-floating: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --background-floating: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --scrollbar-auto-track: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --scrollbar-thin-track: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);

    --border-subtle: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --background-base-lowest: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);
    --background-surface-high: color-mix(in srgb, {{colors.surface.default.hex}}, black 20%);

    --button-secondary-background: color-mix(in srgb, {{colors.surface.default.hex}}, black 30%);
    --background-surface-higher: color-mix(in srgb, {{colors.surface.default.hex}}, black 30%);
    --background-base-lower: color-mix(in srgb, {{colors.surface.default.hex}}, black 35%);

    --background-message-hover: color-mix(in srgb, {{colors.surface.default.hex}}, black 40%);
    --button-secondary-background-hover: color-mix(in srgb, {{colors.surface.default.hex}}, black 40%);
    --background-base-low: color-mix(in srgb, {{colors.surface.default.hex}}, black 40%);
    --background-surface-highest: color-mix(in srgb, {{colors.surface.default.hex}}, black 40%);
    --chat-background-default: color-mix(in srgb, {{colors.surface.default.hex}}, black 45%);

    --button-secondary-background-active: color-mix(in srgb, {{colors.surface.default.hex}}, black 60%);

    --primary-630: {{colors.surface_variant.default.hex}};

    /* Muted / secondary chrome */
    --scrollbar-auto-thumb: {{colors.on_surface_variant.default.hex}};
    --scrollbar-thin-thumb: {{colors.on_surface_variant.default.hex}};
    --interactive-muted: {{colors.on_surface_variant.default.hex}};
    --text-muted: {{colors.on_surface_variant.default.hex}};
    --background-modifier-hover: color-mix(in srgb, {{colors.on_surface_variant.default.hex}}, black 40%);
    --background-modifier-active: color-mix(in srgb, {{colors.on_surface_variant.default.hex}}, black 20%);
    --background-modifier-accent: {{colors.secondary_container.default.hex}};
    --background-accent: {{colors.secondary.default.hex}};

    --input-border: {{colors.outline.default.hex}};
    --border-normal: {{colors.outline.default.hex}};
    --icon-secondary: {{colors.on_surface_variant.default.hex}};
    --icon-tertiary: {{colors.on_surface_variant.default.hex}};
    --channel-icon: {{colors.on_surface_variant.default.hex}};
    --channels-default: {{colors.on_surface_variant.default.hex}};
    --header-primary: {{colors.on_surface.default.hex}};
    --__lottieIconColor: {{colors.on_surface_variant.default.hex}};
    --interactive-normal: {{colors.on_surface_variant.default.hex}};

    /* Selection / highlights */
    --red-400: {{colors.error.default.hex}};
    --background-modifier-selected: {{colors.secondary_container.default.hex}};

    --notice-background-positive: color-mix(in srgb, {{colors.tertiary.default.hex}}, black 75%);
    --notice-text-positive: {{colors.tertiary.default.hex}};

    /* Danger */
    --status-danger: {{colors.error.default.hex}};
    --button-outline-danger-border: {{colors.error.default.hex}};
    --button-outline-danger-text: {{colors.error.default.hex}};
    --button-danger-background: {{colors.error.default.hex}};

    --yellow-300: {{colors.error.default.hex}};

    /* Brand / accents */
    --brand-experiment: {{colors.primary.default.hex}};
    --brand-experiment-360: {{colors.primary.default.hex}};
    --brand-experiment-500: {{colors.primary.default.hex}};
    --profile-gradient-button-color: {{colors.primary.default.hex}};

    --green-360: {{colors.primary.default.hex}};

    /* Foreground */
    --text-normal: {{colors.on_surface.default.hex}};
    --interactive-active: {{colors.on_surface.default.hex}};
}

/* Status indicators (legacy Discord hex fills) */
rect[fill="#d83a41"] {
    fill: {{colors.error.default.hex}} !important;
}

rect[fill="#cc954c"] {
    fill: {{colors.secondary.default.hex}} !important;
}

rect[fill="#40a258"] {
    fill: {{colors.primary.default.hex}} !important;
}

.wrapper_ef3116 {
    background: {{colors.background.default.hex}} !important;
}

.bar_c38106 {
    background: {{colors.background.default.hex}} !important;
}