/**
 * All of the CSS for your dashboard-specific functionality should be
 * included in this file.
 */


.kc-us-items-lists-groups #created_at, .kc-us-items-lists-groups .column-created_at {
    margin-right: 10px;
}

.kc-us-items-lists-groups #clicks, .kc-us-items-lists-groups #links {
    width: 20%;
}


/* Frappe Chart CSS */


/* Remove background horizontal lines from chart also remove label from X-axis */
.frappe-chart .x.axis .line-vertical,
.frappe-chart .x.axis text {
    display: none;
}


/* Progress Bar - Start */
.meter {
    height: 30px;
    position: relative;
    background: #f3efe6;
    overflow: hidden;
}

.meter span {
    display: block;
    height: 100%;
}

.progress {
    background-color: #5850ec;
    animation: progressBar 3s ease-in-out;
    animation-fill-mode: both;
    color: #FFEBE8;
}

@keyframes progressBar {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

/* Progress Bar - End */

/* QR Code */
.kc-us-qr-code .qr {
    margin-left: auto;
    margin-right: auto;
    font-size: 1px;
    width: 50%;
}

/* Align search box with bulk action */

.tablenav {
    padding-top: 0px !important;
    clear: none !important;
}


.kc-us-mail-toggle-dot{
    margin-top: 0.19rem !important;
    width: 0.85rem !important;
    height: 0.8rem !important;
}
.kc-us-mail-toggle-line{
    height: 1.2rem !important;
}


/* Social Share */

.social .fbtn {
    width: 50px;
    display: inline-block;
    color: #fff;
    text-align: center;
    line-height:18px;
    float: left;
}
.social .fa {
    padding:15px 0px;
}

.facebook {
    background-color: #3b5998;
}

.gplus {
    background-color: #dd4b39;
}

.twitter {
    background-color: #55acee;
}

.stumbleupon {
    background-color: #eb4924;
}

.pinterest {
    background-color: #cc2127;
}

.linkedin {
    background-color: #0077b5;
}

.buffer {
    background-color: #323b43;
}

.whatsapp {
    background-color: #25D366;
}

.pinterest {
    background-color: #c8232c;
}

.telegram {
    background-color: #0088cc;
}

.vkontakte {
    background-color: #4c75a3;
}

.hackernews {
    background-color: #ff6600;
}

.tumblr {
    background-color: #34465d;
}

.line {
    background-color: #00c300;
}

.email, .svg_qrcode {
    background-color: #787878;
}

.qrcode {
    background-color: #000000;
}

.share-button.sharer {
    height: 20px;
}

.share-button.sharer .social.active.top {
    transform: scale(1) translateY(-10px);
}

.share-button.sharer .social.active.bottom {
    transform: scale(1) translateY(10px);
}

.share-button.sharer .social.active {
    opacity: 1;
    transition: all 0.4s ease 0s;
    visibility: visible;
}
.share-button.sharer .social.networks-5 {

}
.share-button.sharer .social.top {
    margin-top: -80px;
    transform-origin: 0 0 0;
}
.share-button.sharer .social {
    margin-left: -200px;
    opacity: 0;
    transition: all 0.4s ease 0s;
    visibility: hidden;
}

.us-social {
    display: none;
}

.column-title {
    width: 20%;
}

p.search-box, .search-box #form-search-input, .search-box #search-submit {
    margin: 0;
}

/** Tooltip Custom CSS - START */
.kc-us-tooltip:hover .kc-us-tooltip-text {
    visibility: visible;
}

.kc-us-tooltip .kc-us-tooltip-text  {
    bottom: 25px;
    transform: translate(-50%,0%);
    left: 50%;
    opacity: 0.9;
}

.kc-us-tooltip .kc-us-tooltip-text svg  {
    left: 50%;
    transform: translate(-50%, 0px);
}

.bulkactions input.kc-us-date-picker {
    line-height: 1;
}
/** Tooltip Custom CSS - END */

.wpsf-child-fields {
    margin-left: 20px;
    padding: 15px 0 0 15px;
    border-left: 2px solid #eee;
}

.wpsf-child-field {
    margin-bottom: 15px;
}

.wpsf-child-field__label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

/* Fieldset dependent subfields indentation */
.wpsf-fieldset .wpsf-field--dependent {
    margin-left: 20px;
    padding-left: 15px;
}

/* Copy-link feedback: dark tooltip floating above the button, plus a
   brief row vibrate, in place of an alert(). */
.kc-ml-copy-wrap {
    position: relative;
    display: inline-block;
}
.kc-ml-copied-tooltip {
    position: absolute;
    bottom: calc(100% + 8px);
    left: 50%;
    padding: 4px 8px;
    background: #1d2327;
    color: #fff;
    border-radius: 3px;
    font-size: 12px;
    line-height: 1.4;
    white-space: nowrap;
    opacity: 0;
    transform: translateX(-50%) translateY(4px);
    transition: opacity .15s ease, transform .15s ease;
    pointer-events: none;
    z-index: 1000;
}
.kc-ml-copied-tooltip::after {
    /* Downward-pointing arrow centered on the button. */
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    width: 0;
    height: 0;
    transform: translateX(-50%);
    border: 5px solid transparent;
    border-top-color: #1d2327;
    border-bottom: 0;
}
.kc-ml-copied-tooltip.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

@keyframes kc-ml-vibrate {
    0%, 100% { transform: translateX(0); }
    15%      { transform: translateX(-2px); }
    30%      { transform: translateX(2px); }
    45%      { transform: translateX(-2px); }
    60%      { transform: translateX(2px); }
    75%      { transform: translateX(-1px); }
    90%      { transform: translateX(1px); }
}
.kc-ml-row-vibrate {
    animation: kc-ml-vibrate .4s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
    .kc-ml-row-vibrate { animation: none; }
    .kc-ml-copied-tooltip {
        transition: opacity .05s linear;
        transform: translateX(-50%);
    }
    .kc-ml-copied-tooltip.is-visible {
        transform: translateX(-50%);
    }
}