/* 
* GK News Show Pro
*
* @version: 1.0.0
* @date: 22-03-2014
* @desc: Complex widget for displaying WordPress posts, WooCommerce products, XML/JSON file content and RSS feeds.
* @author: GavickPro 
* @email: info@gavick.com
*
*/

.activated .gk-nsp-ui .gk-loader {
        opacity: 0; filter: alpha(opacity=0);
}

.gk-nsp-ui {
        max-height: 300px;
        overflow: hidden;
        position: relative;
        width: 100%;

        .gk-loader {
                background: #fff url('images/loader.gif') no-repeat center center;
                height: 100%;
                left: 0;
                opacity: 1; filter: alpha(opacity=100);
                position: absolute;
                top: 0;
                -webkit-transition: all .3s ease-out;
                -moz-transition: all .3s ease-out;
                -ms-transition: all .3s ease-out;
                -o-transition: all .3s ease-out;
                transition: all .3s ease-out;
                width: 100%;
                z-index: 1;
        }

        input {
                &.short {
                        width: 32px;
                }

                &.short-right {
                        text-align: right;
                        width: 48px;
                } 
                &.medium {
                        width: 72px;
                }  
                &.medium-right {
                        text-align: right;
                        width: 64px;
                } 
                &.long {
                        width: 120px;
                }    
        }
        p > label{
                &.long-text {
                        font-size: 11px;
                }
                &.no-indent:first-child {
                        min-width: 20px;
                        width: auto;
                }
                &:first-child {
                        display: inline-block;
                        max-width: 90px;
                        text-align: right;
                        width: 90px;
                }
        }
        .gk-right {
                display: none;
                float: right;
        }
        .gk-additional {
                float: right;
        }
        textarea {
                height: 90px;
                margin-left: 93px;
                margin-top: 10px;
                width: 75%;
        }
        .gk-filelist {
                margin-left: 98px;
        }
        big {
                display: block;
                margin: 18px 0;
                border-bottom: 1px solid #dfdfdf;
                font-size: 11px;
                line-height: 0;

                > span {
                        background: #fff;
                        padding: 0 10px 0 0;
                }
        }

        .gk-article-element,
        .gk-link-element {
                background: #fff;
                border: 1px solid #dfdfdf;
                cursor: move;
                margin: 0!important;
                padding: 6px!important;

                label {
                        width: 70px!important;
                }

                .gk-indent {
                        background: #eee;
                        margin: 6px -6px -6px -6px;
                        padding: 12px;
                }

                & + .gk-article-element,
                & + .gk-link-element {
                        border-top: none;
                }
        }

        .gk-format-textarea {
                margin-top: -20px;

                & + small {
                        display: block;
                        margin: 0 0 0 93px;
                }
        }
        .tabs-panel {
                max-width: 190px;
                border-width: 1px;
                margin: 0 auto 10px auto;
                position: relative;
                left: 9px;

                .children {
                        margin: 5px 0 0 20px;
                }
        }
        input[type=checkbox] {
                margin: 8px 2px!important;
        }
        input[type=checkbox]:checked:before {
                margin: -9px 0 0 -8px;
        }
}

.activated .gk-nsp-ui {
        max-height: inherit;
}

.gk-toggler {
        background: #f1f1f1;
        background-image: -webkit-gradient(linear,left bottom,left top,from(#ececec),to(#f9f9f9));
        background-image: -webkit-linear-gradient(bottom,#ececec,#f9f9f9);
        background-image: -moz-linear-gradient(bottom,#ececec,#f9f9f9);
        background-image: -o-linear-gradient(bottom,#ececec,#f9f9f9);
        background-image: linear-gradient(to top,#ececec,#f9f9f9);
        border: 1px solid #dfdfdf;
        -webkit-border-radius: 3px;
        -moz-border-radius: 3px;
        border-radius: 3px;
        cursor: pointer;
        font-size: 12px;
        margin: 0 0 5px 0!important;
        padding: 7px 12px!important;
        position: relative;

        &:after {
                border: 0;
                background: 0 0;
                content: '\f140';
                display: block;
                font: 400 20px/1 dashicons;        
                margin-top: 4px!important;
                padding: 0;
                position: absolute;
                right: 7px;
                speak: none;
                text-indent: 0;
                text-align: center;
                top: 0;
        }

        &.active + .gk-toggle > div {
                margin-top: 0!important;
                opacity: 1; filter: alpha(opacity=100);
        }
}
.gk-toggle {
        overflow: hidden;

        > div {
                background: #fff;
                margin-top: -700px;
                padding: 8px 12px;
                opacity: 0; filter: alpha(opacity=0);
                -webkit-transition: all .3s ease-out;
                -moz-transition: all .3s ease-out;
                -ms-transition: all .3s ease-out;
                -o-transition: all .3s ease-out;
                transition: all .3s ease-out;
        }
}

/* WordPress 3.8+ CSS adjustments */
.wp-admin,
body.wp-customizer {
        .gk-nsp-ui {
                margin: 0 -10px;
                padding: 0 0 15px 0;
                width: auto;

                label {
                        line-height: 15px;
                        vertical-align: text-bottom;
                }
                
                label,
                input,
                select {
                        font-size: 11px!important;
                }

                input {
                        padding: 6px 4px!important;
                }

                input.button {
                        padding: 0 6px!important;
                }

                textarea {
                        margin-left: 105px;
                        width: 71%;
                }

                .gk-filelist {
                        margin-left: 98px;
                }

                .gk-format-textarea + small {
                        margin: 0 0 0 105px;
                }

                p > label:first-child {
                        max-width: 100px;
                        padding-right: 5px;
                        width: 100px;
                }

                .gk-article-element > .gk-indent {
                        padding: 1px;
                }
        }

        .gk-toggle > div {
                margin-top: -800px!important;
        }

        .gk-toggler {
                background: #fafafa;
                background-image: none;
                border: 1px solid #ddd;
                -webkit-border-radius: 0;
                -moz-border-radius: 0;
                border-radius: 0;
                margin: 5px 0!important;

                &:after {
                        opacity: 0.5; filter: alpha(opacity=50);
                }
        }
}

/* Widget Customizer adjustments */
.wp-customizer {
        .gk-nsp-ui {
                select {
                        min-width: inherit;
                }
                input[type=text] {
                        width: 50px;
                } 
                input[type=text].long {
                       width: 150px;
                }
                .gk-media-input {
                        width: auto!important;
                }
        }

        .gk-cols2 > span {
                line-height: 2;
        }
}