@charset "utf-8";

//===========
// variables
//===========

// custom color scheme
@import "@/bulma-scheme";

// Sass variables (bulma)
@import "~bulma/sass/utilities/initial-variables.sass";
@import "~bulma/sass/utilities/derived-variables.sass";

// Sass variables (bulma-prefers-dark)
@import "~bulma-prefers-dark/sass/utilities/initial-variables.sass";
@import "~bulma-prefers-dark/sass/utilities/derived-variables.sass";

//=================
// variable tweaks
//=================

$modal-card-body-background-color-dark: $body-background-dark;
$card-background-color-dark: $background-dark;

//==============
// main imports
//==============

@import "~bulma/bulma";
@import "~bulma-prefers-dark/bulma-prefers-dark";

//==============
// style tweaks
//==============

.card-header {
  background-color: $background;

  @include prefers-scheme(dark) {
    background-color: $card-header-background-color;
  }
}

.card-content {
  @include prefers-scheme(dark) {
    background-color: $body-background-dark;
  }
}

.progress {
  // &::-webkit-progress-bar {
  //   background-color: transparent !important;
  // }
  // &::-webkit-progress-value {
  //   background-color: transparent !important;
  // }
  &::-moz-progress-bar {
    background-color: transparent !important;
  }
  // &::-ms-fill {
  //   background-color: transparent !important;
  // }
}