.btn-primary,
.page-item.active .page-link{
color: #fff;
background-color: #854eae;
border-color: #854eae;
}

a, .footer a, .page-link{
color: #854eae;
}

a:hover, .nav-item:hover{
color: #7a43a4 !important;
}

.sidebar .sidebar-body .nav .nav-item:hover .nav-link .link-icon {
color: #7a43a4;
fill: rgba(239, 243, 255, 0.5);
}

.btn-primary:hover, .btn-primary.dropdown-toggle{
background-color: #7a43a4 !important;
border-color: #7a43a4 !important;
}

.dropdown-item:hover{
color: #854fae !important;
background-color: rgba(133, 79, 174, 0.26) !important;
}

.form-control:focus{
border-color: #00c7c7;
}


.this_month{
display: block;
position: absolute;
top: -22px;
right: 12px;
font-size: 9px;
color: #000;
text-transform: uppercase;
}

.breadcrumb_org ol{
padding-left: 0;
padding-bottom: 20px;
}

.sent_indicator{
background: #0cb4ce !important;
}

.delivered_indicator{
background: #7030a0 !important;
}

#download_singlemailings, #download_automated{
cursor: pointer;
}

.filter_datatable{
padding: 0 0px 40px 0px;
}
.card-header {
text-transform: uppercase;
font-weight: 600;
}

.btn-support {
position: fixed;
bottom: 30px;
right: 35px;
z-index: 99999;
}

.btn-support a:hover {
color:#fff!important;
}

.example_date {
font-size: 13px;
}

#periodButton .btn-icon-prepend, #dashboardDateButton .btn-icon-prepend{
width: 20px;
/* margin: -4px 10px 0px 0; */
}

/* #periodButton{
margin: 0 10px;
} */

#dashboardDate, #dashboardDate2{
width: auto;
}

.slider{
width: 260px;
margin-top: 10px;
margin-bottom: 20px;
}

.indicadorRage{
background: #854eae;
color: #fff;
padding: 3px 5px 1px 5px;
margin-bottom: 20px;
}

.datepicker.input-group {
padding: 0;
border: 1px solid #854eae;
}



@media screen and (max-width: 768px) {
.form-group .w-25{
width: 100% !important;
}
.previews-table {
width: 100% !important;
}
.previews-table thead {
display: none;
}
.previews-table tr:nth-of-type(2n) {
background-color: inherit;
}
.previews-table tr td:first-child {
background: #f0f0f0;
font-weight:bold;
font-size:1.3em;
}
.previews-table tbody td {
display: block;
text-align:center;
}
.previews-table tbody td:before {
content: attr(data-th);
display: block;
text-align:center;
}
.previews-table td:nth-of-type(1)::before {
    content: "ID TEMPLATE";
    font-size: 1rem !important;
    font-weight: normal;
    color: #b4b4b4;
    margin-bottom: 10px;
}

.previews-table td:nth-of-type(2)::before {
    content: "EMAIL";
    font-size: 1rem !important;
    font-weight: normal;
    color: #b4b4b4;
    margin-bottom: 10px
 }
.previews-table td:nth-of-type(3)::before {
    content: "REGISTRO";
    font-size: 1rem !important;
    font-weight: normal;
    color: #b4b4b4;
    margin-bottom: 10px
 }
.previews-table td:nth-of-type(4)::before {
    content: "SHARE URL";
    font-size: 1rem !important;
    font-weight: normal;
    color: #b4b4b4;
    margin-bottom: 10px
 }
}

/* Toast notification - Success Copy */

/* Define los estilos de la notificación */
#snackbar {
visibility: hidden;
min-width: 250px;
margin-left: -125px;
background-color: #26c470;
color: #fff;
text-align: center;
border-radius: 2px;
padding: 16px;
position: fixed;
z-index: 1;
left: 50%;
bottom: 80px;
}

/* Define los estilos de la clase 'show', que se aplica cuando se muestra la notificación */
#snackbar.show {
visibility: visible;
-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
animation: fadein 0.5s, fadeout 0.5s 2.5s;
}

/* Define la animación de entrada de la barra de notificaciones */
@-webkit-keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 80px; opacity: 1;}
}

@keyframes fadein {
from {bottom: 0; opacity: 0;}
to {bottom: 80px; opacity: 1;}
}

/* Define la animación de salida de la barra de notificaciones */
@-webkit-keyframes fadeout {
from {bottom: 80px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}

@keyframes fadeout {
from {bottom: 80px; opacity: 1;}
to {bottom: 0; opacity: 0;}
}

/* FIN Toast notification - Success Copy */

.feather {
    width: 20px !important;
    height: 20px !important;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
}

.deleteJourneyAssociated{
    display: block;
    margin: 10px 0;
}
