/*!
 * coding=utf-8
 * Copyright 2021-present, the Recognai S.L. team.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700');
html {
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  font-size: 100%;
  *,
  *:before,
  *:after {
    box-sizing: inherit;
  }
}

body {
  margin: 0;
  text-rendering: optimizeLegibility;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  color: $font-dark-color;
  font-family: $ff;
  font-size: $base-font-size;
  line-height: $base-line-height;
  background: $bg;
  min-height: 100vh;
  max-height: 100vh;
  overflow: hidden;
  &.--fixed {
    pointer-events: none;
  }
}

a,
button {
  color: $font-dark-color;
}

audio,
img,
svg,
object,
embed,
canvas,
video,
iframe {
  max-width: 100%;
  font-style: italic;
  vertical-align: middle;
}

button,
input,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  margin: 0;
  vertical-align: baseline;
}

button,
select {
  text-transform: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  background: transparent;
  &:focus {
    outline: thin dotted;
  }
  &:hover,
  &:active {
    outline: 0;
  }
}

[tabindex='-1']:focus {
  outline: none !important;
}

// Icons svg
.svg-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  color: inherit;
  vertical-align: middle;
  fill: none;
  stroke: currentColor;
}

.svg-fill {
  fill: currentColor;
  stroke: none;
}


// transitions
// FADE
.fade-enter-active,
.fade-leave-active {
  transition: opacity 0.4s ease-in-out;
}

.fade-enter,
.fade-leave-to,
.fade-leave-active {
  opacity: 0;
}

// FADE LIST
.list-enter-active,
.list-enter-active p,
.list-leave-active p {
  transition: all 1s;
}

.list-enter p,
.list-leave-to p
/* .list-leave-active below version 2.1.8 */

 {
  opacity: 0;
}

// TRANSITIONS
.page-enter-active,
.page-leave-active {
  transition: opacity 0.5s;
}
.page-enter,
.page-leave-to {
  opacity: 0;
}

.layout-enter-active,
.layout-leave-active {
  transition: opacity 0.3s;
}
.layout-enter,
.layout-leave-to {
  opacity: 0;
}

.fade-enter-active, .fade-leave-active {
  transition: opacity .5s;
}
.fade-enter, .fade-leave-to {
  opacity: 0;
}


// sr only
.sr-only {
  @extend %visuallyhidden;
}

.hidden-input {
  opacity: 0;
  position: absolute;
  bottom: 100%;
}