:root {
     --corprincipal: #a256ff;
     --corseduncaria: #e2caff;
     --c1:"";
     --c2:"";
     --c3:"";
     --c4:"";;
}
/* CSS CONVERTA */
 @media (max-width: 1024px) {
     .duplo.card-statistic-1 .card-icon, .duplo.card-statistic-2 .card-icon {
         width: 40px !important;
         height: 40px !important;
         margin: 0px !important;
         border-radius: 10px !important;
         line-height: 0px !important;
         text-align: center !important;
         float: left !important;
         margin-right: 7px !important;
         display: block !important;
         padding-top: 8px;
         margin-bottom: 5px !important;
    }
     .corescura {
         color: var(--corprincipal) !important;
    }
     .corclara {
         color: var(--corseduncaria)!important;
    }
     .corbranca {
         color: #fff !important;
    }
     .corcinza {
         color: #c3c3c3 !important;
    }
     .fundoprincipal i {
         font-size: 18px !important;
         color: var(--corprincipal) !important;
         margin-left: 0px !important;
    }
     .fundoprincipal.branco i {
         font-size: 18px !important;
         color: #fff !important;
         margin-left: 0px !important;
    }
     .fundoprincipal {
         background-color: var(--corprincipal) !important;
         border-radius: 9px;
         padding: 0px;
         border: none;
         margin-bottom: 16px;
    }
     .conectado {
         background-color: var(--corseduncaria);
         !important;
         border-radius: 9px;
         padding: 0px;
         border: none;
         margin-bottom: 16px;
    }
     .conectado .card-body {
         padding: 0px;
    }
     .conectado.card.card-statistic-1 .card-header, .conectado.card.card-statistic-2 .card-header {
         padding-bottom: 0;
         padding-top: 5px;
         padding: 10px;
         color:#5fc66f !important;
    }
     .conectado h4{
         color:#5fc66f !important;
    }
     .fundoprincipalinterna.card-statistic-1 .card-icon, .fundoprincipalinterna.card.card-statistic-2 .card-icon {
         width: 40px;
         height: 40px;
         margin: 10px;
         border-radius: 10px;
         line-height: 42px;
         text-align: center;
         float: left;
         margin-right: 15px;
         background: #fff !important;
         padding-top: 2px !important;
    }
     .fundoprincipal .card-icon {
         line-height: 43px;
    }
     .fundoprincipal .card-icon {
         width: 40px;
         height: 40px;
         margin: 10px;
         border-radius: 10px;
         line-height: 42px;
         text-align: center;
         float: left;
         margin-right: 15px;
         background: #fff !important;
    }
     .fundobranco .card-icon {
         background: transparent !important;
         line-height: 43px;
    }
     .fundobranco .card-header {
         border-bottom-color: #f9f9f9;
         line-height: 30px;
         -ms-grid-row-align: center;
         align-self: center;
         width: 100%;
         min-height: 70px;
         padding: 15px 5px;
         display: flex;
         align-items: center;
    }
     .fundobranco .card-icon {
         line-height: 27px !important;
         width: 42px;
         float: left;
         margin-right: 10px;
         height: 40px;
         padding: 10px 0px 20px 8px;
         background-color: var(--corseduncaria);
         !important;
         border-radius: 8px;
    }
     .fundoprincipal h4 {
         color: #fff !important;
    }
     .card.card-statistic-1 .card-body {
         font-size: 12px;
    }
     .fundoprincipal h4 {
         margin-bottom: -5px !important;
    }
     .fundoprincipal.card-statistic-1 .card-icon, .card.card-statistic-2 .card-icon {
         width: 40px;
         height: 40px;
         margin: 10px;
         border-radius: 10px;
         line-height: 42px;
         text-align: center;
         float: left;
         margin-right: 15px;
         background: #fff !important;
         padding-top: 10px;
    }
     .fundoazul {
        background-color: #b5f7f5 !important;
    }
     .fundoprincipal i {
        color: var(--corprincipal);
         font-size: 15px !important;
         margin-top: 5px;
         margin-left: 1px !important;
    }
     .fundoazul i {
        color: #7ccbc6 !important;
         font-size: 15px !important;
         margin-top: 5px;
         margin-left: 1px !important;
    }
     .conectado .card-icon {
         line-height: 43px;
    }
     .conectado .card-icon {
         width: 40px;
         height: 40px;
         margin: 10px;
         border-radius: 10px;
         line-height: 42px;
         text-align: center;
         float: left;
         margin-right: 15px;
         background: #fff !important;
    }

    
     .conectado .card-header, .conectado .card-body, .conectado .card-footer {
         background-color: #d9e9dc;
         border-radius: 10px;
    }
     .fundobranco.card-body {
         padding-left: 0px !important;
         padding-right: 0px !important;
         color: #fff !important;
    }
     .fundoprincipal .card-body {
         color: #fff !important;
    }
     .duplo.card .card-header {
         padding-left: 5px !important;
         padding-right: 5px !important;
    }
     .duplo .card-header, .duplo.card .card-body, .duplo.card .card-footer {
         background-color: transparent;
         padding-left: 5px !important;
         padding-right: 5px !important;
    }
     .duplo.card.card-statistic-1 .card-header, .duplo.card.card-statistic-2 .card-header {
         padding-bottom: 0;
         padding-top: 5px;
    }
}
/* CSS GERAL */
 @media (max-width: 1024px) {
     table i {
         padding: 10px;
         border-radius: 10px;
         color: #6c757d !important;
         margin-top: 25px;
         margin-bottom: 5px;
    }
     .card-header h5 {
         padding-left: 30px;
         margin-top: 15px;
    }
     .dropdown-toggle i {
         color: var(--corprincipal);
    }
     .page-item.active .page-link {
         background-color: var(--corprincipal);
         border-color: var(--corprincipal);
    }
     .page-link {
         border-color: transparent;
         background-color: var(--corseduncaria);
         font-weight: 600;
    }
     .page-link:hover {
         background-color: var(--corprincipal);
         color: #fff !important;
         border-color: transparent;
    }
     .page-item .page-link {
         color: var(--corprincipal);
    }
     .navbar .navbar-nav:first-child {
         flex-direction: row;
         background-color: var(--corprincipal);
         border-radius: 5px;
         width: 46px;
         height: 34px;
    }
     .navbar .navbar-nav:first-child i {
         color:#fff;
    }
     .main-sidebar .sidebar-menu li:last-child {
         display: block;
         background-color: var(--corseduncaria);
         margin: 4%;
         border-radius: 30px;
         margin-top: 40px;
    }
     .section {
         position: relative;
         z-index: 1;
         background: #f4f7fc;
         padding: 20px;
         border-radius: 20px;
    }
     .card.card-primary {
         border-top: 2px solid var(--corprincipal);
    }
    /* 
    /* TABELA RESPONSIVA */
     table, thead, tbody, th, td, tr {
         display: block;
    }
     thead tr {
         position: absolute;
         top: -9999px;
         left: -9999px;
    }
     tr {
         margin: 0 0 1rem 0;
    }
     tr:nth-child(odd) {
         background: #ccc;
    }
     td {
        /* Behave like a "row" */
         border: none;
         border-bottom: 1px solid #eee;
         position: relative;
         padding-left: 50%;
    }
     td:before {
        /* Now like a table header */
         position: absolute;
        /* Top/left values mimic padding */
         top: 0;
         left: 6px;
         width: 45%;
         padding-right: 10px;
         white-space: nowrap;
    }
     .table-responsive table {
         min-width: 100%;
    }
     .input-group-text, select.form-control:not([size]):not([multiple]), .form-control:not(.form-control-sm):not(.form-control-lg) {
         font-size: 14px;
         padding: 10px 15px;
         height: 42px;
         border-radius: 10px;
         margin-bottom: 10px;
    }
     .select2-container .select2-selection--multiple, .select2-container .select2-selection--single {
         box-sizing: border-box;
         cursor: pointer;
         display: block;
         min-height: 42px;
         -moz-user-select: none;
         -ms-user-select: none;
         user-select: none;
         -webkit-user-select: none;
         outline: none;
         background-color: #fdfdff;
         border-color: #e4e6fc;
         border-radius: 10px;
         margin-bottom: 17px;
    }
     .table-sm td, .table-sm th {
         padding-left: 10px;
         padding-right: 10px;
    }
     tr {
         border-radius: 20px !important;
         overflow: hidden;
    }
     td {
         font-size: 17px;
         font-weight: 900;
    }
     table tr:nth-child(even) {
         background-color: #f0f2ff;
    }
     td:before {
         position: relative;
         top: 0;
         left: 6px;
         width: 45%;
         padding-right: 10px;
         white-space: nowrap;
         width: 100%;
         display: block;
         font-size: 12px;
         font-weight: 100;
    }
     .table-sm td, .table-sm th {
         padding: .3rem;
         min-height: 35px;
         padding-top: 9px;
    }
     .table-responsive table {
         max-width: 100%;
         width: 100%;
    }

span.bg-warning.text-white {
    padding: 2px 10px;
    border-radius: 21px;
}



     td{text-align: center !important;}
     td:nth-of-type(1):before {
         content: var(--c1);
    }
     td:nth-of-type(2):before {
         content: var(--c2);
    }
     td:nth-of-type(3):before {
         content:  var(--c3);
    }
     td:nth-of-type(4):before {
         content:  var(--c4);
    }
     td:nth-of-type(5):before {
         content:  var(--c5);
    }
     td:nth-of-type(6):before {
         content: var(--c6);
    }
     td:nth-of-type(7):before {
         content:  var(--c7);
    }
     td:nth-of-type(8):before {
         content:  var(--c8);
    }
     td:nth-of-type(9):before {
         content:  var(--c9);
    }
     td:nth-of-type(10):before {
         content:  var(--c10);
     }

     .btn-info, .btn-info.disabled {
         box-shadow: 0 2px 6px #a256ff;
         background-color: var(--corprincipal);
         border-color: transparent;
         color: #fff;
    }
     section.section {
         margin: 0px !important;
         padding: 10px !important;
         border-radius: 15px;
    }
     .ml-auto, .mx-auto {
         margin-left: auto !important;
         margin: 0 auto;
    }
     input[type='search'] {
         height: 30px !important;
    }
     .btn-primary, .btn-primary.disabled {
         box-shadow: 0 2px 6px var(--corseduncaria);
         background-color: var(--corprincipal);
         border-color: var(--corprincipal);
    }
     section.section .section-body .card{
         border-radius: 15px;
    }
     .float {
         width: 50%;
         float: left;
    }
     .card {
         box-shadow: none;
    }
     .section .section-header {
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.03);
         box-shadow: none;
         background-color: transparent;
         border-radius: 3px;
         border: none;
         position: relative;
         margin-bottom: 30px;
         padding: 10px 0px 0px 0px;
         display: flex;
         align-items: center;
    }
     .geral.card > .card-header {
         padding-left: 0px ! IMPORTANT;
         padding-right: 0px;
    }
     .geral .ml-auto, .geral .mx-auto {
         margin-left: auto !important;
         margin: 0 auto;
         padding: 10px 25px;
         width: 100%;
    }
     .primario {
         background-color: var(--corprincipal);
    }
     span.desativados {
         padding: 5px 10px;
         border-radius: 20px;
         margin: 0 auto;
         margin-bottom: 27px;
         width: 100% !important;
         display: block;
         text-align: center;
    }
[data-target="#modal-adicionar-personalshopper"] {
    right: -130% !important;
    top: -76px;
}

.wizard span:nth-child(2) {
    margin-top: 11px;
}


td.align-middle.text-right {
    text-align: center !important;
}

.wizard .wizard-nav.dots .wizard-step.active .dot {
    background-color: var(==corprincipal);
    box-shadow: 0 0 0 3px rgb(162 86 255 / 21%);
}



wizard .wizard-nav.dots .wizard-step.active:before {
      background-color: var(--corprincipal);
}



.wizard-step.nav-buttons > span {
    transform: rotate(316deg) !important;
    display: block;
    font-size: 10px;
    line-height: 8px;
}

a.page-link {
    padding: 5px;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: var(--corprincipal);
    border-color: #dee2e6 #dee2e6 #fff;
    COLOR: #FFf !important;
}

    button.btn.btn-sm.btn-primary.btcadastro {
            border-radius: 30px;
         margin: 0 auto;
        /* margin-left: 20px;
         */
         margin: 18px;
         position: absolute;
         top: -65px;
         right: -20px;
         background-color: var(--corprincipal);
         border:none !important;
    }
     .btcadastro {
         border-radius: 30px;
         margin: 0 auto;
        /* margin-left: 20px;
         */
         margin: 18px;
         position: absolute;
         top: -50px;
         right: -20px;
         background-color: var(--corprincipal);
         border:none !important;
    }
     .fundoprincipal.card-statistic-1 .card-header, .card.card-statistic-2 .card-header {
         padding-bottom: 0;
         padding-top: 12px;
    }
     .section-body .row {
         background: #fff;
         padding: 10px 0px;
         width: 100%;
         margin: 0px;
         border-radius: 13px;
         box-shadow: 0 4px 8px rgba(0, 0, 0, 0.03);
         margin-bottom: 20px;
    }
     .navbar-bg, body {
         background-color: #fff;
    }
     .main-sidebar .sidebar-menu li a:hover {
         background-color: #e0dff6;
    }
     .main-sidebar .sidebar-menu li:last-child a:hover {
         background-color: #transparent;
    }
     .main-sidebar .sidebar-menu li.active a {
         color: #6777ef;
         font-weight: 600;
         background-color: transparent;
    }
     .main-sidebar .sidebar-menu li a {
         position: relative;
         display: flex;
         align-items: center;
         height: 50px;
         padding: 0 20px;
         width: 94%;
         letter-spacing: .3px;
         color: #868e96;
         text-decoration: none;
        /* background-color: #eeeefe;
         */
         margin: 2%;
         border-radius: 9px;
    }
     .card.card-statistic-1 .card-body {
         font-size: 15px;
    }
     .float100 li.media {
         width: 46%;
         float: left;
         margin: 2%;
    }
     .media-body a {
         background-color: var(--corprincipal);
         padding: 2px 15px;
         border-radius: 200px;
         float: right;
         color: #fff;
    }
     .card.card-statistic-1 .card-header h4 {
         margin-bottom: 0;
         font-size: 11px !important;
         font-weight: 100 !important;
    }
     .card > .card-header {
         padding-left: 0px ! IMPORTANT;
    }
     .float100 li.media {
         width: 46%;
         float: left;
         margin: 2%;
         background-color: var(--corseduncaria);
         padding: 10px;
         border-radius: 10px;
    }
     table tr:nth-child(even) {
         background-color: #f4f7fc;
    }
     .badge.badge-primary {
         background-color: var(--corprincipal) !important;
    }
}