/* DASHBOARD WIDGETS */


.dashboard-mentions-tabs .download-csv-button .menu-list-item:hover,
.dashboard-widget .download-csv-button .menu-list-item:hover,
.compare-widget .download-csv-button .menu-list-item:hover {
    color: var(--mainly-blue);
    background-color: #f3f2ff !important;
}


.dashboard-widget.dashboard-summary .download-csv-button {
    top: 9px;
    right: 26px;
    z-index: 2;
}

.dashboard-row .download-csv-button .menu-list-item:nth-child(1),
.dashboard-widget .download-csv-button .menu-list-item:nth-child(1),
.compare-widget .download-csv-button .menu-list-item:nth-child(1) {
    border-top: none;
}

.dashboard-row .download-csv-button .menu-list-item,
.dashboard-widget .download-csv-button .menu-list-item,
.compare-widget .download-csv-button .menu-list-item {
    border-top: 1px solid #eef0f2;
}

.dashboard-widget .download-csv-button,
.compare-widget .download-csv-button,
.dashboard-mentions-tabs .download-csv-button,
.dashboard-widget .close-button,
.compare-widget .close-button {
    position: absolute;
    top: 18px;
    right: 10px;
    z-index: 1;
}

.compare-widget.dashboard-summary .download-csv-button {
    top: 22px;
    right: 36px;
    overflow: unset;
}

.dashboard-mentions-tabs .download-csv-button,
.dashboard-summary .download-csv-button {
    top: 18px;
    right: 10px;
}

.dashboard-widget .download-csv-button .download-csv-icon svg,
.compare-widget .download-csv-button .download-csv-icon svg,
.dashboard-mentions-tabs .download-csv-button .download-csv-icon svg {
    width: 15px;
    height: 15px;
    fill: #636482b0;
}

.dashboard-widget .download-csv-button:hover .download-csv-icon,
.compare-widget .download-csv-button:hover .download-csv-icon,
.dashboard-mentions-tabs .download-csv-button:hover .download-csv-icon {
    opacity: 1;
}

.dashboard-preloader .download-csv-button,
.widget-content.dashboard-preloader + .download-csv-button {
    display: none;
}

.dashboard-widget .close-button,
.compare-widget .close-button {
    z-index: 2;
    svg {
        path{
            color: #333;
            opacity: 1 !important;
        }
    }
}

    /* COMPARE DASHBOARD WIDGETS */

.compare-widget .no_data_project > div {
    margin: 0 auto;
    text-align: center;
}

.compare-widget .no_data_project {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.compare-widget .no_data_project.nom {
    margin-top: 0;
}

.compare-widget.no_data_project .pl_icon {
    margin-bottom: 15px;
}

.compare-widget .no_data_project .pl_text {
    font-size: 16px;
    color: var(--purple-fog);;
    font-weight: 500;
    width: 70%;
    line-height: 20px;
}

.compare-widget .no_data_project .pl_icon svg {
    width: 70px;
    height: 70px;
    fill: #e5e5e5 !important;
}

.compare-widget .author-image {
    width: 100%;
    height: 100%;
    position: relative;
    background-image: url("/images/common/ic-web.svg");
    background-size: cover;
    border-radius: 50%;
}

.highlight-multi {
    background-color: #fbffb6;
    display: inline-block;
}

/* Compare Styles */
.highcharts-credits {
    display: none;
}

.dashboard-fade-in-fast {
    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 0.4s;
}

.dashboard-fade-in {
    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 1s;
}

.dashboard-divider {
    margin: 0px;
    padding: 0px;
    border: 0px;
    font-size: 0px;
    line-height: 0px;
    clear: both;
    display: block;
    position: relative;
}

.compare-hashtags .item-widget-column {
    counter-reset: hashtags;
}

.dashboard-row {
    display: block;
    position: relative;
    clear: both;
    margin-bottom: 15px;
}

.compare-widget {
    background: #FFFFFF;
    border-radius: 18px;
    padding: 19px 0;
    margin: 10px 0;
    position: relative;
    transform-origin: 2px 0;
    box-shadow: var(--default-card-shadow);

    .widget-title-container {
        display: flex;
        align-items: center;
    }

    .widget-footer {
        .widget-legend {
            padding-left: 19px;
        }
    }

    .widget-legend {
        display: flex;
        align-items: center;
        padding: 15px 19px 0px;

        > div > div.x-innerhtml {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .legend-item {
            margin: 0;
            display: flex;
            align-items: center;
            gap: 2px;
            font-size: 12px;
        }
    }

    .dashboard-widget-no-data-element {
        position: relative;
        .icon-element {
            margin: 0 auto;
        }
    }
}

.compare-widget .widget-title,
.compare-widget .widget-subtitle,
.compare-widget .widget-preloader {
    padding: 0 19px
}

.compare-widget .widget-content {
    /*margin-top: 20px;*/
}

.compare-preloader::after {
    animation-duration: 1.8s;
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
    animation-name: placeHolderForPrelaoder;
    animation-timing-function: linear;
    background: #f6f7f8;
    background: linear-gradient(to right, #fafafa 8%, #f4f4f4 38%, #fafafa 54%);
    background-size: 1000px 640px;
    /* For after */
    content: ' ';
    position: absolute;
    top: 19px;
    bottom: 19px;
    left: 19px;
    right: 19px;
    z-index: 2;
}

@keyframes fadeInOpacity {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes placeHolderForPrelaoder {
    0% {
        background-position: -468px 0
    }
    100% {
        background-position: 468px 0
    }
}

/* Dashboard Sentiment ======================================================= */

.compare-sentiment .sentiment-bar-container {
    margin: 10px 19px 0 19px;
    height: 8px;
    display: flex;
    position: relative;
    z-index: 1;
}

.compare-sentiment .bar-title {
    margin: 35px 19px 10px 19px;
    font-size: 16px;
    font-family: var(--default-font-family);
    font-weight: 500
}

.compare-sentiment .widget-footer .sentiment-legend-container {
    margin: 19px 20px 5px 20px;
    height: 24px
}

.compare-sentiment .widget-footer .sentiment-legend-container:after {
    content: '';
    display: table;
    clear: both;
}

.compare-sentiment .sentiment-bar-item,
.compare-sentiment .widget-footer .sentiment-legend-item {
    float: left;
    cursor: default;
}

.compare-sentiment .sentiment-bar-item {
    cursor: pointer;
}

.compare-sentiment .widget-footer .sentiment-legend-item {
    margin-right: 18px
}

.compare-sentiment .sentiment-bar-item:first-child {
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

.compare-sentiment .sentiment-bar-item:last-child {
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.compare-sentiment .widget-footer .sentiment-legend-item .sentiment-legend-item-text {
    display: inline-block;
    vertical-align: middle;
    color: #7C888A;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
}

.compare-sentiment .widget-footer .sentiment-legend-item .sentiment-legend-item-icon {
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    height: 24px;
    margin-right: 4px
}

.compare-sentiment .widget-footer .sentiment-legend-item .sentiment-legend-item-icon.positive svg path {
    fill: currentColor !important;
    color: #32D5AA;
}

.compare-sentiment .widget-footer .sentiment-legend-item .sentiment-legend-item-icon.negative svg path {
    color: #EC0775;
    fill: currentColor !important;
}

.compare-sentiment .widget-footer .sentiment-legend-item .sentiment-legend-item-icon.neutral {

}

/* Dashboard Sentiment END ===================================================== */

.compare-sentiment .custom.bm-bg-wl-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0.05;
    width: 450px;
    height: 80px;
}

/* Dashboard Summary ======================================================= */
.compare-widget.dashboard-summary {
    min-height: 176px;
    z-index: 2;
    overflow: hidden;
    margin-top: 0;
}

.compare-widget.dashboard-summary > div {
    overflow-x: auto;
    margin-bottom: -20px;
}

.dashboard-summary.compare-preloader .summary-info {
    display: none;
}

/* Dashboard icons */
.compare-widget.dashboard-summary .img-responsive {
    display: block;
    position: relative;
    width: auto;
    max-width: 100%;
    max-height: 60px;
    margin: 0 auto;
}

.compare-widget.dashboard-summary .summary-info {
    display: inline-block;
    min-height: 20px;
}

.compare-widget.dashboard-summary .summary-header-list ul {
    display: flex;
    align-items: center;
}

.compare-widget.dashboard-summary .summary-info,
.compare-widget.dashboard-summary .summary-row-info {
    text-align: center;
    flex: 1;
}

.compare-widget.dashboard-summary .summary-row-details,
.compare-widget.dashboard-summary .summary-header-details {
    padding: 5px 20px 5px 20px;
}

.compare-widget.dashboard-summary .summary-row-details .summary-row > div {
    display: flex;
    flex-direction: row;
    width: 100%;
    align-items: center;
    border-bottom: 1px solid;
}

.compare-widget.dashboard-summary .summary-row-details .summary-row {
    width: fit-content;
    min-width: 100%;
    margin: 15px 0px 30px 0px;
}

.compare-widget.dashboard-summary .summary-info .image,
.compare-widget.dashboard-summary .summary-info .title,
.compare-widget.dashboard-summary .summary-row-info .image,
.compare-widget.dashboard-summary .summary-row-info .title {
    display: block;
    clear: both;
    position: relative;
}

.compare-widget.dashboard-summary .summary-info .title,
.compare-widget.dashboard-summary .summary-row-info .title {
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: #525172;
    min-height: initial;
}

.compare-widget.dashboard-summary .summary-info .counter,
.compare-widget.dashboard-summary .summary-row-info .counter {
    font-size: 22px;
    line-height: 39px;
    font-weight: 600;
    color: #525172;
    display: inline-block;
    vertical-align: middle;
    max-width: 60%;
    white-space: nowrap;
}

.compare-widget.dashboard-summary .summary-info .procent,
.compare-widget.dashboard-summary .summary-row-info .procent {
    font-size: 11px;
    line-height: 3px;
    font-weight: 400;
    display: inline-block;
    vertical-align: middle;
    max-width: 40%;
}

.compare-widget.dashboard-summary .summary-info .procent-positive,
.compare-widget.dashboard-summary .summary-row-info .procent-positive {
    color: #A2CB8C;
}

.compare-widget.dashboard-summary .summary-info .procent-negative,
.compare-widget.dashboard-summary .summary-row-info .procent-negative {
    color: #F37D86;
}

.compare-widget.dashboard-summary .summary-header-details .summary-header-list .summary-info:nth-child(1),
.compare-widget.dashboard-summary .summary-row-details .summary-body-list .summary-row-info:nth-child(1) {
    min-width: 100px;
    margin-right: auto;
}

.compare-widget.dashboard-summary .summary-row-details .summary-row .summary-project {
    position: relative;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 12px;
}

.compare-widget.dashboard-summary .summary-row-details .summary-row .summary-project .project-name {
    position: relative;
    top: 6px;
}


.compare-widget.dashboard-summary .summary-row-details .summary-row .summary-item-circle {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #2dd0e0;
    margin-right: 10px;
}

.compare-widget.dashboard-summary .set-grey-color {
    color: #a8a8a8;
}

.compare-widget.dashboard-summary .summary-edit-button {
    position: absolute;
    right: 10px;
    top: 22px;
}

/* ========================================================================= */

/* Mentions Chart Tabs START ===================================================== */
.compare-mentions-metrics {
    .compare-mentions-tabs-items {
        display: flex;
        align-items: center;
    }
}

.compare-mentions-tabs .widget-content {

}

.compare-mentions-tabs .metric-list {
    padding: 20px 4px;
    width: auto;
    list-style: none;
}

.compare-mentions-tabs .metric-item {
    display: inline-block;
    vertical-align: middle;
    width: auto;
    text-align: center;
    cursor: pointer;
    border-right: none;
    position: relative;
    padding-right: 20px;
    margin-right: 10px;
}

.compare-mentions-tabs .metric-item .metric-label {
    font-weight: 400;
    color: #525373;
    font-family: var(--default-font-family);
    font-size: 16px;
}

.compare-mentions-tabs .metric-item.selected-metric .metric-label {
    color: #535473;
    font-family: var(--default-font-family);
    font-size: 16px;
    font-weight: 500;
}

.compare-mentions-tabs .metric-item .mention-type::after {
    position: absolute;
    top: 24px;
    left: 0px;
    content: "";
    height: 3px;
    width: calc(100% - 10px);
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
}

.compare-mentions-tabs .metric-item .mention-type:hover::after,
.compare-mentions-tabs .metric-item.selected-metric .mention-type::after {
    background: #7A66FF !important;
}

.compare-mentions-tabs .metric-item .all-mentions .metric-icon {
    display: none;
}

.compare-mentions-tabs .metric-item .web-mentions .metric-icon {
    background-color: #68C5D2;
}

.compare-mentions-tabs .metric-item .social-mentions .metric-icon {
    background-color: #A8E4EC;
}

.metric-icon {
    display: inline-block;
    margin-right: 6px;
    vertical-align: middle;
    line-height: normal;
    width: 11px;
    height: 11px;
    flex: 0 0 11px;
    border-radius: 50%;
    margin-top: -2px;
}

.compare-mentions-tabs .metric-count {
    margin-left: 6px;
}

.compare-mentions-tabs .metric-label, .compare-mentions-tabs .metric-count {
    font-size: 16px;
    color: #89869E;
    display: inline-block;
    vertical-align: middle;
    font-weight: 400;
}

/* Mentions Chart Tabs END ===================================================== */

/* Hashtags START ===================================================== */

.compare-hashtags .table-header,
.compare-context .table-header {
    color: var(--purple-fog);;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
    background: #fff;
}

.compare-hashtags .header-column,
.compare-context .header-column {
    text-transform: none;
    color: var(--purple-fog);;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
    background: #fff;
    height: 28px;
}

.compare-hashtags .body-row,
.compare-context .body-row {
    height: 28px;
    border: none;
    cursor: pointer;
}

.compare-hashtags .body-row:nth-child(odd),
.compare-context .body-row:nth-child(odd) {
    background-color: #f3f2ff;
}

.compare-hashtags .hashtag-label,
.compare-context .context-label {
    color: var(--purple-fog);;
    font-family: var(--default-font-family);
    font-size: 13px;
    line-height: 28px;
    font-weight: 300;
    position: relative;
    padding-left: 20px;
    display: flex;
}

.compare-hashtags .hashtag-value,
.compare-context .context-value {
    color: #7C888A;
    font-family: var(--default-font-family);
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
}

.compare-hashtags .widget-content {
    margin-top: 8px
}

.compare-hashtags .table-element .body-element {
    height: 290px;
}

.compare-hashtags .body-row:hover .highlight-multi,
.compare-context .body-row:hover .highlight-multi {
    /*background: inherit;*/
    opacity: .5;
}

.compare-context .widget-content .table-element .body-row:hover .context-label,
.compare-context .widget-content .table-element .body-row:hover .context-value,
.compare-hashtags .widget-content .table-element .body-row:hover .hashtag-label,
.compare-hashtags .widget-content .table-element .body-row:hover .hashtag-value,
.compare-sources .widget-content .table-element .body-row:hover .source-label,
.compare-sources .widget-content .table-element .body-row:hover .source-value,
.compare-languages .widget-content .table-element .body-row:hover .source-label,
.compare-languages .widget-content .table-element .body-row:hover .source-value {
    color: var(--mainly-blue);
}


/* Hashtags END ===================================================== */

/* Context mentions START ===================================================== */
.compare-context .widget-content,
.compare-hashtags .widget-content {
    padding: 15px 19px 0px;
    margin-top: 0px;
    display: flex;
}

.compare-context .item-widget-column,
.compare-hashtags .item-widget-column {
    counter-reset: hashtags;
}

.compare-context .widget-content:after {
    content: '';
    display: table;
    clear: both;
}

.compare-context .widget-list-item {
    font-size: 12px;
    line-height: 15px;
    margin-bottom: 16px;
}

.compare-context .widget-item-left {
    float: left;
    width: 30%;
}

.compare-context .widget-item-right {
    float: right;
    width: 70%;
    padding: 5px 30px 0 30px
}

.compare-context .item-name {
    color: var(--purple-fog);;
    font-weight: 600;
    max-width: 90%;
}

.compare-context .item-value {
    color: #7C888A;
    font-weight: 300;
    display: inline-block;
    margin-left: 4px
}

.compare-context .column-legend,
.compare-hashtags .column-legend {
    min-height: 200px;
}

/* Context mentions END ======================================================= */

/* Sources START ======================================================= */
.compare-sources .widget-content,
.compare-languages .widget-chart {
    margin-top: 8px;
    padding-bottom: 20px;
    display: flex;
}

.compare-sources .table-header,
.compare-languages .table-header {
    color: var(--purple-fog);;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
    background: #fff;
}

.compare-sources .header-column,
.compare-languages .header-column{
    text-transform: none;
    color: var(--purple-fog);;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
    background: #fff;
    height: 30px;
}

.compare-sources .body-row,
.compare-languages .body-row {
    height: 30px;
    border: none;
    cursor: pointer;
}

.compare-sources .body-row:nth-child(odd),
.compare-languages .body-row:nth-child(odd) {
    background-color: #f6fafd;
}

.compare-sources .hashtag-label::before {
    counter-increment: sources;
    content: counter(sources) ". ";
    display: inline-block;
    position: absolute;
    left: 19px;
}

.compare-sources .source-label,
.compare-languages .source-label {
    color: var(--purple-fog);;
    font-size: 12px;
    line-height: 15px;
    font-weight: 500;
    position: relative;
    padding-left: 34px;
}

.compare-sources .source-value,
.compare-languages .source-value {
    color: #7C888A;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
}

.compare-sources .table-body .source-badge {
    height: 12px;
    width: 12px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 8px;
    position: relative;
    top: 2px;
}

/* Sources END ======================================================= */

/* Languages START ======================================================= */
.compare-languages .widget-chart,
.compare-website-traffic .widget-chart {
    /*width: 50%;*/
    /*float: left;*/
}

.compare-languages .widget-legend,
.compare-website-traffic .widget-legend {
    width: 50%;
    padding: 10px 0 0 15px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.compare-languages .widget-content:after,
.compare-website-traffic .widget-content:after{
    content: '';
    display: table;
    clear: both;
}

.compare-languages .source-badge,
.compare-website-traffic .source-badge {
    height: 12px;
    width: 12px;
    display: inline-block;
    border-radius: 50%;
    margin-right: 8px;
    position: relative;
    top: 2px;
}

.compare-languages .widget-legend-item,
.compare-website-traffic .widget-legend-item{
    margin-bottom: 10px;
    display: inline-block;
    cursor: pointer;
}

.compare-languages .item-name,
.compare-website-traffic .item-name {
    color: var(--purple-fog);;
    font-size: 12px;
    font-weight: 600;
    line-height: 15px;
    display: inline-block;
    margin-right: 4px;
}

.compare-languages .item-value,
.compare-website-traffic .item-value {
    color: #7C888A;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
}

.compare-languages .widget-three-halfs,
.compare-website-traffic .widget-three-halfs {
    padding-right: 10px;
}


/* Languages END ======================================================= */

/* Top Influencers/Sites START ======================================================= */

.compare-influencer .table-header, .compare-site .table-header {
    background: none;

    .header-column {
        text-align: center;
        color: #535473;
        font-size: 12px;
        font-weight: 300;
        text-transform: none;
        height: auto;
    }

    .header-column:nth-child(3),
    .header-column:nth-child(4) {
        text-align: right;
    }
}

.compare-influencer .widget-subheader, .compare-site .widget-subheader {
    padding: 10px 25px 0 19px;
    color: var(--purple-fog);
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
}

.compare-influencer .widget-content, .compare-site .widget-content {
    padding: 0 25px 0 19px;
    margin-top: 10px;
    display: flex;
}

.compare-influencer .widget-subheader .subheader-left, .compare-site .widget-subheader .subheader-left {
    text-align: left;
    float: left;
}

.compare-influencer .widget-subheader .subheader-right, .compare-site .widget-subheader .subheader-right {
    text-align: right;
    float: right;
}

.compare-influencer .widget-subheader:after, .compare-site .widget-subheader:after {
    content: '';
    display: table;
    clear: both;
}

.compare-influencer .body-author-image, .compare-site .body-author-image {
    padding-left: 0;
}

.compare-influencer .body-row, .compare-site .body-row {
    height: 58px;
    border: unset;
}

.compare-influencer .body-row:hover, .compare-site .body-row:hover {
    background: rgba(122, 102, 255, .1) !important;

    a, div {
        color: var(--mainly-blue) !important;
    }

    svg path {
        fill: var(--mainly-blue) !important;
    }
}

.compare-site .linked-hover,
.compare-influencer .linked-hover {
    height: 19px;
    width: 19px;
    position: absolute;
    right: -28px;
    top: -2px
}

.compare-influencer .item-top-subtext .linked-hover:hover,
.compare-site .linked-hover:hover {
    transform: scale(1.20);
}

.compare-site .item-top-title a {
    color: var(--purple-fog);
    font-size: 15px;
    line-height: 15px;
    font-weight: 600;
    text-decoration: none;
}

.compare-site .item-top-title a:hover {
    text-decoration: none;
    cursor: pointer;
    color: var(--mainly-blue);
}

.compare-influencer .item-top-subtext a,
.compare-site .item-top-title a {
    position: relative;
    text-decoration: none;

    &:hover {
        color: var(--mainly-blue);
    }
}

.compare-site .item-top-title a:hover .linked-hover,
.compare-influencer .item-top-subtext a:hover .linked-hover {
    display: block;
}

.compare-influencer .item-top-subtext .linked-hover {
    width: 19px;
    height: 19px;
}

/* Top Influencers/Sites END ======================================================= */

/* Media Wall START =================================================== */
.compare-widget.dashboard-media .widget-content {
    padding: 0 19px 0px 19px;
    clear: both;
    position: relative;
    height: 800px;
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: flex-start;
    overflow: hidden;
}

.compare-widget.dashboard-media .widget-content .compare-media-column {
    width: 100%;
    height: 100%;
    flex: 1 1 auto;
    margin-right: 25px;
    display: flex;
    flex-direction: column;
}

.compare-widget.dashboard-media .widget-content .compare-media-column:last-child {
    margin-right: 0px;
}

.compare-widget.dashboard-media .widget-content .compare-media-column .widget-column-content {
    height: 100%;
    overflow: auto;
}

.compare-widget.dashboard-media .widget-content .compare-media-column .widget-column-content .widget-column-items {
    column-count: 2;
    column-gap: 5px;
}

.compare-widget.dashboard-media .loading-element .loading-spinner {
    margin: 0 auto;
    width: 30px;
    height: 30px;
}

.compare-widget.dashboard-media .img-responsive {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box {
    position: relative;
    display: inline-block;
    overflow: hidden;
    break-inside: avoid;
    width: 100%;
    border: 1px solid #d3d4d8;
    margin: 0px 0px 5px 0px;
    padding: 0px 0px 0px 0px;
    cursor: pointer;
}

.compare-widget.dashboard-media .widget-content .widget-column-title {
    margin: 0px 0px 10px 0px;
    padding-bottom: 5px;
    font-size: 12px;
    border-bottom: 3px solid #fff;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box:hover {
    border: 1px solid #6955af;
    transition: transform 0.5s;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box:hover .main_image img {
    transform: scale(1.02);
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .dashboard-media-box-url {
    display: block;
    padding: 0px;
    margin: 0px;
    border: 0px;
    clear: both;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .main_image {
    margin-bottom: 0px;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_details {
    padding-left: 10px;
    line-height: 15px;
    font-size: 12px;
    margin: 15px 0px;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_details::after {
    content: ' ';
    display: block;
    position: relative;
    clear: both;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_image {
    position: relative;
    width: 100%;
    height: auto;
    max-width: 27px;
    max-height: 27px;
    float: left;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_image img {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_image::after {
    content: ' ';
    position: absolute;
    right: -6px;
    bottom: 2px;
    background-size: contain;
    width: 13px;
    height: 13px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.twitter .author_image::after {
    background: url("/images/dashboard/logo.twitter.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.instagram .author_image::after {
    background: url("/images/dashboard/logo.instagram.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.facebook .author_image::after {
    background: url("/images/dashboard/logo.facebook.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.reddit .author_image::after {
    background: url("/images/dashboard/logo.reddit.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.youtube .author_image::after {
    background: url("/images/dashboard/logo.youtube.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box.quora .author_image::after {
    background: url("/images/dashboard/logo.quora.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_and_followers {
    float: left;
    margin-left: 15px;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_and_followers .author_name {
    clear: both;
    position: relative;
    display: block;
    font-size: 12px;
    line-height: 15px;
    color: var(--purple-fog);;
    font-weight: 500;
}

.compare-widget.dashboard-media .widget-content .dashboard-media-box .author_and_followers .author_profile {
    clear: both;
    position: relative;
    display: block;
    clear: both;
    font-size: 12px;
    line-height: 15px;
    color: #7C888A;
    font-weight: 400;
}

/* Media Wall END ===================================================== */

/* General widgets */
.metric-list .metric-item.disabled {
    background: #f6fafd !important;
    cursor: default;
}

.metric-list .metric-item.disabled .mention-type, .metric-list .metric-item.disabled .mention-list-type {
    opacity: 0.4;
}

.compare-widget .widget-title {
    font-size: 16px;
    color: var(--purple-fog);;
    font-weight: 600;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    width: 100%;

    svg {
        width: 16px;
        vertical-align: middle;
        margin-left: 4px;
        path {
            fill: #38335a;
        }
    }

    .widget-title-info {
        color: #7C888A;
        font-size: 13px;
        font-weight: normal;
    }
}

.compare-widget .widget-subtitle {
    font-size: 12px;
    line-height: 15px;
    color: #7C888A;
    font-weight: 300;
    margin-top: 4px
}

.compare-widget .table-label-left {
    text-align: left;
    padding-left: 19px;
}

.compare-widget .table-label-right {
    text-align: right;
    padding-right: 19px;
}

.widget-content .label-left {
    text-align: left;
}

.widget-content .label-right {
    text-align: right;
}

.widget-content .label-center {
    text-align: center;
}

/* BLOCK SUMMARY =========================================================== */
.no-data-dashboard-summary .dashboard-summary,
.no-data-summary-mentions .summary-mentions,
.no-data-summary-backlinks .summary-backlinks,
.no-data-summary-reach .summary-reach,
.no-data-summary-mentions-positive .summary-mentions-positive,
.no-data-summary-mentions-negative .summary-mentions-negative {
    display: none;
}

/* END BLOCK SUMMARY ======================================================= */
/* BLOCK TOP LATEST MENTIONS + BACKLINKS + INFLUENCER + SITE */
.compare-mentions-tabs {
    width: 100%;
    display: block;
    clear: initial;
}

.dashboard-latest-mentions .widget-content {
    height: 800px;
}

.compare-influencer, .compare-site {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 200px
}

.compare-influencer .widget-content .table-element,
.compare-site .widget-content .table-element {
    max-height: 600px;
    overflow: hidden;
}

.no-data-compare-site .compare-influencer,
.no-data-compare-influencer .compare-site {
    height: 859px;
    margin: 2px 0px 0px 0px;
}

.no-data-compare-site .compare-influencer .widget-content .table-element {
    max-height: 705px;
}

.no-data-compare-influencer .compare-site .widget-content .table-element {
    max-height: 905px;
}

.no-data-compare-site .compare-site,
.no-data-compare-influencer .compare-influencer {
    display: none;
}

.no-data-compare-site.no-data-compare-influencer .dashboard-latest-mentions,
.no-data-compare-influencer.no-data-compare-site .dashboard-latest-mentions {
    width: 100%;
    margin-right: 0px;
}

/* END - BLOCK TOP LATEST MENTIONS + BACKLINKS + INFLUENCER + SITE */

/* START - BLOCK GOOGLE TRENDS + SENTIMENT */
.compare-sentiment {
    position: relative;
    width: 100%;
    display: block;
    clear: initial;
    float: left;
    min-height: 250px;
    overflow: hidden;
}

.compare-widget.dashboard-google-trends {
    margin-right: 20px;
}

.compare-widget.dashboard-google-trends .widget-content {
    background: url("/images/common/bm-whitelabel.svg") no-repeat center center transparent;
    background-size: 450px 80px;
}

.compare-widget.dashboard-google-trends .widget-content .highcharts-background {
    fill: rgba(255, 255, 255, 0.95);
}

.compare-widget.dashboard-google-trends .widget-content .chart-box .flex.flex-row.align-items-center.justify-content-center {
    background: rgba(255, 255, 255, 0.95);
}

.compare-widget.dashboard-google-trends .widget-content {
    margin: 0 15px 0px 15px;
    overflow: hidden;
}

.no-data-dashboard-google-trends .compare-sentiment,
.no-data-compare-sentiment .dashboard-google-trends {
    width: 100%;
    margin-right: 0px;
    float: initial;
}

.no-data-dashboard-google-trends .dashboard-google-trends,
.no-data-compare-sentiment .compare-sentiment {
    display: none;
}

.dashboard-google-trends .highcharts-title .google-trends-chart-title {
    background: url("/images/dashboard/search.blue.svg") no-repeat left center transparent;
    color: #68C5D2;
    font-size: 14px;
    padding-left: 18px;
}

.dashboard-google-trends .highcharts-title .google-trends-chart-mentions {
    font-weight: 300;
    color: #525172;
    font-size: 14px;
}

/* Carousel for Google Trends */
.compare-widget.dashboard-google-trends .x-paint-monitor.overflowchange,
.compare-widget.dashboard-google-trends .x-size-monitors.overflowchange,
.compare-widget.dashboard-google-trends .x-paint-monitor.overflowchanged,
.compare-widget.dashboard-google-trends .x-size-monitors.overflowchanged {
    overflow: hidden;
}

.compare-widget.dashboard-google-trends .x-carousel-inner {
    position: relative;
    overflow: hidden;
    min-height: 260px;
}

.compare-widget.dashboard-google-trends .x-carousel-item,
.compare-widget.dashboard-google-trends .x-carousel-item > * {
    position: absolute !important;
    width: 100%;
    height: 100%
}

.compare-widget.dashboard-google-trends .google-trends-buttons {
    position: absolute;
    display: block;
    z-index: 99999;
    top: 50%;
    cursor: pointer;
    width: 10px;
    height: 15px;
    background-size: contain !important;
}

.compare-widget.dashboard-google-trends .google-trends-button-left {
    left: 5px;
    background: url("/images/dashboard/arrow-left.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-google-trends .google-trends-button-right {
    right: 5px;
    background: url("/images/dashboard/arrow-right.svg") no-repeat center center transparent;
}

.compare-widget.dashboard-google-trends .carousel-hide-navigation .x-carousel-indicator,
.compare-widget.dashboard-google-trends .x-carousel-indicator,
.compare-widget.dashboard-google-trends .carousel-button-left-hidden .google-trends-button-left,
.compare-widget.dashboard-google-trends .carousel-button-right-hidden .google-trends-button-right {
    display: none;
}

/* Carousel for Google Trends */

.compare-widget.dashboard-google-trends .widget-content,
.compare-widget.dashboard-google-trends .widget-content-chart-buttons {
    overflow: hidden;
    clear: both;
    position: relative;
    display: block;
}

.compare-widget.dashboard-google-trends .widget-content-chart {
    display: block;
    position: relative;
    clear: both;
    width: 9000px;
}

.compare-widget.dashboard-google-trends .widget-content-chart {
    display: block;
    position: relative;
}

.compare-widget.dashboard-google-trends .chart-box {
    display: block;
    position: relative;
    float: left;
}

.compare-widget.dashboard-google-trends .widget-content-chart .chart-box:last-child::after {
    content: ' ';
    clear: right;
}

.compare-widget.dashboard-google-trends .widget-content-chart-buttons.scrollableLeft::before {
    content: ' ';
    position: absolute;
    left: 0;
    top: 48%;
    background: url("/images/dashboard/arrow-left.svg") no-repeat center center transparent;
    width: 20px;
    height: 20px;
    z-index: 1;
    cursor: pointer;
}

.compare-widget.dashboard-google-trends .widget-content-chart-buttons.scrollableRight::after {
    content: ' ';
    position: absolute;
    right: 0;
    top: 48%;
    background: url("/images/dashboard/arrow-right.svg") no-repeat center center transparent;
    width: 20px;
    height: 20px;
    z-index: 1;
    cursor: pointer;
}

.compare-widget.dashboard-google-trends .chart-box .no_data_project {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

.compare-widget.dashboard-google-trends .chart-box .no_data_project .pl_icon {
    margin: 0;
    margin-right: 8px;
}

.compare-widget.dashboard-google-trends .chart-box .no_data_project .pl_icon svg {
    width: 24px;
    height: 24px;
}

.compare-widget.dashboard-google-trends .chart-box .no_data_project .pl_text {
    margin: 0;
    font-size: 14px;
    width: inherit;
}

/* END - BLOCK GOOGLE TRENDS + SENTIMENT */

/* START - BLOCK REACH + PERFORMANCE */
.compare-reach, .compare-performance {
    width: 100%;
    display: block;
    clear: initial;
    float: left;
}

.compare-reach {
    margin-right: 20px;
}

.widget-title-container.clearafter .widget-title {
    float: left
}

.widget-title-container.clearafter .widget-legend {

}

.no-data-compare-reach .compare-performance,
.no-data-compare-performance .compare-reach {
    width: 100%;
    margin-right: 0px;
    float: initial;
}

.no-data-compare-reach .compare-reach,
.no-data-compare-performance .compare-performance {
    display: none;
}

/* END - BLOCK REACH + PERFORMANCE */

/* START - BLOCK SOURCES + LOCATIONS + WEEKDAYS + LANGUAGES */
.compare-sources, .compare-locations {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 250px;
}

.compare-locations .widget-content {
    display: flex;
}

.compare-locations .compare-locations-countries {
    /*padding: 20px 20px 10px 20px;*/
    /*clear: both;*/
    /*position: relative;*/
    /*display: block;*/
    /*column-count: 2;*/
    /*column-gap: 25px;*/
    /*overflow: hidden;*/
    /*max-height: 220px;*/
}

.compare-locations .compare-locations-country {
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    color: var(--purple-fog);;
    padding: 5px 0px 15px 0px;
}

.compare-locations .compare-locations-country span {
    font-weight: 300;
    color: #7C888A;
}

.compare-locations .compare-widget-countries {
    padding: 20px 10px 10px 10px;
    clear: both;
    position: relative;
    display: block;
    overflow: hidden;
    width: 30%;
}

.compare-locations .compare-widget-countries-chart  {
    width: 70%;
}

.compare-locations .compare-widget-countries .compare-locations-country {
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    color: var(--purple-fog);;
    padding: 5px 0px 15px 0px;
}

.compare-locations .compare-locations-country > div {
    cursor: pointer;
    display: inline-block;
}

.compare-locations .compare-locations-country > div:hover,
.compare-locations .compare-locations-country > div:hover span,
.compare-languages .widget-legend-item:hover .item-name,
.compare-languages .widget-legend-item:hover .item-value,
.compare-website-traffic .widget-legend-item:hover .item-name,
.compare-website-traffic .widget-legend-item:hover .item-value
{
    color: var(--mainly-blue);
}

.compare-weekday,
.compare-sentiment-by-media-type,
.compare-sentiment-by-language,
.compare-emoji-cloud,
.compare-emotion,
.compare-websites-by-visits {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 500px;
}

.compare-website-traffic {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 450px;

    .widget-content .widget-three-halfs {
        .project-name {
            max-width: 85px;
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    }
}

.compare-widget.compare-languages .widget-title,
.compare-widget.compare-website-traffic .widget-title{
    line-height: normal;
    margin-bottom: 15px;
}

.compare-languages .widget-content,
.compare-website-traffic .widget-content {
    display: flex;
}

.compare-reviews {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 270px;
}

.compare-reviews .widget-content {
    overflow: hidden;
}

.compare-website-traffic .widget-content .item-widget-column {
    display: flex;
    align-items: center;
    justify-content: center;
}

/*.compare-allreviews .base-reviews .left-side .review-average {*/
/*    font-size: 20px;*/
/*    display: block;*/
/*    width: 30px;*/
/*    font-weight: 500;*/
/*    float: left;*/
/*    line-height: 50px;*/
/*    margin-bottom: 10px;*/
/*    margin-top: -8px;*/
/*    margin-right: 10px;*/
/*    margin-left: 30px;*/
/*}*/

/*.compare-allreviews .base-reviews .left-side .no-reviews {*/
/*    color: #5E5E5E;*/
/*    font-size: 20px;*/
/*    font-weight: 400;*/
/*    float: left;*/
/*    width: 100%;*/
/*    text-align: left;*/
/*    display: block;*/
/*    margin-top: 0;*/
/*    margin-left: 30px;*/
/*}*/

/*.compare-allreviews .base-reviews .left-side .review-average-stars {*/
/*    margin: 0px;*/
/*}*/

.base-reviews .left-side .review-average-stars {
    transition: all 0.8s ease;
}

.base-reviews .left-side .review-average-stars:hover svg {
    opacity: 0.75;
}

.shared-dashboard .base-reviews .left-side .logo img,
.visible-sidebar-right .base-reviews .left-side .logo img,
.compare-allreviews .base-reviews .left-side .logo img {
    width: 120px;
    display: block;
    margin-bottom: 10px;
    margin-left: auto;
    margin-right: auto;
}


.shared-dashboard .reviews-yelp .base-reviews .left-side .logo img,
.visible-sidebar-right .reviews-yelp .base-reviews .left-side .logo img,
.compare-allreviews .reviews-yelp .base-reviews .left-side .logo img {
    width: 75px;
}

.compare-reviews .no_data_project.nom {
    margin-top: 30px;
}

.no-data-compare-sources .compare-sources,
.no-data-compare-locations .compare-locations,
.no-data-compare-weekday .compare-weekday,
.no-data-compare-languages .compare-languages {
    display: none;
}

/* START - BLOCK SOURCES + LOCATIONS + WEEKDAYS + LANGUAGES */

/* START - BLOCK HASHTAG + MENTIONS */
.compare-hashtags {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 250px;
}

.compare-context {
    width: 100%;
    display: block;
    clear: initial;
    min-height: 250px;
}

.no-data-compare-hashtags .compare-context,
.no-data-compare-context .compare-hashtags {
    width: 100%;
    margin-right: 0px;
    float: initial;
}

.no-data-compare-hashtags .compare-hashtags,
.no-data-compare-context .compare-context {
    display: none;
}

/* START - BLOCK HASHTAG + MENTIONS */

/* START BLOCK MEDIA */
.no-data-dashboard-media .dashboard-media {
    display: none;
}

/* START BLOCK MEDIA */

.compare-metrics-legend {
    text-align: right;
    background-color: #fff;
}

.legend-items-container .x-innerhtml {
    display: flex;
    align-items: flex-start;
}

.legend-item .metric-icon {
    margin-left: 4px;
    margin-right: 4px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 2px;
    font-size: 12px;
}

.legend-item-period {
    font-size: 11px;
}

.clearafter:after {
    content: '';
    display: table;
    clear: both;
}

.widget-two-halfs {
    width: 50%;
    float: left;
    padding-right: 30px;
    position: relative;
    min-height: 200px;

    .widget-halfs-legend {
        padding-bottom: 26px;
        padding-top: 0px;
    }
}

.widget-three-halfs {
    width: 33.3333%;
    float: left;
    padding-right: 30px;

    .widget-halfs-legend {
        padding-bottom: 10px;
    }
}

.compare-widget .widget-three-halfs:last-child, .compare-widget .widget-two-halfs:last-child {
    padding-right: 0px;
}

.item-sub-title {
    font-size: 12px;
    font-family: var(--default-font-family);
    font-weight: 400;
    margin: 10px 0 8px;
    display: flex;
    align-items: center;
    gap: 2px;
}

.item-sub-title span:nth-child(2) {
    font-weight: 400;
}

.compare-hashtags .item-sub-title,
.compare-locations .item-sub-title,
.compare-weekday .item-sub-title,
.compare-sentiment-by-media-type .item-sub-title,
.compare-sentiment-by-language .item-sub-title,
.compare-emoji-cloud .item-sub-title,
.compare-emotion .item-sub-title {
    padding-left: 19px;
}

.compare-weekday {
    .item-sub-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    [id^="best-time-to-post-"] {
        margin-right: 40px;
        font-size: 14px;
        font-weight: 500;
        color: #595a78;
        text-align: left;
    }

    .widget-two-halfs:first-child,
    .widget-three-halfs:first-child,
    .widget-three-halfs:nth-child(2) {
        [id^="best-time-to-post-"] {
            margin-right: 10px;
        }
    }
}

.compare-reviews .item-sub-title {
    text-align: left;
    padding-left: 29px;
    padding-bottom: 10px;
}

.compare-locations .item-sub-title {
    margin-top: 5px;
}

.compare-locations .item-widget-column {
    border-right: 1px solid #E1E5E6;
}

.compare-locations .item-widget-column:last-child {
    border-right: none !important;
}

.compare-locations .widget-two-halfs {
    width: calc(50% - 15px);
    padding-right: 15px;
    margin-right: 15px;
}

.compare-locations .widget-three-halfs {
    width: calc(33.3333% - 10px);
    padding-right: 10px;
    margin-right: 10px;
}

.compare-locations .widget-three-halfs .compare-widget-countries-chart {
    width: 60%;
}

.compare-locations .widget-three-halfs .compare-widget-countries {
    width: 40%;
}

.column-legend {
    margin-top: 15px
}

.column-legend .legend-items-col, .column .legend-items-col {
    width: 50%;
    float: left;
}

.review-average-stars {
    width: 170px;
    height: 30px;
    position: relative;
    overflow: hidden;
    margin: 10px auto;
}

.review-average-stars .stars-off,
.review-average-stars .stars-on {
    top: 0px;
    left: 0;
    position: absolute;
    font-size: 40px;
    z-index: 1;
    height: 30px;
    line-height: 30px;
}

.review-average-stars svg {
    width: 30px;
    height: 32px;
    margin-right: 4px;
}

.review-average-stars .stars-off svg path {
    fill: #f8e9bd;
}

.review-average-stars .stars-on {
    overflow: hidden;
    z-index: 2;
}

.review-average-stars .stars-on div {
    width: 170px;
    float: left;
    display: block;
}


.review-average-stars .stars-on svg path {
    fill: #ffd54f;
}

.review-average-stars {
    cursor: pointer;
}

.base-reviews .left-side {
    width: 60%;
    display: block;
    float: left;
    margin-top: 12px;
    color: #304754;
}

.base-reviews .left-side .logo:not(:empty) {
    height: 45px;
}

.base-reviews .left-side .logo img {
    width: 120px;
    display: block;
    margin-bottom: 10px;
    margin-left: 30px;
}

.base-reviews .left-side .review-average {
    font-size: 4.5em;
    display: block;
    width: 100%;
    text-align: center;
    font-weight: 500;
    float: left;
    line-height: 50px;
    margin-bottom: 10px;
}

.base-reviews .left-side .no-reviews {
    text-align: center;
    margin-top: 18px;
    color: #5E5E5E;
    font-size: 20px;
    font-weight: 400;
    cursor: pointer;
}


.base-reviews .left-side .no-reviews:hover {
    font-weight: 600 !important;
}

.base-reviews .right-side {
    width: 40%;
    display: block;
    float: left;
}

.no-review {
    color: #A19ABD;
    font-family: var(--default-font-family);
    font-size: 14px;
    font-style: italic;
}


.reviews-sources-box-container .base-reviews .right-side {
    margin-top: 50px;
}

.base-reviews .right-side .stars-container {
    width: 100%;
    display: block;
    float: left;
    margin-top: 15px;
    cursor: pointer;
}

.base-reviews .right-side .stars-container:hover {
    opacity: 0.5;
}

.base-reviews .right-side .stars-container .stars-info {
    width: calc(20% - 10px);
    font-size: 14px;
    display: block;
    float: left;
    margin-right: 10px;
}

.base-reviews .right-side .stars-container .stars-info i {
    font-style: normal;
    width: 35%;
    float: left;
}

.base-reviews .right-side .stars-container .stars-info span {
    color: #ffd54f;
    font-size: 25px;
    line-height: 10px;
    width: 20%;
    float: left;
}

.base-reviews .right-side .stars-container .stars-progress {
    width: 55%;
    display: block;
    float: left;
    height: 5px;
    background: #f1f1f1;
    margin-right: 5%;
    margin-top: 2px;
    position: relative;
}

.base-reviews .right-side .stars-container .stars-progress .loaded {
    background: #ffd54f;
    height: 5px;
    position: absolute;
    top: 0px;
    left: 0px;
}

.base-reviews .right-side .stars-container .stars-no {
    width: 20%;
    display: block;
    float: left;
    font-size: 14px;
}

.no-results-placeholder.filtered .alternative-text,
.no-results-placeholder.filtered .import-mentions-text-container {
    display: none !important;
}

.compare-performance {
    min-height: 380px;
}

/* Compare -> Mentions & Reach */
.compare-mentions-metrics,
.compare-reach-metrics {
    min-height: 380px;
    margin-top: 20px;
    padding-top: 0;

    .compare-mentions-tabs-items {
        padding-left: 19px;
        padding-right: 19px;
    }

    .widget-content {
        padding-bottom: 20px;
    }

    .metric-list {
        padding: 20px 4px;
        width: auto;
        list-style: none;
    }

    .metric-label {
        color: #535473;
        font-family: var(--default-font-family), serif;
        font-size: 16px;
        font-weight: 500;
    }
}

/* end Compare -> Reach */

.compare-positive-mentions.compare-widget .mention-icon svg {
    margin-left: 0;
    margin-right: 4px;
    width: 25px;

    path {
        fill: #68B284 !important;
    }
}

.compare-negative-mentions.compare-widget .mention-icon svg {
    margin-left: 0;
    margin-right: 4px;
    width: 25px;

    path {
        fill: #f0468b !important;
    }
}

.compare-chart-container {
    position: relative;
    width: 100%;
    height: 100%;
}


.compare-widget .item-top-counter {
    color: #7C888A;
    font-size: 12px;
    font-weight: 300;
    line-height: 15px;
    text-align: right;
    vertical-align: middle;

    .mentions-counter {
        display: flex;
        align-items: flex-start;
        justify-content: end;
        cursor: pointer;
        gap: 10px;

        > div {
            display: flex;
            align-items: center;
            justify-content: end;
            cursor: pointer;
            gap: 10px;
        }
    }
}

.compare-widget .item-widget-column.widget-three-halfs {
    .item-top-counter {
        .mentions-counter  {
            > div {
                flex-direction: column;
                gap: 5px;
                align-items: center;
            }
        }
    }
}

.dashboard-widget-no-data-element {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    padding: 20px;
    position: absolute;
    top: 0;
    background: #fff;
    border-radius: inherit;
    gap: 10px;
    font-family: var(--default-font-family);

    .title-element {
        font-size: 16px;
        color: #535473;
        font-weight: 600;
        position: relative;
        &:empty {
            display: none;
        }
    }

    .subtitle-element {
        font-family: var(--default-font-family);
        font-weight: 400;
        font-size: 14px;
        color: #A3A5BB;
    }

    .icon-element {

        flex: 1;
        overflow: hidden;
        max-width: 900px;
        margin-left: auto;
        height: 702px;

        svg {
            width: 100%;
            height: 100%;
             > g {
                opacity: .1;
                path {
                    fill: currentColor;
                    color: rgb(122, 102, 255);
                }
            }

            > path {
                opacity: .1;
                fill: currentColor;
                color: rgb(122, 102, 255);
            }


        }
    }

    &.left-icon {
        align-items: flex-start;
        .icon-element {
            max-width: 250px;
            margin-left: 0;
            margin-right: auto;
        }
    }
}

.compare-context .widget-title-container,
.compare-hashtags .widget-title-container {
    justify-content: space-between;

    .sentiment-toggle {
        margin-right: 40px;
        white-space: nowrap;
        .sentiment-button {
            border-radius: 15px;
            border: none;
            padding: 2px 6px;
            background: linear-gradient(0deg, rgba(245, 0, 74, 0.1) 0%, rgba(122, 102, 255, 0.1) 100%);
            margin-right: 14px;
            display: flex;
            align-items: center;

            &:hover {
                background: linear-gradient(0deg, rgba(245, 0, 74, 0.2) 0%, rgba(122, 102, 255, 0.2) 100%);

                .mentions-legend-container {
                    color: var(--mainly-blue) !important;
                }
            }

            .mentions-legend-container {
                color: var(--purple-fog);
                font-family: var(--default-font-family);
                font-size: 12px;
                font-weight: 400;

                span.legend-color {
                    margin-left: unset;

                    &.default {
                        background-color: var(--purple-fog);
                    }
                }
            }
        }
    }
}


.cloud-tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted black;
}

.cloud-tooltip {
    font-size: 12px;
    position: absolute;
    visibility: hidden;
    left: 0%;
    padding: 10px;
    box-shadow: -1px 2px 5px rgba(0, 0, 0, 0.5);
    border: 1px solid rgb(125, 94, 228);
    border-radius: 3px;
    opacity: 0;
    text-align: left;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    transition-property: opacity;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    transition-timing-function: linear;
    -webkit-transition-delay: initial;
    -moz-transition-delay: initial;
    transition-delay: initial;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;

    &:before,
    &:after {
        content: "";
        position: absolute;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        top: 100%;
        left: 50%;
        margin-left: -10px;
    }

    &:before {
        border-top: 6px solid rgb(125, 94, 228);
        margin-top: 1px;
    }

    &:after {
        border-top: 6px solid white;
        margin-top: 0px;
        z-index: 1;
    }
}

.dashboard-widget,
.compare-widget {
    &.gradient-background {
        background: linear-gradient(180deg, rgba(122, 102, 255, 0.2) 0%, rgba(122, 102, 255, 0) 100%), #FFFFFF;
        border: 1px solid #FFFFFF;
        box-shadow: 0px 2px 16px rgba(122, 102, 255, 0.2);
        border-radius: 18px;

        .widget-content {
            cursor: pointer;
        }
    }

    .notification-element {
        cursor: pointer;
        background: linear-gradient(180deg, #84A5FF 0.19%, #7A66FF 100%);
        &:hover {
            background: var(--primary-button-hover-background);
        }
        .notification-text {
            padding: 4px;

            a {
                color: #fff;
            }
        }

        &.notification-icon-left {
            .notification-icon {
                padding: 0 6px;
            }
        }
    }
}

.enable-data-container {
    background: linear-gradient(180deg, #DBE0FE, #D9D3FF);
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 2px;
    margin: 10px 0;


    .notification-element {
        cursor: pointer;
        margin: 0 auto;
        background: linear-gradient(180deg, #84A5FF 0.19%, #7A66FF 100%);
        &:hover {
            background: var(--primary-button-hover-background);
        }
        .notification-text {
            padding-top: 6px;
            padding-bottom: 6px;
            a {
                color: #fff;
            }
        }
    }
}

@media (max-width: 1350px) {
    .dashboard-weekday,
    .dashboard-locations,
    .dashboard-influencers-by-performance,
    .dashboard-influencers-by-platform,
    .dashboard-website-traffic-demographics,
    .dashboard-websites-by-visits,
    .dashboard-sentiment-by-media-type,
    .dashboard-sentiment-by-language,
    .dashboard-emoji,
    .dashboard-emotion,
    .dashboard-influencer,
    .dashboard-site,
    .dashboard-sources,
    .dashboard-languages,
    .dashboard-demographics-over-time {
        width: 100% !important;
    }
}


