// app global css in SCSS form
@each $size in (1, 2, 3, 4, 5, 10, 15, 20, 25, 50, 75, 100, 200) {
  .rounded-#{$size} {
    border-radius: #{$size}px !important;
  }
}

.text-fb-blue {
  color: #4267B2 !important;
}
.bg-fb-blue {
  background: #4267B2 !important;
}

.text-authentik-orange {
  color: #fd4b2d !important;
}
.bg-authentik-orange {
  background: #fd4b2d !important;
}

.q-table tbody tr:hover {
  background: #00ff260c;
}

body.body--dark {
  --q-secondary: #151520;
  color: $grey-2;
}

.body--light {
  --q-dark: #FFF;
  color: $blue-grey-8;
}

.shift-highlight {
    background: #0195462a;
}

.frosted-glass {
    background-color: #0008 !important;
    backdrop-filter: blur(5px);
}

.q-btn--push::before {
    border-bottom: 4px solid rgba(0,0,0, 0.25);
}

.q-btn--push:active {
    transform: translateY(3px);
}

.q-btn--push:active::before {
    border-bottom-width: 1px;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}