Elep

@import "start";

#fs_customizer_upsell {
    .fs-customizer-plan {
        padding: 10px 20px 20px 20px;
        border-radius: 3px;
        background: #fff;

h2 {
            position: relative;
            margin: 0;
            line-height: 2em;
            text-transform: uppercase;

.button-link {
                top: -2px;
            }
        }
    }

.fs-feature {
        position: relative;
    }

.dashicons-yes {
        color: #0085ba;
        font-size: 2em;
        vertical-align: bottom;
        margin-left: -7px;
        margin-right: 10px;

.rtl & {
            margin-left: 10px;
            margin-right: -7px;
        }
    }

.dashicons-editor-help
    {
        color:  #bbb;
        cursor: help;

$tooltip-color: #000;

.fs-feature-desc {
            opacity:       0;
            visibility: hidden;
            @include transition(opacity 0.3s ease-in-out);

position:      absolute;
            background:    $tooltip-color;
            color:         #fff;
            font-family:   'arial', serif;
            font-size:     12px;
            padding:       10px;
            z-index:       999999;
            bottom:        100%;
            margin-bottom: 5px;
            left:          0;
            right:         0;
            @include border-radius(5px);
            @include box-shadow(1px 1px 1px rgba(0,0,0,0.2));
            line-height:   1.3em;
            font-weight:   bold;
            text-align:    left;

.rtl &
            {
                text-align: right;
            }

&::after {
                content: ' ';
                display: block;
                width: 0;
                height: 0;
                border-style: solid;
                border-width: 5px 5px 0 5px;
                border-color: $tooltip-color transparent transparent transparent;
                position: absolute;
                top: 100%;
                left: 21px;

.rtl & {
                    right: 21px;
                    left: auto;
                }
            }
        }

&:hover {
            .fs-feature-desc {
                visibility: visible;
                opacity: 1;
            }
        }
    }

.button-primary {
        display: block;
        text-align: center;
        margin-top: 10px;
    }
}

#fs_customizer_support
{
    display: block !important;

.button {
        float: right;
    }

.button-group {
        width: 100%;
        display: block;
        margin-top: 10px;

.button {
            float: none;
            width: 50%;
            text-align: center;
        }
    }
}

#customize-theme-controls #accordion-section-freemius_upsell
{
    border-top:    1px solid $wp-button-primary-background-color !important;;
    border-bottom: 1px solid $wp-button-primary-background-color !important;;

h3.accordion-section-title
    {
        color:            $wp-button-primary-color;
        background-color: $wp-button-primary-background-color;
        border-left:      4px solid $wp-button-primary-background-color;
        transition:       .15s background-color ease-in-out, .15s border-color ease-in-out;
        outline:          none;
        border-bottom:    none !important;

&:hover
        {
            background-color:  $wp-button-primary-hover-background-color;
            border-left-color: $wp-button-primary-active-background-color;
        }

&:after {
            color: $wp-button-primary-color;
        }
    }

.rtl
    {
        h3.accordion-section-title
        {
            border-left:  none;
            border-right: 4px solid $wp-button-primary-background-color;

&:hover
            {
                border-right-color: $wp-button-primary-active-background-color;
            }
        }
    }
}