/*
 * #################################
 * #       Default Styling         #
 * #################################
 */
.bar-button-label {
    margin-left: 0.5em;
    color: $text;
}

.module-icon {
    font-size: 1em;
    min-width: 0.7em;
}

.style2 {
    .bar-button-icon {
        border-top-left-radius: $bar-buttons-radius;
        border-bottom-left-radius: $bar-buttons-radius;
        padding: $bar-buttons-padding_y 0em;
        padding-left: $bar-buttons-padding_x;
        padding-right: 0.5em;
        background: $text;
        color: $bar-background;
    }

    .bar-button-label {
        padding: $bar-buttons-padding_y 0em;
        padding-right: $bar-buttons-padding_x;
        padding-left: 0.5em;
        margin-left: 0em;
    }
}

$style-module-defaults: (
    'label-color': $bar-buttons-text,
    'icon-color': $bar-buttons-icon,
    'icon-background': $bar-buttons-icon_background,
    'label-background': $bar-buttons-background,
    'border-enabled': false,
    'border-color': $text,
    'icon-size': 1em,
    'inner-spacing': 0.5em,
);

/*
 * #################################
 * #        Styling Function       #
 * #################################
 */
@mixin styleModule($class, $config: ()) {
    $config: map-merge($style-module-defaults, $config);
    $text-color: map-get($config, 'text-color');
    $icon-color: map-get($config, 'icon-color');
    $icon-background: map-get($config, 'icon-background');
    $label-background: map-get($config, 'label-background');
    $spacing: map-get($config, 'inner-spacing');
    $border-enabled: map-get($config, 'border-enabled');
    $border-color: map-get($config, 'border-color');
    $icon-size: map-get($config, 'icon-size');

    $bar-button-background-opacity-ratio: $bar-buttons-background_opacity * 0.01;
    $transparency-value: 1 - $bar-button-background-opacity-ratio;

    $bar-button-background-hover-opacity-ratio: $bar-buttons-background_hover_opacity * 0.01;
    $transparency-value-hover: 1 - $bar-button-background-hover-opacity-ratio;
    .bar_item_box_visible {
        &.#{$class} {
            background: transparentize(
                if($bar-buttons-monochrome, $bar-buttons-background, $label-background),
                $transparency-value
            );
            border: if(
                $border-enabled or $bar-buttons-enableBorders,
                $bar-buttons-borderSize solid
                    if($bar-buttons-monochrome, $bar-buttons-borderColor, $border-color),
                0em
            );

            &.style2 {
                background: transparent;
            }

            &:hover {
                opacity: $bar-buttons-background_hover_opacity * 0.01;
            }
        }
    }

    .module-label.#{$class} {
        color: if($bar-buttons-monochrome, $bar-buttons-text, $text-color);
        margin-left: $spacing;
        border-radius: $bar-buttons-radius;
    }

    .module-icon.#{$class} {
        color: if($bar-buttons-monochrome, $bar-buttons-icon, $icon-color);
        font-size: if($icon-size, $icon-size, 1em);
    }

    .style2 {
        .module-icon.#{$class} {
            background: if($bar-buttons-monochrome, $bar-buttons-icon_background, $icon-background);
            padding-right: $spacing;
            color: if($bar-buttons-monochrome, $bar-buttons-icon, $icon-color);
            border-top-left-radius: if(
                $border-enabled or $bar-buttons-enableBorders,
                $bar-buttons-radius * $bar-buttons-innerRadiusMultiplier,
                $bar-buttons-radius
            );
            border-bottom-left-radius: if(
                $border-enabled or $bar-buttons-enableBorders,
                $bar-buttons-radius * $bar-buttons-innerRadiusMultiplier,
                $bar-buttons-radius
            );
        }

        .module-label.#{$class} {
            background: transparentize($label-background, $transparency-value);
            padding-left: $spacing * 1.5;
            margin-left: 0em;
            border-top-left-radius: 0em;
            border-bottom-left-radius: 0em;
        }
        &.no-label.#{$class} {
            .module-icon {
                border-top-right-radius: if(
                    $border-enabled or $bar-buttons-enableBorders,
                    $bar-buttons-radius * $bar-buttons-innerRadiusMultiplier,
                    $bar-buttons-radius
                );
                border-bottom-right-radius: if(
                    $border-enabled or $bar-buttons-enableBorders,
                    $bar-buttons-radius * $bar-buttons-innerRadiusMultiplier,
                    $bar-buttons-radius
                );
            }
        }
    }
}

/*
 * #################################
 * #      Mic Module Styling       #
 * #################################
 */
@include styleModule(
    'mic',
    (
        'text-color': $bar-buttons-modules-microphone-text,
        'icon-color': $bar-buttons-modules-microphone-icon,
        'icon-background': $bar-buttons-modules-microphone-icon_background,
        'label-background': $bar-buttons-modules-microphone-background,
        'inner-spacing': $bar-buttons-modules-microphone-spacing,
        'border-enabled': $bar-buttons-modules-microphone-enableBorder,
        'border-color': $bar-buttons-modules-microphone-border,
        'icon-size': 1.3em,
    )
);

/*
 * #################################
 * #      Ram Module Styling       #
 * #################################
 */
@include styleModule(
    'ram',
    (
        'text-color': $bar-buttons-modules-ram-text,
        'icon-color': $bar-buttons-modules-ram-icon,
        'icon-background': $bar-buttons-modules-ram-icon_background,
        'label-background': $bar-buttons-modules-ram-background,
        'inner-spacing': $bar-buttons-modules-ram-spacing,
        'border-enabled': $bar-buttons-modules-ram-enableBorder,
        'border-color': $bar-buttons-modules-ram-border,
        'icon-size': 1em,
    )
);

/*
 * #################################
 * #      Cpu Module Styling       #
 * #################################
 */
@include styleModule(
    'cpu',
    (
        'text-color': $bar-buttons-modules-cpu-text,
        'icon-color': $bar-buttons-modules-cpu-icon,
        'icon-background': $bar-buttons-modules-cpu-icon_background,
        'label-background': $bar-buttons-modules-cpu-background,
        'inner-spacing': $bar-buttons-modules-cpu-spacing,
        'border-enabled': $bar-buttons-modules-cpu-enableBorder,
        'border-color': $bar-buttons-modules-cpu-border,
        'icon-size': 1.05em,
    )
);

/*
 * #################################
 * #    Cpu Temp Module Styling    #
 * #################################
 */
@include styleModule(
    'cpu-temp',
    (
        'text-color': $bar-buttons-modules-cpuTemp-text,
        'icon-color': $bar-buttons-modules-cpuTemp-icon,
        'icon-background': $bar-buttons-modules-cpuTemp-icon_background,
        'label-background': $bar-buttons-modules-cpuTemp-background,
        'inner-spacing': $bar-buttons-modules-cpuTemp-spacing,
        'border-enabled': $bar-buttons-modules-cpuTemp-enableBorder,
        'border-color': $bar-buttons-modules-cpuTemp-border,
        'icon-size': 1.05em,
    )
);

/*
 * #################################
 * #    Storage Module Styling     #
 * #################################
 */
@include styleModule(
    'storage',
    (
        'text-color': $bar-buttons-modules-storage-text,
        'icon-color': $bar-buttons-modules-storage-icon,
        'icon-background': $bar-buttons-modules-storage-icon_background,
        'label-background': $bar-buttons-modules-storage-background,
        'inner-spacing': $bar-buttons-modules-storage-spacing,
        'border-enabled': $bar-buttons-modules-storage-enableBorder,
        'border-color': $bar-buttons-modules-storage-border,
        'icon-size': 1.3em,
    )
);

/*
 * #################################
 * #    Netstat Module Styling     #
 * #################################
 */
@include styleModule(
    'netstat',
    (
        'text-color': $bar-buttons-modules-netstat-text,
        'icon-color': $bar-buttons-modules-netstat-icon,
        'icon-background': $bar-buttons-modules-netstat-icon_background,
        'label-background': $bar-buttons-modules-netstat-background,
        'inner-spacing': $bar-buttons-modules-netstat-spacing,
        'border-enabled': $bar-buttons-modules-netstat-enableBorder,
        'border-color': $bar-buttons-modules-netstat-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #    KB Layout Module Styling   #
 * #################################
 */
@include styleModule(
    'kblayout',
    (
        'text-color': $bar-buttons-modules-kbLayout-text,
        'icon-color': $bar-buttons-modules-kbLayout-icon,
        'icon-background': $bar-buttons-modules-kbLayout-icon_background,
        'label-background': $bar-buttons-modules-kbLayout-background,
        'inner-spacing': $bar-buttons-modules-kbLayout-spacing,
        'border-enabled': $bar-buttons-modules-kbLayout-enableBorder,
        'border-color': $bar-buttons-modules-kbLayout-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #    Updates Module Styling     #
 * #################################
 */
@include styleModule(
    'updates',
    (
        'text-color': $bar-buttons-modules-updates-text,
        'icon-color': $bar-buttons-modules-updates-icon,
        'icon-background': $bar-buttons-modules-updates-icon_background,
        'label-background': $bar-buttons-modules-updates-background,
        'inner-spacing': $bar-buttons-modules-updates-spacing,
        'border-enabled': $bar-buttons-modules-updates-enableBorder,
        'border-color': $bar-buttons-modules-updates-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #    Submap Module Styling      #
 * #################################
 */
@include styleModule(
    'submap',
    (
        'text-color': $bar-buttons-modules-submap-text,
        'icon-color': $bar-buttons-modules-submap-icon,
        'icon-background': $bar-buttons-modules-submap-icon_background,
        'label-background': $bar-buttons-modules-submap-background,
        'inner-spacing': $bar-buttons-modules-submap-spacing,
        'border-enabled': $bar-buttons-modules-submap-enableBorder,
        'border-color': $bar-buttons-modules-submap-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #    Weather Module Styling     #
 * #################################
 */
@include styleModule(
    'weather-custom',
    (
        'text-color': $bar-buttons-modules-weather-text,
        'icon-color': $bar-buttons-modules-weather-icon,
        'icon-background': $bar-buttons-modules-weather-icon_background,
        'label-background': $bar-buttons-modules-weather-background,
        'inner-spacing': $bar-buttons-modules-weather-spacing,
        'border-enabled': $bar-buttons-modules-weather-enableBorder,
        'border-color': $bar-buttons-modules-weather-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #    Power Module Styling       #
 * #################################
 */
@include styleModule(
    'powermodule',
    (
        'text-color': $bar-buttons-modules-power-icon,
        'icon-color': $bar-buttons-modules-power-icon,
        'icon-background': $bar-buttons-modules-power-icon_background,
        'label-background': $bar-buttons-modules-power-background,
        'inner-spacing': $bar-buttons-modules-power-spacing,
        'border-enabled': $bar-buttons-modules-power-enableBorder,
        'border-color': $bar-buttons-modules-power-border,
        'icon-size': 1.3em,
    )
);

/*
 * #################################
 * #      Hyprsunset Styling       #
 * #################################
 */
@include styleModule(
    'hyprsunset',
    (
        'text-color': $bar-buttons-modules-hyprsunset-text,
        'icon-color': $bar-buttons-modules-hyprsunset-icon,
        'icon-background': $bar-buttons-modules-hyprsunset-icon_background,
        'label-background': $bar-buttons-modules-hyprsunset-background,
        'inner-spacing': $bar-buttons-modules-hyprsunset-spacing,
        'border-enabled': $bar-buttons-modules-hyprsunset-enableBorder,
        'border-color': $bar-buttons-modules-hyprsunset-border,
        'icon-size': 1.3em,
    )
);

/*
 * #################################
 * #       Hypridle Styling        #
 * #################################
 */
@include styleModule(
    'hypridle',
    (
        'text-color': $bar-buttons-modules-hypridle-text,
        'icon-color': $bar-buttons-modules-hypridle-icon,
        'icon-background': $bar-buttons-modules-hypridle-icon_background,
        'label-background': $bar-buttons-modules-hypridle-background,
        'inner-spacing': $bar-buttons-modules-hypridle-spacing,
        'border-enabled': $bar-buttons-modules-hypridle-enableBorder,
        'border-color': $bar-buttons-modules-hypridle-border,
        'icon-size': 1.075em,
    )
);

/*
 * #################################
 * #       Cava Styling            #
 * #################################
 */
@include styleModule(
    'cava',
    (
        'text-color': $bar-buttons-modules-cava-text,
        'icon-color': $bar-buttons-modules-cava-icon,
        'icon-background': $bar-buttons-modules-cava-icon_background,
        'label-background': $bar-buttons-modules-cava-background,
        'inner-spacing': $bar-buttons-modules-cava-spacing,
        'border-enabled': $bar-buttons-modules-cava-enableBorder,
        'border-color': $bar-buttons-modules-cava-border,
        'icon-size': 1.2em,
    )
);

/*
 * #################################
 * #      World Clock Styling      #
 * #################################
 */
@include styleModule(
    'worldclock',
    (
        'text-color': $bar-buttons-modules-worldclock-text,
        'icon-color': $bar-buttons-modules-worldclock-icon,
        'icon-background': $bar-buttons-modules-worldclock-icon_background,
        'label-background': $bar-buttons-modules-worldclock-background,
        'inner-spacing': $bar-buttons-modules-worldclock-spacing,
        'border-enabled': $bar-buttons-modules-worldclock-enableBorder,
        'border-color': $bar-buttons-modules-worldclock-border,
        'icon-size': 1.2em,
    )
);
