:root {
    --ct-primary-rgb: 125, 18, 217;
    --ct-component-active-color: #fff;
    --ct-component-active-bg: #7D12D9;
}

@font-face {
    font-family: 'Poppins';
    src: url(../fonts/Poppins-Light.ttf);
}

body {
    font-family: 'Poppins' !important;
}

body[data-leftbar-theme=dark] .leftside-menu {
    background: #ffffff;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-link {
    color: #313a46;
}

body[data-leftbar-theme=dark] .leftside-menu .logo {
    background: #7D12D9 !important;
}

body[data-leftbar-theme=dark] .side-nav .menuitem-active>a {
    color: #45E7A9 !important;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-link:active,
body[data-leftbar-theme=dark] .side-nav .side-nav-link:focus,
body[data-leftbar-theme=dark] .side-nav .side-nav-link:hover {
    color: #45E7A9;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-forth-level li a:focus,
body[data-leftbar-theme=dark] .side-nav .side-nav-forth-level li a:hover,
body[data-leftbar-theme=dark] .side-nav .side-nav-second-level li a:focus,
body[data-leftbar-theme=dark] .side-nav .side-nav-second-level li a:hover,
body[data-leftbar-theme=dark] .side-nav .side-nav-third-level li a:focus,
body[data-leftbar-theme=dark] .side-nav .side-nav-third-level li a:hover {
    color: #45E7A9;
}

body[data-leftbar-theme=dark] .side-nav .side-nav-forth-level li a,
body[data-leftbar-theme=dark] .side-nav .side-nav-second-level li a,
body[data-leftbar-theme=dark] .side-nav .side-nav-third-level li a {
    color: #313a46;
}

body[data-leftbar-theme=dark][data-leftbar-compact-mode=condensed] .side-nav .side-nav-item:hover .side-nav-link {
    background: #45E7A9;
    color: #fff !important;
    -webkit-transition: none;
    transition: none;
}

.bg-primary {
    --ct-bg-opacity: 1;
    background-color: rgba(var(--ct-primary-rgb), var(--ct-bg-opacity)) !important;
}

/* Button Primary */
.btn-primary {
    -webkit-box-shadow: 0 2px 6px 0 rgba(125, 18, 217, .5);
    box-shadow: 0 2px 6px 0 rgb(125 18 217 / 50%);
}

.btn-primary {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
}

.btn-primary:hover {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
}

.btn-primary.disabled,
.btn-primary:disabled {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
}

.btn-outline-primary {
    color: #7D12D9;
    border-color: #7D12D9;
}

.btn-check:focus+.btn-primary,
.btn-primary:focus {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
    -webkit-box-shadow: 0 0 0 .2rem rgba(125, 18, 217, .5);
    box-shadow: 0 0 0 .2rem rgba(125, 18, 217, .5);
}

.btn-check:active+.btn-outline-primary,
.btn-check:checked+.btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
}

.btn-outline-primary:hover {
    color: #fff;
    background-color: #7D12D9;
    border-color: #7D12D9;
}

/* Button Success */
.btn-success {
    -webkit-box-shadow: 0 2px 6px 0 rgba(69, 231, 169, .5);
    box-shadow: 0 2px 6px 0 rgb(69 231 169 / 50%);
}

.btn-success {
    color: #313a46;
    background-color: #45E7A9;
    border-color: #45E7A9;
}

.btn-success:hover {
    color: #313a46;
    background-color: #45E7A9;
    border-color: #45E7A9;
}

.btn-success.disabled,
.btn-success:disabled {
    color: #313a46;
    background-color: #45E7A9;
    border-color: #45E7A9;
}

.btn-check:focus+.btn-success,
.btn-success:focus {
    color: #313a46;
    background-color: #45E7A9;
    border-color: #45E7A9;
    -webkit-box-shadow: 0 0 0 .2rem rgba(69, 231, 169, .5);
    box-shadow: 0 0 0 .2rem rgba(69, 231, 169, .5);
}

.btn-xs {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

/* Badge Css*/
.badge-p-10 {
    padding: 10px 10px;
}

/* Pagination Css */
.page-item.active .page-link {
    z-index: 3;
    color: var(--ct-component-active-color);
    background-color: var(--ct-component-active-bg);
    border-color: var(--ct-component-active-bg);
}

/* Datatable Css */
.dataTables_info {
    font-weight: 500;
}

.imageview {
    height: 150px;
    position: relative;
}

.imageview>img {
    width: auto;
    height: auto;
    max-height: 100%;
    max-width: 100%;
    object-fit: cover;
}

.invalid-feedback {
    display: block;
}

.horizontalimage {
    width: 250px;
    height: 150px;
}

.horizontalimage>img {
    height: 100%;
    width: 100%;
    object-fit: contain
}
/* Image Preview with Remove Icon */
.image-area {
    position: relative;
    height: 150px;
    position: relative;
}

.image-area img {
    height: 100%;
    width: 100%;
    object-fit: contain
}

.remove-image {
    display: none;
    position: absolute;
    top: -10px;
    right: -10px;
    border-radius: 10em;
    padding: 2px 6px 3px;
    text-decoration: none;
    font: 700 21px/20px sans-serif;
    background: #555;
    border: 3px solid #fff;
    color: #FFF;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5), inset 0 2px 4px rgba(0, 0, 0, 0.3);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    -webkit-transition: background 0.5s;
    transition: background 0.5s;
}

.remove-image:hover {
    background: #E54E4E;
    padding: 3px 7px 5px;
    top: -11px;
    right: -11px;
}

.remove-image:active {
    background: #E54E4E;
    top: -10px;
    right: -11px;
}

/* Custom Margin css */
.mt-1-2 {
    margin-top: 1.2rem !important;
}

/* Header Css*/
.nav-upgrade {
    padding: calc(31px * .5) 20px calc(31px * .5) 57px!important;
    text-align: left!important;
    position: relative;
    border-width: 0 1px;
    min-height: 70px
}
/*  Header CSS end */
.ribbon-box .ribbon-primary {
    background: #7D12D9;
}

.ribbon-box .ribbon-primary:before {
    border-color: #7D12D9 transparent transparent;
}

.ribbon-box .ribbon-two-primary span {
    background: #7D12D9;
}

.ribbon-box .ribbon-two-primary span:before {
    border-left: 3px solid #7D12D9;
    border-top: 3px solid #7D12D9;
}

.ribbon-box .ribbon-two-primary span:after {
    border-right: 3px solid #7D12D9;
    border-top: 3px solid #7D12D9;
}

.badge-primary-lighten {
    color: #7D12D9;
    background-color: rgb(125 18 217 / 18%);
}