// 1. Include functions first (so you can manipulate colors, SVGs, calc, etc)
@use './base/variables' as *;

// @use '../../node_modules/bootstrap/scss/functions';

// 2. Include any default variable overrides here
$grid-breakpoints: (
  xs: $breakpoint-xs,
  sm: $breakpoint-sm,
  md: $breakpoint-md,
  lg: $breakpoint-lg,
  xl: $breakpoint-xl,
  xxl: $breakpoint-xxl,
);

// 3. Include remainder of required Bootstrap stylesheets
// @import '../../node_modules/bootstrap/scss/variables';
// @import '../../node_modules/bootstrap/scss/mixins';

// 4. Include any optional Bootstrap components as you like
// @import '../../node_modules/bootstrap/scss/containers';
// @import '../../node_modules/bootstrap/scss/grid';

// 5. Add additional custom code here

// bootstrap's grid only works if box-sizing:border-box is active. generally it is when you use normal bootstrap, but since we have customized it here it isn't included by default
.container,
.container * {
  box-sizing: border-box;
}