// Set your brand colors
$purple: #8a4d76;
$pink: #fa7c91;
$brown: #757763;
$beige-light: #d0d1cd;
$beige-lighter: #eff0eb;

// Override global Sass variables from the /utilities folder
@use "bulma/sass/utilities" with ($family-primary: '"Nunito", sans-serif'
);
// $grey-dark: $brown,
// $grey-light: $beige-light,
// $primary: $purple,
// $link: $pink,
// $control-border-width: 2px

@forward "bulma/sass/layout/footer" with ($footer-padding: 1.5rem 1.5rem 3rem !default);

@forward "bulma/sass/base";

@forward "bulma/sass/components/pagination";
@forward "bulma/sass/components/navbar";
@forward "bulma/sass/components/message";

@forward "bulma/sass/elements/button";
@forward "bulma/sass/elements/box";
@forward "bulma/sass/elements/icon";
@forward "bulma/sass/elements/content";
@forward "bulma/sass/elements/progress";
@forward "bulma/sass/elements/tag";
@forward "bulma/sass/elements/table";
@forward "bulma/sass/elements/title";

@forward "bulma/sass/form";

@forward "bulma/sass/layout/container";
@forward "bulma/sass/layout/level";
@forward "bulma/sass/layout/section";
@forward "bulma/sass/layout/hero";

@forward "bulma/sass/helpers/spacing";
@forward "bulma/sass/helpers/flexbox";

// Import the themes so that all CSS variables have a value
@forward "bulma/sass/themes";

.feather {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}

[class*=" icon"],
[class^=icon] {
  display: inline-block;
  width: 1em;
  height: 1em;
  stroke-width: 0;
  stroke: currentColor;
  fill: currentColor;
  line-height: 1;
  position: relative;
  top: -.05em;
  vertical-align: middle;
}

.result {
  visibility: hidden;
}

.fadeout {
  visibility: visible;
  opacity: 0;
  transition: opacity 2s ease-in;
}

section.htmx-request {
  visibility: hidden;
}