:root {
  /*
      Dark colours
    */
  --colour-black: #000000;
  --colour-dark-blue: #003caa;
  --colour-dark-grey: #747a80;

  /*
      Outline colours
    */
  --colour-outline-grey: #cfdbd5;

  /*
      Light colours
    */
  --colour-white: #ffffff;
  --colour-light-grey: #f1f5f5;
  --colour-light-blue: #00a0ff;
  --colour-green: #6ecc34;
  --colour-red: #ff0000;
  --colour-gold: #eac860;
  /*
      Announcements-Alerts colours
    */
  --colour-announcement-blue: #ccecff;
  --colour-announcement-pale-orange: #ffebd9;
  --colour-announcement-green: #d4efdb;
  --colour-announcement-red: #ffcfcd;

  /*
      Margin/padding/gap sizing
    */
  --spacing-xxx-large: 2rem;
  --spacing-xx-large: 1.75rem;
  --spacing-x-large: 1.5rem;
  --spacing-large: 1.25rem;
  --spacing-medium: 1rem;
  --spacing-small: 0.75rem;
  --spacing-x-small: 0.5rem;
  --spacing-xx-small: 0.3rem;

  /*
        Typography
      */
  --font-size-xx-large: 2rem;
  --font-size-x-large: 1.5rem;
  --font-size-large: 1.25rem;
  --font-size-medium: 1rem;
  --font-size-small: 0.875rem;
  --font-size-x-small: 0.75rem;
  --font-size-xx-small: 0.625rem;

  --font-weight-bold: 700;
  --font-weight-semibold: 600;
  --font-weight-regular: 400;
  --font-weight-light: 300;

  /* --header-height: 11svh;
  --footer-height: 7svh;
  --unavailable-space: calc(var(--header-height) + var(--footer-height));
  --available-space: calc(100svh - var(--unavailable-space) - 10px); */
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.align-center {
  align-items: center;
}
.space-between {
  justify-content: space-between;
}
.space-around {
  justify-content: space-around;
}
.align-self-center {
  align-self: center;
}

.gap_xx-large {
  gap: var(--spacing-xx-large);
}
.gap_x-large {
  gap: var(--spacing-x-large);
}
.gap_large {
  gap: var(--spacing-large);
}
.gap_medium {
  gap: var(--spacing-medium);
}
.gap_small {
  gap: var(--spacing-small);
}
.gap_x-small {
  gap: var(--spacing-x-small);
}
.gap_xx-small {
  gap: var(--spacing-xx-small);
}

/*
      Checkbox animation
  */
.checkbox-el {
  position: relative;
  margin-left: 4px;
  width: 25px;
  float: left;
  margin: 2px 10px 2px 1px;
  height: 25px;
  border-radius: 50%;
  vertical-align: middle;
  border: 2px solid var(--colour-outline-grey);
  -webkit-appearance: none;
  outline: none;
  cursor: pointer;
  padding: 5px;
}
.checkbox-el[data-checked="true"] {
  border-color: var(--colour-green);
}

.checkbox-el input {
  width: 100%;
  height: 100%;
  position: absolute;
  top: -3px;
  left: -3px;
  z-index: 5;
  opacity: 0;
  cursor: pointer;
}

.checkbox-circle {
  position: relative;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  z-index: 1;
  transform: scale(0.5);
  transition: all 0.25s ease-in;
}

.checkbox-el input:checked + .checkbox-circle {
  background-color: var(--colour-green);

  transform: scale(1);
}

/*
    Site defaults
  */
.underline {
  border-bottom: 1px solid var(--colour-outline-grey);
}
/* .header {
  max-height: var(--header-height);
} */
/* .footer {
  height: var(--footer-height);
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
} */

.remove-section-block-padding {
  --dxp-s-section-content-spacing-block-start: 0px;
  --dxp-s-section-content-spacing-block-end: 0px;
  --dxp-s-section-content-spacing-block-start-tablet: 0px;
  --dxp-s-section-content-spacing-block-end-tablet: 0px;
  --dxp-s-section-content-spacing-block-start-mobile: 0px;
  --dxp-s-section-content-spacing-block-end-mobile: 0px;
  margin-block: 0;
}

.branding-overrides {
  --text-colour: var(--colour-white);
  --slds-c-button-brand-text-color: var(--colour-white);
  --dxp-s-button-color-contrast: var(--text-colour);
  --dxp-g-brand-contrast: var(--colour-white);
  --slds-c-card-sizing-border: 0px;
  --dxp-s-form-element-label-color: var(--text-colour);
  --slds-g-color-border-base-1: transparent;
  --slds-c-card-shadow: none;
  --dxp-g-brand: var(--colour-light-blue);
}

/* c-mobile-wizard-footer {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10000;
} */
body {
  font-family: Manrope, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-style: normal;
  line-height: normal;
  font-size: var(--font-size-small);
  margin: 0;
}
.content-section {
  height: var(--available-space);
  overflow-y: auto;
  /* -ms-overflow-style: none;
  scrollbar-width: none; */
}
.content-section-full {
  /* --footer-height: 0px;
  --header-height: 0px; */
  width: 100svw;
  height: 100svh;
}

/*Experimental*/
c-i-t-community-theme,
community_byo-scoped-header-and-footer {
  display: flex;
  flex-direction: column;
  height: 100svh;

  > section {
    flex-grow: 1;
    overflow-y: auto;
  }
  > main {
    flex-grow: 1;
    overflow-y: auto;
  }
  > footer {
    height: fit-content;
    & community_layout-section {
      height: fit-content;
    }
  }
}
/* Experimental*/

/* .content-section::-webkit-scrollbar {
  display: none;
} */
@media (min-width: 54em) {
  /* :root {
    --header-height: 5svh;
    --footer-height: 7svh;
  } */
}
@media (min-width: 64em) {
  /* :root {
    --footer-height: 0px;
    --header-height: 9svh;
  } */
  body {
    font-size: var(--font-size-medium);
  }
  .header {
    min-height: 5.5rem;
  }
}