@import "~bootstrap/scss/functions";
@import "variables";

@import "~bootstrap/scss/mixins";
@import "~bootstrap/scss/utilities";

// Layout & components
@import "root";
@import "~bootstrap/scss/reboot";
@import "~bootstrap/scss/type";
@import "~bootstrap/scss/images";
@import "~bootstrap/scss/containers";

@import "~bootstrap/scss/grid";
@import "~bootstrap/scss/tables";
@import "~bootstrap/scss/forms"; // Maybe destoying django
@import "~bootstrap/scss/buttons";

.btn-icon {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-icon-46px {
  width: 46px;
  height: 46px;
}
.btn-icon-36px {
  width: 36px;
  height: 36px;
}
.btn-icon-24px {
  width: 24px;
  height: 24px;
}
.hover-light:hover {
  background-color: rgba(var(--bs-light-rgb), 1) !important;
}
.hover-soft:hover {
  background-color: rgba(var(--bs-light-rgb), 0.5) !important;
}
.hover-white:hover {
  background-color: #ffffff !important;
}
.hover-shadow-md:hover {
  box-shadow: 0 0.15rem 0.7rem rgba(0, 0, 0, 0.1) !important;
}

@import "~bootstrap/scss/transitions";
@import "~bootstrap/scss/dropdown";
@import "~bootstrap/scss/button-group";
@import "~bootstrap/scss/nav";

.tab-pane {
  @extend .p-4;
}

.tab-pane.bordered {
  @extend .border-start;
  @extend .border-end;
  @extend .border-bottom;
  @extend .rounded-bottom;
}

@import "~bootstrap/scss/navbar";
@import "~bootstrap/scss/card";
@import "~bootstrap/scss/accordion";
@import "~bootstrap/scss/breadcrumb";

.breadcrumbs {
  color: white;
  font-size: small;
  padding: 5px 0;
  a {
    @extend .link-light;
  }
}

@import "~bootstrap/scss/pagination";
@import "~bootstrap/scss/badge";
@import "~bootstrap/scss/alert";
@import "~bootstrap/scss/progress";
@import "~bootstrap/scss/list-group";
@import "~bootstrap/scss/close";
@import "~bootstrap/scss/toasts";
@import "~bootstrap/scss/modal";

.modal-title {
  line-height: 1.5;
  font-size: 1rem !important;
  margin: 0;
  letter-spacing: 0;
}

@import "~bootstrap/scss/tooltip";
@import "~bootstrap/scss/popover";

.popover {
  @extend .shadow-sm;
}

@import "~bootstrap/scss/carousel";
@import "~bootstrap/scss/spinners";
@import "~bootstrap/scss/offcanvas";
@import "~bootstrap/scss/placeholders";

// Helpers
@import "~bootstrap/scss/helpers";

// Utilities
@import "~bootstrap/scss/utilities/api";
// scss-docs-end import-stack

@import "~select2-bootstrap-5-theme/src/include-all";

.w-50px {
  width: 50px;
}
.w-100px {
  width: 100px;
}
.w-150px {
  width: 150px;
}
.w-200px {
  width: 200px;
}
.w-250px {
  width: 250px;
}
.w-300px {
  width: 300px;
}

.bg-holder {
  position: absolute;
  width: 100%;
  min-height: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  will-change: transform, opacity, filter;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  background-repeat: no-repeat;
  z-index: 0;
}
