﻿@font-face {
    font-family: "Rajdhani";
    src: url("../fonts/Rajdhani-Regular.ttf");
    font-weight:normal;
}
/*
@font-face {
    font-family: "Rajdhani";
    src: url("../fonts/Rajdhani-Bold.ttf");
    font-weight:bold;
}

@font-face {
    font-family: "Rajdhani";
    src: url("../fonts/Rajdhani-Light.ttf");
    font-weight:lighter;
}
    */

/* COLORES CORPORATIVOS */
html, body {
    /*font-family: 'Rajdhani'*/
}

.btn-with-spinner {
    width: 45.23px;
    height: 38.8px;
}

.btn-nethodology {
    color: #27F7D2 !important;
    background-color: #004C4F !important;
    border-color: #004C4F !important;
}

    .btn-nethodology:hover {
        color: #004C4F !important;
        background-color: #27F7D2 !important;
        border-color: #27F7D2 !important;
    }

.text-nethodology {
    color: #004C4F !important;
}

.text-hover-nethodology:hover {
    color: #27F7D2 !important;
}

.a-nethodology {
    color: #004C4F !important;
}

    .a-nethodology:hover {
        color: #27F7D2 !important;
    }

.my-notif {
    background-color: #27F7D2 !important;
    color: #004C4F !important;
}

.my-pulse {
    border-color: rgba(039, 247, 210, 0.75) !important;
}

.header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text, .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text, .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-text, .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-text {
    color: #004C4F !important;
}
/* FIN COLORES CORPORATIVOS*/
.logo-twitter-color {
    color: #1da1f2 !important;
}

.logo-facebook-color {
    color: #3b5998 !important;
}

.logo-instagram-color {
    color: #e1306c !important;
}

.logo-youtube-color {
    color: #ff0000 !important;
}

.logo-linkedin-color {
    color: #0077b5 !important;
}

.logo-tiktok-color {
    color: black !important;
}

.logo-twitch-color {
    color: #6441a5 !important;
}

.btn-fb-hov:hover {
    background-color: #3b5998 !important;
    border: solid 1px #3b5998 !important ;
}

.btn-tw-hov:hover {
    background-color: #1da1f2 !important;
    border: solid 1px #1da1f2 !important ;
}

.btn-ig-hov:hover {
    background-color: #e1306c !important ;
    border: solid 1px #e1306c !important ;
}

.btn-yt-hov:hover {
    background-color: #ff0000 !important ;
    border: solid 1px #ff0000 !important ;
}

.btn-lk-hov:hover {
    background-color: #0077b5 !important ;
    border: solid 1px #0077b5 !important ;
}

.btn-tk-hov:hover {
    background-color: black !important;
    border: solid 1px black !important;
}

.btn-tc-hov:hover {
    background-color: #6441a5 !important;
    border: solid 1px #6441a5 !important;
}

.btn.btn-tiktok {
    color: #ffffff;
    background-color: black;
    border-color: black;
}

.btn.btn-twitch {
    color: #ffffff;
    background-color: #6441a5;
    border-color: #6441a5;
}

.btn-all {
    background-color: #00b050 !important;
    border: solid 1px #00b050 !important;
}

.btn-all-hov:hover {
    background-color: #00b050 !important;
    border: solid 1px #00b050 !important;
}

.new-tiktok {
    cursor:pointer;
}
    .new-tiktok:hover {
        box-shadow: 0px 22px 34px #e7e7e7;
    }

    .new-tiktok:hover i {
        color: #000000 !important;
        
    }

    .new-tiktok:hover span {
        color: #000000 !important;
    }

.new-review {
    cursor: pointer;
}

    .new-review:hover {
        box-shadow: 0px 22px 34px #ffe0a7;
    }

    .new-review:hover i {
        color: orange !important;
        
    }
    .new-review:hover span {
        color: orange !important;
       
    }

.new-follow {
    cursor: pointer;
}

    .new-follow:hover {
        box-shadow: 0px 22px 34px #9dbbbd;
    }

    .new-follow:hover i {
        color: #004C4F !important;
        
    }

    .new-follow:hover span {
        color: #004C4F !important;
        
    }

.spinner.spinner-twitter:before {
    border: 2px solid #1da1f2;
    border-right: 2px solid transparent;
}

.spinner.spinner-facebook:before {
    border: 2px solid #3b5998;
    border-right: 2px solid transparent;
}

.spinner.spinner-instagram:before {
    border: 2px solid #e1306c;
    border-right: 2px solid transparent;
}

.spinner.spinner-youtube:before {
    border: 2px solid #ff0000;
    border-right: 2px solid transparent;
}

.spinner.spinner-linkedin:before {
    border: 2px solid #0077b5;
    border-right: 2px solid transparent;
}

.spinner.spinner-tiktok:before {
    border: 2px solid double;
    border-right: 2px solid transparent;
}

.spinner.spinner-twitch:before {
    border: 2px solid #6441a5;
    border-right: 2px solid transparent;
}

.center-logos {
    text-align: center;
}

.dataTables_wrapper .dataTables_processing {
    position: absolute !important;
    top: 30% !important;
    left: 50% !important;
    width: 30% !important;
    height: 40px !important;
    margin-top: 45px !important;
    padding-top: 20px !important;
    text-align: center !important;
    font-size: 1.2em !important;
    background: none !important;
    border: none !important;
}

.dataTables_wrapper .dataTables_paginate .pagination .page-item.active > .page-link {
    background-color: #004C4F !important;
}

.dataTables_wrapper .dataTables_paginate .pagination .page-item:hover:not(.disabled) > .page-link {
    background-color: #004C4F !important;
}

mark {
    background: yellow;
    color: black;
}

.highlight {
    background-color: yellow
}

td > span > span > span > ul > li.select2-selection__choice > span > a {
    color: #3F4254 !important;
}

.fb-like {
    color: #2078f4;
}

.fb-loveit {
    color:#e0245e;
}

.fb-funny {
    color: #fbd914
}

.fb-awesome {
    color: #fbd914
}

.fb-sad {
    color: #fbd914
}

.fb-angry {
    color: #fbd914
}

.label-twitter {
    color: #FFFFFF;
    background-color: #1da1f2;
}

.label-facebook {
    color: #FFFFFF;
    background-color: #3b5998;
}

.label-instagram {
    color: #FFFFFF;
    background-color: #e1306c;
}

.label-youtube {
    color: #FFFFFF;
    background-color: #ff0000;
}

.label-linkedin {
    color: #FFFFFF;
    background-color: #0077b5;
}

.label-tiktok {
    color: #FFFFFF;
    background-color: black;
}

.label-twitch {
    color: #FFFFFF;
    background-color: #6441a5;
}

.wizard-step[data-wizard-state="current"] {
    color: #00b050 !important;
}

.wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-label .wizard-icon, .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-label .wizard-icon {
    color: #6993FF;
}

    .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-label .wizard-icon svg g [fill], .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-label .wizard-icon svg g [fill] {
        -webkit-transition: fill 0.3s ease;
        transition: fill 0.3s ease;
        fill: #00b050 !important;
    }

    .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-label .wizard-icon svg:hover g [fill], .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-label .wizard-icon svg:hover g [fill] {
        -webkit-transition: fill 0.3s ease;
        transition: fill 0.3s ease;
    }

.wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-label .wizard-title, .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-label .wizard-title {
    color: #00b050 !important;
}

.wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-arrow, .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-arrow {
    color: #00b050 !important;
}

    .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-arrow svg g [fill], .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-arrow svg g [fill] {
        -webkit-transition: fill 0.3s ease;
        transition: fill 0.3s ease;
        fill: #00b050 !important;
    }

    .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="done"] .wizard-arrow svg:hover g [fill], .wizard.wizard-1 .wizard-nav .wizard-steps .wizard-step[data-wizard-state="current"] .wizard-arrow svg:hover g [fill] {
        -webkit-transition: fill 0.3s ease;
        transition: fill 0.3s ease;
    }


.no-hover-btn:hover {
    color: #1BC5BD !important;
    background-color: #C9F7F5 !important;
    border-color: transparent !important;
    cursor:default !important;
}

.no-hover-btn:active {
    color: #1BC5BD !important;
    background-color: #C9F7F5 !important;
    border-color: transparent !important;
    cursor:default !important;
}

.no-hover-btn:focus {
    color: #1BC5BD !important;
    background-color: #C9F7F5 !important;
    border-color: transparent !important;
    cursor: default !important;
}

    /* NAV TABS ICON */
.nav.nav-pills .nav-link.active.facebook-i .nav-icon i {
    color: #3b5998 !important;
}
.nav.nav-pills .nav-link.active.twitter-i .nav-icon i {
    color: #1da1f2 !important;
}
.nav.nav-pills .nav-link.active.instagram-i .nav-icon i {
    color: #e1306c !important;
}
.nav.nav-pills .nav-link.active.youtube-i .nav-icon i {
    color: #ff0000 !important;
}
.nav.nav-pills .nav-link.active.linkedin-i .nav-icon i {
    color: #0077b5 !important;
}

.nav.nav-pills .nav-link.active.twitch-i .nav-icon i {
    color: #6441a5 !important;
}

.nav.nav-pills .nav-link.active.twitch-i {
    background-color: transparent !important;
}

.nav.nav-pills .nav-link.active.tiktok-i .nav-icon i {
    color: black !important;
}

.facebook-i:hover {
    color: #3b5998 !important;
}

.twitter-i:hover {
    color: #1da1f2 !important;
}

.instagram-i:hover {
    color: #e1306c !important;
}

.youtube-i:hover {
    color: #ff0000 !important;
}

.linkedin-i:hover {
    color: #0077b5 !important;
}

.tiktok-i:hover {
    color: black !important;
}

.facebook-i > span > i:hover {
    color: #3b5998 !important;
}

.twitter-i > span > i:hover {
    color: #1da1f2 !important;
}

.instagram-i > span > i:hover {
    color: #e1306c !important;
}

.youtube-i > span > i:hover {
    color: #ff0000 !important;
}

.linkedin-i > span > i:hover {
    color: #0077b5 !important;
}

.tiktok-i > span > i:hover {
    color: black !important;
}

.twitch-i > span > i:hover {
    color: #6441a5 !important;
}

.custom-btn-div:hover {
    border-color: #004c4f !important;
    cursor:pointer;

}



.nav.nav-pills .nav-link.active.facebook-i {
    background-color: transparent !important;
}
.nav.nav-pills .nav-link.active.twitter-i {
    background-color: transparent !important;
}
.nav.nav-pills .nav-link.active.instagram-i {
    background-color: transparent !important;
}
.nav.nav-pills .nav-link.active.youtube-i {
    background-color: transparent !important;
}
.nav.nav-pills .nav-link.active.linkedin-i {
    background-color: transparent !important;
}

.nav.nav-pills .nav-link.active.tiktok-i {
    background-color: transparent !important;
}

.nav.nav-pills .nav-link.facebook-pane.active {
    color: #ffffff;
    background-color: #3b5998 !important;
}

.nav.nav-pills .nav-link.twitter-pane.active {
    color: #ffffff;
    background-color: #1da1f2 !important;
}

.nav.nav-pills .nav-link.instagram-pane.active {
    color: #ffffff;
    background-color: #e1306c !important;
}

.nav.nav-pills .nav-link.youtube-pane.active {
    color: #ffffff;
    background-color: #ff0000 !important;
}

.nav.nav-pills .nav-link.linkedin-pane.active {
    color: #ffffff;
    background-color: #0077b5 !important;
}

.nav.nav-pills .nav-link.tiktok-pane.active {
    color: #ffffff;
    background-color: black !important;
}

.nav.nav-pills .nav-link.facebook-pane:hover:not(.active) {
    color: #3b5998 !important;
    background-color: transparent;
}

.nav.nav-pills .nav-link.twitter-pane:hover:not(.active) {
    color: #1da1f2 !important;
    background-color: transparent;
}

.nav.nav-pills .nav-link.instagram-pane:hover:not(.active) {
    color: #e1306c !important;
    background-color: transparent;
}


.nav.nav-pills .nav-link.youtube-pane:hover:not(.active) {
    color: #ff0000 !important;
    background-color: transparent;
}

.nav.nav-pills .nav-link.linkedin-pane:hover:not(.active) {
    color: #0077b5 !important;
    background-color: transparent;
}

.nav.nav-pills .nav-link.tiktok-pane:hover:not(.active) {
    color: black !important;
    background-color: transparent;
}

/* custom switch */

.switch.facebook-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #3b5998;
}

.switch.twitter-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #1da1f2;
}

.switch.instagram-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #e1306c;
}

.switch.youtube-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #ff0000;
}

.switch.linkedin-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #0077b5;
}

.switch.twitch-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: #6441a5;
}

.switch.tiktok-switch input:checked ~ span:after {
    opacity: 1;
    color: #ffffff;
    background-color: black;
}

.card-label-editable:hover{
    
}



.dashcard-row {
    border: 2px dashed transparent;
    transition: border 0.4s linear;
    border-radius:7px;
}

    .dashcard-row:hover {
        border: 2px dashed #9c8e8e;
    }

.opt {
    width: 100%;
    text-align: right;
    color: transparent !important;
    padding-right: 5px;
    padding-top: 2px;
}

.optc {
    color: transparent !important;
    cursor: pointer;
    transition: color 0.4s linear;
}

.dashcard-row:hover .optc {
    color: red !important;
}

.int-row {
    text-align: center;
    border: 2px dashed transparent;
    transition: border 0.4s linear;
    border-radius: 7px;
}

    .int-row:hover {
        text-align: center;
        border: 2px dashed #9c8e8e;
    }

.int-row > .col-12{
    color:transparent;
}

    .int-row:hover > .col-12 {
        color: #9c8e8e;
    }


.sombrear:hover {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

/*CONFIGURACION DE PROYECTO*/

.table-perfiles-font-th {
    font-size:20px !important;
}

.table-perfiles-th{
    text-align:center;
}


.table-perfiles-td {
    text-align: center;
}

/* PAGINATION */
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
    background-color: #004C4F !important;
    border-color: #004C4F !important;
    color:white !important;
}

.pagination > li > a, .pagination > li > span {
    color: #004C4F !important;
}

.scrolltop {
    background-color: #004C4F !important;
}

.fechas-global
{
    display:none;
}

.paginate_button:hover a{
    color:white !important;
}



.btn-icon:hover i {
    color: #27F7D2 !important;
}

.my-delete:hover I{
    color: red !important;
}


/* ERRORES */
.validation-summary-errors {
    color: #f44336 !important;
    font-weight: bold !important;
}

@media (min-width: 992px) {
    .header-fixed[data-header-scroll="on"] .header-menu .menu-nav > .menu-item:hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text, .header-fixed[data-header-scroll="on"] .header-menu .menu-nav > .menu-item.menu-item-hover:not(.menu-item-here):not(.menu-item-active) > .menu-link .menu-text, .header-fixed[data-header-scroll="on"] .header-menu .menu-nav > .menu-item.menu-item-here > .menu-link .menu-text, .header-fixed[data-header-scroll="on"] .header-menu .menu-nav > .menu-item.menu-item-active > .menu-link .menu-text {
        color: #004C4F !important;
    }
}

.link-mostrar-img {
    cursor: pointer;
    margin-left: 45%;
    color: #18aba4;
}

.link-mostrar-img:hover {
    color: #1BC5BD;
    border-bottom: 2px solid #004C4F;
}

.link-mostrar-transcription {
    cursor: pointer;
    margin-left: 45%;
    color: #18aba4;
}

.link-mostrar-transcription:hover {
    color: #1BC5BD;
    border-bottom: 2px solid #004C4F;
}
/*table {
    table-layout: fixed;
    word-wrap: break-word;
    width: 100% !important;
    clear: both !important;
    border-collapse: collapse !important;
}*/

.fill-review svg path {
    fill: orange !important;
}

.fill-sentiment svg path {
    fill: red !important;
}

.fill-classifier svg path {
    fill: #ff8000 !important;
}

/*SIDECAR PARA MOSTRAR IMAGENES*/

.slideshow-container {
    max-width: 1000px;
    position: relative;
    margin: auto;
}

.mySlides {
}

.prev-slide, .next-slide {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    margin-top: -22px;
    padding: 16px;
    color: black;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}

.next-slide {
    right: 0;
    border-radius: 3px 0 0 3px;
}

    .prev-slide:hover, .next-slide:hover {
        background-color: #27F7D2;
    }


.numbertext-slide {
    color: black;
    font-size: 14px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
}

.dot-slide {
    cursor: pointer;
    height: 15px;
    width: 15px;
    margin: 0 2px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.6s ease;
}

.active-slide-dot, .dot-slide:hover {
    background-color: #717171;
}


.fade-slide {
    animation-name: fade;
    animation-duration: 1.5s;
}

@keyframes fade-slide {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}


/*Mostrar imágenes circulares*/
.circular-image {
    width: 3.5em; 
    height: 3.5em; 
    border-radius: 50%; 
    overflow: hidden; 
    object-fit: cover; 
    margin-top: 0.3em;
}
}

.fill-image svg path {
    fill: black !important;
}

.dz-success-mark svg path{
    fill: green !important;
}

.dropzone .dz-preview .dz-success-mark, .dropzone .dz-preview .dz-error-mark {
    margin-top: -40px !important;
}
.dz-error-mark svg path {
    fill: #be2626 !important;
}

.dropzone .dz-preview .dz-error-message {
    top: 150px;
}

.dz-remove {
    font-size: 14px !important;
}


/******CUSTOM BTN LOADER******/
/******************************** HTML ********************************
<button type="button" class="btn btn-primary" data-loader-neth="off">
    <span class="loader-neth-label">
        Text
    </span>
    <span class="loader-neth-progress">
        Loading... <span class="spinner-border spinner-border-sm align-middle"></span>
    </span>
</button>
*/

/******************************** JS ********************************
  //Activate
  $(btn).attr("data-loader-neth","on").attr("disabled", true);

  //Disactivate
  $(btn).attr("data-loader-neth","on").attr("disabled", true);
*/

.loader-neth-progress {
    display: none;
}

[data-loader-neth=on] > .loader-neth-progress {
    display: inline-block;
}

[data-loader-neth=on] > .loader-neth-label {
    display: none;
}

.loader-neth-border-sm {
    --bs-loader-neth-width: 1rem;
    --bs-loader-neth-height: 1rem;
    --bs-loader-neth-border-width: 0.145em;
}

.loader-neth-border {
    --bs-loader-neth-width: 2rem;
    --bs-loader-neth-height: 2rem;
    --bs-loader-neth-vertical-align: -0.125em;
    --bs-loader-neth-border-width: 0.185rem;
    --bs-loader-neth-animation-speed: 0.65s;
    --bs-loader-neth-animation-name: loader-neth-border;
    border: var(--bs-loader-neth-border-width) solid currentcolor;
    border-right-color: transparent;
}


.loader-neth-grow,
.loader-neth-border {
    display: inline-block;
    width: var(--bs-loader-neth-width);
    height: var(--bs-loader-neth-height);
    vertical-align: var(--bs-loader-neth-vertical-align);
    border-radius: 50%;
    animation: var(--bs-loader-neth-animation-speed) linear infinite var(--bs-loader-neth-animation-name);
}

@keyframes loader-neth-border {
    to {
        transform: rotate(360deg) /* rtl:ignore */;
    }
}

.loader-neth-border {
    --bs-loader-neth-width: 2rem;
    --bs-loader-neth-height: 2rem;
    --bs-loader-neth-vertical-align: -0.125em;
    --bs-loader-neth-border-width: 0.185rem;
    --bs-loader-neth-animation-speed: 0.65s;
    --bs-loader-neth-animation-name: loader-neth-border;
    border: var(--bs-loader-neth-border-width) solid currentcolor;
    border-right-color: transparent;
}

.loader-neth-border-sm {
    --bs-loader-neth-width: 1rem;
    --bs-loader-neth-height: 1rem;
    --bs-loader-neth-border-width: 0.145em;
}

@keyframes loader-neth-grow {
    0% {
        transform: scale(0);
    }

    50% {
        opacity: 1;
        transform: none;
    }
}

.loader-neth-grow {
    --bs-loader-neth-width: 2rem;
    --bs-loader-neth-height: 2rem;
    --bs-loader-neth-vertical-align: -0.125em;
    --bs-loader-neth-animation-speed: 0.65s;
    --bs-loader-neth-animation-name: loader-neth-grow;
    background-color: currentcolor;
    opacity: 0;
}

.loader-neth-grow-sm {
    --bs-loader-neth-width: 1rem;
    --bs-loader-neth-height: 1rem;
}

@media (prefers-reduced-motion: reduce) {
    .loader-neth-border,
    .loader-neth-grow {
        --bs-loader-neth-animation-speed: 1.3s;
    }
}



/*HansonTable*/
.ht-outer-container {
    min-height: 100px;
}

.ht_master.handsontable .wtHolder {
/*    width: max-content !important;*/
    height: 100%
}

.ht-outer-container {
    max-width: 100% !important;
    position: relative;
/*    overflow-x:hidden;*/
}

.ht-outer-container > * {
    max-width: 100% !important;
}