// This file is the global CSS that must be included by all applications
// that consume polaris-react. Per component styling relies on these base styles.

@import './common';

:root {
  --polaris-version-number: '4.6.1';
}

html,
body {
  @include text-style-body;
  @include text-emphasis-normal;
}

html,
body,
button {
  font-family: font-family();
}

html {
  position: relative;
  font-size: ($base-font-size / $default-browser-font-size) * 100%;
  -webkit-font-smoothing: antialiased;

  // This needs to come after -webkit-font-smoothing
  -moz-osx-font-smoothing: grayscale;

  text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
}

body {
  min-height: 100%;
  margin: 0;
  padding: 0;
  background-color: color('sky', 'light');
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  font-size: 1em;
  font-weight: 400;
}

button::-moz-focus-inner,
[type='button']::-moz-focus-inner,
[type='reset']::-moz-focus-inner,
[type='submit']::-moz-focus-inner {
  border-style: none;
}

@keyframes :global(polaris-SkeletonShimmerAnimation) {
  0% {
    opacity: 0.45;
  }

  100% {
    opacity: 0.9;
  }
}