{"version":3,"file":"980.332cc3d5c3c773793fc1.css","mappings":"AAEA,iBACI,kBACA,oBACA,gBACA,gBACA,sBACA,mBACA,uBACA,YACA,kBACA,oCACA,kBACA,6BCqBU,CDpBV,eACA,qBACA,8DACA,kBAEA,sEAGI,6BCaM,CDZN,8DAGJ,wBACI,gBACA,uBAEA,gDACI,iBAGJ,oDACI,WACA,YAIR,4BACI,eAGJ,0BACI,6BCZM,CDaN,mCAEA,iGAGI,6BClBE,CDmBF,mCAGJ,gCACI,6BCrBE,CDyBV,4BACI,kBACA,SACA,WACA,WACA,YACA,uBACA,eAGJ,wBACI,kCACA,eACA,gB;AE1ER,kBACI,UACA,S;ACFJ,4BACI,mB;ACDJ,oBACI,kBACA,aACA,aACA,sBACA,uBACA,uB;AC8UJ,8BACI,QAEI,kCAGJ,QAEI,iCAGJ,YAGI,kCAGJ,QAEI,kCCrWR,sBACI,gBAIJ,qCAEQ,gCACI,aACA,sBACA,mBACA,kBAEA,iDACI,WACA,gBACA,mBACA,YACA,aACA,eACA,mBACA,gBAEA,qDACI,eACA,gBACA,cAGJ,wDACI,WACA,YACA,cACA,kBAGJ,4DACI,gBACA,kBAGJ,4DACI,iBD8PZ,kCACI,4BAGJ,yCACI,wBACA,uCAGJ,uCACI,wBAKJ,8BACI,wBAGJ,qCACI,4BACA,uCAGJ,mCACI,4BAzDJ,iCACI,6BAGJ,wCACI,wBACA,uCAGJ,sCACI,wBAKJ,6BACI,wBAGJ,oCACI,6BACA,uCAGJ,kCACI,6B;AAiDZ,8BACI,QAEI,kCAGJ,QAEI,iCAGJ,YAGI,kCAGJ,QAEI,kCEpWR,4BACI,eACA,UACA,aACA,YACA,aACA,cACA,mBACA,uBAEA,qCACI,aACA,sBACA,aAGJ,oCACI,qBACA,UACA,WACA,aACA,kBNrBQ,CMsBR,kBACA,WAEA,2CACI,UACA,0BAKJ,2DACI,UAGJ,kEACI,UACA,kCAGJ,gEACI,UAGJ,0DACI,UAGJ,iEACI,UACA,kCAGJ,+DACI,UAKZ,sCACI,4BACI,c;AFmRR,8BACI,QAEI,kCAGJ,QAEI,iCAGJ,YAGI,kCAGJ,QAEI,kCGpWR,oBACI,YAEA,0BACI,eACA,UACA,SACA,WAGJ,8BACI,oBACA,mBACA,kBACA,mBACA,uBACA,eACA,eACA,gBAEA,2CACI,iBAIR,kCACI,eACA,UACA,YACA,wBACA,aACA,YACA,mBACA,aACA,sCACA,kBACA,6BPJM,COKN,+BACA,eACA,gBAEA,8CACI,eAIR,0CACI,YACA,cACA,iBAGJ,qCHmCA,oBACA,mBACA,SACA,4CACA,kBACA,uBACA,gBACA,6BAqIA,YACA,eACA,eACA,iBG9KI,iBHwCJ,8CACI,uDACA,kDAGJ,mDACI,4CAGJ,oDACI,4CAGJ,uCACI,aACA,eAEA,+CACI,iBGvDR,oCH6DA,kBACA,oBACA,mBACA,uBACA,SACA,4BACA,kBACA,0BACA,gBACA,6BAkGA,YACA,eACA,eACA,iBAnGA,0CACI,4FAGJ,2CACI,4FAGJ,0CACI,sBACA,mDACA,aAGJ,6CACI,uDACA,kDACA,mBAGJ,sCACI,aACA,eGzFJ,gCAEI,kBACA,aAIR,iCAGI,kBACA,iBACA,eAGA,c","sources":["webpack://mattermost-webapp/./components/common/multi_select_cards/multi_select_card.scss","webpack://mattermost-webapp/./sass/utils/_variables.scss","webpack://mattermost-webapp/./components/common/multi_select_cards/index.scss","webpack://mattermost-webapp/./components/preparing_workspace/page_body.scss","webpack://mattermost-webapp/./components/preparing_workspace/single_column_layout.scss","webpack://mattermost-webapp/./sass/utils/_mixins.scss","webpack://mattermost-webapp/./components/preparing_workspace/plugins.scss","webpack://mattermost-webapp/./components/preparing_workspace/progress.scss","webpack://mattermost-webapp/./components/preparing_workspace/preparing_workspace.scss"],"sourcesContent":["@import 'utils/variables';\n\n.MultiSelectCard {\n    position: relative;\n    display: inline-flex;\n    min-width: 212px;\n    max-width: 257px;\n    flex-direction: column;\n    align-items: center;\n    padding: 16px 24px 24px;\n    border: none;\n    margin-right: 16px;\n    background: var(--center-channel-bg);\n    border-radius: 8px;\n    box-shadow: $elevation-3;\n    cursor: pointer;\n    list-style-type: none;\n    outline: 1px solid rgba(var(--center-channel-color-rgb), 0.16);\n    text-align: center;\n\n    &:hover,\n    &:active,\n    &:focus {\n        box-shadow: $elevation-4;\n        outline: 1px solid rgba(var(--center-channel-color-rgb), 0.32);\n    }\n\n    &--small {\n        min-width: 160px;\n        padding: 24px 12px 20px;\n\n        .MultiSelectCard__label {\n            padding-top: 12px;\n        }\n\n        .MultiSelectCard__checkmark {\n            width: 28px;\n            height: 28px;\n        }\n    }\n\n    &:last-child {\n        margin-right: 0;\n    }\n\n    &--checked {\n        box-shadow: $elevation-2;\n        outline: 2px solid var(--button-bg);\n\n        &:hover,\n        &:active,\n        &:focus {\n            box-shadow: $elevation-2;\n            outline: 2px solid var(--button-bg);\n        }\n\n        &:focus {\n            box-shadow: $elevation-4;\n        }\n    }\n\n    &__checkmark {\n        position: absolute;\n        top: 11px;\n        right: 11px;\n        width: 31px;\n        height: 31px;\n        color: var(--button-bg);\n        font-size: 31px;\n    }\n\n    &__label {\n        font-family: Metropolis, sans-serif;\n        font-size: 18px;\n        font-weight: 600;\n    }\n}\n","@charset 'UTF-8';\n\n// Color Variables\n$primary-color: #166de0;\n$primary-color--hover: darken($primary-color, 10%);\n$bg--gray: rgb(245, 245, 245);\n$white: rgb(255, 255, 255);\n$black: rgb(0, 0, 0);\n$red: rgb(214, 73, 70);\n$yellow: rgb(255, 255, 0);\n$light-gray: rgba(0, 0, 0, 0.15);\n$gray: rgba(0, 0, 0, 0.3);\n$dark-gray: rgba(0, 0, 0, 0.5);\n$link-color: rgb(35, 137, 215);\n$transparent: rgba(0, 0, 0, 0);\n$highlight-color: #fcea8d;\n\n// Typography\n$font-weight--semibold: 600;\n\n// Page Variables\n$border-gray: 1px solid rgba(var(--center-channel-color-rgb), 0.12);\n$announcement-bar-height: 40px;\n$backstage-bar-height: 43px;\n\n// Random variables\n$border-rad: 2px;\n$emoji-per-row: 9; // needs to match variable `EMOJI_PER_ROW` in emoji_picker.jsx\n\n// Transition timing defaults\n$transition-quick: 0.12s;\n\n// Elevations\n$elevation-1: var(--elevation-1);\n$elevation-2: var(--elevation-2);\n$elevation-3: var(--elevation-3);\n$elevation-4: var(--elevation-4);\n$elevation-5: var(--elevation-5);\n$elevation-6: var(--elevation-6);\n",".MultiSelectCards {\n    padding: 0;\n    margin: 0;\n}\n",".PreparingWorkspacePageBody {\n    margin-bottom: 24px;\n}\n",".SingleColumnLayout {\n    position: relative;\n    display: flex;\n    height: 100vh;\n    flex-direction: column;\n    align-items: flex-start;\n    justify-content: center;\n}\n","@charset \"utf-8\";\n\n@mixin file-icon($path) {\n    background-image: url($path);\n    background-position: center;\n    background-repeat: no-repeat;\n    background-size: 32px 40px;\n}\n\n@mixin alpha-property($property, $color, $opacity) {\n    #{$property}: rgba($color, $opacity);\n}\n\n@mixin font-smoothing($value: antialiased) {\n    @if $value == antialiased {\n        -webkit-font-smoothing: antialiased;\n        -moz-osx-font-smoothing: grayscale;\n    }\n\n    @else {\n        -webkit-font-smoothing: subpixel-antialiased;\n        -moz-osx-font-smoothing: auto;\n    }\n}\n\n@mixin cursor($value) {\n    cursor: -webkit-$value;\n    cursor: zoom-$value;\n}\n\n// From https://gist.github.com/kaelig/7528069\n@mixin text-clamp($lines: 2, $line-height: false) {\n    display: -webkit-box;\n    overflow: hidden;\n    -webkit-box-orient: vertical;\n    -webkit-line-clamp: $lines;\n\n    // Fallback for non-Webkit browsers\n    // (won't show `…` at the end of the block)\n    @if $line-height {\n        max-height: $line-height * $lines * 1px;\n    }\n}\n\n@mixin button-style--none {\n    padding: 0;\n    border: none;\n    background: transparent;\n\n    &:focus {\n        outline: 0;\n        text-decoration: none;\n    }\n\n    &.btn {\n        padding: 6px 12px;\n    }\n\n    &.btn--block {\n        width: 100%;\n        text-align: left;\n    }\n\n    &:hover,\n    &:active {\n        text-decoration: none;\n    }\n}\n\n@mixin fit-content {\n    width: fit-content;\n    width: -moz-fit-content;\n}\n\n@mixin clearfix {\n    overflow: hidden;\n    *zoom: 1;\n}\n\n@mixin pie-clearfix {\n    &::after {\n        display: table;\n        clear: both;\n        content: \"\";\n    }\n\n    *zoom: 1;\n}\n\n@mixin tertiary-button {\n    display: inline-flex;\n    align-items: center;\n    border: 0;\n    background: rgba(var(--button-bg-rgb), 0.08);\n    border-radius: 4px;\n    color: var(--button-bg);\n    font-weight: 600;\n    transition: all 0.15s ease-out;\n\n    &:disabled {\n        background: rgba(var(--center-channel-color-rgb), 0.08);\n        color: rgba(var(--center-channel-color-rgb), 0.32);\n    }\n\n    &:hover:enabled {\n        background: rgba(var(--button-bg-rgb), 0.12);\n    }\n\n    &:active:enabled {\n        background: rgba(var(--button-bg-rgb), 0.16);\n    }\n\n    i {\n        display: flex;\n        font-size: 18px;\n\n        &::before {\n            margin: 0 7px 0 0;\n        }\n    }\n}\n\n@mixin primary-button {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border: 0;\n    background: var(--button-bg);\n    border-radius: 4px;\n    color: var(--button-color);\n    font-weight: 600;\n    transition: all 0.15s ease-out;\n\n    &:hover {\n        background: linear-gradient(0deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.08)), var(--button-bg);\n    }\n\n    &:active {\n        background: linear-gradient(0deg, rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.16)), var(--button-bg);\n    }\n\n    &:focus {\n        box-sizing: border-box;\n        border: 2px solid var(--sidebar-text-active-border);\n        outline: none;\n    }\n\n    &:disabled {\n        background: rgba(var(--center-channel-color-rgb), 0.08);\n        color: rgba(var(--center-channel-color-rgb), 0.32);\n        cursor: not-allowed;\n    }\n\n    i {\n        display: flex;\n        font-size: 18px;\n    }\n}\n\n@mixin secondary-button {\n    position: relative;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    border: 1px solid var(--denim-button-bg);\n    background: var(--center-channel-bg);\n    border-radius: 4px;\n    color: var(--button-bg);\n    font-weight: 600;\n    transition: all 0.15s ease-out;\n\n    &:hover {\n        background: rgba(var(--denim-button-bg-rgb), 0.08);\n    }\n\n    &:active {\n        background: rgba(var(--denim-button-bg-rgb), 0.16);\n    }\n\n    &:focus {\n        box-sizing: border-box;\n        border: 2px solid var(--sidebar-text-active-border);\n        outline: none;\n    }\n\n    &:disabled {\n        border: rgba(var(--center-channel-color-rgb), 0.32);\n        color: rgba(var(--center-channel-color-rgb), 0.32);\n        cursor: not-allowed;\n    }\n\n    i {\n        display: flex;\n        font-size: 18px;\n    }\n}\n\n@mixin button-focus {\n    &:focus {\n        border-width: 0;\n        box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);\n    }\n\n    &:focus:not(:focus-visible) {\n        border-width: 0;\n        box-shadow: none;\n    }\n\n    &:focus-visible {\n        border-width: 0;\n        box-shadow: inset 0 0 0 2px var(--sidebar-text-active-border);\n    }\n}\n\n@mixin button-xsmall {\n    height: 24px;\n    padding: 4px 6px;\n    font-size: 11px;\n    line-height: 16px;\n}\n\n@mixin button-small {\n    height: 32px;\n    padding: 0 16px;\n    font-size: 12px;\n    line-height: 10px;\n}\n\n@mixin button-medium {\n    height: 40px;\n    padding: 0 20px;\n    font-size: 14px;\n    line-height: 14px;\n}\n\n@mixin button-large {\n    height: 48px;\n    padding: 0 24px;\n    font-size: 16px;\n    line-height: 18px;\n}\n\n@mixin link {\n    border: none;\n    box-shadow: none;\n    color: var(--link-color);\n    font-size: 12px;\n    font-weight: 600;\n    line-height: 16px;\n\n    &:hover,\n    &:active,\n    &:focus {\n        text-decoration-line: underline;\n    }\n\n    &:disabled {\n        color: rgba(var(--center-channel-color-rgb), 0.32);\n        cursor: not-allowed;\n        text-decoration: none;\n    }\n}\n\n@mixin simple-in-and-out-after($classPrefix, $transition_time: 300ms) {\n    .#{$classPrefix}--enter-from-after {\n        &-enter {\n            transform: translateY(-100vh);\n        }\n\n        &-enter-active {\n            transform: translateY(0);\n            transition: transform $transition_time ease-in-out;\n        }\n\n        &-enter-done {\n            transform: translateY(0);\n        }\n    }\n\n    .#{$classPrefix}--exit-to-after {\n        &-exit {\n            transform: translateY(0);\n        }\n\n        &-exit-active {\n            transform: translateY(-100vh);\n            transition: transform $transition_time ease-in-out;\n        }\n\n        &-exit-done {\n            transform: translateY(-100vh);\n        }\n    }\n}\n\n@mixin simple-in-and-out-before($classPrefix, $transition_time: 300ms) {\n    .#{$classPrefix}--enter-from-before {\n        &-enter {\n            transform: translateY(100vh);\n        }\n\n        &-enter-active {\n            transform: translateY(0);\n            transition: transform $transition_time ease-in-out;\n        }\n\n        &-enter-done {\n            transform: translateY(0);\n        }\n    }\n\n    .#{$classPrefix}--exit-to-before {\n        &-exit {\n            transform: translateY(0);\n        }\n\n        &-exit-active {\n            transform: translateY(100vh);\n            transition: transform $transition_time ease-in-out;\n        }\n\n        &-exit-done {\n            transform: translateY(100vh);\n        }\n    }\n}\n\n@mixin simple-in-and-out($classPrefix, $transition_time: 300ms) {\n    @include simple-in-and-out-before($classPrefix, $transition_time);\n    @include simple-in-and-out-after($classPrefix, $transition_time);\n}\n\n@mixin shake-horizontally {\n    animation: shake-horizontally 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;\n    backface-visibility: hidden;\n    perspective: 1000px;\n    transform: translate3d(0, 0, 0);\n}\n\n@keyframes shake-horizontally {\n    10%,\n    90% {\n        transform: translate3d(-1px, 0, 0);\n    }\n\n    20%,\n    80% {\n        transform: translate3d(2px, 0, 0);\n    }\n\n    30%,\n    50%,\n    70% {\n        transform: translate3d(-4px, 0, 0);\n    }\n\n    40%,\n    60% {\n        transform: translate3d(4px, 0, 0);\n    }\n}\n","@import 'utils/mixins';\n\n.Plugins__marketplace {\n    margin-top: 24px;\n}\n\n// preempt cards wrapping\n@media screen and (max-width: 900px) {\n    .Plugins-body {\n        .MultiSelectCards {\n            display: flex;\n            flex-direction: column;\n            align-items: center;\n            margin-right: 16px;\n\n            .MultiSelectCard {\n                width: 100%;\n                max-width: 500px;\n                flex-direction: row;\n                flex-grow: 1;\n                padding: 16px;\n                margin-right: 0;\n                margin-bottom: 16px;\n                text-align: left;\n\n                svg {\n                    max-width: 50px;\n                    max-height: 50px;\n                    flex-shrink: 0;\n                }\n\n                &__label {\n                    width: 100%;\n                    flex-grow: 1;\n                    padding-top: 0;\n                    padding-left: 20px;\n                }\n\n                &__checkmark {\n                    position: static;\n                    padding-right: 4px;\n                }\n\n                &:last-child {\n                    margin-bottom: 0;\n                }\n            }\n        }\n    }\n}\n\n@include simple-in-and-out(\"Plugins\");\n","@import 'utils/variables';\n@import 'utils/mixins';\n\n.PreparingWorkspaceProgress {\n    position: fixed;\n    z-index: 1;\n    display: flex;\n    width: 120px;\n    height: 100vh;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: center;\n\n    &__circles {\n        display: flex;\n        flex-direction: column;\n        margin: 2em 0;\n    }\n\n    &__circle {\n        display: inline-block;\n        width: 6px;\n        height: 6px;\n        margin: 5px 0;\n        background: $primary-color;\n        border-radius: 6px;\n        opacity: 0.2;\n\n        &.active {\n            opacity: 1;\n            outline: 3px solid lighten($primary-color, 50%);\n        }\n    }\n\n    &.OnboardingWizardProgress {\n        &-enter {\n            opacity: 0;\n        }\n\n        &-enter-active {\n            opacity: 1;\n            transition: transform 300ms linear;\n        }\n\n        &-enter-done {\n            opacity: 1;\n        }\n\n        &-exit {\n            opacity: 1;\n        }\n\n        &-exit-active {\n            opacity: 0;\n            transition: transform 300ms linear;\n        }\n\n        &-exit-done {\n            opacity: 0;\n        }\n    }\n}\n\n@media screen and (max-width: 1270px) {\n    .PreparingWorkspaceProgress {\n        display: none;\n    }\n}\n","@import 'utils/variables';\n@import 'utils/mixins';\n\n.PreparingWorkspace {\n    width: 100vw;\n\n    &__logo {\n        position: fixed;\n        z-index: 1;\n        top: 32px;\n        right: 32px;\n    }\n\n    &__previous {\n        display: inline-flex;\n        align-items: center;\n        padding-right: 2px;\n        margin-bottom: 25px;\n        color: var(--button-bg);\n        cursor: pointer;\n        font-size: 12px;\n        font-weight: 600;\n\n        :first-child {\n            margin-right: 5px;\n        }\n    }\n\n    &__submit-error {\n        position: fixed;\n        z-index: 1;\n        bottom: 24px;\n        left: calc(50vw - 202px);\n        display: flex;\n        width: 404px;\n        align-items: center;\n        padding: 10px;\n        background-color: var(--dnd-indicator);\n        border-radius: 4px;\n        box-shadow: $elevation-3;\n        color: var(--center-channel-bg);\n        font-size: 14px;\n        font-weight: 600;\n\n        .icon-close {\n            cursor: pointer;\n        }\n    }\n\n    &__submit-error-message {\n        flex-grow: 1;\n        flex-shrink: 0;\n        padding-left: 9px;\n    }\n\n    .tertiary-button {\n        @include tertiary-button;\n        @include button-medium;\n\n        margin-left: 16px;\n    }\n\n    .primary-button {\n        @include primary-button;\n        @include button-medium;\n    }\n\n    .child-page {\n        // needed for smooth cross-page transition;\n        position: absolute;\n        height: 100vh;\n    }\n}\n\n.PreparingWorkspacePageContainer {\n\n    // needed so that channel preview can be positioned relative to this div\n    position: relative;\n    max-width: 1030px;\n    padding: 0 10px;\n\n    // centering\n    margin: 0 auto;\n}\n"],"names":[],"sourceRoot":""}