:root {
  --primary: #5e76ed;
  --primary-light: #9167e4;
  --muted-foreground: 215 15% 50%;
  --border: rgb(30, 34, 41);
  --accent: 260 70% 65%;
  --background: #080a0c;
  --foreground: #f0f2f5;
  --foreground-alpha: color(from var(--foreground) srgb r g b / 0.03);
  --font-sans: "Inter", sans-serif;
  --font-mono: "JetBrains Mono", monospace;

  /* Root Max Width */
  --sms-root-max-width: var(
    --dxp-c-section-columns-max-width,
    var(
      --dxp-c-l-max-content-width,
      var(--dxp-c-max-content-width, var(--dxp-s-section-columns-max-width))
    )
  );
}

html,
body {
  height: 100%;
}

body {
  background-color: var(--background);
  background-image:
    linear-gradient(var(--foreground-alpha) 1px, transparent 1px),
    linear-gradient(90deg, var(--foreground-alpha) 1px, transparent 1px);
  background-size: 60px 60px;
  color: hsl(var(--foreground));
  height: unset;
  margin: 0;
}

.sms-theme {
  .sms-main-has-bg {
    .column-content {
      background-color: #fff;
      border-radius: 0.75rem;
    }
  }

  a {
    &:has(.fa-solid),
    &:has(.fa-regular),
    &:has(.fa-light),
    &:has(.fa-thin),
    &:has(.fa-brands) {
      --dxp-c-link-text-decoration: none;
      --dxp-s-link-text-decoration-hover: none;
      --dxp-s-link-text-decoration-focus: none;
    }
  }
}