@import "import";

html {
  @include transition(color, 0.4s);
  font-family: font-family(base);
  font-size: font-size(base);
  line-height: line-height(base);
  letter-spacing: letter-spacing(base);
  font-weight: font-weight(base);
  background-color: color(background);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
}

#__next {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: clip;
  isolation: isolate;
}

hr {
  @include global-container;
  width: 100%; //min(calc(100% - spacer(4) * 2), calc(max-w(global) - spacer(4) * 2));
  height: 1px;
  border: none;
  background-color: currentColor;

  @include breakpoint(medium) {
    width: 100%; //min(calc(100% - spacer(6) * 2), calc(max-w(global) - spacer(6) * 2));
  }
}

.debug {
  @include debug;
}

.light,
.dark {
  @include transition(color, 0.4s);
}

.light {
  color: color(text-light);
}

.dark {
  color: color(text-dark);
}

/* Components */

.tag {
  @include transition("background-color, color");
  @include button(small);
  letter-spacing: 0;
  background-color: color(background);
  border: 1px solid color(tag);

  span {
    white-space: nowrap;
  }

  &:hover {
    background-color: color(tag);
  }

  &.active {
    color: color(background);
    background-color: color(text);
    border: 1px solid color(text);
  }
}

/* Lenis - Keeping only necessary styles without smooth behavior */

.lenis {
  height: auto;
  overflow: auto;
  overscroll-behavior-y: none; /* Prevents scrolling above y=0 (no spring effect) */
}

.lenis [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis iframe {
  pointer-events: auto;
}