/* Cozy UI utilities classes */
@import '~cozy-ui/dist/cozy-ui.min.css';
/* Cozy UI React components styles */
@import '~cozy-ui/react/stylesheet.css';
/* App styles */
@import 'base/layout';
@import 'base/color';
@import 'base/breakpoint';
@import 'base/typography';
@import 'components/card';
@import 'components/form';
@import 'components/button';
@import 'components/konnector';
@import 'components/fluid';
@import 'components/navigator';
@import 'components/consumptionvisualizer';
@import 'components/barchart';
@import 'components/nav';
@import 'components/indicators';
@import 'components/challenges';
@import 'components/ecogesture';
@import 'components/modal';
@import 'components/faq';
@import 'components/splash';
@import 'components/oauth';

:root {
  --blue: #{$blue};
  --blue40: #{$blue-40};
  --blueBackground: #{$blue-radial-gradient};
  --blueRadialGradient: #{$blue-radial-gradient};
  --blueRadialGradientTrans: #{$blue-radial-gradient-transparent};
  --elecColor: #{$elec-color};
  --elecCompareColor: #{$elec-compare-color};
  --gasColor: #{$gas-color};
  --gasCompareColor: #{$gas-compare-color};
  --waterColor: #{$water-color};
  --waterCompareColor: #{$water-compare-color};
  --multiColor: #{$multi-color};
  --multiCompareColor: #{$multi-compare-color};
  --greyBright: #{$grey-bright};
  --greyDark: #{$grey-dark};
  --textBlack: #{$text-black};
  --textWhite: #{$text-white};
  --textBright: #{$text-bright};
  --textDark: #{$text-dark};
  --darkLight: #{$dark-light};
  --darkLight2: #{$dark-light-2};
  --textFont: #{$text-font};
  --greyBackground: #{$grey-background};
  --multiColorRadialGradientTrans: #{$multi-color-radial-gradient-transparent};
  --elecColorRadialGradientTrans: #{$elec-color-radial-gradient-transparent};
  --waterColorRadialGradientTrans: #{$water-color-radial-gradient-transparent};
  --gasColorRadialGradientTrans: #{$multi-color-radial-gradient-transparent};
  --multiColorRadialGradient: #{$multi-color-radial-gradient};
  --elecColorRadialGradient: #{$elec-color-radial-gradient};
  --gasColorRadialGradient: #{$gas-color-radial-gradient};
  --waterColorRadialGradient: #{$water-color-radial-gradient};
}

.application {
  @media #{$large-phone} {
    min-height: 100vh;
  }
  overflow-x: hidden;
}