@import './base.scss';

$mbsc-windows-accent: #0078d7 !default;
$mbsc-windows-background: #f2f2f2 !default;
$mbsc-windows-text: #262626 !default;

$mbsc-windows-dark-accent: #0078d7 !default;
$mbsc-windows-dark-background: #1a1a1a !default;
$mbsc-windows-dark-text: #ffffff !default;

/* Base colors */
$mbsc-windows-primary: #3f97f6 !default;
$mbsc-windows-secondary: #90979E !default;
$mbsc-windows-success: #43BE5F !default;
$mbsc-windows-danger: #f5504e !default;
$mbsc-windows-warning: #f8b042 !default;
$mbsc-windows-info: #5BB7C5 !default;
$mbsc-windows-light: #fff !default;
$mbsc-windows-dark: #47494A !default;

$mbsc-windows-colors: ( // Colors map
  'background': $mbsc-windows-background,
  'text': $mbsc-windows-text,
  'accent': $mbsc-windows-accent,
);
$mbsc-windows-dark-colors: ( // Colors map
  'background': $mbsc-windows-dark-background,
  'text': $mbsc-windows-dark-text,
  'accent': $mbsc-windows-dark-accent,
);

@function mbsc-windows-colors($params) {
  $background: map-get($params, 'background');
  $text: map-get($params, 'text');
  $accent: map-get($params, 'accent');

  $frame-border: '';
  $input-hover: '';
  $empty-color: '';
  $input-border: '';
  $progress-background: '';
  $alt-background: '';
  $color-item: '';
  $color-preview-border: '';


  // Light background
  @if (lightness($background) > 50%) {
    $frame-border: darken($background, 15%);
    $input-hover: darken($background, 55%);
    $empty-color: lighten($text, 30%);
    $input-border: darken($background, 35%);

    $progress-background: hsl(hue($background), saturation($background), min(lightness($background), 80%));
    $alt-background: darken($background, 18%);
    $color-item: #ffffff;
    $color-preview-border: darken($background, 25%);
  }
  // Dark background
  @else {
    $frame-border: lighten($background, 15%);
    $input-hover: lighten($background, 55%);
    $empty-color: darken($text, 30%);
    $input-border: lighten($background, 35%);

    $progress-background: hsl(hue($background), saturation($background), max(lightness($background), 12%));
    $alt-background: lighten($background, 18%);
    $color-item: fade(#dfdede, 30%);
    $color-preview-border: lighten($background, 60%);
  }

  @return ('frame-border': $frame-border,
    'input-hover': $input-hover,
    'empty-color': $empty-color,
    'input-border': $input-border,
    'progress-background': $progress-background,
    'alt-background': $alt-background,
    'color-item': $color-item,
    'color-preview-border': $color-preview-border,
    /* static colors */
    'dark-text': darken($mbsc-windows-dark, 30%),
    'light-text': #efeff4,
    'error': #d30101);
}

@mixin mbsc-windows-common($theme, $params) {
  @include exports("common.#{$theme}.colors") {
    $colors: mbsc-windows-colors($params);
    $empty-color: map-get($colors, empty-color);

    .mbsc-#{$theme} {
      .mbsc-empty {
        color: $empty-color;
      }
    }
  }
}
