#totalkredit-embedded-application {
  /*Headings and interactive elements*/
  --primary-color: #114345;
  --primary-color--hover: #1143459a;

  /*Buttons and links*/
  --secondary-color: #5acb9c;
  --secondary-color--hover: #7bd5b0;

  /*House middle*/
  --tertiary-color: #fabf3a;

  /*Loading spinner, house top*/
  --quarternary-color: #ff8308;

  /*card border color*/
  --card-border-color: var(--secondary-color);

  /*Button corner curvature*/
  --button-border-radius: 5rem;

  /*Input corner curvature */
  --input-border-radius: 0.25rem;

  /*Card corner curvature */
  --card-border-radius: 0.25rem;
}

#totalkredit-embedded-application .typography {
  font-family: Lato, sans-serif;
}

#totalkredit-embedded-application .textfield__input {
  font-family: Lato, sans-serif;
}

/*This overrides transparent buttons hover state text color*/
#totalkredit-embedded-application {
  .button--text:hover:not([disabled]) .typography {
    color: var(--primary-color);
  }
}

#totalkredit-embedded-application .button--text .typography {
  color: var(--primary-color);
}

#totalkredit-embedded-application .button--text .typography:hover {
  color: var(--primary-color);
}

#totalkredit-embedded-application .button--text:hover:not([disabled]) {
  text-decoration-color: var(--primary-color);
}

#totalkredit-embedded-application .button--text {
  text-decoration-line: none;
  border: none;
}

#totalkredit-embedded-application .button--text:hover {
  text-decoration-line: underline;
  text-underline-offset: 0.2rem;
}

/*Primary button*/
#totalkredit-embedded-application .button--primary {
  border-color: var(--secondary-color);
}

#totalkredit-embedded-application .button--primary:hover {
  border-color: var(--secondary-color);
}

#totalkredit-embedded-application .button--primary .typography {
  color: var(--primary-color);
}

#totalkredit-embedded-application {
  .link {
    text-decoration-line: none;
    text-decoration-style: solid;
    text-underline-position: from-font;
    border: none;
    color: var(--primary-color);
    text-decoration-color: var(--primary-color);
  }
}

/*Secondary button*/
#totalkredit-embedded-application .button--secondary {
  border-color: var(--primary-color);
}

#totalkredit-embedded-application .button--secondary:hover {
  border-color: var(--primary-color);
  background: #5acb9c1a;
}

#totalkredit-embedded-application .button--secondary .typography {
  color: var(--primary-color);
}

#totalkredit-embedded-application {
  .button--secondary:hover:not([disabled]) {
    background: #5acb9c1a;
  }
}

/*Links*/
#totalkredit-embedded-application {
  .link {
    text-decoration-line: none;
    text-decoration-style: solid;
    text-underline-position: from-font;
    border: none;
    color: var(--primary-color);
    text-decoration-color: var(--primary-color);
  }
}

#totalkredit-embedded-application {
  .link:hover {
    text-decoration-line: underline;
    text-decoration-style: solid;
    text-underline-position: from-font;
    text-underline-offset: 0.2rem;
    border: none;
    color: var(--primary-color);
    text-decoration-color: var(--primary-color);
  }
}

#totalkredit-embedded-application {
  .link .typography {
    color: var(--primary-color);
  }
}

#totalkredit-embedded-application .typography {
  .link:hover:not([disabled]) {
    color: var(--primary-color);
    text-decoration-color: var(--primary-color);
  }
}

#totalkredit-embedded-application {
  .link:hover:not([disabled]) .typography {
    color: var(--primary-color);
  }
}

#totalkredit-embedded-application {
  .json-render__link {
    text-decoration-line: none;
    cursor: pointer;
    color: var(--primary-color);
  }
}

#totalkredit-embedded-application {
  .house-graph__bottom-section {
    fill: #ff4d00;
  }
}

#totalkredit-embedded-application {
  .new-loan-distribution__legend__row--third {
    background: #ff4d00;
  }
}

/*slider colors in id=new-loan-calculator / tk-2025-nyt-laan*/
#totalkredit-embedded-application {
  .slider__track__selection {
    background-color: var(--secondary-color);
  }
}

#totalkredit-embedded-application {
  .slider__thumb {
    background-color: var(--secondary-color);
  }
}

#totalkredit-embedded-application {
  .slider__track {
    background-color: var(--secondary-color);
  }
}

#totalkredit-embedded-application {
  .slider:hover .slider__thumb,
  .slider:hover .slider__track__selection {
    background-color: var(--secondary-color);
  }
}

/*third legend color in tk-2025-tillaegslaan / id=supplementary-mortgage*/
#totalkredit-embedded-application {
  .supplementary-mortgage-distribution__legend__row--third {
    background: #ff4d00;
  }
}

/*checkmark color*/
#totalkredit-embedded-application {
  .interest-only-info__icon {
    --primary-color: var(--secondary-color);
    --quarternary-color: var(--secondary-color);
  }
}

/*spinner stroke color for "Henter beregner..." (beregn_frivaerdi)*/
#totalkredit-embedded-application {
  .totalkredit-embedded-application__spinner__svg__outer-path {
    stroke: var(--secondary-color) !important;
  }
}

/*spinner stroke color for "Henter data" (beregn_frivaerdi)*/
@keyframes totalkredit-embedded-application-spinner-colors {
  0% {
    stroke: var(--secondary-color) !important;
  }

  to {
    stroke: var(--secondary-color) !important;
  }
}