////////////////////////////////////////////////////////////////////////////////
//
//  Licensed to the Apache Software Foundation (ASF) under one or more
//  contributor license agreements.  See the NOTICE file distributed with
//  this work for additional information regarding copyright ownership.
//  The ASF licenses this file to You under the Apache License, Version 2.0
//  (the "License"); you may not use this file except in compliance with
//  the License.  You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
//  Unless required by applicable law or agreed to in writing, software
//  distributed under the License is distributed on an "AS IS" BASIS,
//  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
//  See the License for the specific language governing permissions and
//  limitations under the License.
//
////////////////////////////////////////////////////////////////////////////////

// Jewel PopUp

// PopUp variables
$popup-content-overlay-color: #000 !default
$popup-content-overlay-opacity: .65 !default

.jewel.popup

.popup-content
    
    &::before
        
        background-color: rgba($popup-content-overlay-color, $popup-content-overlay-opacity)
        will-change: opacity
        transition: animation-standard(opacity, .4s)

    .jewel.popupcontent
        border: 0px
        border-radius: 10px
        padding: 20px
        background: white
        
        box-shadow: 0px 0px 6px 1px rgba(.7, .7, .7, .7) !important

    &.open
        
        &::before
        
        .jewel.popupcontent

@media (min-width: $desktop)
    .popup-content
        .jewel.popupcontent
            box-shadow: none !important