/* Tabs
   ========================================================================== */
.wp-webmft-tab
    display: none

.wp-webmft-tab.active
    display: block



/* Top links
   ========================================================================== */
.webmft-recommend
    color: #179347
    font-size: .8em


.wp-webmft-tab p.description
    padding-left: 25px
    font-size: 13px
    font-style: normal
    margin: .7em 0


.wp-webmft-tab label
    font-size: 14px


.pseudo-button
    display: inline-block
    border: 2px solid #6da8e1
    padding: 7px 20px
    cursor: pointer

.pseudo-button:hover
    background: #6da8e1
    color: #fff

.pseudo-button__green
    border-color: #00C76D

.pseudo-button__green:hover
    background: #00C76D

.pseudo-button__gray
    border-color: #77939f
    color: #999

.pseudo-button__gray:hover
    background: #77939f

p.description.danger
    color: #dd2b19

.wpshopbiz-plugin-info
    float: right






/* settings item
   ========================================================================== */
.webmft-settings-item:after
    content: ''
    display: table
    width: 100%
    height: 1px
    clear: both


.webmft-settings-item label
    width: 200px
    float: left


.webmft-settings-item p.description
    padding-left: 0


.webmft-fieldset
    margin-bottom: 20px


.webmft-fieldset p.description
    padding-left: 61px





/* ==========================================================================
   Changelog
   ========================================================================== */
.webmft-changelog
    padding: 20px 15px
    border-left: 1px solid #ccc
    margin-left: 10px


.webmft-changelog__item
    position: relative
    padding-left: 60px


.webmft-changelog__item:before
    content: ''
    position: absolute
    top: 2px
    left: -23px
    width: 12px
    height: 12px
    background: #fff
    border: 1px solid #ccc
    -webkit-border-radius: 50%
    -moz-border-radius: 50%
    border-radius: 50%


.webmft-changelog__version
    position: absolute
    top: 0
    left: 0

.checkbox-webmft
    vertical-align: top
    margin: 0 3px 0 0
    width: 17px
    height: 17px
.checkbox-webmft + label
    cursor: pointer
.checkbox-webmft:not(checked)
    position: absolute
    opacity: 0
.checkbox-webmft:not(checked) + label
    position: relative
    padding: 0 0 0 60px
.checkbox-webmft:not(checked) + label:before
    content: ''
    position: absolute
    top: -4px
    left: 0
    width: 48px
    height: 24px
    border-radius: 13px
    background: #fff
    border: 1px solid #ccc

.checkbox-webmft:not(checked) + label:after
    content: ''
    position: absolute
    top: -2px
    left: 2px
    width: 22px
    height: 22px
    border-radius: 10px
    background: #FFF
    box-shadow: 0 2px 5px rgba(0,0,0,.3)
    transition: all .2s

.checkbox-webmft:checked + label:before
    background: #9FD468
    border: 1px solid #9FD468

.checkbox-webmft:checked + label:after
    left: 26px

.checkbox-webmft:focus + label:before
    box-shadow: 0 0 0 3px rgb(215, 227, 200)

.radio-webmft
    vertical-align: top
    width: 17px
    height: 17px
    margin: 0 3px 0 0

.radio-webmft + label
    cursor: pointer

.radio-webmft:not(checked)
    position: absolute
    opacity: 0

.radio-webmft:not(checked) + label
    position: relative
    padding: 0 0 0 35px

.radio-webmft:not(checked) + label:before
    content: ''
    position: absolute
    top: -3px
    left: 0
    width: 22px
    height: 22px
    border: 1px solid #CDD1DA
    border-radius: 50%
    background: #FFF

.radio-webmft:not(checked) + label:after
    content: ''
    position: absolute
    top: 1px
    left: 4px
    width: 16px
    height: 16px
    border-radius: 50%
    background: #9FD468
    box-shadow: inset 0 1px 1px rgba(0,0,0,.5)
    opacity: 0
    transition: all .2s

.radio-webmft:checked + label:after
    opacity: 1

.radio-webmft:focus + label:before
    box-shadow: 0 0 0 3px rgba(255,255,0,.5)

@import "../../../../_sass/bootstrap-custom.scss"