// app global css in Sass form
@import "quasar.variables"

.aui-sticky-column-left
    position: sticky
    left: 0
    z-index: 1

.aui-list-item-section-button
    height: 60px
    padding-bottom: 20px

.aui-required
    & .q-field, // this is used for wrapped inputs like "AuiInputScoredPassword"
    &.q-field
        --aui-required-mark-text: " *"
        .q-field__control-container:hover
            --aui-required-mark-text: var(--aui-required-mark-text-i18n, " (mandatory field)")

        .q-field__label:after
            content: var(--aui-required-mark-text, " *")
            vertical-align: super
            font-size: smaller

\:root
    --aui-required-mark-text-i18n: " (mandatory field)" // this variable can be redefined from JS to provide i18n


// styling "Timeline" component
.aui-timeline
    .vis-item
        border-color: $timeline-item-border-color
        background-color: $timeline-item-background-color1
        background: linear-gradient(0deg, $timeline-item-background-color2, white)


.aui-page-sticky-fix
    z-index: 50 // Note: the fix for the overriding button bug on q-page-sticky by some elements of "vue-password-strength-meter"'s strength indicator control
