@charset "utf-8";

@use "./variables" as *;
@forward "./components";

html {
  color-scheme: light !important;
  width: 100%;
  font: normal $slab-base-body-font-size $slab-base-body-font-family;
  color: var(--slab_foreground_primary);

  body {
    color: var(--slab_foreground_primary);

    &:not(.is-login) {
      min-width: $slab-app-min-width;
      min-height: $slab-app-min-height;
    }
  }

  input,
  button,
  a,
  a:focus {
    outline: 0 !important;
  }

  input::-ms-clear {
    display: none;
  }

  input[type='number'] {
    -moz-appearance: textfield;
  }

  input::-webkit-outer-spin-button,
  input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
  }
}

.slab-flex-1 {
  flex: 1;
}

.slab-overflow-container {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}