@import "dashboard/boostrap_gird";
@import "dashboard/box";
@import "dashboard/notice";
@import "dashboard/modal";
@import "dashboard/dashboard";
@import "dashboard/documentation";
@import "dashboard/product_registration";
@import "dashboard/changelog";
@import "dashboard/importer";
@import "dashboard/plugin";
@import "dashboard/update";
@import "dashboard/getting-started";
@import "dashboard/subscribe";
@import "dashboard/system-status";
@import "dashboard/child-themes";
@import "dashboard/feedback";
@import "dashboard/developer-access";
@import "dashboard/envato-hosted";

//.tc-loading {
//	position: relative;
//
//	&:before {
//		content: '';
//		border: 1px solid rgba(0, 0, 0, 0.1);
//		border-top: 1px solid #3498db;
//		border-radius: 50%;
//		width: 1em;
//		height: 1em;
//		animation: spinner 0.8s linear infinite;
//		position: absolute;
//		z-index: 2;
//		top: 0.6em;
//		left: 20px;
//	}
//}

@keyframes spinner {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.text-success {
    color: #4CAF50;
}

.text-error {
    color: #F44336;
}

.tc-kbd {
    font-size: 12px;
    background-color: #eee;
    padding: 0 2px;

    &:before {
        line-height: 1.7;
    }
}

.tc-button-box {
    position: relative;
    color: #0073aa;
    display: inline-block;
    padding: 1em;
    text-decoration: none;
    min-width: 7em;
    text-align: center;
    margin: 0 0.2em 0;
    border-radius: 5px;
    transition: all 200ms ease-out;

    &:hover {
        color: #fff;
        background-color: #0073aa;
    }

    .icon {
        margin-bottom: 2em;

        .dashicons {
            font-size: 2.5em;
            position: relative;
        }

        .dashicons-menu {
            left: -8px;
        }

        .dashicons-admin-customizer {
            left: -4px;
        }

        .dashicons-welcome-widgets-menus {
            left: -10px;
        }
    }
}

.thim-dashboard {
    .tc-button {
        padding: 5px 20px 6px;
        height: auto;
        font-size: 0.9em;
        text-transform: uppercase;
        font-weight: 500;
    }

    &.thim-modal-open {
        .thim-wrapper {
            -webkit-filter: blur(3px);
            -moz-filter: blur(3px);
            filter: blur(3px);
        }
    }

    .activate-btn {
        background-color: #83B04C;
        border: none;
        color: #fff;
        text-shadow: none;
        box-shadow: none;
        border-radius: 5px;
        font-weight: 400;
        padding: 10px 30px;
        margin: 0;
        position: relative;

        &.updating-message {
            &:before {
                animation: none;
            }
        }

        &:before {
            content: '';
            display: inline-block;
            padding-right: 5px;
            width: 15px;
            height: 15px;
            background: url(../images/envato.svg) no-repeat left center;
            background-size: 15px 15px;
            position: relative;
            top: 2px;
        }

        &:hover {
            background-color: #769e44;
        }

        &:active, &:focus {
            background-color: #769e44;
            border-color: #769e44;
            box-shadow: inset 0 2px 0 #769e44;
        }

        &:disabled {
            background-color: #769e44 !important;
            color: #e4ffc3 !important;
        }
    }

    .thim-wrapper {
        .wrap {
            margin-right: 0;
        }
    }
}

.tc-nav-tab-wrapper {
    border-bottom: 1px solid #ccc;
    margin-bottom: 3em;
}

.notice, .updated, .update-nag, .sb_instagram_notice, .sbi_notice, div.error {
    display: none !important;
}

.thim-wrapper {
    max-width: 77em;
    margin-top: 1em;
    margin-right: 1em;
    font-size: 1.15em;
    position: relative;

    .tc-header {
        .title {
            position: relative;
            display: block;
            min-height: 5em;
            margin-bottom: 1em;

            h1 {
                margin: 0;
                line-height: 1;
                font-size: 2em;
                padding: 30px 10px;
                font-weight: 500;
                display: inline-block;
            }

            .version {
                position: absolute;
                top: 50%;
                left: auto;
                background-color: #424242;
                color: #fff;
                padding: 0.7em 1.2em;
                -webkit-transform: translateY(-50%);
                -moz-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                transform: translateY(-50%);
                border-radius: 5px;
                margin-left: 1em;
            }
        }
    }

    * {
        //box-sizing: border-box;
    }

    /* Fix box-sizing for column Bootstrap*/
    *[class^="col-"] {
        box-sizing: border-box;
    }
}

@media all and (max-width: 480px) {
    .thim-wrapper {
        .tc-header {
            .title {
                .version {
                    position: static;
                }
            }
        }
    }
}