/* Footer styles */

footer .link-list {
  display: flex;
  -webkit-box-pack: end;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 10px clamp(0.75rem, 0.42rem + 0.69vw, 1.25rem);

  .item {
    display: inline;
  }

  @media (max-width: 1023px) {
    flex-direction: column;
  }

}

@media (prefers-reduced-motion: no-preference) {
  footer .item a.link  {
    transition-duration: 0.35s;
    transition-property: text-decoration-color;
    transition-timing-function: cubic-bezier(0.33, 1, 0.68, 1);
    will-change: text-decoration-color;
  }
}

footer .item a.link {
  text-decoration: underline 1px transparent;
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  margin: 0px;
  font-size: clamp(1.13rem, 1.04rem + 0.17vw, 1.25rem);
  line-height: clamp(1.63rem, 1.54rem + 0.17vw, 1.75rem);
  color: rgb(240, 239, 255);
  text-underline-offset: 2px;

  &:hover {
    text-decoration-color: currentcolor;
  }

  @media (max-width: 1023px) {
      font-family: "Graphik Compact", sans-serif;
      font-style: normal;
      font-weight: 500;
  }
}

footer .footer__legal-links .item a.link {
  font-size: clamp(1rem, 0.92rem + 0.17vw, 1.13rem);
}


/* Header styles */

header {
  .main-navigation {
    [data-sticky='true'] & {

      @media (min-width: 1104px) {
        padding-right: 8px;
      }

      @media (min-width: 1366px) {
        padding-right: 0;
      }
    }
  }

  .main-navigation__top-level-link {
    [data-sticky='true'] & {
      padding-top: 8px;

      @media (max-width: 1279px) {
          font-size: clamp(0.88rem, 0.38rem + 0.78vw, 1rem);
      }
    }

    [data-sticky='false'] & {
      @media (max-width: 1279px) {
          font-size: clamp(1rem, 0.5rem + 0.78vw, 1.13rem);
      }
    }
  }

  .dropdown-nav {
    --headerHeight: clamp(11.88rem, 11.23rem + 1vw, 12.44rem);
    --stickyHeaderHeight: 105px;
    --maxHeight: calc(100vh - var(--headerHeight) - clamp(1rem, 0.67rem + 0.69vw, 1.5rem));

    [data-sticky='true'] & {
      --maxHeight: calc(100vh - var(--stickyHeaderHeight));

      top: var(--stickyHeaderHeight);
    }
  }

  .header__search-form {
    @media (min-width: 1024px) {

      [data-sticky='true'] & {
        max-width: clamp(46px, 4vw, 48px);
      }

      [data-open='true'] & {
        max-width: 825px;

        /* Ensure search sits above navigation links */
        z-index: 1;
      }
    }

    .header__search-button {
      &:nth-of-type(2) {

        &[data-active='true'] {
          transform: translate(-133%, -50%);
        }
      }
    }
  }

  .header__search-input {
    [data-sticky='true'] & {
      display: none;
    }

    [data-sticky='true'][data-search-open='true'] & {
      display: block;
    }
  }

  .header__search-error {
    @media (min-width: 1024px) {
      [data-sticky='true'] & {
        animation-fill-mode: backwards;
      }

      [data-open='true'] & {
        animation-fill-mode: forwards;
      }
    }

    [data-open='true'] & {
      display: block;
    }
  }

  .header__search-button {
    [data-sticky='true'] & {
      opacity: 0;
    }

    &:nth-of-type(1) {
      [data-sticky='true'] & {
        opacity: 0;
      }

      [data-open='true'] & {
        opacity: 1;
        z-index: 2;
      }
    }

    &:nth-of-type(2) {
      opacity: 0;
      left: 3px;
      visibility: hidden;
      pointer-events: none;

      &[data-active='true'] {
        transform: translate(-133%, -50%);
      }

      [data-sticky='true'] & {
        opacity: 1;
        z-index: 2;
        visibility: visible;
        pointer-events: all;

        @media (max-width: 1023px) {
          opacity: 0;
        }
      }
    }
  }
}

.slds-card__body {
  background: #F0EFFF;
  margin: 0;
  padding-top: 12px;
  padding-bottom: 12px;
}

.slds-card__footer.navigationBar {
  background: #F0EFFF;
}


.section.slds-grid.slds-gutters.slds-wrap {
  background: #F7F7FF;
  padding-top: 20px;
  padding-bottom: 20px;

  @media (max-width: 767px) {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}

.component-wrapper-spacer {
  --dxp-c-l-component-spacer-size: 1.5rem;
}


/* General Flow styles */
.columns-content .rcr-flowholder {
  border-radius: 0;
  border: none;
  background: #F7F7FF;
  padding: 0;
}

.rcr-flowholder .slds-card__body {
  background: #F7F7FF;
}

.slds-visual-picker__text {
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 30px;

  @media (max-width: 767px) {
    font-size: 18px;
    line-height: 26px;
  }
}


/* Table styles */
.slds-table--header-fixed_container, 
.slds-table_header-fixed_container {
  background-color: #2D053C;
}

.table-rows-count,
.selected-row-count {
 color: white;
}

.slds-theme_shade,
.slds-cell-fixed {
  background-color: #2D053C;

}

.slds-th__action {
 color: white;

 svg.slds-button__icon {
  fill: white;
 }
}

.slds-th__action:focus, 
.slds-th__action:hover {
  color: #2D053C;

  svg.slds-button__icon {
  fill: #2D053C;
 }
}

.slds-border--top,
.slds-border--right,
.slds-border--bottom,
.slds-border--left {
  border-color: #2D053C;
}

.slds-table--bordered tbody td, 
.slds-table--bordered tbody th, 
.slds-table_bordered tbody td, 
.slds-table_bordered tbody th {
  border-color: #2D053C;
}


.slds-table tbody tr.slds-is-selected>td, 
.slds-table tbody tr.slds-is-selected>th, 
.slds-table:not(.slds-no-row-hover) tr.slds-is-selected:hover>td, 
.slds-table:not(.slds-no-row-hover) tr.slds-is-selected:hover>th {
  border-color: #2D053C;
  background-color: #2D053C;
  color: white;
}

.slds-table:not(.slds-no-row-hover) tbody tr:focus>td,
.slds-table:not(.slds-no-row-hover) tbody tr:focus>th, 
.slds-table:not(.slds-no-row-hover) tbody tr:hover>td, 
.slds-table:not(.slds-no-row-hover) tbody tr:hover>th {
  background-color: #2D053C;
  color: white;
}

.slds-table--bordered, 
.slds-table_bordered {
  background: transparent;

  tbody {
    tr:nth-child(odd) {
      background-color: #F7F7FF;
    }

    tr:nth-child(even) {
      background-color: #F0EFFF;
    }
  }
}


/* Accordion styles */

.slds-accordion__section {
  background-color: #F7F7FF;
  margin-bottom: 20px;
}

.slds-accordion__content {
  .section.slds-grid.slds-gutters.slds-wrap {
    padding: 0;
    
    @media (max-width: 767px) {
      padding: 0;
    }
  }
}

.slds-accordion__section.slds-is-open {
  .slds-accordion__summary-heading {
    color: #2E54FF;
  }
  .slds-button.slds-accordion__summary-action {
    color: #2E54FF;
  }

  .slds-button__icon.slds-button__icon_left {
    fill: #2E54FF;
  }
}

.slds-form-element__icon.helptext__container {
  padding-top: 0;
}

.slds-accordion__summary {
  background-color: #F7F7FF;

  .slds-button_icon {
    .slds-button__icon.slds-icon-text-error {
      fill: #FF324B;
    }
  }

  &:hover,
  &:focus {
    .slds-accordion__summary-heading {
      color: #2E54FF;

      .slds-button__icon.slds-button__icon_left {
        fill: #2E54FF;
      }
    }
    .slds-button.slds-accordion__summary-action {
      color: #2E54FF;
    }

    .slds-button_icon {
      .slds-button__icon.slds-icon-text-error {
        fill: #FF324B;
      }
    }
  }
}

.slds-button.slds-accordion__summary-action {
  border-radius: 0;
}

.slds-accordion__summary-content {
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 24px;
  line-height: 34px;

  @media (max-width: 767px) {
    font-size: 20px;
    line-height: 30px;
  }
}

.slds-accordion__content {
  padding-top: 40px;
  padding-bottom: 40px;

  @media (max-width: 767px) {
    padding-top: 20px;
    padding-bottom: 20px;
  }
}


/* Form styles */

.slds-form-element > .slds-form-element {
  margin-bottom: 0;
  padding: 0;
}

.flowruntime-inline.slds-form-element {
  .flowruntime-input-label {
    padding-bottom: 8px;
  }
}


.slds-form-element__row {
  align-items: flex-start;

  @media (max-width: 767px) {
    flex-wrap: wrap;
  }

  .slds-size--1-of-1,
  .slds-size--1-of-12, 
  .slds-size--1-of-2, 
  .slds-size--1-of-3,
  .slds-size--1-of-4,
  .slds-size--1-of-5,
  .slds-size--1-of-6,
  .slds-size--1-of-7,
  .slds-size--1-of-8,
  .slds-size--10-of-12,
  .slds-size--11-of-12,
  .slds-size--12-of-12,
  .slds-size--2-of-12,
  .slds-size--2-of-2,
  .slds-size--2-of-3,
  .slds-size--2-of-4,
  .slds-size--2-of-5,
  .slds-size--2-of-6,
  .slds-size--2-of-7,
  .slds-size--2-of-8,
  .slds-size--3-of-12,
  .slds-size--3-of-3,
  .slds-size--3-of-4,
  .slds-size--3-of-5,
  .slds-size--3-of-6,
  .slds-size--3-of-7,
  .slds-size--3-of-8,
  .slds-size--4-of-12,
  .slds-size--4-of-4,
  .slds-size--4-of-5,
  .slds-size--4-of-6,
  .slds-size--4-of-7,
  .slds-size--4-of-8,
  .slds-size--5-of-12,
  .slds-size--5-of-5,
  .slds-size--5-of-6,
  .slds-size--5-of-7,
  .slds-size--5-of-8,
  .slds-size--6-of-12,
  .slds-size--6-of-6,
  .slds-size--6-of-7,
  .slds-size--6-of-8,
  .slds-size--7-of-12,
  .slds-size--7-of-7,
  .slds-size--7-of-8,
  .slds-size--8-of-12,
  .slds-size--8-of-8,
  .slds-size--9-of-12,
  .slds-size_1-of-1,
  .slds-size_1-of-12,
  .slds-size_1-of-2,
  .slds-size_1-of-3,
  .slds-size_1-of-4,
  .slds-size_1-of-5,
  .slds-size_1-of-6,
  .slds-size_1-of-7,
  .slds-size_1-of-8,
  .slds-size_10-of-12,
  .slds-size_11-of-12,
  .slds-size_12-of-12,
  .slds-size_2-of-12,
  .slds-size_2-of-2,
  .slds-size_2-of-3,
  .slds-size_2-of-4,
  .slds-size_2-of-5,
  .slds-size_2-of-6,
  .slds-size_2-of-7,
  .slds-size_2-of-8,
  .slds-size_3-of-12,
  .slds-size_3-of-3,
  .slds-size_3-of-4,
  .slds-size_3-of-5,
  .slds-size_3-of-6,
  .slds-size_3-of-7,
  .slds-size_3-of-8,
  .slds-size_4-of-12,
  .slds-size_4-of-4,
  .slds-size_4-of-5,
  .slds-size_4-of-6,
  .slds-size_4-of-7,
  .slds-size_4-of-8,
  .slds-size_5-of-12,
  .slds-size_5-of-5,
  .slds-size_5-of-6,
  .slds-size_5-of-7,
  .slds-size_5-of-8,
  .slds-size_6-of-12,
  .slds-size_6-of-6,
  .slds-size_6-of-7,
  .slds-size_6-of-8,
  .slds-size_7-of-12,
  .slds-size_7-of-7,
  .slds-size_7-of-8,
  .slds-size_8-of-12,
  .slds-size_8-of-8,
  .slds-size_9-of-12 {
    @media (max-width: 767px) {
      flex: 1 0 100%;
    }
  }  
}

.slds-form-element__label span,
.slds-form-element__label.slds-form-element__legend,
.slds-form-element__label:not(.slds-form-element__legend),
.slds-form-element_stacked.slds-form-element .slds-form-element__label,
.field-element .slds-form-element .slds-form-element__label {
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 30px;

  @media (max-width: 767px) {
    font-size: 18px;
    line-height: 26px;
  }
}

.flowruntime-inline.slds-form-element__label span {
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
}

.help-text__button {
  .slds-icon {
    fill: #2E54FF;
  }
}

.slds-form-element__label .slds-button__icon {
  fill: #2E54FF;
}

.flowruntime-input.slds-form-element {
  .flowruntime-input-label {
    padding-bottom: 8px;
  }
}
.flowruntime-input.slds-form-element.flowruntime-inline-container .flowruntime-input-label {
  padding-bottom: 0;
}

.flowruntime-input-label.flowruntime-inline,
.flowruntime-inline.slds-form-element__label.slds-rich-text-editor__output {
  padding-top: 0;
  padding-bottom: 0;
}



.slds-form-element__control .slds-select,
.edqsf-native-select .slds-form-element select.slds-input,
.edqsf-native-select .slds-form-element:not(.slds-has-error) .edqsf-native-select,
.edqsf-phone-crud .edqsf-phone-input-container select,
.edqsf-phone-crud .edqsf-phone-input-container select.comfy-view {
  border-radius: 0px !important;
  height: 45px;
  max-height: 45px !important;
  background-color: #F0EFFF;
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  border-color: #2D053C;
}

.edqsf-native-select .slds-form-element:not(.slds-has-error) .edqsf-native-select,
.edqsf-phone-crud .edqsf-phone-input-container select {
  border-color: #2D053C !important;
}

.slds-form-element__control .slds-input {
  border-radius: 0px;
  height: 45px;
  background-color: #F0EFFF;
  border-color: #2D053C;
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  padding: 2px 8px;
}

.slds-form-element__control .slds-textarea {
  border-radius: 0px;
  background-color: #F0EFFF;
  border-color: #2D053C;
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
}

.slds-has-error .slds-input {
  background-color: #F0EFFF;
  border-color: #FF324B;
  box-shadow: #FF324B 0 0 0 1px inset;
}

.flowruntime-input-error.slds-form-element__help,
.slds-form-element .flowruntime-input-error.slds-form-element__help {
  color: #FF324B;
  font-family: "Graphik Compact", sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
}

.flowruntime-input.slds-form-element.flowruntime-inline-container {
  .flowruntime-inline.slds-form-element {
    margin-bottom: 0;
  }  
}

.flowruntime-inline.slds-form-element {
  .slds-checkbox {
    padding-top: 3px;
  }
}


.slds-checkbox [type="checkbox"]:checked + .slds-checkbox__label .slds-checkbox_faux {
  width: 16px;
  height: 16px;
  background: white;
  border: 1px solid #2D053C;
  border-radius: 4px;
}

.slds-checkbox [type=checkbox]:checked+.slds-checkbox__label .slds-checkbox_faux:after {
  display: block;
  content: "";
  height: .25rem;
  width: .5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0) rotate(-45deg);
  border-bottom: 2px solid #2D053C;
  border-left: 2px solid #2D053C;
}

/* Button styles */

.slds-card__footer.navigationBar {
  .footerContainer {
    padding-top: 24px;

    .slds-button.slds-button_neutral {
      transition: background 0.35s, color 0.35s;
      padding: 2px clamp(1.25rem, 1.04rem + 0.43vw, 1.56rem) 3px;
      min-height: clamp(2.88rem, 2.79rem + 0.17vw, 3rem);
      border-radius: 1e+06px;
      background: #F0EFFF;
      line-height: 1.4;

      &:hover {
        background: #2D053C;
        color: #F0EFFF;
      }

      &:focus {
        box-shadow: none;
        outline-width: 2px;
        outline-color: #2D053C;
        outline-style: solid;
        outline-offset: 3px;
        background: #2D053C;
        color: #F0EFFF;
      }
    }

    .slds-button.slds-button_neutral:before {
      content: "";
      position: absolute;
      top: 0px;
      left: 0px;
      width: 100%;
      height: 100%;
      background: #2D053C;
      border-radius: 1e+06px;
      transform: translateX(calc(-100% - 2px));
      transition-duration: 0.35s;
      transition-property: transform, opacity;
      transition-timing-function: cubic-bezier(0.33, 1, 0.68, 1);
      will-change: transform;
    }

    .slds-button.slds-button_neutral:hover::before,
    .slds-button.slds-button_neutral:focus::before {
      transform: translateX(0px);
      background: #2D053C;
      opacity: 0;
    }
    
  }  
}

.slds-button.slds-button_brand {
  transition: background 0.35s, color 0.35s;
  padding: 2px clamp(1.25rem, 1.04rem + 0.43vw, 1.56rem) 3px;
  min-height: clamp(2.88rem, 2.79rem + 0.17vw, 3rem);
  border-radius: 1e+06px;
  background: #FF324B;
  overflow: hidden;
  line-height: 1.4;

  &:hover {
    background: #2D053C;
    color: #F0EFFF;
  }

  &:focus {
    box-shadow: none;
    outline-width: 2px;
    outline-color: #F0EFFF;
    outline-style: solid;
    outline-offset: 3px;
    background: #2D053C;
    color: #F0EFFF;
  }
}

.slds-button.slds-button_brand:before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  background: #2D053C;
  border-radius: 1e+06px;
  transform: translateX(calc(-100% - 2px));
  transition-duration: 0.35s;
  transition-property: transform, opacity;
  transition-timing-function: cubic-bezier(0.33, 1, 0.68, 1);
  will-change: transform;
}

.slds-button.slds-button_brand:hover::before,
.slds-button.slds-button_brand:focus::before {
  transform: translateX(0px);
  background: #2D053C;
  opacity: 0;
}


/* Ordered lists */

.dxp-ordered-list {

  .dxp-list-item {

    padding-top: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #2D053C;

    &:first-child {
      padding-top: 0;
    }

    &:nth-child(even) {
      background-color: #F7F7FF;
    }

    &:before {
      font-family: "Graphik Compact", sans-serif;
      font-style: normal;
      font-weight: 500;
      margin: 0px;
      margin-left: 5px;
      font-size: 1rem;
      line-height: 1.2rem;
      width: 20px;
    }

    .column-content {
      h5 {
        font-family: "Graphik Compact", sans-serif;
        font-style: normal;
        font-weight: 400;
        margin: 0px;
        font-size: 1rem;
        line-height: 1.2rem;
      }
    }
  }
}