@import "~bootstrap/scss/functions";
// scss-docs-start color-variables
$body-color: #333333;
$blue: #337ab7;
$gray-600: #cccccc;
$green: #89b03e;
$light:#dddddd;
$red: #c9302c;
$gray-100: #dddddd;
$gray-900: #4d4d4d;
$dark: #4d4d4d;
$orange: #f6a828;
$white: #ffffff;
$info: #17a2b8;

// pos-web color-variables
$header-color: #3b3b3b;
$light-blue: #f7f7f8;
$light-gray: rgba(203, 203, 210, 0.15);
$gradient-danger: repeating-linear-gradient(
  -60deg,
  #f8d7da,
  #f8d7da 15px,
  #f5c6cb 15px,
  #f5c6cb 30px
);
$gradient-warning: repeating-linear-gradient(
  -60deg,
  #fcf3cf,
  #fcf3cf 15px,
  #f9e79f 15px,
  #f9e79f 30px
);
$gray-secondary: #cccccc;

// stylelint-enable value-keyword-case
$font-family-base: 'Roboto', sans-serif;
$headings-font-family: 'Roboto Slab', serif;

// scss-docs-start font-variables
$font-size-base: 0.75rem;

$h1-font-size: 1.375rem; //22px
$h2-font-size: 1.25rem; //20px
$h3-font-size: 1.125rem; //18px
$h4-font-size: 1rem; //16px
$h5-font-size: 0.875rem; //14px
$h6-font-size: 0.75rem; //12px

// pos-web font-variables
$headings-font-weight: 700;

// scss-docs-start spacer-variables-maps
$spacer: 0.125rem;
$spacers: (
  0: 0,
  1: $spacer,
  2: $spacer * 2,
  3: $spacer * 3,
  4: $spacer * 4,
  5: $spacer * 5,
  6: $spacer * 6,
  7: $spacer * 7,
  8: $spacer * 8,
  9: $spacer * 9,
  10: $spacer * 10,
  11: $spacer * 11,
  12: $spacer * 12,
);

// Style anchor elements.
$link-color:#0976b4;

// scss-docs-start type-variables
$text-muted: #9a9a9a;

// scss-docs-start btn-variables
$btn-padding-y: 0.625rem;
$btn-padding-x: 0.9375rem;

// scss-docs-start dropdown-variables
$dropdown-item-padding-y: .5rem;
$dropdown-item-padding-x: 1rem;
$dropdown-link-color: $body-color;
$dropdown-link-active-bg: transparent;
$dropdown-link-active-color: inherit;

// scss-docs-start table-variables
$table-cell-padding-y: 12px;
$table-cell-padding-x: 8px;
$table-border-color: $light;

// scss-docs-start form-input-variables
$input-focus-box-shadow: none;
$input-border-radius:0px;
$input-border-radius-lg: 1px;

// scss-docs-start input-group-variables
$input-group-addon-bg: white;

// scss-docs-start card-variables
$card-cap-bg: $white;
$card-spacer-x: 0.9375rem;

// scss-docs-start border-variables
$border: 1px solid $light;

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

// scss-docs-start colors-map
// known issue, should not make bg-light-gray: https://github.com/twbs/bootstrap/issues/34756
// this issue will be supposedly fixed in Bootstrap 5.2.0: https://github.com/twbs/bootstrap/issues/35815
$light-gray-map: (
  "light-gray": $light-gray
);
$theme-colors: map-merge($theme-colors, $light-gray-map);
// pos-web bg-*
.bg-light-gray {
  background-color: var(--bs-light-gray);
  --bs-bg-opacity: 0.15 !important;
}
.bg-gradient-danger {
  background: repeating-linear-gradient(-60deg, #f8d7da, #f8d7da 15px, #f5c6cb 15px, #f5c6cb 30px) !important;
}

.bg-gradient-success {
  background: repeating-linear-gradient(-60deg,#28a745,#28a745 15px,#a2dbb0 15px,#a2dbb0 30px) !important;
}

.bg-gradient-warning {
  background: repeating-linear-gradient(-60deg,#FCF3CF,#FCF3CF 15px,#F9E79F 15px,#F9E79F 30px) !important;
}

// pos-web text-*
.text-primary {
  color: #0976b4 !important;
}

.text-danger {
  color: #fb404b !important;
}

.text-dark {
  color: #5e5e5e !important;
}

.text-success {
  color: #87cb16 !important;
}

.text-black {
  color: black !important;
}

// pos-web btn-*
.btn-light-blue {
  color: #212529;
  background-color: #dfeffc !important;
  border-color: #dfeffc;
}
.btn-light-blue:hover {
  color: #212529;
  background-color: #bcdef9;
  border-color: #b0d8f8;
}
.btn-light-blue:focus,
.btn-light-blue.focus {
  color: #212529;
  background-color: #bcdef9;
  border-color: #b0d8f8;
  box-shadow: 0 0 0 0.2rem rgba(195, 209, 220, 0.5);
}
.btn-light-blue.disabled,
.btn-light-blue:disabled {
  color: #212529;
  background-color: #dfeffc;
  border-color: #dfeffc;
}
.btn-light-blue:not(:disabled):not(.disabled):active,
.btn-light-blue:not(:disabled):not(.disabled).active,
.show > .btn-light-blue.dropdown-toggle {
  color: #212529;
  background-color: #b0d8f8;
  border-color: #a5d2f7;
}
.btn-light-blue:not(:disabled):not(.disabled):active:focus,
.btn-light-blue:not(:disabled):not(.disabled).active:focus,
.show > .btn-light-blue.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(195, 209, 220, 0.5);
}