// app global css in SCSS form
.text-brand {
  color: $brand !important;
}
  
.bg-brand {
  background: $brand !important;
}

.text-brand2 {
  color: $brand2 !important;
}
  
.bg-brand2 {
  background: $brand2 !important;
}

$base-width: 100;
@while $base-width > 0 {
   .w#{$base-width} { width: #{$base-width}+'%'; }
   $base-width: $base-width - 10;
}

body, html, #q-app {
  font-family: $typography-font-family;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

* {
  font-family: inherit;
}

:root {
  --body-width: 600px;
  --top-radius: 12px;
  --logo-color-bg-white: grey;
  --dynamic-font-size: 16px;
}

#q-app {
  padding-bottom: env(safe-area-inset-bottom, 0);
  padding-bottom: constant(safe-area-inset-bottom, 0); // Для старых iOS
}

body {
  overflow: hidden !important;
}

.main-content {
  max-width: 600px;
  margin: 0 auto;
}

.fix-fab-offset {
  margin-right: calc(max((100vw - var(--body-width))/2, 0px) + 18px) !important;
}
  
.projects-header {
  background-color: #eee;
}

.top-rounded-card {
  border-top-left-radius: var(--top-radius) !important;
  border-top-right-radius: var(--top-radius) !important;
}

.rounded-card {
  border-radius: var(--top-radius) !important;
}

.glass-card {
  background-color: rgb(255, 255, 255, 0.91) !important;
}

.orline {
  display: flex;
  flex-direction: row;
}     

.orline:before,
.orline:after {
  content: "";
  flex: 1 1;
  border-bottom: 1px solid grey;
  margin: auto;
}

@font-face {
  font-family: 'myFont';
  src: url(./fonts/Inter-Regular.woff2);
}

.fix-disabled-btn.q-btn[disabled]:not(.q-btn--flat) {
  background-color: $grey-5 !important;
}

.fix-disabled-btn.q-btn.q-btn--flat[disabled] {
  color: $grey-9 !important;
  opacity: 1;
}