/**
 * Do not edit directly, this file was auto-generated.
 */
@layer jokul.components {
  .jkl-logo {
    color: var(--jkl-color-text-default);
  }
  @media screen and (forced-colors: active) {
    .jkl-logo {
      stroke: CanvasText;
      fill: CanvasText;
    }
    .jkl-logo svg, .jkl-logo path {
      stroke: CanvasText;
      fill: CanvasText;
    }
  }
  .jkl-logo__F {
    /* Is connected to the viewbox of the logo, change at your own risk */
    transform-origin: 30px 132px;
  }
  .jkl-logo__F-line {
    /* Must be the same as the line x1 origin, change at your own risk */
    transform-origin: 34.3px;
  }
  .jkl-logo__fremtind {
    opacity: 1;
  }
  .jkl-logo--symbol-only .jkl-logo__F {
    transform: rotate(45deg);
  }
  .jkl-logo--symbol-only .jkl-logo__F-line {
    transform: scaleX(1.5);
  }
  .jkl-logo--symbol-only .jkl-logo__fremtind {
    transition-delay: 0ms;
    opacity: 0;
    transform: translateX(-5%);
  }
  .jkl-logo--animated .jkl-logo__F {
    transition: transform 250ms 75ms cubic-bezier(0.5, 0, 0.62, 1);
  }
  .jkl-logo--animated .jkl-logo__F-line {
    transition: transform 250ms ease-in;
  }
  .jkl-logo--animated .jkl-logo__fremtind {
    transition: opacity 250ms 75ms ease-in, transform 250ms ease;
  }
  .jkl-logo--centered.jkl-logo--symbol-only .jkl-logo__F {
    transform: translateX(35%) rotate(45deg);
  }
  .jkl-logo-stamp {
    color: var(--logo-stamp-color);
  }
  @media screen and (forced-colors: active) {
    .jkl-logo-stamp {
      stroke: CanvasText;
      fill: CanvasText;
    }
    .jkl-logo-stamp svg, .jkl-logo-stamp path {
      stroke: CanvasText;
      fill: CanvasText;
    }
  }
  .jkl-logo-stamp--animated .jkl-logo-stamp__text {
    transform-origin: 256px 256px;
    transition-timing-function: cubic-bezier(0.75, 0, 0, 1);
    transition-duration: 150ms;
    transition-property: transform;
  }
  .jkl-logo-stamp--animated[data-rotate=true] .jkl-logo-stamp__text {
    transition-duration: 1500ms;
    transform: rotate(360deg);
  }
}