/*
Template Name: Admin Style Sheet
Author: SiddhiInfosoft
Email: info@siddhiinfosoft.com
File: scss
*/

/**
 * Table Of Content
 *
 *  1. Globals
 *  2. Headers
 *  3. Navigations
 *  4. Banners
 *  5. Footers
 *  6. app
 *  7. Widgets
 *  8. Custom Templates
 */

/*
Template Name: Admin Style Sheet
Author: SiddhiInfosoft
Email: info@siddhiinfosoft.com
File: scss
*/

/*Theme Colors*/
/*bootstrap Color*/
/*Light colors*/
/*Normal Color*/
/*Extra Variable*/
/*Preloader*/

@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700");
@import url(../scss/icons/font-awesome/css/font-awesome.min.css);
@import url(../scss/icons/simple-line-icons/css/simple-line-icons.css);
@import url(../scss/icons/weather-icons/css/weather-icons.min.css);
@import url(../scss/icons/linea-icons/linea.css);
@import url(../scss/icons/themify-icons/themify-icons.css);
@import url(../scss/icons/flag-icon-css/flag-icon.min.css);
@import url(../scss/icons/material-design-iconic-font/css/materialdesignicons.min.css);
@import url(../css/spinners.css);
@import url(../css/animate.css);

.preloader {
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
    background: #fff;
}

.preloader .cssload-speeding-wheel {
    position: absolute;
    top: calc(50% - 3.5px);
    left: calc(50% - 3.5px);
}

/*******************
Global Styles
*******************/
* {
    outline: none;
}

body {
    background: #fff;
    font-family: "Urbanist", sans-serif;
    margin: 0;
    overflow-x: hidden;
    color: #434343;
    font-weight: 500;
    letter-spacing: 0.5px;
}

html {
    position: relative;
    min-height: 100%;
    background: #ffffff;
}

a {
    color: var(--admin-panel-color);
}

a:hover,
a:focus {
    text-decoration: none !important;
    color: #f53d05;
}

a.link {
    color: #455a64;
}

a.link:hover,
a.link:focus {
    color: var(--admin-panel-color);
}

.img-responsive {
    width: 100%;
    height: auto;
    display: inline-block;
}

.img-rounded {
    border-radius: 4px;
}

html body .mdi:before,
html body .mdi-set {
    line-height: initial;
}

/*******************
Headings
*******************/
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #455a64;
    font-family: "Urbanist", sans-serif;
    font-weight: 600 !important;
}

h1 {
    line-height: 40px;
    font-size: 36px;
    font-weight: 600 !important;
}

h2 {
    line-height: 36px;
    font-size: 24px;
    font-weight: 600 !important;
}

h3 {
    line-height: 30px;
    font-size: 21px;
    font-weight: 600 !important;
}

h4 {
    line-height: 22px;
    font-size: 18px;
    font-weight: 600 !important;
}

h5 {
    line-height: 18px;
    font-size: 16px;
    font-weight: 400;
    font-weight: 600 !important;
}

h6 {
    line-height: 16px;
    font-size: 14px;
    font-weight: 400;
    font-weight: 600 !important;
}

.display-5 {
    font-size: 3rem;
}

.display-6 {
    font-size: 36px;
}

.box {
    border-radius: 4px;
    padding: 10px;
}

html body .dl {
    display: inline-block;
}

html body .db {
    display: block;
}

.no-wrap td,
.no-wrap th {
    white-space: nowrap;
}

/*******************
Blockquote
*******************/
html body blockquote {
    border-left: 5px solid var(--admin-panel-color);
    border: 1px solid rgba(120, 130, 140, 0.13);
    padding: 15px;
}

.clear {
    clear: both;
}

ol li {
    margin: 5px 0;
}

/*******************
Paddings
*******************/
html body .p-0 {
    padding: 0px;
}

html body .p-10 {
    padding: 10px;
}

html body .p-20 {
    padding: 20px;
}

html body .p-30 {
    padding: 30px;
}

html body .p-l-0 {
    padding-left: 0px;
}

html body .p-l-10 {
    padding-left: 10px;
}

html body .p-l-20 {
    padding-left: 20px;
}

html body .p-r-0 {
    padding-right: 0px;
}

html body .p-r-10 {
    padding-right: 10px;
}

html body .p-r-20 {
    padding-right: 20px;
}

html body .p-r-30 {
    padding-right: 30px;
}

html body .p-r-40 {
    padding-right: 40px;
}

html body .p-t-0 {
    padding-top: 0px;
}

html body .p-t-10 {
    padding-top: 10px;
}

html body .p-t-20 {
    padding-top: 20px;
}

html body .p-t-30 {
    padding-top: 30px;
}

html body .p-b-0 {
    padding-bottom: 0px;
}

html body .p-b-5 {
    padding-bottom: 5px;
}

html body .p-b-10 {
    padding-bottom: 10px;
}

html body .p-b-20 {
    padding-bottom: 20px;
}

html body .p-b-30 {
    padding-bottom: 30px;
}

html body .p-b-40 {
    padding-bottom: 40px;
}

/*******************
Margin
*******************/
html body .m-0 {
    margin: 0px;
}

html body .m-l-5 {
    margin-left: 5px;
}

html body .m-l-10 {
    margin-left: 10px;
}

html body .m-l-15 {
    margin-left: 15px;
}

html body .m-l-20 {
    margin-left: 20px;
}

html body .m-l-30 {
    margin-left: 30px;
}

html body .m-l-40 {
    margin-left: 40px;
}

html body .m-r-5 {
    margin-right: 5px;
}

html body .m-r-10 {
    margin-right: 10px;
}

html body .m-r-15 {
    margin-right: 15px;
}

html body .m-r-20 {
    margin-right: 20px;
}

html body .m-r-30 {
    margin-right: 30px;
}

html body .m-r-40 {
    margin-right: 40px;
}

html body .m-t-0 {
    margin-top: 0px;
}

html body .m-t-5 {
    margin-top: 5px;
}

html body .m-t-10 {
    margin-top: 10px;
}

html body .m-t-15 {
    margin-top: 15px;
}

html body .m-t-20 {
    margin-top: 20px;
}

html body .m-t-30 {
    margin-top: 30px;
}

html body .m-t-40 {
    margin-top: 40px;
}

html body .m-b-0 {
    margin-bottom: 0px;
}

html body .m-b-5 {
    margin-bottom: 5px;
}

html body .m-b-10 {
    margin-bottom: 10px;
}

html body .m-b-15 {
    margin-bottom: 15px;
}

html body .m-b-20 {
    margin-bottom: 20px;
}

html body .m-b-30 {
    margin-bottom: 30px;
}

html body .m-b-40 {
    margin-bottom: 40px;
}

/*******************
vertical alignment
*******************/
html body .vt {
    vertical-align: top;
}

html body .vm {
    vertical-align: middle;
}

html body .vb {
    vertical-align: bottom;
}

/*******************
Opacity
*******************/
.op-5 {
    opacity: 0.5;
}

/*******************
font weight
*******************/
html body .font-bold {
    font-weight: 700;
}

html body .font-normal {
    font-weight: normal;
}

html body .font-light {
    font-weight: 300;
}

html body .font-medium {
    font-weight: 500;
}

html body .font-16 {
    font-size: 16px;
}

html body .font-14 {
    font-size: 14px;
}

html body .font-10 {
    font-size: 10px;
}

html body .font-18 {
    font-size: 18px;
}

html body .font-20 {
    font-size: 20px;
}

/*******************
Border
*******************/
html body .b-0 {
    border: none;
}

html body .b-r {
    border-right: 1px solid rgba(120, 130, 140, 0.13);
}

html body .b-l {
    border-left: 1px solid rgba(120, 130, 140, 0.13);
}

html body .b-b {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

html body .b-t {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
}

html body .b-all {
    border: 1px solid rgba(120, 130, 140, 0.13) !important;
}

/*******************
Thumb size
*******************/
.thumb-sm {
    height: 32px;
    width: 32px;
}

.thumb-md {
    height: 48px;
    width: 48px;
}

.thumb-lg {
    height: 88px;
    width: 88px;
}

.hide {
    display: none;
}

.img-circle {
    border-radius: 100%;
}

.radius {
    border-radius: 4px;
}

/*******************
Text Colors
*******************/
.text-white {
    color: #ffffff !important;
}

.text-danger {
    color: #dc3545 !important;
}

.text-muted {
    color: #99abb4 !important;
}

.text-warning {
    color: #ffc107 !important;
}

.text-success {
    color: #28a745 !important;
}

.text-info {
    color: #17a2b8 !important;
}

.text-inverse {
    color: #2f3d4a !important;
}

html body .text-blue {
    color: #02bec9;
}

html body .text-purple {
    color: #ebc51a;
}

html body .text-primary {
    color: var(--admin-panel-color);
}

html body .text-megna {
    color: #00897b;
}

html body .text-dark {
    color: #67757c;
}

html body .text-themecolor {
    color: var(--admin-panel-color);
}

/*******************
Background Colors
*******************/
.bg-primary {
    background-color: var(--admin-panel-color) !important;
}

.bg-success {
    background-color: #26dad2 !important;
}

.bg-info {
    background-color: var(--admin-panel-color) !important;
}

.bg-warning {
    background-color: var(--admin-panel-color) !important;
}

.bg-danger {
    background-color: #ef5350 !important;
}

html body .bg-megna {
    background-color: #00897b;
}

html body .bg-theme {
    background-color: var(--admin-panel-color);
}

html body .bg-inverse {
    background-color: #2f3d4a;
}

html body .bg-purple {
    background-color: #ebc51a;
}

html body .bg-light-part {
    background-color: rgba(0, 0, 0, 0.02);
}

html body .bg-light-primary {
    background-color: #f1effd;
}

html body .bg-light-success {
    background-color: #e8fdeb;
}

html body .bg-light-info {
    background-color: #cfecfe;
}

html body .bg-light-extra {
    background-color: #ebf3f5;
}

html body .bg-light-warning {
    background-color: #fff8ec;
}

html body .bg-light-danger {
    background-color: #f9e7eb;
}

html body .bg-light-inverse {
    background-color: #f6f6f6;
}

html body .bg-light {
    background-color: #f2f4f8;
}

html body .bg-white {
    background-color: #ffffff;
}

/*******************
Rounds
*******************/
.round {
    line-height: 48px;
    color: #ffffff;
    width: 50px;
    height: 50px;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    border-radius: 100%;
    background: var(--admin-panel-color);
}

.round img {
    border-radius: 100%;
}

.round-lg {
    line-height: 65px;
    width: 60px;
    height: 60px;
    font-size: 30px;
}

.round.round-info {
    background: var(--admin-panel-color);
}

.round.round-warning {
    background: var(--admin-panel-color);
}

.round.round-danger {
    background: #ef5350;
}

.round.round-success {
    background: #26dad2;
}

.round.round-primary {
    background: var(--admin-panel-color);
}

/*******************
Labels
*******************/
.label {
    padding: 3px 10px;
    line-height: 13px;
    color: #ffffff;
    font-weight: 400;
    border-radius: 4px;
    font-size: 75%;
}

.label-rounded {
    border-radius: 60px;
}

.label-custom {
    background-color: #00897b;
}

.label-success {
    background-color: #26dad2;
}

.label-info {
    background-color: var(--admin-panel-color);
}

.label-warning {
    background-color: var(--admin-panel-color);
}

.label-danger {
    background-color: #ef5350;
}

.label-megna {
    background-color: #00897b;
}

.label-primary {
    background-color: var(--admin-panel-color);
}

.label-purple {
    background-color: #ebc51a;
}

.label-red {
    background-color: #fb3a3a;
}

.label-inverse {
    background-color: #2f3d4a;
}

.label-default {
    background-color: #f2f4f8;
}

.label-white {
    background-color: #ffffff;
}

.label-light-success {
    background-color: #e8fdeb;
    color: #26dad2;
}

.label-light-info {
    background-color: #cfecfe;
    color: var(--admin-panel-color);
}

.label-light-warning {
    background-color: #fff8ec;
    color: var(--admin-panel-color);
}

.label-light-danger {
    background-color: #f9e7eb;
    color: #ef5350;
}

.label-light-megna {
    background-color: #e0f2f4;
    color: #00897b;
}

.label-light-primary {
    background-color: #f1effd;
    color: var(--admin-panel-color);
}

.label-light-inverse {
    background-color: #f6f6f6;
    color: #2f3d4a;
}

.table td,
.table th {
    border-color: #f3f1f1;
}

.table thead th [type="checkbox"]+label,
.table th [type="checkbox"]+label {
    margin-bottom: 0;
}

.table tr td>img {
    object-fit: cover;
    border-radius: 5px;
}

.payment_images img {
    max-width: 100px;
}

.role-table .table tr td strong {
    color: #000;
    font-weight: 600;
}

.role-table .table tr td [type="checkbox"]+label {
    margin-right: 10px
}

/*******************
Pagination
*******************/
.pagination>li:first-child>a,
.pagination>li:first-child>span {
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}

.pagination>li:last-child>a,
.pagination>li:last-child>span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.pagination>li>a,
.pagination>li>span {
    color: #263238;
}

.pagination>li>a:hover,
.pagination>li>span:hover,
.pagination>li>a:focus,
.pagination>li>span:focus {
    background-color: #f2f4f8;
}

.pagination-split li {
    margin-left: 5px;
    display: inline-block;
    float: left;
}

.pagination-split li:first-child {
    margin-left: 0;
}

.pagination-split li a {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}

.pagination>.active>a,
.pagination>.active>span,
.pagination>.active>a:hover,
.pagination>.active>span:hover,
.pagination>.active>a:focus,
.pagination>.active>span:focus {
    background-color: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.pager li>a,
.pager li>span {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    color: #263238;
}

/*******************
Table Cell
*******************/
.table-box {
    display: table;
    width: 100%;
}

.table.no-border tbody td {
    border: 0px;
}

.cell {
    display: table-cell;
    vertical-align: middle;
}

.table td,
.table th {
    border-color: #f3f1f1;
}

.table thead th,
.table th {
    font-weight: 500;
}

/*.table-hover tbody tr:hover {
    background: #f2f4f8;
}*/
.nowrap {
    white-space: nowrap;
}

.lite-padding td {
    padding: 5px;
}

.v-middle td,
.v-middle th {
    vertical-align: middle;
}

.table-responsive {
    display: block;
    width: 99%;
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: #FF7E56 transparent;
    border-radius: 0;
    padding-bottom: 15px;
}

.table-responsive:-webkit-scrollbar {
    width: 6px;
    border-radius: 13px;
}

.table-responsive:-webkit-scrollbar-track {
    background: transparent;
}

.table-responsive:-webkit-scrollbar-thumb {
    background-color: #FF7E56;
    border-radius: 6px;
    border: 3px solid transparent;
}

.table-responsive::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar-thumb {
    height: 5px;
    border-radius: 13px;
    background-clip: padding-box;
    border: 6px solid transparent;
    width: 5px;
}

.table-responsive::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 0 10px;
    background: #FF7E56;
}

.table-responsive tr td i {
    font-size: 20px;

}

.table-responsive tr td.ratings {
    white-space: nowrap;
}

.table-responsive tr td.ratings i {
    padding: 3px 4px;
    background: #C8C9CA;
    border-radius: 8px;
    color: #fff !important;
    margin: 0 2px;
}

.table tr td>span.action-btn {
    white-space: nowrap;
}

/*******************
Wave Effects
*******************/
.waves-effect {
    position: relative;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    vertical-align: middle;
    z-index: 1;
    will-change: opacity, transform;
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}

.waves-effect .waves-ripple {
    position: absolute;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -10px;
    opacity: 0;
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: all 0.7s ease-out;
    -moz-transition: all 0.7s ease-out;
    -o-transition: all 0.7s ease-out;
    -ms-transition: all 0.7s ease-out;
    transition: all 0.7s ease-out;
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: transform, opacity;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    pointer-events: none;
}

.waves-effect.waves-light .waves-ripple {
    background-color: rgba(255, 255, 255, 0.45);
}

.waves-effect.waves-red .waves-ripple {
    background-color: rgba(244, 67, 54, 0.7);
}

.waves-effect.waves-yellow .waves-ripple {
    background-color: rgba(255, 235, 59, 0.7);
}

.waves-effect.waves-orange .waves-ripple {
    background-color: rgba(255, 152, 0, 0.7);
}

.waves-effect.waves-purple .waves-ripple {
    background-color: rgba(156, 39, 176, 0.7);
}

.waves-effect.waves-green .waves-ripple {
    background-color: rgba(76, 175, 80, 0.7);
}

.waves-effect.waves-teal .waves-ripple {
    background-color: rgba(0, 150, 136, 0.7);
}

html body .waves-notransition {
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    -ms-transition: none;
    transition: none;
}

.waves-circle {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    text-align: center;
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
    border-radius: 50%;
    -webkit-mask-image: none;
}

.waves-input-wrapper {
    border-radius: 0.2em;
    vertical-align: bottom;
}

.waves-input-wrapper .waves-button-input {
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
}

.waves-block {
    display: block;
}

/*Badge*/
.badge {
    font-weight: 500;
    font-size: 14px;
}

.badge-xs {
    font-size: 9px;
}

.badge-xs,
.badge-sm {
    -webkit-transform: translate(0, -2px);
    -ms-transform: translate(0, -2px);
    -o-transform: translate(0, -2px);
    transform: translate(0, -2px);
}

.table tr th.delete-all,
.table tr td.delete-all {
    width: 60px;
}

/*******************
Buttons
******************/
.btn {
    padding: 5px 12px;
    cursor: pointer;
}

.btn-group label {
    color: #ffffff !important;
    margin-bottom: 0px;
}

.btn-group label.btn-secondary {
    color: #67757c !important;
}

.btn-lg {
    padding: .75rem 0.8rem;
    font-size: 1.0rem;
}

.btn-md {
    padding: 12px 55px;
    font-size: 16px;
}

.btn-circle {
    border-radius: 100%;
    width: 40px;
    height: 40px;
    padding: 10px;
}

.btn-circle.btn-sm {
    width: 35px;
    height: 35px;
    padding: 8px 10px;
    font-size: 14px;
}

.btn-circle.btn-lg {
    width: 50px;
    height: 50px;
    padding: 14px 15px;
    font-size: 18px;
    line-height: 22px;
}

.btn-circle.btn-xl {
    width: 70px;
    height: 70px;
    padding: 14px 15px;
    font-size: 24px;
}

.btn-sm {
    padding: .25rem .9rem;
    font-size: 14px;
}

.btn-xs {
    padding: .25rem .5rem;
    font-size: 10px;
}

.button-list button,
.button-list a {
    margin: 5px 12px 5px 0;
}

.btn-outline {
    color: inherit;
    background-color: transparent;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.btn-rounded {
    border-radius: 60px;
    padding: 7px 18px;
}

.btn-rounded.btn-lg {
    padding: .75rem 1.5rem;
}

.btn-rounded.btn-sm {
    padding: .25rem .5rem;
    font-size: 12px;
}

.btn-rounded.btn-xs {
    padding: .25rem .5rem;
    font-size: 10px;
}

.btn-rounded.btn-md {
    padding: 12px 35px;
    font-size: 16px;
}

.btn-secondary,
.btn-secondary.disabled {
    -webkit-box-shadow: 0 2px 2px 0 rgba(169, 169, 169, 0.14), 0 3px 1px -2px rgba(169, 169, 169, 0.2), 0 1px 5px 0 rgba(169, 169, 169, 0.12);
    box-shadow: 0 2px 2px 0 rgba(169, 169, 169, 0.14), 0 3px 1px -2px rgba(169, 169, 169, 0.2), 0 1px 5px 0 rgba(169, 169, 169, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    background-color: #ffffff;
    color: #67757c;
    border-color: #b1b8bb;
}

.btn-secondary:hover,
.btn-secondary.disabled:hover {
    -webkit-box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
    box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
}

.btn-secondary.active,
.btn-secondary:active,
.btn-secondary:focus,
.btn-secondary.disabled.active,
.btn-secondary.disabled:active,
.btn-secondary.disabled:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
    box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
}

.btn-primary,
.btn-primary.disabled {
    background: var(--admin-panel-color);
    border: 1px solid var(--admin-panel-color);
    -webkit-box-shadow: 0 2px 2px 0 rgba(116, 96, 238, 0.14), 0 3px 1px -2px rgba(116, 96, 238, 0.2), 0 1px 5px 0 rgba(116, 96, 238, 0.12);
    box-shadow: 0 2px 2px 0 rgba(116, 96, 238, 0.14), 0 3px 1px -2px rgba(116, 96, 238, 0.2), 0 1px 5px 0 rgba(116, 96, 238, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-primary:hover,
.btn-primary.disabled:hover {
    background: var(--admin-panel-color);
    -webkit-box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    border: 1px solid var(--admin-panel-color);
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.disabled.active,
.btn-primary.disabled:active,
.btn-primary.disabled:focus {
    background: #6352ce;
    -webkit-box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
}

.btn-themecolor,
.btn-themecolor.disabled {
    background: var(--admin-panel-color);
    color: #ffffff;
    border: 1px solid var(--admin-panel-color);
}

.btn-themecolor:hover,
.btn-themecolor.disabled:hover {
    background: var(--admin-panel-color);
    opacity: 0.7;
    border: 1px solid var(--admin-panel-color);
}

.btn-themecolor.active,
.btn-themecolor:active,
.btn-themecolor:focus,
.btn-themecolor.disabled.active,
.btn-themecolor.disabled:active,
.btn-themecolor.disabled:focus {
    background: #028ee1;
}

.btn-success,
.btn-success.disabled {
    background: #28a745;
    border: 1px solid #28a745;
    -webkit-box-shadow: 0 2px 2px 0 rgba(40, 190, 189, 0.14), 0 3px 1px -2px rgba(40, 190, 189, 0.2), 0 1px 5px 0 rgba(40, 190, 189, 0.12);
    box-shadow: 0 2px 2px 0 rgba(40, 190, 189, 0.14), 0 3px 1px -2px rgba(40, 190, 189, 0.2), 0 1px 5px 0 rgba(40, 190, 189, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-success:hover,
.btn-success.disabled:hover {
    background: #28a745;
    -webkit-box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    border: 1px solid #28a745;
}

.btn-success.active,
.btn-success:active,
.btn-success:focus,
.btn-success.disabled.active,
.btn-success.disabled:active,
.btn-success.disabled:focus {
    background: #28a745;
    -webkit-box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
}

.btn-info,
.btn-info.disabled {
    background: #117a8b;
    border: 1px solid #117a8b;
    -webkit-box-shadow: 0 2px 2px 0 rgba(66, 165, 245, 0.14), 0 3px 1px -2px rgba(66, 165, 245, 0.2), 0 1px 5px 0 rgba(66, 165, 245, 0.12);
    box-shadow: 0 2px 2px 0 rgba(66, 165, 245, 0.14), 0 3px 1px -2px rgba(66, 165, 245, 0.2), 0 1px 5px 0 rgba(66, 165, 245, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-info:hover,
.btn-info.disabled:hover {
    background: #117a8b;
    border: 1px solid #117a8b;
    -webkit-box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
    box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
}

.btn-info.active,
.btn-info:active,
.btn-info:focus,
.btn-info.disabled.active,
.btn-info.disabled:active,
.btn-info.disabled:focus {
    background: #117a8b;
    -webkit-box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
    box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
}

.btn-warning,
.btn-warning.disabled {
    background: var(--admin-panel-color);
    color: #ffffff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(248, 194, 0, 0.14), 0 3px 1px -2px rgba(248, 194, 0, 0.2), 0 1px 5px 0 rgba(248, 194, 0, 0.12);
    box-shadow: 0 2px 2px 0 rgba(248, 194, 0, 0.14), 0 3px 1px -2px rgba(248, 194, 0, 0.2), 0 1px 5px 0 rgba(248, 194, 0, 0.12);
    border: 1px solid var(--admin-panel-color);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
    color: #ffffff;
}

.btn-warning:hover,
.btn-warning.disabled:hover {
    background: var(--admin-panel-color);
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    border: 1px solid var(--admin-panel-color);
}

.btn-warning.active,
.btn-warning:active,
.btn-warning:focus,
.btn-warning.disabled.active,
.btn-warning.disabled:active,
.btn-warning.disabled:focus {
    background: #e9ab2e;
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
}

.btn-danger,
.btn-danger.disabled {
    background: #ef5350;
    border: 1px solid #ef5350;
    -webkit-box-shadow: 0 2px 2px 0 rgba(239, 83, 80, 0.14), 0 3px 1px -2px rgba(239, 83, 80, 0.2), 0 1px 5px 0 rgba(239, 83, 80, 0.12);
    box-shadow: 0 2px 2px 0 rgba(239, 83, 80, 0.14), 0 3px 1px -2px rgba(239, 83, 80, 0.2), 0 1px 5px 0 rgba(239, 83, 80, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-danger:hover,
.btn-danger.disabled:hover {
    background: #ef5350;
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    border: 1px solid #ef5350;
}

.btn-danger.active,
.btn-danger:active,
.btn-danger:focus,
.btn-danger.disabled.active,
.btn-danger.disabled:active,
.btn-danger.disabled:focus {
    background: #e6294b;
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
}

.btn-inverse,
.btn-inverse.disabled {
    background: #2f3d4a;
    border: 1px solid #2f3d4a;
    color: #ffffff;
}

.btn-inverse:hover,
.btn-inverse.disabled:hover {
    background: #2f3d4a;
    opacity: 0.7;
    color: #ffffff;
    border: 1px solid #2f3d4a;
}

.btn-inverse.active,
.btn-inverse:active,
.btn-inverse:focus,
.btn-inverse.disabled.active,
.btn-inverse.disabled:active,
.btn-inverse.disabled:focus {
    background: #232a37;
    color: #ffffff;
}

.btn-red,
.btn-red.disabled {
    background: #fb3a3a;
    border: 1px solid #fb3a3a;
    color: #ffffff;
}

.btn-red:hover,
.btn-red.disabled:hover {
    opacity: 0.7;
    border: 1px solid #fb3a3a;
    background: #fb3a3a;
}

.btn-red.active,
.btn-red:active,
.btn-red:focus,
.btn-red.disabled.active,
.btn-red.disabled:active,
.btn-red.disabled:focus {
    background: #e6294b;
}

.btn-outline-secondary {
    background-color: #ffffff;
    -webkit-box-shadow: 0 2px 2px 0 rgba(169, 169, 169, 0.14), 0 3px 1px -2px rgba(169, 169, 169, 0.2), 0 1px 5px 0 rgba(169, 169, 169, 0.12);
    box-shadow: 0 2px 2px 0 rgba(169, 169, 169, 0.14), 0 3px 1px -2px rgba(169, 169, 169, 0.2), 0 1px 5px 0 rgba(169, 169, 169, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary.focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
    box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
}

.btn-outline-secondary.active,
.btn-outline-secondary:active,
.btn-outline-secondary:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
    box-shadow: 0 14px 26px -12px rgba(169, 169, 169, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(169, 169, 169, 0.2);
}

.btn-outline-primary {
    color: var(--admin-panel-color);
    background-color: #ffffff;
    border-color: var(--admin-panel-color);
    -webkit-box-shadow: 0 2px 2px 0 rgba(116, 96, 238, 0.14), 0 3px 1px -2px rgba(116, 96, 238, 0.2), 0 1px 5px 0 rgba(116, 96, 238, 0.12);
    box-shadow: 0 2px 2px 0 rgba(116, 96, 238, 0.14), 0 3px 1px -2px rgba(116, 96, 238, 0.2), 0 1px 5px 0 rgba(116, 96, 238, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary.focus {
    background: var(--admin-panel-color);
    -webkit-box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    color: #ffffff;
    border-color: var(--admin-panel-color);
}

.btn-outline-primary.active,
.btn-outline-primary:active,
.btn-outline-primary:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);
    background: #6352ce;
}

.btn-outline-success {
    color: #26dad2;
    background-color: transparent;
    border-color: #26dad2;
    -webkit-box-shadow: 0 2px 2px 0 rgba(40, 190, 189, 0.14), 0 3px 1px -2px rgba(40, 190, 189, 0.2), 0 1px 5px 0 rgba(40, 190, 189, 0.12);
    box-shadow: 0 2px 2px 0 rgba(40, 190, 189, 0.14), 0 3px 1px -2px rgba(40, 190, 189, 0.2), 0 1px 5px 0 rgba(40, 190, 189, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-success:hover,
.btn-outline-success:focus,
.btn-outline-success.focus {
    background: #26dad2;
    border-color: #26dad2;
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
}

.btn-outline-success.active,
.btn-outline-success:active,
.btn-outline-success:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    box-shadow: 0 14px 26px -12px rgba(40, 190, 189, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(40, 190, 189, 0.2);
    background: #1eacbe;
}

.btn-outline-info {
    color: var(--admin-panel-color);
    background-color: transparent;
    border-color: var(--admin-panel-color);
    -webkit-box-shadow: 0 2px 2px 0 rgba(66, 165, 245, 0.14), 0 3px 1px -2px rgba(66, 165, 245, 0.2), 0 1px 5px 0 rgba(66, 165, 245, 0.12);
    box-shadow: 0 2px 2px 0 rgba(66, 165, 245, 0.14), 0 3px 1px -2px rgba(66, 165, 245, 0.2), 0 1px 5px 0 rgba(66, 165, 245, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-info:hover,
.btn-outline-info:focus,
.btn-outline-info.focus {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
    box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
}

.btn-outline-info.active,
.btn-outline-info:active,
.btn-outline-info:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
    box-shadow: 0 14px 26px -12px rgba(23, 105, 255, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(23, 105, 255, 0.2);
    background: #028ee1;
}

.btn-outline-warning {
    color: var(--admin-panel-color);
    background-color: transparent;
    border-color: var(--admin-panel-color);
    -webkit-box-shadow: 0 2px 2px 0 rgba(248, 194, 0, 0.14), 0 3px 1px -2px rgba(248, 194, 0, 0.2), 0 1px 5px 0 rgba(248, 194, 0, 0.12);
    box-shadow: 0 2px 2px 0 rgba(248, 194, 0, 0.14), 0 3px 1px -2px rgba(248, 194, 0, 0.2), 0 1px 5px 0 rgba(248, 194, 0, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-warning:hover,
.btn-outline-warning:focus,
.btn-outline-warning.focus {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
}

.btn-outline-warning.active,
.btn-outline-warning:active,
.btn-outline-warning:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    box-shadow: 0 14px 26px -12px rgba(248, 194, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(248, 194, 0, 0.2);
    background: #e9ab2e;
}

.btn-outline-danger {
    color: #ef5350;
    background-color: transparent;
    border-color: #ef5350;
    -webkit-box-shadow: 0 2px 2px 0 rgba(239, 83, 80, 0.14), 0 3px 1px -2px rgba(239, 83, 80, 0.2), 0 1px 5px 0 rgba(239, 83, 80, 0.12);
    box-shadow: 0 2px 2px 0 rgba(239, 83, 80, 0.14), 0 3px 1px -2px rgba(239, 83, 80, 0.2), 0 1px 5px 0 rgba(239, 83, 80, 0.12);
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

.btn-outline-danger:hover,
.btn-outline-danger:focus,
.btn-outline-danger.focus {
    background: #ef5350;
    border-color: #ef5350;
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
}

.btn-outline-danger.active,
.btn-outline-danger:active,
.btn-outline-danger:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    background: #e6294b;
}

.btn-outline-red {
    color: #fb3a3a;
    background-color: transparent;
    border-color: #fb3a3a;
}

.btn-outline-red:hover,
.btn-outline-red:focus,
.btn-outline-red.focus {
    background: #fb3a3a;
    border-color: #fb3a3a;
    color: #ffffff;
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
}

.btn-outline-red.active,
.btn-outline-red:active,
.btn-outline-red:focus {
    -webkit-box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    box-shadow: 0 14px 26px -12px rgba(239, 83, 80, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(239, 83, 80, 0.2);
    background: #e6294b;
}

.btn-outline-inverse {
    color: #2f3d4a;
    background-color: transparent;
    border-color: #2f3d4a;
}

.btn-outline-inverse:hover,
.btn-outline-inverse:focus,
.btn-outline-inverse.focus {
    background: #2f3d4a;
    border-color: #2f3d4a;
    color: #ffffff;
}

.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary.focus:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open>.dropdown-toggle.btn-primary.focus,
.open>.dropdown-toggle.btn-primary:focus,
.open>.dropdown-toggle.btn-primary:hover,
.btn-primary.focus,
.btn-primary:focus {
    background-color: #6352ce;
    border: 1px solid #6352ce;
}

.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success.focus:active,
.btn-success:active:focus,
.btn-success:active:hover,
.open>.dropdown-toggle.btn-success.focus,
.open>.dropdown-toggle.btn-success:focus,
.open>.dropdown-toggle.btn-success:hover,
.btn-success.focus,
.btn-success:focus {
    background-color: #28a745;
    border: 1px solid #28a745;
}

.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info.focus:active,
.btn-info:active:focus,
.btn-info:active:hover,
.open>.dropdown-toggle.btn-info.focus,
.open>.dropdown-toggle.btn-info:focus,
.open>.dropdown-toggle.btn-info:hover,
.btn-info.focus,
.btn-info:focus {
    background-color: #028ee1;
    border: 1px solid #028ee1;
}

.btn-warning.active.focus,
.btn-warning.active:focus,
.btn-warning.active:hover,
.btn-warning.focus:active,
.btn-warning:active:focus,
.btn-warning:active:hover,
.open>.dropdown-toggle.btn-warning.focus,
.open>.dropdown-toggle.btn-warning:focus,
.open>.dropdown-toggle.btn-warning:hover,
.btn-warning.focus,
.btn-warning:focus {
    background-color: #e9ab2e;
    border: 1px solid #e9ab2e;
}

.btn-danger.active.focus,
.btn-danger.active:focus,
.btn-danger.active:hover,
.btn-danger.focus:active,
.btn-danger:active:focus,
.btn-danger:active:hover,
.open>.dropdown-toggle.btn-danger.focus,
.open>.dropdown-toggle.btn-danger:focus,
.open>.dropdown-toggle.btn-danger:hover,
.btn-danger.focus,
.btn-danger:focus {
    background-color: #e6294b;
    border: 1px solid #e6294b;
}

.btn-inverse:hover,
.btn-inverse:focus,
.btn-inverse:active,
.btn-inverse.active,
.btn-inverse.focus,
.btn-inverse:active,
.btn-inverse:focus,
.btn-inverse:hover,
.open>.dropdown-toggle.btn-inverse {
    background-color: #232a37;
    border: 1px solid #232a37;
}

.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red.active,
.btn-red.focus,
.btn-red:active,
.btn-red:focus,
.btn-red:hover,
.open>.dropdown-toggle.btn-red {
    background-color: #d61f1f;
    border: 1px solid #d61f1f;
    color: #ffffff;
}

.button-box .btn {
    margin: 0 8px 8px 0px;
}

.btn-label {
    background: rgba(0, 0, 0, 0.05);
    display: inline-block;
    margin: -6px 12px -6px -14px;
    padding: 7px 15px;
}

.btn-facebook {
    color: #ffffff;
    background-color: #3b5998;
}

.btn-twitter {
    color: #ffffff;
    background-color: #55acee;
}

.btn-linkedin {
    color: #ffffff;
    background-color: #007bb6;
}

.btn-dribbble {
    color: #ffffff;
    background-color: #ea4c89;
}

.btn-googleplus {
    color: #ffffff;
    background-color: #dd4b39;
}

.btn-instagram {
    color: #ffffff;
    background-color: #3f729b;
}

.btn-pinterest {
    color: #ffffff;
    background-color: #cb2027;
}

.btn-dropbox {
    color: #ffffff;
    background-color: #007ee5;
}

.btn-flickr {
    color: #ffffff;
    background-color: #ff0084;
}

.btn-tumblr {
    color: #ffffff;
    background-color: #32506d;
}

.btn-skype {
    color: #ffffff;
    background-color: #00aff0;
}

.btn-youtube {
    color: #ffffff;
    background-color: #bb0000;
}

.btn-github {
    color: #ffffff;
    background-color: #171515;
}

/*******************
Notify
*******************/
.notify {
    position: relative;
    top: -22px;
    right: -9px;
}

.notify .heartbit {
    position: absolute;
    top: -20px;
    right: -4px;
    height: 25px;
    width: 25px;
    z-index: 10;
    border: 5px solid #ef5350;
    border-radius: 70px;
    -moz-animation: heartbit 1s ease-out;
    -moz-animation-iteration-count: infinite;
    -o-animation: heartbit 1s ease-out;
    -o-animation-iteration-count: infinite;
    -webkit-animation: heartbit 1s ease-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.notify .point {
    width: 6px;
    height: 6px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    background-color: #ef5350;
    position: absolute;
    right: 6px;
    top: -10px;
}

@-moz-keyframes heartbit {
    0% {
        -moz-transform: scale(0);
        opacity: 0.0;
    }

    25% {
        -moz-transform: scale(0.1);
        opacity: 0.1;
    }

    50% {
        -moz-transform: scale(0.5);
        opacity: 0.3;
    }

    75% {
        -moz-transform: scale(0.8);
        opacity: 0.5;
    }

    100% {
        -moz-transform: scale(1);
        opacity: 0.0;
    }
}

@-webkit-keyframes heartbit {
    0% {
        -webkit-transform: scale(0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0.1);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.5);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.8);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1);
        opacity: 0.0;
    }
}

/*******************
File Upload
******************/
.fileupload {
    overflow: hidden;
    position: relative;
}

.fileupload input.upload {
    cursor: pointer;
    filter: alpha(opacity=0);
    font-size: 20px;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
}

/*******************
Megamenu
******************/
.mega-dropdown {
    position: static;
    width: 100%;
}

.mega-dropdown .dropdown-menu {
    width: 100%;
    padding: 30px;
    margin-top: 0px;
}

.mega-dropdown ul {
    padding: 0px;
}

.mega-dropdown ul li {
    list-style: none;
}

.mega-dropdown .carousel-item .container {
    padding: 0px;
}

.mega-dropdown .nav-accordion .card {
    margin-bottom: 1px;
}

.mega-dropdown .nav-accordion .card-header {
    background: #ffffff;
}

.mega-dropdown .nav-accordion .card-header h5 {
    margin: 0px;
}

.mega-dropdown .nav-accordion .card-header h5 a {
    text-decoration: none;
    color: #67757c;
}

/*******************
List-style-none
******************/
ul.list-style-none {
    margin: 0px;
    padding: 0px;
}

ul.list-style-none li {
    list-style: none;
}

ul.list-style-none li a {
    color: #67757c;
    padding: 8px 0px;
    display: block;
    text-decoration: none;
}

ul.list-style-none li a:hover {
    color: var(--admin-panel-color);
}

/*******************
dropdown-item
******************/
.dropdown-item {
    padding: 8px 1rem;
    color: #67757c;
}

/*******************
Custom-select
******************/
.custom-select {
    background: url(../../assets/images/custom-select.png) right 0.75rem center no-repeat;
}

/*******************
textarea
******************/
textarea {
    resize: none;
    width: 100%;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 5px;
}

/*******************
Form-control
******************/
.form-control {
    color: #67757c;
    min-height: 38px;
    display: initial;
}

.form-control-sm {
    min-height: 20px;
}

.form-control:disabled,
.form-control[readonly] {
    opacity: 0.7;
}

.custom-control-input:focus~.custom-control-indicator {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.custom-control-input:checked~.custom-control-indicator {
    background-color: #26dad2;
}

form label {
    font-weight: 500;
}

.form-group {
    margin-bottom: 25px;
}

.form-horizontal label {
    margin-bottom: 0px;
}

.form-control-static {
    padding-top: 0px;
}

.form-bordered .form-group {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    padding-bottom: 20px;
}

/*******************
Layouts
******************/
/*Card-noborders*/
.card-no-border .card {
    border: 0px;
    border-radius: 4px;
    -webkit-box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
}

.card-no-border .card:hover {
    -webkit-box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.1);
    transition: 0.5s;
}

.card-no-border .shadow-none {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.card-outline-danger,
.card-outline-info,
.card-outline-warning,
.card-outline-success,
.card-outline-primary {
    background: #ffffff;
}

.card-fullscreen {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    overflow: auto;
}

/*******************/
/*widgets -app*/
/*******************/
.css-bar:after {
    z-index: 1;
}

.css-bar>i {
    z-index: 10;
}

/*******************/
/*single column*/
/*******************/
.single-column .left-sidebar {
    display: none;
}

.single-column .page-wrapper {
    margin-left: 0px;
}

.fix-width {
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
}

/*******************/
/*card-default*/
/*******************/
.card-default .card-header {
    background: #ffffff;
    border-bottom: 0px;
}

/***********************
 13/02/2018 (New Update)
***********************/
.progress {
    height: auto;
}

.card-group {
    margin-bottom: 30px;
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*Theme Colors*/
/*bootstrap Color*/
/*Light colors*/
/*Normal Color*/
/*Extra Variable*/
/*Preloader*/
.preloader {
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
    background: #fff;
}

.preloader .cssload-speeding-wheel {
    position: absolute;
    top: calc(50% - 3.5px);
    left: calc(50% - 3.5px);
}

/*==============================================================
 For all pages
 ============================================================== */
#main-wrapper {
    width: auto;
}

.boxed #main-wrapper {
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    -webkit-box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 60px rgba(0, 0, 0, 0.1);
}

.boxed #main-wrapper .sidebar-footer {
    position: absolute;
}

.boxed #main-wrapper .footer {
    display: none;
}

.page-wrapper {
    background: #fff;
    padding-bottom: 20px;
    min-height: 850px !important;
}

.container-fluid {
    padding: 0 20px 20px 20px;
}

html {
    background: #fff;
}

/*******************
 Topbar
*******************/
.topbar {
    position: relative;
    z-index: 50;
    top: 0 !important;
    bottom: auto !important;
}

.topbar .top-navbar {
    min-height: 50px;
    padding: 0px 0px 0 0;
}

.topbar .top-navbar .dropdown-toggle::after {
    display: none;
}

.topbar .top-navbar .navbar-header {
    line-height: 45px;
    text-align: center;
    height: 60px;
    padding: 7px 0;
}

.topbar .top-navbar .navbar-header .navbar-brand {
    margin-right: 0px;
    padding-bottom: 0px;
    padding-top: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.topbar .top-navbar .navbar-header .navbar-brand img{
    height: 45px;
    width: auto;
}

.topbar .top-navbar .navbar-header .navbar-brand .light-logo {
    display: none;
}

.topbar .top-navbar .navbar-header .navbar-brand b {
    line-height: normal;
    display: inline-block;
}

.topbar .top-navbar .navbar-nav>.nav-item>.nav-link {
    padding-left: .75rem;
    padding-right: .75rem;
    font-size: 15px;
    line-height: 40px;
}

.topbar .top-navbar .navbar-nav>.nav-item.show {
    background: rgba(0, 0, 0, 0.05);
}

.topbar .profile-pic {
    width: 30px;
    border-radius: 100%;
}

.topbar .nav-item-user p {
    color: #000;
    font-size: 12px
}

.topbar .top-navbar .navbar-nav>.nav-item>.nav-link.sidebartoggler {
    padding: 10px 10px;
    background: #374151;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: -18px;
}

.mini-sidebar .topbar .top-navbar .navbar-nav>.nav-item>.nav-link.sidebartoggler {
    transform: rotate(180deg);
}

.topbar .dropdown-menu {
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);
    border-color: rgba(120, 130, 140, 0.13);
}

.topbar .dropdown-menu .dropdown-item {
    padding: 7px 1.5rem;
}

.topbar ul.dropdown-user {
    padding: 0px;
    min-width: 270px;
}

.topbar ul.dropdown-user li {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

.topbar ul.dropdown-user li.divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: rgba(120, 130, 140, 0.13);
}

.topbar ul.dropdown-user li .dw-user-box {
    padding: 10px 15px;
}

.topbar ul.dropdown-user li .dw-user-box .u-img {
    width: 50px;
    display: inline-block;
    vertical-align: top;
}

.topbar ul.dropdown-user li .dw-user-box .u-img img {
    width: 100%;
    border-radius: 5px;
}

.topbar ul.dropdown-user li .dw-user-box .u-text {
    display: inline-block;
    padding-left: 10px;
}

.topbar ul.dropdown-user li .dw-user-box .u-text h4 {
    margin: 0px;
    font-size: 15px;
}

.topbar ul.dropdown-user li .dw-user-box .u-text p {
    margin-bottom: 2px;
    font-size: 12px;
}

.topbar ul.dropdown-user li .dw-user-box .u-text .btn {
    color: #ffffff;
    padding: 5px 10px;
    display: inline-block;
}

.topbar ul.dropdown-user li .dw-user-box .u-text .btn:hover {
    background: #e6294b;
}

.topbar ul.dropdown-user li a {
    padding: 9px 15px;
    display: block;
    color: #67757c;
}

.topbar ul.dropdown-user li a:hover {
    background: #f2f4f8;
    color: var(--admin-panel-color);
    text-decoration: none;
}

.search-box .app-search {
    position: absolute;
    margin: 0px;
    display: block;
    z-index: 110;
    width: 100%;
    top: -1px;
    -webkit-box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0px;
}

.search-box .app-search input {
    width: 100.5%;
    padding: 20px 40px 20px 20px;
    border-radius: 0px;
    font-size: 17px;
    -webkit-transition: 0.5s ease-in;
    -o-transition: 0.5s ease-in;
    transition: 0.5s ease-in;
}

.search-box .app-search input:focus {
    border-color: #ffffff;
}

.search-box .app-search .srh-btn {
    position: absolute;
    top: 23px;
    cursor: pointer;
    background: #ffffff;
    width: 15px;
    height: 15px;
    right: 20px;
    font-size: 14px;
}

.mini-sidebar .top-navbar .navbar-header {
    width: 60px;
    text-align: center;
}

.logo-center .top-navbar .navbar-header {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
}

/*******************
 Breadcrumb and page title
*******************/
.page-titles {
    background: #ffffff;
    margin: 0 0px 30px;
    padding: 15px 10px;
    position: relative;
    z-index: 10;
    -webkit-box-shadow: 1px 0 5px rgba(0, 0, 0, 0.1);
    box-shadow: 1px 0 5px rgba(0, 0, 0, 0.1);
}

.page-titles h3 {
    margin-bottom: 0px;
    margin-top: 0px;
    color: #000 !important;
    font-weight: 600;
}

.page-titles .breadcrumb {
    padding: 0px;
    background: transparent;
    font-size: 14px;
}

.page-titles .breadcrumb li {
    margin-top: 0px;
    margin-bottom: 0px;
}

.page-titles .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
    content: "\e649";
    font-family: themify;
    color: #a6b7bf;
    font-size: 11px;
}

.page-titles .breadcrumb .breadcrumb-item.active {
    color: #99abb4;
}

.page-titles h3.text-white {
    color: #fff !important;
}

/*******************
 Right side toggle
*******************/
@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(360deg);
    }
}

@keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.right-side-toggle {
    position: relative;
}

.right-side-toggle i {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 1s;
    transition-property: -webkit-transform;
    -o-transition-property: transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -o-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-animation-name: rotate;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotate;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    animation-name: rotate;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    position: absolute;
    top: 18px;
    left: 18px;
}

.right-sidebar {
    position: fixed;
    right: -240px;
    width: 240px;
    display: none;
    z-index: 1100;
    background: #ffffff;
    top: 0px;
    padding-bottom: 20px;
    height: 100%;
    -webkit-box-shadow: 5px 1px 40px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 1px 40px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.right-sidebar .rpanel-title {
    display: block;
    padding: 19px 20px;
    color: #ffffff;
    text-transform: uppercase;
    font-size: 15px;
    background: var(--admin-panel-color);
}

.right-sidebar .rpanel-title span {
    float: right;
    cursor: pointer;
    font-size: 11px;
}

.right-sidebar .rpanel-title span:hover {
    color: #ffffff;
}

.right-sidebar .r-panel-body {
    padding: 20px;
}

.right-sidebar .r-panel-body ul {
    margin: 0px;
    padding: 0px;
}

.right-sidebar .r-panel-body ul li {
    list-style: none;
    padding: 5px 0;
}

.shw-rside {
    right: 0px;
    width: 240px;
    display: block;
}

.chatonline img {
    margin-right: 10px;
    float: left;
    width: 30px;
}

.chatonline li a {
    padding: 13px 0;
    float: left;
    width: 100%;
}

.chatonline li a span {
    color: #67757c;
}

.chatonline li a span small {
    display: block;
    font-size: 10px;
}

/*******************
 Right side toggle
*******************/
ul#themecolors {
    display: block;
}

ul#themecolors li {
    display: inline-block;
}

ul#themecolors li:first-child {
    display: block;
}

ul#themecolors li a {
    width: 50px;
    height: 50px;
    display: inline-block;
    margin: 5px;
    color: transparent;
    position: relative;
}

ul#themecolors li a.working:before {
    content: "\f00c";
    font-family: "FontAwesome";
    font-size: 18px;
    line-height: 50px;
    width: 50px;
    height: 50px;
    position: absolute;
    top: 0;
    left: 0;
    color: #ffffff;
    text-align: center;
}

.default-theme {
    background: #99abb4;
}

.green-theme {
    background: #26dad2;
}

.yellow-theme {
    background: var(--admin-panel-color);
}

.red-theme {
    background: #ef5350;
}

.blue-theme {
    background: var(--admin-panel-color);
}

.purple-theme {
    background: #ebc51a;
}

.megna-theme {
    background: #00897b;
}

.default-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #99abb4 23%, #99abb4 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #99abb4 23%, #99abb4 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #99abb4), color-stop(99%, #99abb4));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #99abb4 23%, #99abb4 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #99abb4 23%, #99abb4 99%);
}

.green-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #26dad2 23%, #26dad2 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #00c292 23%, #26dad2 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #26dad2), color-stop(99%, #26dad2));
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #26dad2 23%, #26dad2 99%);
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #26dad2 23%, #26dad2 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #26dad2 23%, #26dad2 99%);
}

.yellow-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #ef5350), color-stop(99%, #ef5350));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
}

.blue-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, var(--admin-panel-color) 23%, var(--admin-panel-color) 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, var(--admin-panel-color) 23%, var(--admin-panel-color) 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, var(--admin-panel-color)), color-stop(99%, var(--admin-panel-color)));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, var(--admin-panel-color) 23%, var(--admin-panel-color) 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, var(--admin-panel-color) 23%, var(--admin-panel-color) 99%);
}

.purple-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #ebc51a 23%, #ebc51a 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #ebc51a 23%, #ebc51a 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #ebc51a), color-stop(99%, #ebc51a));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #ebc51a 23%, #ebc51a 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #ebc51a 23%, #ebc51a 99%);
}

.megna-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #00897b 23%, #00897b 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #00897b 23%, #00897b 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #00897b), color-stop(99%, #00897b));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #00897b 23%, #00897b 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #00897b 23%, #00897b 99%);
}

.red-dark-theme {
    background: #263238;
    /* Old browsers */
    background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    /* Chrome10-25,Safari5.1-6 */
    background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #ef5350), color-stop(99%, #ef5350));
    background: -o-linear-gradient(left, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
    background: linear-gradient(to right, #263238 0%, #263238 23%, #ef5350 23%, #ef5350 99%);
}

/*******************
 page title
*******************/
.page-titles {
    padding-bottom: 20px;
}

/*******************
 Footer
*******************/
.footer {
    bottom: 0;
    color: #67757c;
    left: 0px;
    padding: 10px;
    position: absolute;
    right: 0;
    background: #ffffff;
}

/*******************
 Card title
*******************/
.card {
    margin-bottom: 30px;
}

.card .card-subtitle {
    font-weight: 300;
    margin-bottom: 15px;
    color: #99abb4;
}

.card-inverse .card-bodyquote .blockquote-footer,
.card-inverse .card-link,
.card-inverse .card-subtitle,
.card-inverse .card-text {
    color: rgba(255, 255, 255, 0.65);
}

.card-success {
    background: #26dad2;
    border-color: #26dad2;
}

.card-danger {
    background: #ef5350;
    border-color: #ef5350;
}

.card-warning {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-info {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-primary {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-dark {
    background: #2f3d4a;
    border-color: #2f3d4a;
}

.card-megna {
    background: #00897b;
    border-color: #00897b;
}

/*==============================================================
 Buttons page
 ============================================================== */
.button-group .btn {
    margin-bottom: 5px;
    margin-right: 5px;
}

.no-button-group .btn {
    margin-bottom: 5px;
    margin-right: 0px;
}

.btn .text-active {
    display: none;
}

.btn.active .text-active {
    display: inline-block;
}

.btn.active .text {
    display: none;
}

/*==============================================================
 Cards page
 ============================================================== */
.card-actions {
    float: right;
}

.card-actions a {
    cursor: pointer;
    color: #67757c;
    opacity: 0.7;
    padding-left: 7px;
    font-size: 13px;
}

.card-actions a:hover {
    opacity: 1;
}

.card-columns .card {
    margin-bottom: 20px;
}

.collapsing {
    -webkit-transition: height .08s ease;
    -o-transition: height .08s ease;
    transition: height .08s ease;
}

.card-info {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-primary {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-outline-info {
    border-color: var(--admin-panel-color);
}

.card-outline-info .card-header {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-outline-inverse {
    border-color: #2f3d4a;
}

.card-outline-inverse .card-header {
    background: #2f3d4a;
    border-color: #2f3d4a;
}

.card-outline-warning {
    border-color: var(--admin-panel-color);
}

.card-outline-warning .card-header {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.card-outline-success {
    border-color: #26dad2;
}

.card-outline-success .card-header {
    background: #26dad2;
    border-color: #26dad2;
}

.card-outline-danger {
    border-color: #ef5350;
}

.card-outline-danger .card-header {
    background: #ef5350;
    border-color: #ef5350;
}

.card-outline-primary {
    border-color: var(--admin-panel-color);
}

.card-outline-primary .card-header {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

/*==============================================================
Breadcrumb
 ============================================================== */
.bc-colored .breadcrumb-item,
.bc-colored .breadcrumb-item a {
    color: #ffffff;
}

.bc-colored .breadcrumb-item.active,
.bc-colored .breadcrumb-item a.active {
    opacity: 0.7;
}

.bc-colored .breadcrumb-item+.breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.4);
}

.breadcrumb {
    margin-bottom: 0px;
}

/*==============================================================
 Ui-bootstrap
 ============================================================== */
ul.list-icons {
    margin: 0px;
    padding: 0px;
}

ul.list-icons li {
    list-style: none;
    line-height: 30px;
    margin: 5px 0;
    -webkit-transition: 0.2s ease-in;
    -o-transition: 0.2s ease-in;
    transition: 0.2s ease-in;
}

ul.list-icons li a {
    color: #67757c;
}

ul.list-icons li a:hover {
    color: var(--admin-panel-color);
}

ul.list-icons li i {
    font-size: 13px;
    padding-right: 8px;
}

ul.list-inline li {
    display: inline-block;
    padding: 0 8px;
}

ul.two-part {
    margin: 0px;
}

ul.two-part li {
    width: 48.8%;
}

/*Accordion*/
html body .accordion .card {
    margin-bottom: 0px;
}

/*==============================================================
 flot chart
 ============================================================== */
.flot-chart {
    display: block;
    height: 400px;
}

.flot-chart-content {
    width: 100%;
    height: 100%;
}

html body .jqstooltip,
html body .flotTip {
    width: auto !important;
    height: auto !important;
    background: #263238;
    color: #ffffff;
    padding: 5px 10px;
}

body .jqstooltip {
    border-color: transparent;
    border-radius: 60px;
}

/*==============================================================
Easy pie chart
 ============================================================== */
.chart {
    position: relative;
    display: inline-block;
    width: 100px;
    height: 100px;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}

.chart canvas {
    position: absolute;
    top: 0;
    left: 0;
}

.chart.chart-widget-pie {
    margin-top: 5px;
    margin-bottom: 5px;
}

.pie-chart>span {
    left: 0;
    margin-top: -2px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.chart>span>img {
    left: 0;
    margin-top: -2px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    width: 60%;
    height: 60%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin: 0 auto;
}

.percent {
    display: inline-block;
    line-height: 100px;
    z-index: 2;
    font-weight: 600;
    font-size: 18px;
    color: #263238;
}

.percent:after {
    content: '%';
    margin-left: 0.1em;
    font-size: .8em;
}

/*==============================================================
Dashboard1 chart
 ============================================================== */
.ct-charts {
    position: relative;
}

.amp-pxl {
    position: relative;
}

.amp-pxl .ct-series-a .ct-bar {
    stroke: var(--admin-panel-color);
}

.amp-pxl .ct-series-b .ct-bar {
    stroke: #26dad2;
}

.c3-chart-arcs-title,
.c3-legend-item {
    font-family: "Poppins", sans-serif;
    fill: #67757c;
}

html body #visitor .c3-chart-arcs-title {
    font-size: 18px;
    fill: #99abb4;
}

.stylish-table thead th {
    font-weight: 400;
    color: #99abb4;
    border: 0px;
    border-bottom: 1px;
}

.stylish-table tbody tr {
    border-left: 4px solid #ffffff;
}

.stylish-table tbody tr:hover,
.stylish-table tbody tr.active {
    border-left: 4px solid var(--admin-panel-color);
}

.stylish-table tbody td {
    vertical-align: middle;
}

.stylish-table tbody td h6 {
    font-weight: 500;
    margin-bottom: 0px;
    white-space: nowrap;
}

.stylish-table tbody td small {
    line-height: 12px;
    white-space: nowrap;
}

.orders-tracking-item-details>div {
    padding-bottom: 3px;
    font-size: 13px;
}

.orders-tracking-item-details .variant-info ul li span.label {
    font-weight: 600;
    padding: 10;
    padding-right: 10px;
}

.orders-tracking-item-details .variant-info ul li span {
    color: #333;
    font-size: 14px;
    text-transform: capitalize;
}

.orders-tracking-item-details .variant-info ul li {
    text-align: left;
    padding-bottom: 0;
    display: inline-block;
    padding-right: 5px;
    border-right: 1px solid #ccc;
    margin-right: 5px;
}

.orders-tracking-item-details .variant-info ul li span.value {
    padding: 2px 5px;
    border: 1px solid #ccc;
    border-radius: 3px;
    background: #ececec;
}

.orders-tracking-item-details .variant-info ul li span {
    color: #333;
    font-size: 14px;
    text-transform: capitalize;
}

.orders-tracking-item-details .variant-info ul {
    padding: 0;
    list-style-type: none;
    margin: 0;
}

.orders-tracking-item-details .variant-info ul li:last-child {
    border: 0;
}

/*==============================================================
Dashboard2 chart
 ============================================================== */
.campaign {
    height: 280px;
}

.campaign .ct-series-a .ct-area {
    fill-opacity: 0.2;
    fill: url(#gradient);
}

.campaign .ct-series-a .ct-line,
.campaign .ct-series-a .ct-point {
    stroke: #26dad2;
    stroke-width: 2px;
}

.campaign .ct-series-b .ct-area {
    fill: var(--admin-panel-color);
    fill-opacity: 0.1;
}

.campaign .ct-series-b .ct-line,
.campaign .ct-series-b .ct-point {
    stroke: var(--admin-panel-color);
    stroke-width: 2px;
}

.campaign .ct-series-a .ct-point,
.campaign .ct-series-b .ct-point {
    stroke-width: 6px;
}

.campaign2 .ct-series-a .ct-area {
    fill-opacity: 0.2;
    fill: url(#gradient);
}

.campaign2 .ct-series-a .ct-line,
.campaign2 .ct-series-a .ct-point {
    stroke: #26dad2;
    stroke-width: 2px;
}

.campaign2 .ct-series-b .ct-area {
    fill: var(--admin-panel-color);
    fill-opacity: 0.1;
}

.campaign2 .ct-series-b .ct-line,
.campaign2 .ct-series-b .ct-point {
    stroke: var(--admin-panel-color);
    stroke-width: 2px;
}

.campaign2 .ct-series-a .ct-point,
.campaign2 .ct-series-b .ct-point {
    stroke-width: 6px;
}

.usage .ct-series-a .ct-line {
    stroke-width: 3px;
    stroke: rgba(255, 255, 255, 0.5);
}

/*==============================================================
Dashboard3 chart
 ============================================================== */
.total-sales {
    position: relative;
}

.total-sales .chartist-tooltip {
    background: #2f3d4a;
}

.total-sales .ct-series-a .ct-bar {
    stroke: var(--admin-panel-color);
}

.total-sales .ct-series-b .ct-bar {
    stroke: #26dad2;
}

.total-sales .ct-series-c .ct-bar {
    stroke: #ef5350;
}

.ct-chart {
    position: relative;
}

.ct-chart .ct-series-a .ct-slice-donut {
    stroke: #26dad2;
}

.ct-chart .ct-series-b .ct-slice-donut {
    stroke: #f2f4f8;
}

.ct-chart .ct-series-c .ct-slice-donut {
    stroke: var(--admin-panel-color);
}

#visitfromworld path.jvectormap-region.jvectormap-element {
    stroke-width: 1px;
    stroke: #99abb4;
}

.jvectormap-zoomin,
.jvectormap-zoomout,
.jvectormap-goback {
    background: #99abb4;
}

.browser td {
    vertical-align: middle;
    padding-left: 0px;
}

#calendar .fc-today-button {
    display: none;
}

.calender-sidebar {
    background: rgba(0, 0, 0, 0.02);
}

/*==============================================================
Dashboard4 chart
 ============================================================== */
.ecomm-donute svg text {
    font-family: "Poppins", sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

.total-revenue4 {
    position: relative;
}

.total-revenue4 .ct-series-a .ct-line {
    stroke: var(--admin-panel-color);
    stroke-width: 1px;
}

.total-revenue4 .ct-series-a .ct-point {
    stroke: var(--admin-panel-color);
    stroke-width: 5px;
}

.total-revenue4 .ct-series-b .ct-line {
    stroke: #26dad2;
    stroke-width: 1px;
}

.total-revenue4 .ct-series-b .ct-point {
    stroke: #26dad2;
    stroke-width: 5px;
}

.total-revenue4 .ct-series-a .ct-area {
    fill: var(--admin-panel-color);
    fill-opacity: 0.2;
}

.total-revenue4 .ct-series-b .ct-area {
    fill: #26dad2;
    fill-opacity: 0.2;
}

/*==============================================================
Dashboard6 chart
 ============================================================== */
.product-overview.table tbody tr td {
    vertical-align: middle;
}

/*==============================================================
Widget-data
 ============================================================== */
.sparkchart {
    margin-bottom: -2px;
}

/*==============================================================
File upload
 ============================================================== */
.btn-file {
    overflow: hidden;
    position: relative;
    vertical-align: middle;
}

.btn-file>input {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
    filter: alpha(opacity=0);
    font-size: 23px;
    height: 100%;
    width: 100%;
    direction: ltr;
    cursor: pointer;
    border-radius: 0px;
}

.fileinput .input-group-addon {
    border: none;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    background: #ffffff;
    margin-bottom: 1px;
}

.fileinput .form-control {
    padding-top: 7px;
    padding-bottom: 5px;
    display: inline-block;
    margin-bottom: 0px;
    vertical-align: middle;
    cursor: text;
}

.fileinput .thumbnail {
    overflow: hidden;
    display: inline-block;
    margin-bottom: 5px;
    vertical-align: middle;
    text-align: center;
}

.fileinput .thumbnail>img {
    max-height: 100%;
}

.fileinput .btn {
    vertical-align: middle;
}

.fileinput-exists .fileinput-new,
.fileinput-new .fileinput-exists {
    display: none;
}

.fileinput-inline .fileinput-controls {
    display: inline;
}

.fileinput-filename {
    vertical-align: middle;
    display: inline-block;
    overflow: hidden;
}

.form-control .fileinput-filename {
    vertical-align: bottom;
}

.fileinput.input-group>* {
    position: relative;
    z-index: 2;
}

.fileinput.input-group>.btn-file {
    z-index: 1;
}

/*==============================================================
widget-chart-page product review
 ============================================================== */
.product-review {
    margin: 0px;
    padding: 25px;
}

.product-review li {
    display: block;
    padding: 20px 0;
    list-style: none;
}

.product-review li .font,
.product-review li span {
    display: inline-block;
    margin-left: 10px;
}

.social-profile {
    text-align: center;
    background: rgba(7, 10, 43, 0.8);
}

.profile-tab li a.nav-link,
.customtab li a.nav-link {
    border: 0px;
    padding: 15px 20px;
    color: #67757c;
}

.profile-tab li a.nav-link.active,
.customtab li a.nav-link.active {
    border-bottom: 2px solid var(--admin-panel-color);
    color: var(--admin-panel-color);
}

.profile-tab li a.nav-link:hover,
.customtab li a.nav-link:hover {
    color: var(--admin-panel-color);
}

/*==============================================================
Form addons page
============================================================== */
/*Bootstrap select*/
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
    width: 100%;
}

.bootstrap-select .dropdown-menu li a {
    display: block;
    padding: 7px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #67757c;
    white-space: nowrap;
}

.bootstrap-select .dropdown-menu li a:hover,
.bootstrap-select .dropdown-menu li a:focus {
    color: var(--admin-panel-color);
    background: #f2f4f8;
}

.bootstrap-select .show>.dropdown-menu {
    display: block;
}

.bootstrap-select .dropdown-toggle.bs-placeholder:hover {
    color: #ffffff;
}

.bootstrap-touchspin .input-group-btn-vertical>.btn {
    padding: 9px 10px;
}

.select2-container--default .select2-selection--single {
    border-color: #b1b8bb;
    height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 33px;
}

.input-form .btn {
    padding: 8px 12px;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered,
.select2-container--default .select2-search--inline .select2-search__field {
    padding: 0 5px;
}

/*==============================================================
Form Material page
 ============================================================== */
/*Material inputs*/
.form-material .form-group {
    overflow: hidden;
}

.form-material .form-control {
    background-color: transparent;
    background-position: center bottom, center calc(100% - 1px);
    background-repeat: no-repeat;
    background-size: 0 2px, 100% 1px;
    padding: 0;
    -webkit-transition: background 0s ease-out 0s;
    -o-transition: background 0s ease-out 0s;
    transition: background 0s ease-out 0s;
}

.form-material .form-control,
.form-material .form-control.focus,
.form-material .form-control:focus {
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(rgba(120, 130, 140, 0.13)), to(rgba(120, 130, 140, 0.13)));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
    border: 0 none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    float: none;
}

.form-material .form-control.focus,
.form-material .form-control:focus {
    background-size: 100% 2px, 100% 1px;
    outline: 0 none;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.form-control-line .form-group {
    overflow: hidden;
}

.form-control-line .form-control {
    border: 0px;
    border-radius: 0px;
    padding-left: 0px;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.form-control-line .form-control:focus {
    border-bottom: 1px solid var(--admin-panel-color);
}

/*******************/
/*Floating Label*/
/*******************/
.floating-labels .form-group {
    position: relative;
}

.floating-labels .form-control {
    padding: 10px 10px 10px 0;
    display: block;
    border: none;
    font-family: "Poppins", sans-serif;
    border-radius: 0px;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.floating-labels .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}

.floating-labels select.form-control>option {
    font-size: 14px;
}

.floating-labels .has-error .form-control {
    border-bottom: 1px solid #ef5350;
}

.floating-labels .has-warning .form-control {
    border-bottom: 1px solid var(--admin-panel-color);
}

.floating-labels .has-success .form-control {
    border-bottom: 1px solid #26dad2;
}

.floating-labels .form-control:focus {
    outline: none;
    border: none;
}

.floating-labels label {
    color: #67757c;
    position: absolute;
    cursor: auto;
    top: 5px;
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

.floating-labels .focused label {
    top: -20px;
    font-size: 12px;
    color: #263238;
}

.floating-labels .bar {
    position: relative;
    display: block;
}

.floating-labels .bar:before,
.floating-labels .bar:after {
    content: '';
    height: 2px;
    width: 0;
    bottom: 1px;
    position: absolute;
    background: var(--admin-panel-color);
    -o-transition: 0.2s ease all;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all;
}

.floating-labels .bar:before {
    left: 50%;
}

.floating-labels .bar:after {
    right: 50%;
}

.floating-labels .form-control:focus~.bar:before,
.floating-labels .form-control:focus~.bar:after {
    width: 50%;
}

.floating-labels .highlight {
    position: absolute;
    height: 60%;
    width: 100px;
    top: 25%;
    left: 0;
    pointer-events: none;
    opacity: 0.5;
}

.floating-labels .input-lg~label,
.floating-labels .input-lg {
    font-size: 24px;
}

.floating-labels .input-sm~label,
.floating-labels .input-sm {
    font-size: 16px;
}

.has-warning .bar:before,
.has-warning .bar:after {
    background: var(--admin-panel-color);
}

.has-success .bar:before,
.has-success .bar:after {
    background: #26dad2;
}

.has-error .bar:before,
.has-error .bar:after {
    background: #ef5350;
}

.has-warning .form-control:focus~label,
.has-warning .form-control:valid~label {
    color: var(--admin-panel-color);
}

.has-success .form-control:focus~label,
.has-success .form-control:valid~label {
    color: #26dad2;
}

.has-error .form-control:focus~label,
.has-error .form-control:valid~label {
    color: #ef5350;
}

.has-feedback label~.t-0 {
    top: 0;
}

.form-group.error input,
.form-group.error select,
.form-group.error textarea {
    border: 1px solid #ef5350;
}

.form-group.validate input,
.form-group.validate select,
.form-group.validate textarea {
    border: 1px solid #26dad2;
}

.form-group.error .help-block ul {
    padding: 0px;
    color: #ef5350;
}

.form-group.error .help-block ul li {
    list-style: none;
}

.form-group.issue .help-block ul {
    padding: 0px;
    color: var(--admin-panel-color);
}

.form-group.issue .help-block ul li {
    list-style: none;
}

/*******************
Pagination
******************/
.pagination-circle li.active a {
    background: #26dad2;
}

.pagination-circle li a {
    width: 40px;
    height: 40px;
    background: #f2f4f8;
    border: 0px;
    text-align: center;
    border-radius: 100%;
}

.pagination-circle li a:first-child,
.pagination-circle li a:last-child {
    border-radius: 100%;
}

.pagination-circle li a:hover {
    background: #26dad2;
    color: #ffffff;
}

.pagination-circle li.disabled a {
    background: #f2f4f8;
    color: rgba(120, 130, 140, 0.13);
}

/*******************
Form Dropzone
******************/
.dropzone {
    border: 1px dashed #b1b8bb;
}

.dropzone .dz-message {
    padding: 5% 0;
    margin: 0px;
}

/*******************
Form Pickers
******************/
.asColorPicker-dropdown {
    max-width: 260px;
}

.asColorPicker-trigger {
    position: absolute;
    top: 0;
    right: -35px;
    height: 38px;
    width: 37px;
    border: 0;
}

.asColorPicker-clear {
    display: none;
    position: absolute;
    top: 5px;
    right: 10px;
    text-decoration: none;
}

table th {
    font-weight: 400;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: var(--admin-panel-color);
}

.datepicker table tr td.today,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today:hover {
    background: var(--admin-panel-color);
    color: #ffffff;
}

.datepicker td,
.datepicker th {
    padding: 5px 10px;
}

/*******************
Form icheck
******************/
.icolors,
.icheck-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.icolors>li {
    padding: 0;
    margin: 2px;
    float: left;
    display: inline-block;
    height: 30px;
    width: 30px;
    background: #263238;
    text-align: center;
}

.icolors>li.active:after {
    content: "\2713 ";
    color: #ffffff;
    line-height: 30px;
}

.icolors>li:first-child {
    margin-left: 0;
}

.icolors>li.orange {
    background: #ef5350;
}

.icolors>li.yellow {
    background: var(--admin-panel-color);
}

.icolors>li.info {
    background: var(--admin-panel-color);
}

.icolors>li.green {
    background: #26dad2;
}

.icolors>li.red {
    background: #fb3a3a;
}

.icolors>li.purple {
    background: #ebc51a;
}

.icolors>li.blue {
    background: #02bec9;
}

.icheck-list {
    float: left;
    padding-right: 50px;
    padding-top: 10px;
}

.icheck-list li {
    padding-bottom: 5px;
}

.icheck-list li label {
    padding-left: 10px;
}

/*******************
Form summernote
******************/
.note-popover,
.note-icon-caret {
    display: none;
}

.note-editor.note-frame {
    border: 1px solid #b1b8bb;
}

.note-editor.note-frame .panel-heading {
    padding: 6px 10px 10px;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.label {
    display: inline-block;
}

/*******************
Table-Layout
******************/
.table thead th,
.table th {
    border-bottom: 0px;
}

.color-table.primary-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.table-striped tbody tr:nth-of-type(odd) {
    background: none;
}

.table-hover tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.01);
}

.color-table.success-table thead th {
    background-color: #26dad2;
    color: #ffffff;
}

.color-table.info-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.color-table.warning-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.color-table.danger-table thead th {
    background-color: #ef5350;
    color: #ffffff;
}

.color-table.inverse-table thead th {
    background-color: #2f3d4a;
    color: #ffffff;
}

.color-table.dark-table thead th {
    background-color: #263238;
    color: #ffffff;
}

.color-table.red-table thead th {
    background-color: #fb3a3a;
    color: #ffffff;
}

.color-table.purple-table thead th {
    background-color: #ebc51a;
    color: #ffffff;
}

.color-table.muted-table thead th {
    background-color: #99abb4;
    color: #ffffff;
}

.color-bordered-table.primary-bordered-table {
    border: 2px solid var(--admin-panel-color);
}

.color-bordered-table.primary-bordered-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.color-bordered-table.success-bordered-table {
    border: 2px solid #26dad2;
}

.color-bordered-table.success-bordered-table thead th {
    background-color: #26dad2;
    color: #ffffff;
}

.color-bordered-table.info-bordered-table {
    border: 2px solid var(--admin-panel-color);
}

.color-bordered-table.info-bordered-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.color-bordered-table.warning-bordered-table {
    border: 2px solid var(--admin-panel-color);
}

.color-bordered-table.warning-bordered-table thead th {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.color-bordered-table.danger-bordered-table {
    border: 2px solid #ef5350;
}

.color-bordered-table.danger-bordered-table thead th {
    background-color: #ef5350;
    color: #ffffff;
}

.color-bordered-table.inverse-bordered-table {
    border: 2px solid #2f3d4a;
}

.color-bordered-table.inverse-bordered-table thead th {
    background-color: #2f3d4a;
    color: #ffffff;
}

.color-bordered-table.dark-bordered-table {
    border: 2px solid #263238;
}

.color-bordered-table.dark-bordered-table thead th {
    background-color: #263238;
    color: #ffffff;
}

.color-bordered-table.red-bordered-table {
    border: 2px solid #fb3a3a;
}

.color-bordered-table.red-bordered-table thead th {
    background-color: #fb3a3a;
    color: #ffffff;
}

.color-bordered-table.purple-bordered-table {
    border: 2px solid #ebc51a;
}

.color-bordered-table.purple-bordered-table thead th {
    background-color: #ebc51a;
    color: #ffffff;
}

.color-bordered-table.muted-bordered-table {
    border: 2px solid #99abb4;
}

.color-bordered-table.muted-bordered-table thead th {
    background-color: #99abb4;
    color: #ffffff;
}

.full-color-table.full-primary-table {
    background-color: #f1effd;
}

.full-color-table.full-primary-table thead th {
    background-color: var(--admin-panel-color);
    border: 0;
    color: #ffffff;
}

.full-color-table.full-primary-table tbody td {
    border: 0;
}

.full-color-table.full-primary-table tr:hover {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.full-color-table.full-success-table {
    background-color: #e8fdeb;
}

.full-color-table.full-success-table thead th {
    background-color: #26dad2;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-success-table tbody td {
    border: 0;
}

.full-color-table.full-success-table tr:hover {
    background-color: #26dad2;
    color: #ffffff;
}

.full-color-table.full-info-table {
    background-color: #cfecfe;
}

.full-color-table.full-info-table thead th {
    background-color: var(--admin-panel-color);
    border: 0;
    color: #ffffff;
}

.full-color-table.full-info-table tbody td {
    border: 0;
}

.full-color-table.full-info-table tr:hover {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.full-color-table.full-warning-table {
    background-color: #fff8ec;
}

.full-color-table.full-warning-table thead th {
    background-color: var(--admin-panel-color);
    border: 0;
    color: #ffffff;
}

.full-color-table.full-warning-table tbody td {
    border: 0;
}

.full-color-table.full-warning-table tr:hover {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.full-color-table.full-danger-table {
    background-color: #f9e7eb;
}

.full-color-table.full-danger-table thead th {
    background-color: #ef5350;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-danger-table tbody td {
    border: 0;
}

.full-color-table.full-danger-table tr:hover {
    background-color: #ef5350;
    color: #ffffff;
}

.full-color-table.full-inverse-table {
    background-color: #f6f6f6;
}

.full-color-table.full-inverse-table thead th {
    background-color: #2f3d4a;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-inverse-table tbody td {
    border: 0;
}

.full-color-table.full-inverse-table tr:hover {
    background-color: #2f3d4a;
    color: #ffffff;
}

.full-color-table.full-dark-table {
    background-color: rgba(43, 43, 43, 0.8);
}

.full-color-table.full-dark-table thead th {
    background-color: #263238;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-dark-table tbody td {
    border: 0;
    color: #ffffff;
}

.full-color-table.full-dark-table tr:hover {
    background-color: #263238;
    color: #ffffff;
}

.full-color-table.full-red-table {
    background-color: #f9e7eb;
}

.full-color-table.full-red-table thead th {
    background-color: #fb3a3a;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-red-table tbody td {
    border: 0;
}

.full-color-table.full-red-table tr:hover {
    background-color: #fb3a3a;
    color: #ffffff;
}

.full-color-table.full-purple-table {
    background-color: #f1effd;
}

.full-color-table.full-purple-table thead th {
    background-color: #ebc51a;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-purple-table tbody td {
    border: 0;
}

.full-color-table.full-purple-table tr:hover {
    background-color: #ebc51a;
    color: #ffffff;
}

.full-color-table.full-muted-table {
    background-color: rgba(152, 166, 173, 0.2);
}

.full-color-table.full-muted-table thead th {
    background-color: #99abb4;
    border: 0;
    color: #ffffff;
}

.full-color-table.full-muted-table tbody td {
    border: 0;
}

.full-color-table.full-muted-table tr:hover {
    background-color: #99abb4;
    color: #ffffff;
}

/*******************
Table-Data Table
******************/
.dataTables_wrapper {
    padding-top: 10px;
}

.dt-buttons {
    display: inline-block;
    padding-top: 5px;
}

.dt-buttons .dt-button {
    padding: 5px 15px;
    border-radius: 4px;
    background: var(--admin-panel-color);
    color: #ffffff;
    margin-right: 3px;
}

.dt-buttons .dt-button:hover {
    background: #2f3d4a;
}

.dataTables_info,
.dataTables_length {
    display: inline-block;
}

.dataTables_length {
    margin-top: 10px;
}

.dataTables_length select {
    border: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    -webkit-transition: background 0s ease-out;
    -o-transition: background 0s ease-out;
    transition: background 0s ease-out;
    padding-bottom: 5px;
}

.dataTables_length select:focus {
    outline: none;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 100% 2px, 100% 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.dataTables_filter {
    float: right;
    margin-top: 10px;
}

.dataTables_filter input {
    border: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    -webkit-transition: background 0s ease-out;
    -o-transition: background 0s ease-out;
    transition: background 0s ease-out;
    float: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    margin-left: 10px;
}

.dataTables_filter input:focus {
    outline: none;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 100% 2px, 100% 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background: transparent;
}

table.dataTable thead .sorting_asc:after {
    content: "\f0de";
    margin-left: 10px;
    font-family: fontawesome;
    cursor: pointer;
}

table.dataTable thead .sorting_desc:after {
    content: "\f0dd";
    margin-left: 10px;
    font-family: fontawesome;
    cursor: pointer;
}

table.dataTable thead .sorting:after {
    content: "\f0dc";
    margin-left: 10px;
    font-family: fontawesome !important;
    cursor: pointer;
    color: rgba(50, 50, 50, 0.5);
}

.dataTables_wrapper .dataTables_paginate {
    float: right;
    text-align: right;
    padding-top: 0.25em;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.5em 1em;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    color: #67757c;
    border: 1px solid #ddd;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    color: #ffffff !important;
    border: 1px solid var(--admin-panel-color);
    background-color: var(--admin-panel-color);
}

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    cursor: default;
    color: #67757c;
    border: 1px solid #ddd;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    color: white;
    border: 1px solid var(--admin-panel-color);
    background-color: var(--admin-panel-color);
}

.dataTables_wrapper .dataTables_paginate .paginate_button:active {
    outline: none;
    background-color: #67757c;
}

.dataTables_wrapper .dataTables_paginate .ellipsis {
    padding: 0 1em;
}

/*******************
Table- responsive
******************/
.tablesaw-bar .btn-group label {
    color: #67757c !important;
}

/*******************
Table- editable table
******************/
.dt-bootstrap {
    display: block;
}

.paging_simple_numbers .pagination .paginate_button {
    padding: 0px;
    background: #ffffff;
}

.paging_simple_numbers .pagination .paginate_button:hover {
    background: #ffffff;
}

.paging_simple_numbers .pagination .paginate_button a {
    padding: 2px 10px;
    border: 0px;
}

.paging_simple_numbers .pagination .paginate_button.active a,
.paging_simple_numbers .pagination .paginate_button:hover a {
    background: var(--admin-panel-color);
    color: #ffffff;
}

/*******************
Table- Footable
******************/
#demo-show-entries {
    border: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    -webkit-transition: background 0s ease-out;
    -o-transition: background 0s ease-out;
    transition: background 0s ease-out;
    padding-bottom: 5px;
    color: #67757c;
}

#demo-show-entries:focus {
    outline: none;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 100% 2px, 100% 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

#demo-input-search2 {
    border: 0;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 0 2px, 100% 1px;
    background-repeat: no-repeat;
    background-position: center bottom, center calc(100% - 1px);
    background-color: transparent;
    -webkit-transition: background 0s ease-out;
    -o-transition: background 0s ease-out;
    transition: background 0s ease-out;
    float: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    margin-left: 10px;
    color: #67757c;
}

#demo-input-search2:focus {
    outline: none;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(#b1b8bb, #b1b8bb);
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(#b1b8bb, #b1b8bb);
    background-size: 100% 2px, 100% 1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.footable .pagination li a {
    position: relative;
    display: block;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #0275d8;
    background-color: #ffffff;
    border: 1px solid #ddd;
}

.footable .pagination li.active a {
    z-index: 2;
    color: #fff;
    background-color: #0275d8;
    border-color: #0275d8;
}

.footable .pagination li.disabled a {
    color: #636c72;
    pointer-events: none;
    cursor: not-allowed;
    background-color: #ffffff;
    border-color: #ddd;
}

.footable .pagination li:first-child a {
    margin-left: 0;
    border-bottom-left-radius: .25rem;
    border-top-left-radius: .25rem;
}

.footable-odd {
    background: #f2f4f8;
}

/*******************
Icon list fontawesom
******************/
.icon-list-demo div {
    cursor: pointer;
    line-height: 60px;
    white-space: nowrap;
    color: #67757c;
}

.icon-list-demo div:hover {
    color: #263238;
}

.icon-list-demo div p {
    margin: 10px 0;
    padding: 5px 0;
}

.icon-list-demo i {
    -webkit-transition: all 0.2s;
    -webkit-transition: font-size .2s;
    display: inline-block;
    font-size: 18px;
    margin: 0 15px 0 10px;
    text-align: left;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    -o-transition: font-size .2s;
    transition: font-size .2s;
    vertical-align: middle;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.icon-list-demo .col-md-4,
.icon-list-demo .col-3 {
    border-radius: 4px;
}

.icon-list-demo .col-md-4:hover,
.icon-list-demo .col-3:hover {
    background-color: #ebf3f5;
}

.icon-list-demo .div:hover i {
    font-size: 2em;
}

/*******************
Icon list material icon
******************/
.material-icon-list-demo .mdi {
    font-size: 21px;
}

/*******************
Gridstack Dragable portlet
******************/
.grid-stack-item-content {
    background: #fff;
    color: #2b2b2b;
    text-align: center;
    font-size: 20px;
}

.grid-stack>.grid-stack-item>.grid-stack-item-content {
    border: 1px solid rgba(120, 130, 140, 0.13);
}

/*******************
Bootstrap Switch
******************/
.bootstrap-switch,
.bootstrap-switch .bootstrap-switch-container {
    border-radius: 2px;
}

.bootstrap-switch .bootstrap-switch-handle-on {
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
}

.bootstrap-switch .bootstrap-switch-handle-off {
    border-bottom-right-radius: 2px;
    border-top-right-radius: 2px;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary {
    color: #ffffff;
    background: var(--admin-panel-color);
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
    color: #ffffff;
    background: var(--admin-panel-color);
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success {
    color: #ffffff;
    background: #26dad2;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-warning,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-warning {
    color: #ffffff;
    background: var(--admin-panel-color);
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-danger,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-danger {
    color: #ffffff;
    background: #ef5350;
}

.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default {
    color: #263238;
    background: #f2f4f8;
}

.onoffswitch {
    position: relative;
    width: 90px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border: 2px solid #26dad2;
    border-radius: 20px;
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    -webkit-transition: margin 0.3s ease-in 0s;
    -o-transition: margin 0.3s ease-in 0s;
    transition: margin 0.3s ease-in 0s;
}

.onoffswitch-inner:before,
.onoffswitch-inner:after {
    display: block;
    float: left;
    width: 50%;
    height: 30px;
    padding: 0;
    line-height: 30px;
    font-size: 14px;
    color: white;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.onoffswitch-inner:before {
    content: "ON";
    padding-left: 27px;
    background-color: #26dad2;
    color: #FFFFFF;
}

.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 24px;
    background-color: #EEEEEE;
    color: #999999;
    text-align: right;
}

.onoffswitch-switch {
    display: block;
    width: 23px;
    margin: 6px;
    background: #FFFFFF;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 56px;
    border: 2px solid #26dad2;
    border-radius: 20px;
    -webkit-transition: all 0.3s ease-in 0s;
    -o-transition: all 0.3s ease-in 0s;
    transition: all 0.3s ease-in 0s;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
    right: 0px;
}

/*******************
Date paginator page
******************/
.dp-selected[style] {
    background-color: var(--admin-panel-color) !important;
}

.datepaginator-sm .pagination li a,
.datepaginator-lg .pagination li a,
.datepaginator .pagination li a {
    padding: 0 5px;
    height: 60px;
    border: 1px solid rgba(120, 130, 140, 0.13);
    float: left;
    position: relative;
}

/*******************
sweet alert page
******************/
.model_img {
    cursor: pointer;
}

/*******************
Grid page
******************/
.show-grid {
    margin-bottom: 10px;
    padding: 0 15px;
}

.show-grid [class^=col-] {
    padding-top: 10px;
    padding-bottom: 10px;
    border: 1px solid #b1b8bb;
    background-color: #f2f4f8;
}

/*******************
Vertical tabs
******************/
.vtabs {
    display: table;
}

.vtabs .tabs-vertical {
    width: 150px;
    border-bottom: 0px;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
    display: table-cell;
    vertical-align: top;
}

.vtabs .tabs-vertical li .nav-link {
    color: #263238;
    margin-bottom: 10px;
    border: 0px;
    border-radius: 4px 0 0 4px;
}

.vtabs .tab-content {
    display: table-cell;
    padding: 20px;
    vertical-align: top;
}

.tabs-vertical li .nav-link.active,
.tabs-vertical li .nav-link:hover,
.tabs-vertical li .nav-link.active:focus {
    background: var(--admin-panel-color);
    border: 0px;
    color: #ffffff;
}

/*Custom vertical tab*/
.customvtab .tabs-vertical li .nav-link.active,
.customvtab .tabs-vertical li .nav-link:hover,
.customvtab .tabs-vertical li .nav-link:focus {
    background: #ffffff;
    border: 0px;
    border-right: 2px solid var(--admin-panel-color);
    margin-right: -1px;
    color: var(--admin-panel-color);
}

.tabcontent-border {
    border: 1px solid #ddd;
    border-top: 0px;
}

.customtab2 li a.nav-link {
    border: 0px;
    margin-right: 3px;
    color: #67757c;
}

.customtab2 li a.nav-link.active {
    background: var(--admin-panel-color);
    color: #ffffff;
}

.customtab2 li a.nav-link:hover {
    color: #ffffff;
    background: var(--admin-panel-color);
}

/*******************
Progress bar
******************/
.progress.active .progress-bar,
.progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
}

.progress-vertical {
    min-height: 250px;
    height: 250px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
}

.progress-vertical-bottom {
    min-height: 250px;
    height: 250px;
    position: relative;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 20px;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}

.progress-animated {
    -webkit-animation-duration: 5s;
    -webkit-animation-name: myanimation;
    -webkit-transition: 5s all;
    animation-duration: 5s;
    animation-name: myanimation;
    -o-transition: 5s all;
    transition: 5s all;
}

@-webkit-keyframes myanimation {
    from {
        width: 0;
    }
}

@keyframes myanimation {
    from {
        width: 0;
    }
}

/*******************
Notification page Jquery toaster
******************/
.jq-icon-info {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.jq-icon-success {
    background-color: #26dad2;
    color: #ffffff;
}

.jq-icon-error {
    background-color: #ef5350;
    color: #ffffff;
}

.jq-icon-warning {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.alert-rounded {
    border-radius: 60px;
}

/*******************
list and media
******************/
.list-group a.list-group-item:hover {
    background: #f2f4f8;
}

.list-group-item.active,
.list-group .list-group-item.active:hover {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.list-group-item.disabled {
    color: #99abb4;
    background: #f2f4f8;
}

.media {
    border: 1px solid rgba(120, 130, 140, 0.13);
    margin-bottom: 10px;
    padding: 15px;
}

/*******************
User card page
******************/
.el-element-overlay .white-box {
    padding: 0px;
}

.el-element-overlay .el-card-item {
    position: relative;
    padding-bottom: 25px;
}

.el-element-overlay .el-card-item .el-card-avatar {
    margin-bottom: 15px;
}

.el-element-overlay .el-card-item .el-card-content {
    text-align: center;
}

.el-element-overlay .el-card-item .el-card-content h3 {
    margin: 0px;
}

.el-element-overlay .el-card-item .el-card-content a {
    color: #67757c;
}

.el-element-overlay .el-card-item .el-card-content a:hover {
    color: var(--admin-panel-color);
}

.el-element-overlay .el-card-item .el-overlay-1 {
    width: 100%;
    overflow: hidden;
    position: relative;
    text-align: center;
    cursor: default;
}

.el-element-overlay .el-card-item .el-overlay-1 img {
    display: block;
    position: relative;
    -webkit-transition: all .4s linear;
    -o-transition: all .4s linear;
    transition: all .4s linear;
    width: 100%;
    height: auto;
}

.el-element-overlay .el-card-item .el-overlay-1:hover img {
    -ms-transform: scale(1.2) translateZ(0);
    -webkit-transform: scale(1.2) translateZ(0);
    /* transform: scale(1.2) translateZ(0); */
}

.el-element-overlay .el-card-item .el-overlay-1 .el-info {
    text-decoration: none;
    display: inline-block;
    text-transform: uppercase;
    color: #ffffff;
    background-color: transparent;
    filter: alpha(opacity=0);
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    padding: 0;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%) translateZ(0);
    -webkit-transform: translateY(-50%) translateZ(0);
    -ms-transform: translateY(-50%) translateZ(0);
}

.el-element-overlay .el-card-item .el-overlay-1 .el-info>li {
    list-style: none;
    display: inline-block;
    margin: 0 3px;
}

.el-element-overlay .el-card-item .el-overlay-1 .el-info>li a {
    border-color: #ffffff;
    color: #ffffff;
    padding: 12px 15px 10px;
}

.el-element-overlay .el-card-item .el-overlay-1 .el-info>li a:hover {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.el-element-overlay .el-card-item .el-overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0;
    opacity: 0;
    background-color: rgba(0, 0, 0, 0.7);
    -webkit-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.el-element-overlay .el-card-item .el-overlay-1:hover .el-overlay {
    opacity: 1;
    filter: alpha(opacity=100);
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.el-element-overlay .el-card-item .el-overlay-1 .scrl-dwn {
    top: -100%;
}

.el-element-overlay .el-card-item .el-overlay-1 .scrl-up {
    top: 100%;
    height: 0px;
}

.el-element-overlay .el-card-item .el-overlay-1:hover .scrl-dwn {
    top: 0px;
}

.el-element-overlay .el-card-item .el-overlay-1:hover .scrl-up {
    top: 0px;
    height: 100%;
}

/*******************
Timeline page
******************/
.timeline {
    position: relative;
    padding: 20px 0 20px;
    list-style: none;
    max-width: 1200px;
    margin: 0 auto;
}

.timeline:before {
    content: " ";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 3px;
    margin-left: -1.5px;
    background-color: #f2f4f8;
}

.timeline>li {
    position: relative;
    margin-bottom: 20px;
}

.timeline>li:before,
.timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
}

.timeline>li:before,
.timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
}

.timeline>li>.timeline-panel {
    float: left;
    position: relative;
    width: 46%;
    padding: 20px;
    border: 1px solid rgba(120, 130, 140, 0.13);
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
}

.timeline>li>.timeline-panel:before {
    content: " ";
    display: inline-block;
    position: absolute;
    top: 26px;
    right: -8px;
    border-top: 8px solid transparent;
    border-right: 0 solid rgba(120, 130, 140, 0.13);
    border-bottom: 8px solid transparent;
    border-left: 8px solid rgba(120, 130, 140, 0.13);
}

.timeline>li>.timeline-panel:after {
    content: " ";
    display: inline-block;
    position: absolute;
    top: 27px;
    right: -7px;
    border-top: 7px solid transparent;
    border-right: 0 solid #ffffff;
    border-bottom: 7px solid transparent;
    border-left: 7px solid #ffffff;
}

.timeline>li>.timeline-badge {
    z-index: 10;
    position: absolute;
    top: 16px;
    left: 50%;
    width: 50px;
    height: 50px;
    margin-left: -25px;
    border-radius: 50% 50% 50% 50%;
    text-align: center;
    font-size: 1.4em;
    line-height: 50px;
    color: #fff;
    overflow: hidden;
}

.timeline>li.timeline-inverted>.timeline-panel {
    float: right;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
    right: auto;
    left: -8px;
    border-right-width: 8px;
    border-left-width: 0;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
    right: auto;
    left: -7px;
    border-right-width: 7px;
    border-left-width: 0;
}

.timeline-badge.primary {
    background-color: var(--admin-panel-color);
}

.timeline-badge.success {
    background-color: #26dad2;
}

.timeline-badge.warning {
    background-color: var(--admin-panel-color);
}

.timeline-badge.danger {
    background-color: #ef5350;
}

.timeline-badge.info {
    background-color: var(--admin-panel-color);
}

.timeline-title {
    margin-top: 0;
    color: inherit;
    font-weight: 400;
}

.timeline-body>p,
.timeline-body>ul {
    margin-bottom: 0;
}

.timeline-body>p+p {
    margin-top: 5px;
}

/*******************
Horizontal Timeline page
******************/
.cd-horizontal-timeline .events a {
    padding-bottom: 6px;
    color: var(--admin-panel-color);
}

.cd-horizontal-timeline .filling-line,
.cd-horizontal-timeline .events a.selected::after {
    background: var(--admin-panel-color);
}

.cd-horizontal-timeline .events a.selected::after {
    border-color: var(--admin-panel-color);
}

.myadmin-dd .dd-list .dd-item .dd-handle {
    background: #ffffff;
    border: 1px solid rgba(120, 130, 140, 0.13);
    padding: 8px 16px;
    height: auto;
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    border-radius: 0;
}

.myadmin-dd-empty .dd-list .dd3-content {
    height: auto;
    border: 1px solid rgba(120, 130, 140, 0.13);
    padding: 8px 16px 8px 46px;
    background: #ffffff;
    font-weight: 400;
}

.myadmin-dd-empty .dd-list .dd3-handle {
    border: 1px solid rgba(120, 130, 140, 0.13);
    border-bottom: 0;
    background: #ffffff;
    height: 36px;
    width: 36px;
}

.dd3-handle:before {
    color: #67757c;
    top: 7px;
}

/*******************
ribbons page
******************/
.ribbon-wrapper,
.ribbon-wrapper-reverse,
.ribbon-wrapper-bottom,
.ribbon-wrapper-right-bottom {
    position: relative;
    padding: 50px 15px 15px 15px;
}

.ribbon-vwrapper {
    padding: 15px 15px 15px 50px;
    position: relative;
}

.ribbon-overflow {
    overflow: hidden;
}

.ribbon-vwrapper-reverse {
    padding: 15px 50px 15px 15px;
}

.ribbon-wrapper-bottom {
    padding: 15px 15px 50px 50px;
}

.ribbon-wrapper-right-bottom {
    padding: 15px 50px 50px 15px;
}

.ribbon-content {
    margin-bottom: 0px;
}

.ribbon {
    padding: 0 20px;
    height: 30px;
    line-height: 30px;
    clear: left;
    position: absolute;
    top: 12px;
    left: -2px;
    color: #ffffff;
}

.ribbon-bookmark:before {
    position: absolute;
    top: 0;
    left: 100%;
    display: block;
    width: 0;
    height: 0;
    content: '';
    border: 15px solid #263238;
    border-right: 10px solid transparent;
}

.ribbon-right {
    left: auto;
    right: -2px;
}

.ribbon-bookmark.ribbon-right:before {
    right: 100%;
    left: auto;
    border-right: 15px solid #263238;
    border-left: 10px solid transparent;
}

.ribbon-vertical-l,
.ribbon-vertical-r {
    clear: none;
    padding: 0 5px;
    height: 70px;
    width: 30px;
    line-height: 70px;
    text-align: center;
    left: 12px;
    top: -2px;
}

.ribbon-vertical-r {
    left: auto;
    right: 12px;
}

.ribbon-bookmark.ribbon-vertical-l:before,
.ribbon-bookmark.ribbon-vertical-r:before {
    top: 100%;
    left: 0;
    margin-top: -14px;
    border-right: 15px solid #263238;
    border-bottom: 10px solid transparent;
}

.ribbon-badge {
    top: 15px;
    overflow: hidden;
    left: -90px;
    width: 100%;
    text-align: center;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.ribbon-badge.ribbon-right {
    left: auto;
    right: -90px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.ribbon-badge.ribbon-bottom {
    top: auto;
    bottom: 15px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.ribbon-badge.ribbon-right.ribbon-bottom {
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.ribbon-corner {
    top: 0;
    left: 0;
    background-color: transparent !important;
    padding: 6px 0 0 10px;
}

.ribbon-corner i {
    position: relative;
}

.ribbon-corner:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 0;
    height: 0;
    content: '';
    border: 30px solid transparent;
    border-top-color: var(--admin-panel-color);
    border-left-color: var(--admin-panel-color);
}

.ribbon-corner.ribbon-right:before {
    right: 0;
    left: auto;
    border-right-color: #526069;
    border-left-color: transparent;
}

.ribbon-corner.ribbon-right {
    right: 0;
    left: auto;
    padding: 6px 10px 0 0;
}

.ribbon-corner.ribbon-bottom:before {
    top: auto;
    bottom: 0;
    border-top-color: transparent;
    border-bottom-color: #526069;
}

.ribbon-corner.ribbon-bottom {
    bottom: 0;
    top: auto;
    padding: 0 10px 6px 10px;
}

.ribbon-custom {
    background: var(--admin-panel-color);
}

.ribbon-bookmark.ribbon-right.ribbon-custom:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-custom:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-custom:before {
    border-right-color: var(--admin-panel-color);
    border-bottom-color: transparent;
}

.ribbon-primary {
    background: var(--admin-panel-color);
}

.ribbon-bookmark.ribbon-primary:before {
    border-color: var(--admin-panel-color);
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-primary:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-primary:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-primary:before {
    border-right-color: var(--admin-panel-color);
    border-bottom-color: transparent;
}

.ribbon-primary.ribbon-corner:before {
    border-top-color: var(--admin-panel-color);
    border-left-color: var(--admin-panel-color);
}

.ribbon-primary.ribbon-corner.ribbon-right:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-primary.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: var(--admin-panel-color);
}

.ribbon-success {
    background: #26dad2;
}

.ribbon-bookmark.ribbon-success:before {
    border-color: #26dad2;
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-success:before {
    border-right-color: #26dad2;
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-success:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-success:before {
    border-right-color: #26dad2;
    border-bottom-color: transparent;
}

.ribbon-success.ribbon-corner:before {
    border-top-color: #26dad2;
    border-left-color: #26dad2;
}

.ribbon-success.ribbon-corner.ribbon-right:before {
    border-right-color: #26dad2;
    border-left-color: transparent;
}

.ribbon-success.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: #26dad2;
}

.ribbon-info {
    background: var(--admin-panel-color);
}

.ribbon-bookmark.ribbon-info:before {
    border-color: var(--admin-panel-color);
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-info:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-info:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-info:before {
    border-right-color: var(--admin-panel-color);
    border-bottom-color: transparent;
}

.ribbon-info.ribbon-corner:before {
    border-top-color: var(--admin-panel-color);
    border-left-color: var(--admin-panel-color);
}

.ribbon-info.ribbon-corner.ribbon-right:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-info.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: var(--admin-panel-color);
}

.ribbon-warning {
    background: var(--admin-panel-color);
}

.ribbon-bookmark.ribbon-warning:before {
    border-color: var(--admin-panel-color);
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-warning:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-warning:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-warning:before {
    border-right-color: var(--admin-panel-color);
    border-bottom-color: transparent;
}

.ribbon-warning.ribbon-corner:before {
    border-top-color: var(--admin-panel-color);
    border-left-color: var(--admin-panel-color);
}

.ribbon-warning.ribbon-corner.ribbon-right:before {
    border-right-color: var(--admin-panel-color);
    border-left-color: transparent;
}

.ribbon-warning.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: var(--admin-panel-color);
}

.ribbon-danger {
    background: #ef5350;
}

.ribbon-bookmark.ribbon-danger:before {
    border-color: #ef5350;
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-danger:before {
    border-right-color: #ef5350;
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-danger:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-danger:before {
    border-right-color: #ef5350;
    border-bottom-color: transparent;
}

.ribbon-danger.ribbon-corner:before {
    border-top-color: #ef5350;
    border-left-color: #ef5350;
}

.ribbon-danger.ribbon-corner.ribbon-right:before {
    border-right-color: #ef5350;
    border-left-color: transparent;
}

.ribbon-danger.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: #ef5350;
}

.ribbon-default {
    background: #263238;
}

.ribbon-bookmark.ribbon-default:before {
    border-color: #263238;
    border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-default:before {
    border-right-color: #263238;
    border-left-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-l.ribbon-default:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-default:before {
    border-right-color: #263238;
    border-bottom-color: transparent;
}

.ribbon-default.ribbon-corner:before {
    border-top-color: #263238;
    border-left-color: #263238;
}

.ribbon-default.ribbon-corner.ribbon-right:before {
    border-right-color: #263238;
    border-left-color: transparent;
}

.ribbon-default.ribbon-corner.ribbon-bottom:before {
    border-top-color: transparent;
    border-bottom-color: #263238;
}

.res_password {
    font-size: 33px !important;
    height: 33px !important;
}

/*******************
session ideal timeout page
******************/
#idletimeout {
    background: var(--admin-panel-color);
    border: 3px solid var(--admin-panel-color);
    color: #fff;
    font-family: arial, sans-serif;
    text-align: center;
    font-size: 12px;
    padding: 10px;
    position: relative;
    top: 0px;
    left: 0;
    right: 0;
    z-index: 100000;
    display: none;
}

#idletimeout a {
    color: #ffffff;
    font-weight: bold;
}

#idletimeout span {
    font-weight: bold;
}

/*******************
Stylish tooltip
******************/
.mytooltip:hover .tooltip-content2,
.mytooltip:hover .tooltip-content2 i {
    opacity: 1;
    font-size: 18px;
    pointer-events: auto;
    -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}

.mytooltip:hover .tooltip-content4,
.mytooltip:hover .tooltip-text2 {
    pointer-events: auto;
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.mytooltip {
    display: inline;
    position: relative;
    z-index: 9999;
}

.mytooltip:hover .tooltip-item::after {
    pointer-events: auto;
}

.mytooltip:hover .tooltip-content {
    pointer-events: auto;
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0) rotate3d(0, 0, 0, 0);
    transform: translate3d(0, 0, 0) rotate3d(0, 0, 0, 0);
}

.mytooltip:hover .tooltip-content3 {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}

.mytooltip:hover .tooltip-item2 {
    color: #ffffff;
    -webkit-transform: translate3d(0, -0.5em, 0);
    transform: translate3d(0, -0.5em, 0);
}

.mytooltip:hover .tooltip-content5 {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
}

.mytooltip:hover .tooltip-text3 {
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}

.mytooltip:hover .tooltip-inner2 {
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.tooltip-item {
    background: rgba(0, 0, 0, 0.1);
    cursor: pointer;
    display: inline-block;
    font-weight: 500;
    padding: 0 10px;
}

.tooltip-item::after {
    content: '';
    position: absolute;
    width: 360px;
    height: 20px;
    bottom: 100%;
    left: 50%;
    pointer-events: none;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}

.tooltip-content {
    position: absolute;
    z-index: 9999;
    width: 360px;
    left: 50%;
    margin: 0 0 20px -180px;
    bottom: 100%;
    text-align: left;
    font-size: 14px;
    line-height: 30px;
    -webkit-box-shadow: -5px -5px 15px rgba(48, 54, 61, 0.2);
    box-shadow: -5px -5px 15px rgba(48, 54, 61, 0.2);
    background: #2b2b2b;
    opacity: 0;
    cursor: default;
    pointer-events: none;
}

.tooltip-content img {
    position: relative;
    height: 140px;
    display: block;
    float: left;
    margin-right: 1em;
}

.tooltip-effect-5 .tooltip-content {
    width: 180px;
    margin-left: -90px;
    -webkit-transform-origin: 50% calc(106%);
    -ms-transform-origin: 50% calc(106%);
    transform-origin: 50% calc(106%);
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
    transition: opacity 0.2s, -webkit-transform 0.2s;
    -o-transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s;
    -webkit-transition-timing-function: ease, cubic-bezier(0.17, 0.67, 0.4, 1.39);
    -o-transition-timing-function: ease, cubic-bezier(0.17, 0.67, 0.4, 1.39);
    transition-timing-function: ease, cubic-bezier(0.17, 0.67, 0.4, 1.39);
}

.tooltip-effect-5 .tooltip-text {
    padding: 1.4em;
}

.tooltip-content::after {
    content: '';
    top: 100%;
    left: 50%;
    border: solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: transparent;
    border-top-color: #2a3035;
    border-width: 10px;
    margin-left: -10px;
}

.tooltip-text {
    font-size: 14px;
    line-height: 24px;
    display: block;
    padding: 1.31em 1.21em 1.21em 0;
    color: #ffffff;
}

.tooltip-content2 {
    position: absolute;
    z-index: 9999;
    width: 80px;
    height: 80px;
    padding-top: 25px;
    left: 50%;
    margin-left: -40px;
    bottom: 100%;
    border-radius: 50%;
    text-align: center;
    background: var(--admin-panel-color);
    color: #ffffff;
    opacity: 0;
    margin-bottom: 20px;
    cursor: default;
    pointer-events: none;
}

.tooltip-content2 i {
    opacity: 0;
}

.tooltip-effect-6 .tooltip-content2 {
    -webkit-transform: translate3d(0, 10px, 0) rotate3d(1, 1, 1, 45deg);
    transform: translate3d(0, 10px, 0) rotate3d(1, 1, 1, 45deg);
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-6 .tooltip-content2 i {
    -webkit-transform: scale3d(0, 0, 1);
    transform: scale3d(0, 0, 1);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-6:hover .tooltip-content2 i {
    -webkit-transform: rotate3d(1, 1, 1, 0);
    transform: rotate3d(1, 1, 1, 0);
}

.tooltip-content2::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin: -7px 0 0 -15px;
    width: 30px;
    height: 20px;
    background: url(../../assets/images/tooltip/tooltip1.svg) no-repeat center center;
    background-size: 100%;
}

.tooltip-content3 {
    position: absolute;
    background: url(../../assets/images/tooltip/shape1.svg) no-repeat center bottom;
    background-size: 100% 100%;
    z-index: 9999;
    width: 200px;
    bottom: 100%;
    left: 50%;
    margin-left: -100px;
    padding: 50px 30px;
    text-align: center;
    color: #ffffff;
    opacity: 0;
    cursor: default;
    font-size: 14;
    line-height: 27px;
    pointer-events: none;
    -webkit-transform: scale3d(0.1, 0.2, 1);
    transform: scale3d(0.1, 0.2, 1);
    -webkit-transform-origin: 50% 120%;
    -ms-transform-origin: 50% 120%;
    transform-origin: 50% 120%;
    -webkit-transition: opacity 0.4s, -webkit-transform 0.4s;
    transition: opacity 0.4s, -webkit-transform 0.4s;
    -o-transition: opacity 0.4s, transform 0.4s;
    transition: opacity 0.4s, transform 0.4s;
    transition: opacity 0.4s, transform 0.4s, -webkit-transform 0.4s;
    -webkit-transition-timing-function: ease, cubic-bezier(0.6, 0, 0.4, 1);
    -o-transition-timing-function: ease, cubic-bezier(0.6, 0, 0.4, 1);
    transition-timing-function: ease, cubic-bezier(0.6, 0, 0.4, 1);
}

.tooltip-content3::after {
    content: '';
    position: absolute;
    width: 16px;
    height: 16px;
    left: 50%;
    margin-left: -8px;
    top: 100%;
    background: #00aeef;
    -webkit-transform: translate3d(0, -60%, 0) rotate3d(0, 0, 1, 45deg);
    transform: translate3d(0, -60%, 0) rotate3d(0, 0, 1, 45deg);
}

.tooltip-item2 {
    color: #00aeef;
    cursor: pointer;
    z-index: 100;
    position: relative;
    display: inline-block;
    font-weight: 500;
    -webkit-transition: background-color 0.3s, color 0.3s, -webkit-transform 0.3s;
    transition: background-color 0.3s, color 0.3s, -webkit-transform 0.3s;
    -o-transition: background-color 0.3s, color 0.3s, transform 0.3s;
    transition: background-color 0.3s, color 0.3s, transform 0.3s;
    transition: background-color 0.3s, color 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-content4 {
    position: absolute;
    z-index: 99;
    width: 360px;
    left: 50%;
    margin-left: -180px;
    bottom: -5px;
    text-align: left;
    background: #00aeef;
    opacity: 0;
    font-size: 14px;
    line-height: 27px;
    padding: 1.5em;
    color: #ffffff;
    border-bottom: 55px solid #2b2b2b;
    cursor: default;
    pointer-events: none;
    border-radius: 5px;
    -webkit-transform: translate3d(0, -0.5em, 0);
    transform: translate3d(0, -0.5em, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-content4 a {
    color: #2b2b2b;
}

.tooltip-text2 {
    opacity: 0;
    -webkit-transform: translate3d(0, 1.5em, 0);
    transform: translate3d(0, 1.5em, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-content5 {
    position: absolute;
    z-index: 9999;
    width: 300px;
    left: 50%;
    bottom: 100%;
    font-size: 20px;
    line-height: 1.4;
    text-align: center;
    font-weight: 400;
    color: #ffffff;
    background: transparent;
    opacity: 0;
    margin: 0 0 20px -150px;
    cursor: default;
    pointer-events: none;
    -webkit-transition: opacity 0.3s 0.3s;
    -o-transition: opacity 0.3s 0.3s;
    transition: opacity 0.3s 0.3s;
}

.tooltip-content5 span {
    display: block;
}

.tooltip-text3 {
    border-bottom: 10px solid var(--admin-panel-color);
    overflow: hidden;
    -webkit-transform: scale3d(0, 1, 1);
    transform: scale3d(0, 1, 1);
    -webkit-transition: -webkit-transform 0.3s 0.3s;
    transition: -webkit-transform 0.3s 0.3s;
    -o-transition: transform 0.3s 0.3s;
    transition: transform 0.3s 0.3s;
    transition: transform 0.3s 0.3s, -webkit-transform 0.3s 0.3s;
}

.tooltip-inner2 {
    background: #2b2b2b;
    padding: 40px;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    -o-transition: transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-content5::after {
    content: '';
    bottom: -20px;
    left: 50%;
    border: solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: transparent;
    border-top-color: var(--admin-panel-color);
    border-width: 10px;
    margin-left: -10px;
}

.tooltip-effect-1 .tooltip-content {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
    color: #ffffff;
}

.tooltip-effect-2 .tooltip-content {
    -webkit-transform-origin: 50% calc(110%);
    -ms-transform-origin: 50% calc(110%);
    transform-origin: 50% calc(110%);
    -webkit-transform: perspective(1000px) rotate3d(1, 0, 0, 45deg);
    transform: perspective(1000px) rotate3d(1, 0, 0, 45deg);
    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
    transition: opacity 0.2s, -webkit-transform 0.2s;
    -o-transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s;
}

.tooltip-effect-3 .tooltip-content {
    -webkit-transform: translate3d(0, 10px, 0) rotate3d(1, 1, 0, 25deg);
    transform: translate3d(0, 10px, 0) rotate3d(1, 1, 0, 25deg);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-4 .tooltip-content {
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: scale3d(0.7, 0.3, 1);
    transform: scale3d(0.7, 0.3, 1);
    -webkit-transition: opacity 0.2s, -webkit-transform 0.2s;
    transition: opacity 0.2s, -webkit-transform 0.2s;
    -o-transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s;
    transition: opacity 0.2s, transform 0.2s, -webkit-transform 0.2s;
}

.tooltip.tooltip-effect-2:hover .tooltip-content {
    -webkit-transform: perspective(1000px) rotate3d(1, 0, 0, 0deg);
    transform: perspective(1000px) rotate3d(1, 0, 0, 0deg);
}

a.mytooltip {
    font-weight: 500;
    color: var(--admin-panel-color);
}

.tooltip-effect-7 .tooltip-content2 {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-7 .tooltip-content2 i {
    -webkit-transform: translate3d(0, 15px, 0);
    transform: translate3d(0, 15px, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-8 .tooltip-content2 {
    -webkit-transform: translate3d(0, 10px, 0) rotate3d(0, 1, 0, 90deg);
    transform: translate3d(0, 10px, 0) rotate3d(0, 1, 0, 90deg);
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-8 .tooltip-content2 i {
    -webkit-transform: scale3d(0, 0, 1);
    transform: scale3d(0, 0, 1);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-9 .tooltip-content2 {
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

.tooltip-effect-9 .tooltip-content2 i {
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s;
    transition: opacity 0.3s, transform 0.3s, -webkit-transform 0.3s;
}

/*******************
Error Page
******************/
.error-box {
    height: 100%;
    position: fixed;
    background: url(../../assets/images/background/error-bg.jpg) no-repeat center center #fff;
    width: 100%;
}

.error-box .footer {
    width: 100%;
    left: 0px;
    right: 0px;
}

.error-body {
    padding-top: 5%;
}

.error-body h1 {
    font-size: 210px;
    font-weight: 900;
    line-height: 210px;
}

/*******************
google map Page
******************/
.gmaps,
.gmaps-panaroma {
    height: 300px;
}

.gmaps,
.gmaps-panaroma {
    height: 300px;
    background: #f2f4f8;
    border-radius: 3px;
}

.gmaps-overlay {
    display: block;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    line-height: 40px;
    background: var(--admin-panel-color);
    border-radius: 4px;
    padding: 10px 20px;
}

.gmaps-overlay_arrow {
    left: 50%;
    margin-left: -16px;
    width: 0;
    height: 0;
    position: absolute;
}

.gmaps-overlay_arrow.above {
    bottom: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-top: 16px solid var(--admin-panel-color);
}

.gmaps-overlay_arrow.below {
    top: -15px;
    border-left: 16px solid transparent;
    border-right: 16px solid transparent;
    border-bottom: 16px solid var(--admin-panel-color);
}

/*******************
vector map Page
******************/
.jvectormap-zoomin,
.jvectormap-zoomout {
    width: 10px;
    height: 10px;
    line-height: 10px;
}

.jvectormap-zoomout {
    top: 40px;
}

/*******************
Seach listing Page
******************/
.search-listing {
    padding: 0px;
    margin: 0px;
}

.search-listing li {
    list-style: none;
    padding: 15px 0;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.search-listing li h3 {
    margin: 0px;
    font-size: 18px;
}

.search-listing li h3 a {
    color: var(--admin-panel-color);
}

.search-listing li h3 a:hover {
    text-decoration: underline;
}

.search-listing li a {
    color: #26dad2;
}

/*******************
Login register and recover password Page
******************/
.login-register {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    height: 100%;
    width: 100%;
    padding: 5% 0;
    position: fixed;
    overflow: auto;
}

.login-box {
    width: 400px;
    margin: 0 auto;
}

.login-box .footer {
    width: 100%;
    left: 0px;
    right: 0px;
}

.login-box .social {
    display: block;
    margin-bottom: 30px;
}

#recoverform {
    display: none;
}

.login-sidebar {
    padding: 0px;
    margin-top: 0px;
}

.login-sidebar .login-box {
    right: 0px;
    position: absolute;
    height: 100%;
}

/*******************
FAQs Page
******************/
.minimal-faq .card {
    border: 0px;
}

.minimal-faq .card .card-header {
    background: #ffffff;
    padding: 20px 0;
    margin-top: 10px;
}

.minimal-faq .card .card-body {
    padding: 15px 0px;
}

/*******************
Pricing Page
******************/
.pricing-box {
    position: relative;
    text-align: center;
    margin-top: 30px;
}

.featured-plan {
    margin-top: 0px;
}

.featured-plan .pricing-body {
    padding: 60px 0;
    background: #ebf3f5;
    border: 1px solid #ddd;
}

.featured-plan .price-table-content .price-row {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
}

.pricing-body {
    border-radius: 0px;
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    border-bottom: 5px solid rgba(120, 130, 140, 0.13);
    vertical-align: middle;
    padding: 30px 0;
    position: relative;
}

.pricing-body h2 {
    position: relative;
    font-size: 56px;
    margin: 20px 0 10px;
    font-weight: 500;
}

.pricing-body h2 span {
    position: absolute;
    font-size: 15px;
    top: -10px;
    margin-left: -10px;
}

.price-table-content .price-row {
    padding: 20px 0;
    border-top: 1px solid rgba(120, 130, 140, 0.13);
}

.pricing-plan {
    padding: 0 15px;
}

.pricing-plan .no-padding {
    padding: 0px;
}

.price-lable {
    position: absolute;
    top: -10px;
    padding: 5px 10px;
    margin: 0 auto;
    display: inline-block;
    width: 100px;
    left: 0px;
    right: 0px;
}

/*******************
chat application Page
******************/
.chat-main-box {
    position: relative;
    overflow: hidden;
}

.chat-main-box .chat-left-aside {
    position: relative;
    width: 250px;
    float: left;
    z-index: 9;
    top: 0px;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
}

.chat-main-box .chat-left-aside .open-panel {
    display: none;
    cursor: pointer;
    position: absolute;
    left: -webkit-calc(100% - 1px);
    top: 50%;
    z-index: 100;
    background-color: #fff;
    -webkit-box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    box-shadow: 1px 0 3px rgba(0, 0, 0, 0.2);
    border-radius: 0 100px 100px 0;
    line-height: 1;
    padding: 15px 8px 15px 4px;
}

.chat-main-box .chat-left-aside .chat-left-inner {
    position: relative;
}

.chat-main-box .chat-left-aside .chat-left-inner .form-control {
    height: 60px;
    padding: 15px;
    background-image: -webkit-gradient(linear, left top, left bottom, from(var(--admin-panel-color)), to(var(--admin-panel-color))), -webkit-gradient(linear, left top, left bottom, from(rgba(120, 130, 140, 0.13)), to(rgba(120, 130, 140, 0.13)));
    background-image: -webkit-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -webkit-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
    background-image: -o-linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), -o-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
    background-image: linear-gradient(var(--admin-panel-color), var(--admin-panel-color)), linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
}

.chat-main-box .chat-left-aside .chat-left-inner .style-none {
    padding: 0px;
}

.chat-main-box .chat-left-aside .chat-left-inner .style-none li {
    list-style: none;
    overflow: hidden;
}

.chat-main-box .chat-left-aside .chat-left-inner .style-none li a {
    padding: 20px;
}

.chat-main-box .chat-left-aside .chat-left-inner .style-none li a:hover,
.chat-main-box .chat-left-aside .chat-left-inner .style-none li a.active {
    background: #ebf3f5;
}

.chat-main-box .chat-right-aside {
    width: calc(100% - 250px);
    float: left;
}

.chat-main-box .chat-right-aside .chat-list {
    max-height: none;
    height: 100%;
    padding-top: 40px;
}

.chat-main-box .chat-right-aside .chat-list .chat-text {
    border-radius: 6px;
}

.chat-main-box .chat-right-aside .send-chat-box {
    position: relative;
}

.chat-main-box .chat-right-aside .send-chat-box .form-control {
    border: none;
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    resize: none;
    height: 80px;
    padding-right: 180px;
}

.chat-main-box .chat-right-aside .send-chat-box .form-control:focus {
    border-color: rgba(120, 130, 140, 0.13);
}

.chat-main-box .chat-right-aside .send-chat-box .custom-send {
    position: absolute;
    right: 20px;
    bottom: 10px;
}

.chat-main-box .chat-right-aside .send-chat-box .custom-send .cst-icon {
    color: #67757c;
    margin-right: 10px;
}

/*******************
Email inbox Page
******************/
.inbox-panel .list-group .list-group-item {
    border: 0px;
    border-radius: 0px;
    border-left: 3px solid transparent;
}

.inbox-panel .list-group .list-group-item a {
    color: #67757c;
}

.inbox-panel .list-group .list-group-item.active,
.inbox-panel .list-group .list-group-item:hover {
    background: #f2f4f8;
    border-left: 3px solid var(--admin-panel-color);
}

.inbox-center .unread td {
    font-weight: 400;
}

.inbox-center td {
    vertical-align: middle;
    white-space: nowrap;
}

.inbox-center a {
    color: #67757c;
    padding: 2px 0 3px 0;
    overflow: hidden;
    vertical-align: middle;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
}

.inbox-center .checkbox {
    margin-top: -13px;
    height: 20px;
}

.calendar-events {
    padding: 8px 10px;
    border: 1px solid #ffffff;
    cursor: move;
}

.calendar-events:hover {
    border: 1px dashed rgba(120, 130, 140, 0.13);
}

.calendar-events i {
    margin-right: 8px;
}

/*******************
Contact app Page
******************/
/*left-aside-column*/
.contact-page-aside {
    position: relative;
}

.left-aside {
    position: absolute;
    border-right: 1px solid rgba(120, 130, 140, 0.13);
    padding: 20px;
    width: 250px;
    height: 100%;
}

.right-aside {
    padding: 20px;
    margin-left: 250px;
}

.contact-list td {
    vertical-align: middle;
    padding: 25px 10px;
}

.contact-list td img {
    width: 30px;
}

.list-style-none {
    margin: 0px;
    padding: 0px;
}

.list-style-none li {
    list-style: none;
    margin: 0px;
}

.list-style-none li.box-label a {
    font-weight: 500;
}

.list-style-none li.divider {
    margin: 10px 0;
    height: 1px;
    background: rgba(120, 130, 140, 0.13);
}

.list-style-none li a {
    padding: 15px 10px;
    display: block;
    color: #67757c;
}

.list-style-none li a:hover {
    color: var(--admin-panel-color);
}

.list-style-none li a span {
    float: right;
}

.slimScrollBar {
    z-index: 10 !important;
}

.carousel-item-next,
.carousel-item-prev,
.carousel-item.active {
    display: block;
}

/*Documentation page*/
.plugin-details {
    display: none;
}

.plugin-details-active {
    display: block;
}

.earning-box h6 {
    font-weight: 500;
    margin-bottom: 0px;
    white-space: nowrap;
}

.earning-box td,
.earning-box th {
    vertical-align: middle;
}

/*******************
Table-Jsgrid table
******************/
.jsgrid-pager-page a,
.jsgrid-pager-current-page,
.jsgrid-pager-nav-button a {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: inline-block;
    min-width: 1.5em;
    padding: 0.5em 1em;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    color: #67757c;
    border: 1px solid #ddd;
}

.jsgrid-pager-page a:hover,
.jsgrid-pager-nav-button a:hover {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.jsgrid-pager-current-page {
    background-color: var(--admin-panel-color);
    color: #ffffff;
}

.jsgrid-pager-page,
.jsgrid-pager-nav-button {
    padding: 0;
}

.jsgrid-pager-page.jsgrid-pager-current-page {
    padding: 0.5em 1em !important;
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*******************
Main sidebar
******************/
.left-sidebar {
    position: absolute;
    width: 265px;
    height: 100%;
    top: 0px;
    z-index: 20;
    padding-top: 60px;
    background: #0C111C;
    -webkit-box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);
    box-shadow: 1px 0px 20px rgba(0, 0, 0, 0.08);
}

.fix-sidebar .left-sidebar {
    position: fixed;
}

/*******************
use profile section
******************/
.user-profile {
    position: relative;
    background-size: cover;
}

.user-profile .setpos {
    top: -47px;
    right: -3px;
}

.user-profile .profile-img {
    width: 70px;
    margin: 0 auto;
    padding: 10px 0 5px 0;
    border-radius: 100%;
}

.user-profile .profile-img img {
    width: 100%;
    padding: 5px;
    border: 1px solid rgba(120, 130, 140, 0.13);
    border-radius: 100%;
}

.user-profile .profile-text {
    padding: 5px 0px;
    position: relative;
    text-align: center;
}

.user-profile .profile-text>a {
    color: #99abb4;
    padding: 0 5px;
}

.user-profile .profile-text>a:hover {
    color: var(--admin-panel-color);
}

.user-profile .profile-text>a:after {
    display: none;
}

.user-profile .dropdown-menu {
    left: 0px;
    right: 0px;
    top: 62px !important;
    width: 180px;
    margin: 0 auto;
}

/*******************
sidebar footer
******************/
.sidebar-footer {
    position: fixed;
    z-index: 10;
    bottom: 0px;
    left: 0px;
    -webkit-transition: 0.2s ease-out;
    -o-transition: 0.2s ease-out;
    transition: 0.2s ease-out;
    width: 240px;
    background: #fff;
    border-top: 1px solid rgba(120, 130, 140, 0.13);
}

.sidebar-footer a {
    padding: 15px;
    width: 33.333337%;
    float: left;
    text-align: center;
    font-size: 18px;
}

/*******************
sidebar navigation
******************/
.scroll-sidebar {
    padding-bottom: 60px;
    padding-top: 0px;
}

.collapse.in {
    display: block !important;
}

.sidebar-search {
    padding: 10px 15px;
}

.sidebar-search input {
    padding: 8px 12px 8px 48px;
    border-radius: 120px;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 22px;
    background: #363F4A url(../images/search_icon.png) no-repeat left 15px center;
    width: 100%;
    border: 0;
    color: #fff;
}

.mini-sidebar .sidebar-search {
    width: 60px;
    padding: 10px 10px;
}

.mini-sidebar .sidebar-search:hover {
    width: 250px;
}

.mini-sidebar .sidebar-search input {
    background-position: left 10px center;
    padding: 8px 8px 8px 32px
}

.sidebar-nav {
    background: #0C111C;
    padding: 0px;
}

.sidebar-nav ul {
    margin: 0px;
    padding: 0px;
    transition: all ease 0.5s;
}

.sidebar-nav ul li {
    list-style: none;
}

.sidebar-nav ul li a {
    color: #D1D5DB;
    padding: 8px 35px 8px 15px;
    display: block;
    font-size: 14px;
    font-weight: 600;
    /*    border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;*/
}

/*.mini-sidebar .sidebar-nav ul li a{color: #fff !important;}*/
.sidebar-nav ul li a.active,
.sidebar-nav ul li a:hover {
    color: var(--admin-panel-color);
}

.sidebar-nav ul li a.active i,
.sidebar-nav ul li a:hover i {
    color: var(--admin-panel-color);
}

.sidebar-nav ul li a.active {
    font-weight: 500;
    color: #263238;
}

.sidebar-nav ul li ul {
    padding-left: 0px;
    /*    background: rgba(255, 255, 255, 0.09);*/
}

.sidebar-nav ul li ul li a {
    padding: 7px 25px 7px 60px;
    position: relative;
    border-right: 3px solid transparent;
}

.sidebar-nav ul li ul li.active a,
.sidebar-nav ul li ul li a:hover {
    border-color: #ff6839;
}

.sidebar-nav ul li ul li a::before {
    content: "";
    width: 3px;
    height: 3px;
    border: 2px solid;
    display: inline-block;
    margin-right: 10px;
    border-radius: 50px;
    position: absolute;
    left: 40px;
    top: 14px;
    margin: 0;
}

.sidebar-nav ul li ul li a::after {
    content: "";
    width: 4px;
    height: 4px;
    border: 1px solid;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    border-radius: 50px;
    position: absolute;
    left: 25px;
    top: 17px;
    display: none;
}

.sidebar-nav ul li ul ul {
    padding-left: 15px;
}

.sidebar-nav ul li.nav-small-cap {
    font-size: 12px;
    margin-bottom: 0px;
    padding: 14px 14px 14px 20px;
    color: #fff;
    font-weight: 500;
}

.sidebar-nav ul li.nav-devider {
    height: 1px;
    background: #fff;
    display: block;
    margin: 0px 0;
}

.sidebar-nav>ul>li>a {
    border-right: 3px solid transparent;
}

.sidebar-nav>ul>li>a i {
    width: 27px;
    font-size: 19px;
    display: inline-block;
    vertical-align: middle;
    color: #D1D5DB;
}

.mini-sidebar .sidebar-nav #sidebarnav>li:hover a i {
    color: var(--admin-panel-color);
}

.sidebar-nav>ul>li>a .label {
    float: right;
    margin-top: 6px;
}

.sidebar-nav>ul>li>a.active {
    font-weight: 400;
    /*background: #242933;*/
    color: #26c6da;
}

.sidebar-nav ul li a.active,
.sidebar-nav ul li a:hover {
    color: #26c6da;
}

.sidebar-nav>ul>li {
    margin-bottom: 1px;
}

.sidebar-nav>ul>li.active>a {
    color: var(--admin-panel-color);
    font-weight: 500;
    border-right: 3px solid var(--admin-panel-color);
}

.sidebar-nav>ul>li.active>a i {
    color: var(--admin-panel-color);
}

.sidebar-nav>ul>li.nav-subtitle {
    padding: 0 0px 0 0px;
    margin-bottom: 5px;
    margin-top: 15px;
}

.sidebar-nav>ul>li.nav-subtitle .nav-subtitle-span {
    padding: 5px 20px;
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    background: rgba(255, 255, 255, 0.15);
    line-height: 1;
    display: block;
    text-align: left;
    color: #BDBDBD;
    border-radius: 0px 0px 0px 0px;
}

.sidebar-nav>ul>li.nav-separater hr {
    border-top: 1px dashed rgba(255, 255, 255, .5);
    margin: 9px 0;
}

.mini-sidebar .sidebar-nav>ul>li.nav-subtitle .nav-subtitle-span {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 60px;
    font-size: 11px;
}

.sidebar-nav .has-arrow {
    position: relative;
}

.sidebar-nav .has-arrow::after {
    position: absolute;
    content: '';
    width: 8px;
    height: 8px;
    border-width: 2px 0 0 2px;
    border-style: solid;
    border-color: #D1D5DB;
    right: 1em;
    -webkit-transform: rotate(135deg) translate(0, -50%);
    -ms-transform: rotate(135deg) translate(0, -50%);
    -o-transform: rotate(135deg) translate(0, -50%);
    transform: rotate(135deg) translate(0, -50%);
    -webkit-transform-origin: top;
    -ms-transform-origin: top;
    -o-transform-origin: top;
    transform-origin: top;
    top: 47%;
    -webkit-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

.sidebar-nav .active>.has-arrow::after,
.sidebar-nav li>.has-arrow.active::after,
.sidebar-nav .has-arrow[aria-expanded="true"]::after {
    -webkit-transform: rotate(-135deg) translate(0, -50%);
    -ms-transform: rotate(-135deg) translate(0, -50%);
    -o-transform: rotate(-135deg) translate(0, -50%);
    top: 45%;
    width: 7px;
    transform: rotate(-135deg) translate(0, -50%);
}

/****************
When click on sidebar toggler and also for tablet
*****************/
@media (min-width: 768px) {
    .mini-sidebar .sidebar-nav #sidebarnav li {
        position: relative;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li>ul {
        position: absolute;
        left: 60px;
        top: 45px;
        width: 200px;
        z-index: 1001;
        background: #f2f6f8;
        display: none;
        padding-left: 1px;
    }

    .mini-sidebar .user-profile .profile-img {
        width: 50px;
    }

    .mini-sidebar .user-profile .profile-img .setpos {
        top: -35px;
    }

    .mini-sidebar.fix-sidebar .left-sidebar {
        position: absolute;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>ul {
        height: auto !important;
        overflow: auto;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>ul,
    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>ul.collapse {
        display: block;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li>a.has-arrow:after {
        display: none;
    }

    .mini-sidebar .left-sidebar {
        width: 60px;
    }

    .mini-sidebar .user-profile {
        padding-bottom: 15px;
        width: 60px;
        margin-bottom: 7px;
    }

    .mini-sidebar .user-profile .profile-img {
        padding: 15px 0 0 0;
        margin: 0px 0 0 6px;
    }

    .mini-sidebar .user-profile .profile-img:before {
        top: 15px;
    }

    .mini-sidebar .scroll-sidebar {
        padding-bottom: 0px;
        position: absolute;
        overflow-x: hidden !important;
    }

    .mini-sidebar .hide-menu,
    .mini-sidebar .nav-small-cap,
    .mini-sidebar .sidebar-footer,
    .mini-sidebar .user-profile .profile-text,
    .mini-sidebar>.label {
        display: none;
    }

    .mini-sidebar .nav-devider {
        width: 60px;
    }

    .mini-sidebar .sidebar-nav {
        background: transparent;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li>a {
        padding: 9px 18px;
        width: 60px;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>a {
        width: 260px;
        background: #f2f6f8;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>a .hide-menu {
        display: inline;
    }

    .mini-sidebar .sidebar-nav #sidebarnav>li:hover>a .label {
        display: none;
    }
}

@media (max-width: 767px) {
    .mini-sidebar .left-sidebar {
        position: fixed;
    }

    .mini-sidebar .left-sidebar,
    .mini-sidebar .sidebar-footer {
        left: -265px;
    }

    .mini-sidebar.show-sidebar .left-sidebar,
    .mini-sidebar.show-sidebar .sidebar-footer {
        left: 0px;
    }
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*******************
/*User mail widgets*/
/*******************/
.topbar .top-navbar .mailbox {
    width: 300px;
}

.topbar .top-navbar .mailbox ul {
    padding: 0px;
}

.topbar .top-navbar .mailbox ul li {
    list-style: none;
}

.mailbox ul li .drop-title {
    font-weight: 500;
    padding: 11px 20px 15px;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.mailbox ul li .nav-link {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    padding-top: 15px;
}

.mailbox .message-center {
    height: 200px;
    overflow: auto;
    position: relative;
}

.mailbox .message-center a {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    display: block;
    text-decoration: none;
    padding: 9px 15px;
}

.mailbox .message-center a:hover {
    background: #f2f4f8;
}

.mailbox .message-center a div {
    white-space: normal;
}

.mailbox .message-center a .user-img {
    width: 40px;
    position: relative;
    display: inline-block;
    margin: 0 10px 15px 0;
}

.mailbox .message-center a .user-img img {
    width: 100%;
}

.mailbox .message-center a .user-img .profile-status {
    border: 2px solid #ffffff;
    border-radius: 50%;
    display: inline-block;
    height: 10px;
    left: 30px;
    position: absolute;
    top: 1px;
    width: 10px;
}

.mailbox .message-center a .user-img .online {
    background: #26dad2;
}

.mailbox .message-center a .user-img .busy {
    background: #ef5350;
}

.mailbox .message-center a .user-img .away {
    background: var(--admin-panel-color);
}

.mailbox .message-center a .user-img .offline {
    background: var(--admin-panel-color);
}

.mailbox .message-center a .mail-contnet {
    display: inline-block;
    width: 75%;
    vertical-align: middle;
}

.mailbox .message-center a .mail-contnet h5 {
    margin: 5px 0px 0;
}

.mailbox .message-center a .mail-contnet .mail-desc,
.mailbox .message-center a .mail-contnet .time {
    font-size: 12px;
    display: block;
    margin: 1px 0;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #67757c;
    white-space: nowrap;
}

/*******************
/*Analytic info sparkline chart page*/
/*******************/
.analytics-info li span {
    font-size: 24px;
    vertical-align: middle;
}

/*******************
/*States row*/
/*******************/
.stats-row {
    margin-bottom: 20px;
}

.stats-row .stat-item {
    display: inline-block;
    padding-right: 15px;
}

.stats-row .stat-item+.stat-item {
    padding-left: 15px;
    border-left: 1px solid rgba(120, 130, 140, 0.13);
}

/*******************/
/*Dashboard1 Weather*/
/*******************/
.city-weather-days {
    margin: 0px;
}

.city-weather-days li {
    text-align: center;
    padding: 15px 0;
}

.city-weather-days li span {
    display: block;
    padding: 10px 0 0;
    color: #99abb4;
}

.city-weather-days li i {
    display: block;
    font-size: 20px;
    color: var(--admin-panel-color);
}

.city-weather-days li h3 {
    font-weight: 300;
    margin-top: 5px;
}

/*******************/
/*Comment widgets*/
/*******************/
.comment-widgets {
    position: relative;
    margin-bottom: 10px;
}

.comment-widgets .comment-row {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    padding: 15px;
}

.comment-widgets .comment-row:last-child {
    border-bottom: 0px;
}

.comment-widgets .comment-row:hover,
.comment-widgets .comment-row.active {
    background: rgba(0, 0, 0, 0.02);
}

.comment-text {
    padding: 15px 15px 15px 20px;
    width: 80%;
}

.comment-text:hover .comment-footer .action-icons,
.comment-text.active .comment-footer .action-icons {
    visibility: visible;
}

.comment-text p {
    max-height: 50px;
    width: 100%;
    overflow: hidden;
}

.comment-footer .action-icons {
    visibility: hidden;
}

.comment-footer .action-icons a {
    padding-left: 7px;
    vertical-align: middle;
    color: #99abb4;
}

.comment-footer .action-icons a:hover,
.comment-footer .action-icons a.active {
    color: var(--admin-panel-color);
}

/*******************/
/*To do widgets*/
/*******************/
.todo-list li {
    border: 0px;
    margin-bottom: 0px;
    padding: 20px 15px 15px 0px;
}

.todo-list li .checkbox {
    width: 100%;
}

.todo-list li .checkbox label {
    font-weight: 400;
    color: #455a64;
}

.todo-list li:last-child {
    border-bottom: 0px;
}

.todo-list li .assignedto {
    padding: 0px 0 0 27px;
    margin: 0px;
}

.todo-list li .assignedto li {
    list-style: none;
    padding: 0px;
    display: inline-block;
    border: 0px;
    margin-right: 2px;
}

.todo-list li .assignedto li img {
    width: 30px;
    border-radius: 100%;
}

.todo-list li .item-date {
    padding-left: 25px;
    font-size: 12px;
    display: inline-block;
}

.list-task .task-done span {
    text-decoration: line-through;
}

/*******************/
/*Chat widget*/
/*******************/
.chat-list {
    margin: 0px;
    padding: 0px;
}

.chat-list li {
    list-style: none;
    margin-top: 30px;
}

.chat-list li .chat-img {
    display: inline-block;
    width: 45px;
    vertical-align: top;
}

.chat-list li .chat-img img {
    width: 45px;
    border-radius: 100%;
}

.chat-list li .chat-content {
    width: calc(100% - 140px);
    display: inline-block;
    padding-left: 15px;
}

.chat-list li .chat-content h5 {
    color: #263238;
}

.chat-list li .chat-content .box {
    display: inline-block;
    margin-bottom: 10px;
    position: relative;
}

.chat-list li .chat-content .box:after {
    right: 99%;
    top: 0;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-top-color: #cfecfe;
    border-width: 8px;
    margin-left: -1px;
    border-right-color: #cfecfe;
}

.chat-list li .chat-time {
    display: block;
    text-align: right;
    width: 80px;
    margin-left: 28px;
    font-size: 10px;
    color: #99abb4;
}

.chat-list li.odd .chat-content {
    text-align: right;
    width: calc(100% - 90px);
}

.chat-list li.odd .box {
    clear: both;
}

.chat-list li.odd+.odd {
    margin-top: 0px;
}

.chat-list li.reverse {
    text-align: right;
}

.chat-list li.reverse .box:after {
    left: 99%;
    right: auto;
    border-right-color: transparent;
    border-left-color: #f6f6f6;
    border-top-color: #f6f6f6;
}

.chat-list li.reverse .chat-time {
    text-align: right;
    margin-left: auto;
    margin-right: 65px;
}

.chat-list li.reverse .chat-content {
    padding-left: 0px;
    padding-right: 15px;
}

/*******************/
/*Chat widget*/
/*******************/
.message-box ul li .drop-title {
    font-weight: 500;
    padding: 11px 20px 15px;
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
}

.message-box ul li .nav-link {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    padding-top: 15px;
}

.message-box .message-widget {
    position: relative;
}

.message-box .message-widget a {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    display: block;
    text-decoration: none;
    padding: 9px 15px;
}

.message-box .message-widget a:hover {
    background: #f2f4f8;
}

.message-box .message-widget a:last-child {
    border-bottom: 0px;
}

.message-box .message-widget a div {
    white-space: normal;
}

.message-box .message-widget a .user-img {
    width: 45px;
    position: relative;
    display: inline-block;
    margin: 0 10px 15px 0;
}

.message-box .message-widget a .user-img img {
    width: 100%;
}

.message-box .message-widget a .user-img .profile-status {
    border: 2px solid #ffffff;
    border-radius: 50%;
    display: inline-block;
    height: 10px;
    left: 33px;
    position: absolute;
    top: -1px;
    width: 10px;
}

.message-box .message-widget a .user-img .online {
    background: #26dad2;
}

.message-box .message-widget a .user-img .busy {
    background: #ef5350;
}

.message-box .message-widget a .user-img .away {
    background: var(--admin-panel-color);
}

.message-box .message-widget a .user-img .offline {
    background: var(--admin-panel-color);
}

.message-box .message-widget a .mail-contnet {
    display: inline-block;
    width: 73%;
    vertical-align: middle;
}

.message-box .message-widget a .mail-contnet h5 {
    margin: 5px 0px 0;
}

.message-box .message-widget a .mail-contnet .mail-desc,
.message-box .message-widget a .mail-contnet .time {
    font-size: 12px;
    display: block;
    margin: 1px 0;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #67757c;
    white-space: nowrap;
}

/*******************/
/*Calendar widget*/
/*******************/
.calendar {
    float: left;
    margin-bottom: 0px;
}

.fc-view {
    margin-top: 30px;
}

.none-border .modal-footer {
    border-top: none;
}

.fc-toolbar {
    margin-bottom: 5px;
    margin-top: 15px;
}

.fc-toolbar h2 {
    font-size: 18px;
    font-weight: 500;
    line-height: 30px;
    text-transform: uppercase;
}

.fc-day {
    background: #ffffff;
}

.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active,
.fc-toolbar button:focus,
.fc-toolbar button:hover,
.fc-toolbar .ui-state-hover {
    z-index: 0;
}

.fc-widget-header {
    border: 0px !important;
}

.fc-widget-content {
    border-color: rgba(120, 130, 140, 0.13) !important;
}

.fc th.fc-widget-header {
    color: #67757c;
    font-size: 13px;
    font-weight: 300;
    line-height: 20px;
    padding: 7px 0px;
    text-transform: uppercase;
}

.fc th.fc-sun,
.fc th.fc-tue,
.fc th.fc-thu,
.fc th.fc-sat {
    background: #f2f7f8;
}

.fc th.fc-mon,
.fc th.fc-wed,
.fc th.fc-fri {
    background: #f2f7f8;
}

.fc-view {
    margin-top: 0px;
}

.fc-toolbar {
    margin: 0px;
    padding: 24px 0px;
}

.fc-button {
    background: #ffffff;
    border: 1px solid rgba(120, 130, 140, 0.13);
    color: #67757c;
    text-transform: capitalize;
}

.fc-button:hover {
    background: #f2f4f8;
    opacity: 0.8;
}

.fc-text-arrow {
    font-family: inherit;
    font-size: 16px;
}

.fc-state-hover {
    background: #F5F5F5;
}

.fc-unthemed .fc-today {
    border: 1px solid #ef5350;
    background: #f2f4f8 !important;
}

.fc-state-highlight {
    background: #f0f0f0;
}

.fc-cell-overlay {
    background: #f0f0f0;
}

.fc-unthemed .fc-today {
    background: #ffffff;
}

.fc-event {
    border-radius: 0px;
    border: none;
    cursor: move;
    color: #ffffff !important;
    font-size: 13px;
    margin: 1px -1px 0 -1px;
    padding: 5px 5px;
    text-align: center;
    background: var(--admin-panel-color);
}

.calendar-event {
    cursor: move;
    margin: 10px 5px 0 0;
    padding: 6px 10px;
    display: inline-block;
    color: #ffffff;
    min-width: 140px;
    text-align: center;
    background: var(--admin-panel-color);
}

.calendar-event a {
    float: right;
    opacity: 0.6;
    font-size: 10px;
    margin: 4px 0 0 10px;
    color: #ffffff;
}

.fc-basic-view td.fc-week-number span {
    padding-right: 5px;
}

.fc-basic-view .fc-day-number {
    padding: 10px 15px;
    display: inline-block;
}

/*******************/
/*Steam line widget*/
/*******************/
.steamline {
    position: relative;
    border-left: 1px solid rgba(120, 130, 140, 0.13);
    margin-left: 20px;
}

.steamline .sl-left {
    float: left;
    margin-left: -20px;
    z-index: 1;
    width: 40px;
    line-height: 40px;
    text-align: center;
    height: 40px;
    border-radius: 100%;
    color: #ffffff;
    background: #263238;
    margin-right: 15px;
}

.steamline .sl-left img {
    max-width: 40px;
}

.steamline .sl-right {
    padding-left: 50px;
}

.steamline .sl-right .desc,
.steamline .sl-right .inline-photos {
    margin-bottom: 30px;
}

.steamline .sl-item {
    border-bottom: 1px solid rgba(120, 130, 140, 0.13);
    margin: 20px 0;
}

.sl-date {
    font-size: 10px;
    color: #99abb4;
}

.time-item {
    border-color: rgba(120, 130, 140, 0.13);
    padding-bottom: 1px;
    position: relative;
}

.time-item:before {
    content: " ";
    display: table;
}

.time-item:after {
    background-color: #ffffff;
    border-color: rgba(120, 130, 140, 0.13);
    border-radius: 10px;
    border-style: solid;
    border-width: 2px;
    bottom: 0;
    content: '';
    height: 14px;
    left: 0;
    margin-left: -8px;
    position: absolute;
    top: 5px;
    width: 14px;
}

.time-item-item:after {
    content: " ";
    display: table;
}

.item-info {
    margin-bottom: 15px;
    margin-left: 15px;
}

.item-info p {
    margin-bottom: 10px !important;
}

/*******************/
/*Feed widget*/
/*******************/
.feeds {
    margin: 0px;
    padding: 0px;
}

.feeds li {
    list-style: none;
    padding: 10px;
    display: block;
}

.feeds li:hover {
    background: #ebf3f5;
}

.feeds li>div {
    width: 40px;
    height: 40px;
    margin-right: 5px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    border-radius: 100%;
}

.feeds li>div i {
    line-height: 40px;
}

.feeds li span {
    float: right;
    width: auto;
    font-size: 12px;
}

/*******************/
/*Vertical carousel*/
/*******************/
.vert .carousel-item-next.carousel-item-left,
.vert .carousel-item-prev.carousel-item-right {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.vert .carousel-item-next,
.vert .active.carousel-item-right {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100% 0);
}

.vert .carousel-item-prev,
.vert .active.carousel-item-left {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
}

/*******************/
/*social-widgets*/
/*******************/
.social-widget .soc-header {
    padding: 15px;
    text-align: center;
    font-size: 36px;
    color: #fff;
}

.social-widget .soc-header.box-facebook {
    background: #3b5998;
}

.social-widget .soc-header.box-twitter {
    background: #00aced;
}

.social-widget .soc-header.box-google {
    background: #f86c6b;
}

.social-widget .soc-header.box-linkedin {
    background: #4875b4;
}

.social-widget .soc-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
}

.social-widget .soc-content div {
    padding: 10px;
}

.social-widget .soc-content div h3 {
    margin-bottom: 0px;
}

/*******************/
/*Guage chart*/
/*******************/
.gaugejs-box {
    position: relative;
    margin: 0 auto;
}

.gaugejs-box canvas.gaugejs {
    width: 100% !important;
    height: auto !important;
}

/*******************/
/*social-profile-first*/
/*******************/
.social-profile-first {
    text-align: center;
    padding-top: 22%;
    margin-bottom: 96px;
}

.social-profile-first.bg-over {
    background: rgba(56, 83, 161, 0.7);
}

.social-profile-first .middle {
    vertical-align: middle;
}

/*******************/
/*country-state*/
/*******************/
.country-state {
    list-style: none;
    margin: 0;
    padding: 0 0 0 10px;
}

.country-state li {
    margin-top: 30px;
    margin-bottom: 10px;
}

.country-state h2 {
    margin-bottom: 0px;
    font-weight: 400;
}

/*******************/
/*profile timeline widget*/
/*******************/
.profiletimeline {
    position: relative;
    padding-left: 40px;
    margin-right: 10px;
    border-left: 1px solid rgba(120, 130, 140, 0.13);
    margin-left: 30px;
}

.profiletimeline .sl-left {
    float: left;
    margin-left: -60px;
    z-index: 1;
    margin-right: 15px;
}

.profiletimeline .sl-left img {
    max-width: 40px;
}

.profiletimeline .sl-item {
    margin-top: 8px;
    margin-bottom: 30px;
}

.profiletimeline .sl-date {
    font-size: 12px;
    color: #99abb4;
}

.profiletimeline .time-item {
    border-color: rgba(120, 130, 140, 0.13);
    padding-bottom: 1px;
    position: relative;
}

.profiletimeline .time-item:before {
    content: " ";
    display: table;
}

.profiletimeline .time-item:after {
    background-color: #ffffff;
    border-color: rgba(120, 130, 140, 0.13);
    border-radius: 10px;
    border-style: solid;
    border-width: 2px;
    bottom: 0;
    content: '';
    height: 14px;
    left: 0;
    margin-left: -8px;
    position: absolute;
    top: 5px;
    width: 14px;
}

.profiletimeline .time-item-item:after {
    content: " ";
    display: table;
}

.profiletimeline .item-info {
    margin-bottom: 15px;
    margin-left: 15px;
}

.profiletimeline .item-info p {
    margin-bottom: 10px !important;
}

/*Blog widgets*/
.blog-widget {
    margin-top: 30px;
}

.blog-widget .blog-image img {
    border-radius: 4px;
    margin-top: -45px;
    margin-bottom: 20px;
    -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
}

/*Weather smal;*/
.weather-small h1 {
    line-height: 30px;
}

.weather-small sup {
    font-size: 60%;
}

/*little-profile*/
.little-profile .pro-img {
    margin-top: -80px;
    margin-bottom: 20px;
}

.little-profile .pro-img img {
    width: 128px;
    height: 128px;
    -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);
    border-radius: 100%;
}

.contact-box {
    position: relative;
}

.contact-box .add-ct-btn {
    position: absolute;
    right: 4px;
    top: -46px;
}

.contact-box .contact-widget>a {
    padding: 15px 10px;
}

.contact-box .contact-widget>a .user-img {
    margin-bottom: 0px !important;
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
@media (min-width: 1600px) {

    .col-xlg-1,
    .col-xlg-10,
    .col-xlg-11,
    .col-xlg-12,
    .col-xlg-2,
    .col-xlg-3,
    .col-xlg-4,
    .col-xlg-5,
    .col-xlg-6,
    .col-xlg-7,
    .col-xlg-8,
    .col-xlg-9 {
        float: left;
    }

    .col-xlg-12 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 100%;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-xlg-11 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 91.66666667%;
        -ms-flex: 0 0 91.66666667%;
        flex: 0 0 91.66666667%;
        max-width: 91.66666667%;
    }

    .col-xlg-10 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 83.33333333%;
        -ms-flex: 0 0 83.33333333%;
        flex: 0 0 83.33333333%;
        max-width: 83.33333333%;
    }

    .col-xlg-9 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 75%;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-xlg-8 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 66.66666667%;
        -ms-flex: 0 0 66.66666667%;
        flex: 0 0 66.66666667%;
        max-width: 66.66666667%;
    }

    .col-xlg-7 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 58.33333333%;
        -ms-flex: 0 0 58.33333333%;
        flex: 0 0 58.33333333%;
        max-width: 58.33333333%;
    }

    .col-xlg-6 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 50%;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-xlg-5 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 41.66666667%;
        -ms-flex: 0 0 41.66666667%;
        flex: 0 0 41.66666667%;
        max-width: 41.66666667%;
    }

    .col-xlg-4 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 33.33333333%;
        -ms-flex: 0 0 33.33333333%;
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%;
    }

    .col-xlg-3 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 25%;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-xlg-2 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 16.66666667%;
        -ms-flex: 0 0 16.66666667%;
        flex: 0 0 16.66666667%;
        max-width: 16.66666667%;
    }

    .col-xlg-1 {
        -webkit-box-flex: 0;
        -webkit-flex: 0 0 8.33333333%;
        -ms-flex: 0 0 8.33333333%;
        flex: 0 0 8.33333333%;
        max-width: 8.33333333%;
    }

    .col-xlg-pull-12 {
        right: 100%;
    }

    .col-xlg-pull-11 {
        right: 91.66666667%;
    }

    .col-xlg-pull-10 {
        right: 83.33333333%;
    }

    .col-xlg-pull-9 {
        right: 75%;
    }

    .col-xlg-pull-8 {
        right: 66.66666667%;
    }

    .col-xlg-pull-7 {
        right: 58.33333333%;
    }

    .col-xlg-pull-6 {
        right: 50%;
    }

    .col-xlg-pull-5 {
        right: 41.66666667%;
    }

    .col-xlg-pull-4 {
        right: 33.33333333%;
    }

    .col-xlg-pull-3 {
        right: 25%;
    }

    .col-xlg-pull-2 {
        right: 16.66666667%;
    }

    .col-xlg-pull-1 {
        right: 8.33333333%;
    }

    .col-xlg-pull-0 {
        right: auto;
    }

    .col-xlg-push-12 {
        left: 100%;
    }

    .col-xlg-push-11 {
        left: 91.66666667%;
    }

    .col-xlg-push-10 {
        left: 83.33333333%;
    }

    .col-xlg-push-9 {
        left: 75%;
    }

    .col-xlg-push-8 {
        left: 66.66666667%;
    }

    .col-xlg-push-7 {
        left: 58.33333333%;
    }

    .col-xlg-push-6 {
        left: 50%;
    }

    .col-xlg-push-5 {
        left: 41.66666667%;
    }

    .col-xlg-push-4 {
        left: 33.33333333%;
    }

    .col-xlg-push-3 {
        left: 25%;
    }

    .col-xlg-push-2 {
        left: 16.66666667%;
    }

    .col-xlg-push-1 {
        left: 8.33333333%;
    }

    .col-xlg-push-0 {
        left: auto;
    }

    .offset-xlg-12 {
        margin-left: 100%;
    }

    .offset-xlg-11 {
        margin-left: 91.66666667%;
    }

    .offset-xlg-10 {
        margin-left: 83.33333333%;
    }

    .offset-xlg-9 {
        margin-left: 75%;
    }

    .offset-xlg-8 {
        margin-left: 66.66666667%;
    }

    .offset-xlg-7 {
        margin-left: 58.33333333%;
    }

    .offset-xlg-6 {
        margin-left: 50%;
    }

    .offset-xlg-5 {
        margin-left: 41.66666667%;
    }

    .offset-xlg-4 {
        margin-left: 33.33333333%;
    }

    .offset-xlg-3 {
        margin-left: 25%;
    }

    .offset-xlg-2 {
        margin-left: 16.66666667%;
    }

    .offset-xlg-1 {
        margin-left: 8.33333333%;
    }

    .offset-xlg-0 {
        margin-left: 0;
    }
}

.col-xlg-1,
.col-xlg-10,
.col-xlg-11,
.col-xlg-12,
.col-xlg-2,
.col-xlg-3,
.col-xlg-4,
.col-xlg-5,
.col-xlg-6,
.col-xlg-7,
.col-xlg-8,
.col-xlg-9 {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

/*-------------------*/
/*Bootstrap 4 hack*/
/*-------------------*/
.bootstrap-touchspin .input-group-btn {
    -webkit-box-align: normal;
    -ms-flex-align: normal;
    align-items: normal;
}

.form-control-danger,
.form-control-success,
.form-control-warning {
    padding-right: 2.25rem;
    background-repeat: no-repeat;
    background-position: center right .5625rem;
    -webkit-background-size: 1.125rem 1.125rem;
    background-size: 1.125rem 1.125rem;
}

.has-success .col-form-label,
.has-success .custom-control,
.has-success .form-check-label,
.has-success .form-control-feedback,
.has-success .form-control-label {
    color: #26dad2;
}

.has-success .form-control-success {
    background-image: url(../../assets/images/icon/success.svg);
}

.has-success .form-control {
    border-color: #26dad2;
}

.has-warning .col-form-label,
.has-warning .custom-control,
.has-warning .form-check-label,
.has-warning .form-control-feedback,
.has-warning .form-control-label {
    color: var(--admin-panel-color);
}

.has-warning .form-control-warning {
    background-image: url(../../assets/images/icon/warning.svg);
}

.has-warning .form-control {
    border-color: var(--admin-panel-color);
}

.has-danger .col-form-label,
.has-danger .custom-control,
.has-danger .form-check-label,
.has-danger .form-control-feedback,
.has-danger .form-control-label {
    color: #ef5350;
}

.has-danger .form-control-danger {
    background-image: url(../../assets/images/icon/danger.svg);
}

.has-danger .form-control {
    border-color: #ef5350;
}

.input-group-addon [type="radio"]:not(:checked),
.input-group-addon [type="radio"]:checked,
.input-group-addon [type="checkbox"]:not(:checked),
.input-group-addon [type="checkbox"]:checked {
    position: initial;
    opacity: 1;
}

.invisible {
    visibility: hidden !important;
}

.hidden-xs-up {
    display: none !important;
}

@media (max-width: 575px) {
    .hidden-xs-down {
        display: none !important;
    }
}

@media (min-width: 576px) {
    .hidden-sm-up {
        display: none !important;
    }
}

@media (max-width: 767px) {
    .hidden-sm-down {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .hidden-md-up {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .hidden-md-down {
        display: none !important;
    }
}

@media (min-width: 992px) {
    .hidden-lg-up {
        display: none !important;
    }
}

@media (max-width: 1199px) {
    .hidden-lg-down {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hidden-xl-up {
        display: none !important;
    }
}

.hidden-xl-down {
    display: none !important;
}

.card-inverse .card-blockquote,
.card-inverse .card-footer,
.card-inverse .card-header,
.card-inverse .card-title {
    color: #ffffff;
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*==============================================================
 For Laptop & above all (1650px)
 ============================================================== */
@media (min-width: 1650px) {
    .widget-app-columns {
        -webkit-column-count: 3;
        column-count: 3;
    }

    .campaign {
        height: 365px !important;
    }
}

/*==============================================================
 For Laptop & above all (1370px)
 ============================================================== */
@media (max-width: 1370px) {
    .widget-app-columns {
        -webkit-column-count: 2;
        column-count: 2;
    }
}

/*-- ==============================================================
 Small Desktop & above all (1024px)
 ============================================================== */
@media (min-width: 1024px) {
    .page-wrapper {
        padding-left: 265px;
    }

    .footer {
        left: 148px;
    }
}

@media (max-width: 1023px) {
    .page-wrapper {
        margin-left: 60px;
        -webkit-transition: 0.2s ease-in;
        -o-transition: 0.2s ease-in;
        transition: 0.2s ease-in;
    }

    .footer {
        left: 60px;
    }

    .widget-app-columns {
        -webkit-column-count: 1;
        column-count: 1;
    }

    .inbox-center a {
        width: 200px;
    }
}

/*-- ==============================================================
 Ipad & above all(768px)
 ============================================================== */
@media (min-width: 768px) {
    .navbar-header {
        width: 265px;
        -ms-flex-negative: 0;
        flex-shrink: 0;
    }

    .navbar-header .navbar-brand {
        padding-top: 0px;
    }

    /*This is for the breeadcrumd*/
    .page-titles .breadcrumb {
        float: right;
    }

    .card-group .card:first-child,
    .card-group .card:not(:first-child):not(:last-child) {
        border-right: 1px solid rgba(0, 0, 0, 0.03);
    }

    .material-icon-list-demo .icons div {
        width: 33%;
        padding: 15px;
        display: inline-block;
        line-height: 40px;
    }

    .mini-sidebar .page-wrapper {
        padding-left: 60px;
    }

    .mini-sidebar .footer {
        left: 60px;
    }

    .flex-wrap {
        -ms-flex-wrap: nowrap !important;
        flex-wrap: nowrap !important;
        -webkit-flex-wrap: nowrap !important;
    }
}

/*-- ==============================================================
 Phone and below ipad(767px)
 ============================================================== */
@media (max-width: 767px) {

    /*Header*/
    .topbar {
        position: fixed;
        width: 100%;
        top: 0;
        bottom: auto !important;
    }

    .topbar .top-navbar {
        padding-right: 15px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-align-items: center;
    }

    .topbar .top-navbar .navbar-collapse {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
    }

    .topbar .top-navbar .navbar-nav {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .topbar .top-navbar .navbar-nav>.nav-item.show {
        position: static;
    }

    .topbar .top-navbar .navbar-nav>.nav-item.show .dropdown-menu {
        width: 100%;
        margin-top: 0px;
    }

    .topbar .top-navbar .navbar-nav>.nav-item>.nav-link {
        padding-left: .50rem;
        padding-right: .50rem;
    }

    .topbar .top-navbar .navbar-nav .dropdown-menu {
        position: absolute;
    }

    .mega-dropdown .dropdown-menu {
        height: 480px;
        overflow: auto;
    }

    /*Sidebar and wrapper*/
    .mini-sidebar .page-wrapper {
        margin-left: 0px;
        padding-top: 60px;
    }

    .comment-text .comment-footer .action-icons {
        display: block;
        padding: 10px 0;
    }

    .vtabs .tabs-vertical {
        width: auto;
    }

    /*Footer*/
    .footer {
        left: 0px;
    }

    .material-icon-list-demo .icons div {
        width: 100%;
    }

    .error-page .footer {
        position: fixed;
        bottom: 0px;
        z-index: 10;
    }

    .error-box {
        position: relative;
        padding-bottom: 60px;
    }

    .error-body {
        padding-top: 10%;
    }

    .error-body h1 {
        font-size: 100px;
        font-weight: 600;
        line-height: 100px;
    }

    .login-register {
        position: relative;
        overflow: hidden;
    }

    .login-box {
        width: 90%;
    }

    .login-sidebar {
        padding: 10% 0;
    }

    .login-sidebar .login-box {
        position: relative;
    }

    /*This is for chat page*/
    .chat-main-box .chat-left-aside {
        left: -250px;
        position: absolute;
        -webkit-transition: 0.5s ease-in;
        -o-transition: 0.5s ease-in;
        transition: 0.5s ease-in;
        background: #ffffff;
    }

    .chat-main-box .chat-left-aside.open-pnl {
        left: 0px;
    }

    .chat-main-box .chat-left-aside .open-panel {
        display: block;
    }

    .chat-main-box .chat-right-aside {
        width: 100%;
    }

    /*Timeline*/
    ul.timeline:before {
        left: 40px;
    }

    ul.timeline>li>.timeline-panel {
        width: calc(100% - 90px);
    }

    ul.timeline>li>.timeline-badge {
        top: 16px;
        left: 15px;
        margin-left: 0;
    }

    ul.timeline>li>.timeline-panel {
        float: right;
    }

    ul.timeline>li>.timeline-panel:before {
        right: auto;
        left: -15px;
        border-right-width: 15px;
        border-left-width: 0;
    }

    ul.timeline>li>.timeline-panel:after {
        right: auto;
        left: -14px;
        border-right-width: 14px;
        border-left-width: 0;
    }

    /*Contact app page*/
    .left-aside {
        width: 100%;
        position: relative;
        border: 0px;
    }

    .right-aside {
        margin-left: 0px;
    }

    .flex-wrap {
        -ms-flex-wrap: wrap !important;
        flex-wrap: wrap !important;
        -webkit-flex-wrap: wrap !important;
    }

    .chat-list li .chat-content {
        width: calc(100% - 80px);
    }
}

/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/*Theme Colors*/
/*bootstrap Color*/
/*Light colors*/
/*Normal Color*/
/*Extra Variable*/
/*Preloader*/
.preloader {
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
    background: #fff;
}

.preloader .cssload-speeding-wheel {
    position: absolute;
    top: calc(50% - 3.5px);
    left: calc(50% - 3.5px);
}

/* Radio Buttons
   ========================================================================== */
[type="radio"]:not(:checked),
[type="radio"]:checked {
    position: absolute;
    left: -9999px;
    opacity: 0;
}

[type="radio"]:not(:checked)+label,
[type="radio"]:checked+label {
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    font-size: 1rem;
    -webkit-transition: .28s ease;
    -o-transition: .28s ease;
    transition: .28s ease;
    /* webkit (konqueror) browsers */
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

[type="radio"]+label:before,
[type="radio"]+label:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    margin: 4px;
    width: 16px;
    height: 16px;
    z-index: 0;
    -webkit-transition: .28s ease;
    -o-transition: .28s ease;
    transition: .28s ease;
}

/* Unchecked styles */
[type="radio"]:not(:checked)+label:before,
[type="radio"]:not(:checked)+label:after,
[type="radio"]:checked+label:before,
[type="radio"]:checked+label:after,
[type="radio"].with-gap:checked+label:before,
[type="radio"].with-gap:checked+label:after {
    border-radius: 50%;
}

[type="radio"]:not(:checked)+label:before,
[type="radio"]:not(:checked)+label:after {
    border: 1px solid #b1b8bb;
}

[type="radio"]:not(:checked)+label:after {
    z-index: -1;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
}

/* Checked styles */
[type="radio"]:checked+label:before {
    border: 2px solid transparent;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"]:checked+label:after,
[type="radio"].with-gap:checked+label:before,
[type="radio"].with-gap:checked+label:after {
    border: 2px solid #26a69a;
}

[type="radio"]:checked+label:after,
[type="radio"].with-gap:checked+label:after {
    background-color: #26a69a;
    z-index: 0;
}

[type="radio"]:checked+label:after {
    -webkit-transform: scale(1.02);
    -ms-transform: scale(1.02);
    transform: scale(1.02);
}

/* Radio With gap */
[type="radio"].with-gap:checked+label:after {
    -webkit-transform: scale(0.5);
    -ms-transform: scale(0.5);
    transform: scale(0.5);
}

/* Focused styles */
[type="radio"].tabbed:focus+label:before {
    -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

/* Disabled Radio With gap */
[type="radio"].with-gap:disabled:checked+label:before {
    border: 2px solid rgba(0, 0, 0, 0.26);
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap:disabled:checked+label:after {
    border: none;
    background-color: rgba(0, 0, 0, 0.26);
}

/* Disabled style */
[type="radio"]:disabled:not(:checked)+label:before,
[type="radio"]:disabled:checked+label:before {
    background-color: transparent;
    border-color: rgba(0, 0, 0, 0.26);
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"]:disabled+label {
    color: rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled:not(:checked)+label:before {
    border-color: rgba(0, 0, 0, 0.26);
}

[type="radio"]:disabled:checked+label:after {
    background-color: rgba(0, 0, 0, 0.26);
    border-color: #BDBDBD;
}

/* Checkboxes
   ========================================================================== */
/* CUSTOM CSS CHECKBOXES */
form p {
    margin-bottom: 10px;
    text-align: left;
}

form p:last-child {
    margin-bottom: 0;
}

/* Remove default checkbox */
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
    position: absolute;
    left: -9999px;
    opacity: 0;
}

#userTable .dtr-control .is_open,
#userTable #is_active {
    left: auto !important;
}

html[lang="ar"] #roleTable #is_active {
    left: auto !important;
}

html[lang="ar"] .sis-card-content input {
    left: auto !important;
}

[type="checkbox"] {
    /* checkbox aspect */
}

[type="checkbox"]+label {
    position: relative;
    padding-left: 35px;
    cursor: pointer;
    display: inline-block;
    height: 25px;
    line-height: 25px;
    font-size: 1rem;
    -webkit-user-select: none;
    /* webkit (safari, chrome) browsers */
    -moz-user-select: none;
    /* mozilla browsers */
    -khtml-user-select: none;
    /* webkit (konqueror) browsers */
    -ms-user-select: none;
    /* IE10+ */
}

[type="checkbox"]+label:before,
[type="checkbox"]:not(.filled-in)+label:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 18px;
    height: 18px;
    z-index: 0;
    border: 1px solid #b1b8bb;
    border-radius: 1px;
    margin-top: 2px;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
}

[type="checkbox"]:not(.filled-in)+label:after {
    border: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
}

[type="checkbox"]:not(:checked):disabled+label:before {
    border: none;
    background-color: rgba(0, 0, 0, 0.26);
}

[type="checkbox"].tabbed:focus+label:after {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    border: 0;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
    background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"]:checked+label:before {
    top: -4px;
    left: -5px;
    width: 12px;
    height: 22px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #26a69a;
    border-bottom: 2px solid #26a69a;
    -webkit-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

[type="checkbox"]:checked:disabled+label:before {
    border-right: 2px solid rgba(0, 0, 0, 0.26);
    border-bottom: 2px solid rgba(0, 0, 0, 0.26);
}

/* Indeterminate checkbox */
[type="checkbox"]:indeterminate+label:before {
    top: -11px;
    left: -12px;
    width: 10px;
    height: 22px;
    border-top: none;
    border-left: none;
    border-right: 2px solid #26a69a;
    border-bottom: none;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

[type="checkbox"]:indeterminate:disabled+label:before {
    border-right: 2px solid rgba(0, 0, 0, 0.26);
    background-color: transparent;
}

[type="checkbox"].filled-in+label:after {
    border-radius: 2px;
}

[type="checkbox"].filled-in+label:before,
[type="checkbox"].filled-in+label:after {
    content: '';
    left: 0;
    position: absolute;
    /* .1s delay is for check animation */
    -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
    -o-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
    transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
    z-index: 1;
}

[type="checkbox"].filled-in:not(:checked)+label:before {
    width: 0;
    height: 0;
    border: 3px solid transparent;
    left: 6px;
    top: 10px;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 20% 40%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:not(:checked)+label:after {
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 1px solid #b1b8bb;
    top: 0px;
    z-index: 0;
}

[type="checkbox"].filled-in:checked+label:before {
    top: 0;
    left: 1px;
    width: 8px;
    height: 13px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

[type="checkbox"].filled-in:checked+label:after {
    top: 0;
    width: 20px;
    height: 20px;
    border: 2px solid #26a69a;
    background-color: #26a69a;
    z-index: 0;
}

[type="checkbox"].filled-in.tabbed:focus+label:after {
    border-radius: 2px;
    border-color: #5a5a5a;
    background-color: rgba(0, 0, 0, 0.1);
}

[type="checkbox"].filled-in.tabbed:checked:focus+label:after {
    border-radius: 2px;
    background-color: #26a69a;
    border-color: #26a69a;
}

[type="checkbox"].filled-in:disabled:not(:checked)+label:before {
    background-color: transparent;
    border: 2px solid transparent;
}

[type="checkbox"].filled-in:disabled:not(:checked)+label:after {
    border-color: transparent;
    background-color: #BDBDBD;
}

[type="checkbox"].filled-in:disabled:checked+label:before {
    background-color: transparent;
}

[type="checkbox"].filled-in:disabled:checked+label:after {
    background-color: #BDBDBD;
    border-color: #BDBDBD;
}

/* Switch
   ========================================================================== */
.switch,
.switch * {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
}

.switch label {
    cursor: pointer;
}

.switch label input[type=checkbox] {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch label input[type=checkbox]:checked+.lever {
    background-color: #84c7c1;
}

.switch label input[type=checkbox]:checked+.lever:after {
    background-color: #26a69a;
    left: 24px;
}

.switch label .lever {
    content: "";
    display: inline-block;
    position: relative;
    width: 40px;
    height: 15px;
    background-color: #818181;
    border-radius: 15px;
    margin-right: 10px;
    -webkit-transition: background 0.3s ease;
    -o-transition: background 0.3s ease;
    transition: background 0.3s ease;
    vertical-align: middle;
    margin: 0 16px;
}

.switch label .lever:after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 21px;
    height: 21px;
    background-color: #F1F1F1;
    border-radius: 21px;
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4);
    left: -5px;
    top: -3px;
    -webkit-transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease;
    transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease;
    -o-transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease;
    transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease;
    transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, -webkit-box-shadow 0.1s ease;
}

input[type=checkbox]:checked:not(:disabled)~.lever:active::after,
input[type=checkbox]:checked:not(:disabled).tabbed:focus~.lever::after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 166, 154, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 166, 154, 0.1);
}

input[type=checkbox]:not(:disabled)~.lever:active:after,
input[type=checkbox]:not(:disabled).tabbed:focus~.lever::after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.08);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.08);
}

.switch input[type=checkbox][disabled]+.lever {
    cursor: default;
}

.switch label input[type=checkbox][disabled]+.lever:after,
.switch label input[type=checkbox][disabled]:checked+.lever:after {
    background-color: #BDBDBD;
}

.scale-up {
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    display: inline-block;
    -webkit-transform-origin: right 0px;
    -ms-transform-origin: right 0px;
    transform-origin: right 0px;
}

.scale-up-left {
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    display: inline-block;
    -webkit-transform-origin: left 0px;
    -ms-transform-origin: left 0px;
    transform-origin: left 0px;
}

.show>.scale-up {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: right 0px;
    -ms-transform-origin: right 0px;
    transform-origin: right 0px;
}

.show>.scale-up-left {
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-transform: scale(1);
    -webkit-transform-origin: left 0px;
    -ms-transform-origin: left 0px;
    transform-origin: left 0px;
}

/*panels*/
.card {
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

.well,
pre {
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.page-titles .justify-content-end:last-child .d-flex {
    margin-right: 10px;
}

.btn-circle.right-side-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
    padding: 25px;
    z-index: 10;
}

/*Radio button*/
@-webkit-keyframes ripple {
    0% {
        -webkit-box-shadow: 0px 0px 0px 1px transparent;
        box-shadow: 0px 0px 0px 1px transparent;
    }

    50% {
        -webkit-box-shadow: 0px 0px 0px 15px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 0px 0px 15px rgba(0, 0, 0, 0.1);
    }

    100% {
        -webkit-box-shadow: 0px 0px 0px 15px transparent;
        box-shadow: 0px 0px 0px 15px transparent;
    }
}

@keyframes ripple {
    0% {
        -webkit-box-shadow: 0px 0px 0px 1px transparent;
        box-shadow: 0px 0px 0px 1px transparent;
    }

    50% {
        -webkit-box-shadow: 0px 0px 0px 15px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 0px 0px 15px rgba(0, 0, 0, 0.1);
    }

    100% {
        -webkit-box-shadow: 0px 0px 0px 15px transparent;
        box-shadow: 0px 0px 0px 15px transparent;
    }
}

/*Bootstrap Select*/
.bootstrap-select.btn-group .dropdown-menu {
    margin-top: -40px;
    -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}

.demo-checkbox label,
.demo-radio-button label {
    min-width: 200px;
    margin-bottom: 20px;
}

.demo-swtich .demo-switch-title,
.demo-swtich .switch {
    width: 150px;
    margin-bottom: 10px;
    display: inline-block;
}

.table tr th.delete-all [type="checkbox"]+label,
.table tr td.delete-all [type="checkbox"]+label {
    margin-bottom: 0;
}

.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    background-position: center bottom, center calc(100% - -1px);
}

[type="checkbox"]+label {
    padding-left: 26px;
    height: 25px;
    line-height: 21px;
    font-weight: normal;
}

[type="checkbox"]:checked+label:before {
    top: -4px;
    left: -2px;
    width: 11px;
    height: 19px;
}

[type="checkbox"]:checked.chk-col-red+label:before {
    border-right: 2px solid #fb3a3a;
    border-bottom: 2px solid #fb3a3a;
}

[type="checkbox"]:checked.chk-col-pink+label:before {
    border-right: 2px solid #E91E63;
    border-bottom: 2px solid #E91E63;
}

[type="checkbox"]:checked.chk-col-purple+label:before {
    border-right: 2px solid #ebc51a;
    border-bottom: 2px solid #ebc51a;
}

[type="checkbox"]:checked.chk-col-deep-purple+label:before {
    border-right: 2px solid #673AB7;
    border-bottom: 2px solid #673AB7;
}

[type="checkbox"]:checked.chk-col-indigo+label:before {
    border-right: 2px solid #3F51B5;
    border-bottom: 2px solid #3F51B5;
}

[type="checkbox"]:checked.chk-col-blue+label:before {
    border-right: 2px solid #02bec9;
    border-bottom: 2px solid #02bec9;
}

[type="checkbox"]:checked.chk-col-light-blue+label:before {
    border-right: 2px solid #03A9F4;
    border-bottom: 2px solid #03A9F4;
}

[type="checkbox"]:checked.chk-col-cyan+label:before {
    border-right: 2px solid #00BCD4;
    border-bottom: 2px solid #00BCD4;
}

[type="checkbox"]:checked.chk-col-teal+label:before {
    border-right: 2px solid #009688;
    border-bottom: 2px solid #009688;
}

[type="checkbox"]:checked.chk-col-green+label:before {
    border-right: 2px solid #26c6da;
    border-bottom: 2px solid #26c6da;
}

[type="checkbox"]:checked.chk-col-light-green+label:before {
    border-right: 2px solid #8BC34A;
    border-bottom: 2px solid #8BC34A;
}

[type="checkbox"]:checked.chk-col-lime+label:before {
    border-right: 2px solid #CDDC39;
    border-bottom: 2px solid #CDDC39;
}

[type="checkbox"]:checked.chk-col-yellow+label:before {
    border-right: 2px solid #ffe821;
    border-bottom: 2px solid #ffe821;
}

[type="checkbox"]:checked.chk-col-amber+label:before {
    border-right: 2px solid #FFC107;
    border-bottom: 2px solid #FFC107;
}

[type="checkbox"]:checked.chk-col-orange+label:before {
    border-right: 2px solid #FF9800;
    border-bottom: 2px solid #FF9800;
}

[type="checkbox"]:checked.chk-col-deep-orange+label:before {
    border-right: 2px solid #FF5722;
    border-bottom: 2px solid #FF5722;
}

[type="checkbox"]:checked.chk-col-brown+label:before {
    border-right: 2px solid #795548;
    border-bottom: 2px solid #795548;
}

[type="checkbox"]:checked.chk-col-grey+label:before {
    border-right: 2px solid #9E9E9E;
    border-bottom: 2px solid #9E9E9E;
}

[type="checkbox"]:checked.chk-col-blue-grey+label:before {
    border-right: 2px solid #607D8B;
    border-bottom: 2px solid #607D8B;
}

[type="checkbox"]:checked.chk-col-black+label:before {
    border-right: 2px solid #000000;
    border-bottom: 2px solid #000000;
}

[type="checkbox"]:checked.chk-col-white+label:before {
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
}

[type="checkbox"].filled-in:checked+label:after {
    top: 0;
    width: 20px;
    height: 20px;
    border: 2px solid #26a69a;
    background-color: #26a69a;
    z-index: 0;
}

[type="checkbox"].filled-in:checked+label:before {
    border-right: 2px solid #fff !important;
    border-bottom: 2px solid #fff !important;
}

[type="checkbox"].filled-in:checked.chk-col-red+label:after {
    border: 2px solid #fb3a3a;
    background-color: #fb3a3a;
}

[type="checkbox"].filled-in:checked.chk-col-pink+label:after {
    border: 2px solid #E91E63;
    background-color: #E91E63;
}

[type="checkbox"].filled-in:checked.chk-col-purple+label:after {
    border: 2px solid #ebc51a;
    background-color: #ebc51a;
}

[type="checkbox"].filled-in:checked.chk-col-deep-purple+label:after {
    border: 2px solid #673AB7;
    background-color: #673AB7;
}

[type="checkbox"].filled-in:checked.chk-col-indigo+label:after {
    border: 2px solid #3F51B5;
    background-color: #3F51B5;
}

[type="checkbox"].filled-in:checked.chk-col-blue+label:after {
    border: 2px solid #02bec9;
    background-color: #02bec9;
}

[type="checkbox"].filled-in:checked.chk-col-light-blue+label:after {
    border: 2px solid #03A9F4;
    background-color: #03A9F4;
}

[type="checkbox"].filled-in:checked.chk-col-cyan+label:after {
    border: 2px solid #00BCD4;
    background-color: #00BCD4;
}

[type="checkbox"].filled-in:checked.chk-col-teal+label:after {
    border: 2px solid #009688;
    background-color: #009688;
}

[type="checkbox"].filled-in:checked.chk-col-green+label:after {
    border: 2px solid #26c6da;
    background-color: #26c6da;
}

[type="checkbox"].filled-in:checked.chk-col-light-green+label:after {
    border: 2px solid #8BC34A;
    background-color: #8BC34A;
}

[type="checkbox"].filled-in:checked.chk-col-lime+label:after {
    border: 2px solid #CDDC39;
    background-color: #CDDC39;
}

[type="checkbox"].filled-in:checked.chk-col-yellow+label:after {
    border: 2px solid #ffe821;
    background-color: #ffe821;
}

[type="checkbox"].filled-in:checked.chk-col-amber+label:after {
    border: 2px solid #FFC107;
    background-color: #FFC107;
}

[type="checkbox"].filled-in:checked.chk-col-orange+label:after {
    border: 2px solid #FF9800;
    background-color: #FF9800;
}

[type="checkbox"].filled-in:checked.chk-col-deep-orange+label:after {
    border: 2px solid #FF5722;
    background-color: #FF5722;
}

[type="checkbox"].filled-in:checked.chk-col-brown+label:after {
    border: 2px solid #795548;
    background-color: #795548;
}

[type="checkbox"].filled-in:checked.chk-col-grey+label:after {
    border: 2px solid #9E9E9E;
    background-color: #9E9E9E;
}

[type="checkbox"].filled-in:checked.chk-col-blue-grey+label:after {
    border: 2px solid #607D8B;
    background-color: #607D8B;
}

[type="checkbox"].filled-in:checked.chk-col-black+label:after {
    border: 2px solid #000000;
    background-color: #000000;
}

[type="checkbox"].filled-in:checked.chk-col-white+label:after {
    border: 2px solid #ffffff;
    background-color: #ffffff;
}

[type="radio"]:not(:checked)+label {
    padding-left: 26px;
    height: 25px;
    line-height: 25px;
    font-weight: normal;
}

[type="radio"]:checked+label {
    padding-left: 26px;
    height: 25px;
    line-height: 25px;
    font-weight: normal;
}

[type="radio"].radio-col-red:checked+label:after {
    background-color: #fb3a3a;
    border-color: #fb3a3a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-pink:checked+label:after {
    background-color: #E91E63;
    border-color: #E91E63;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-purple:checked+label:after {
    background-color: #ebc51a;
    border-color: #ebc51a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-deep-purple:checked+label:after {
    background-color: #673AB7;
    border-color: #673AB7;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-indigo:checked+label:after {
    background-color: #3F51B5;
    border-color: #3F51B5;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-blue:checked+label:after {
    background-color: #02bec9;
    border-color: #02bec9;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-light-blue:checked+label:after {
    background-color: #03A9F4;
    border-color: #03A9F4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-cyan:checked+label:after {
    background-color: #00BCD4;
    border-color: #00BCD4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-teal:checked+label:after {
    background-color: #009688;
    border-color: #009688;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-green:checked+label:after {
    background-color: #26c6da;
    border-color: #26c6da;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-light-green:checked+label:after {
    background-color: #8BC34A;
    border-color: #8BC34A;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-lime:checked+label:after {
    background-color: #CDDC39;
    border-color: #CDDC39;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-yellow:checked+label:after {
    background-color: #ffe821;
    border-color: #ffe821;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-amber:checked+label:after {
    background-color: #FFC107;
    border-color: #FFC107;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-orange:checked+label:after {
    background-color: #FF9800;
    border-color: #FF9800;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-deep-orange:checked+label:after {
    background-color: #FF5722;
    border-color: #FF5722;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-brown:checked+label:after {
    background-color: #795548;
    border-color: #795548;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-grey:checked+label:after {
    background-color: #9E9E9E;
    border-color: #9E9E9E;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-blue-grey:checked+label:after {
    background-color: #607D8B;
    border-color: #607D8B;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-black:checked+label:after {
    background-color: #000000;
    border-color: #000000;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].radio-col-white:checked+label:after {
    background-color: #ffffff;
    border-color: #ffffff;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-red:checked+label:before {
    border: 2px solid #fb3a3a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-red:checked+label:after {
    background-color: #fb3a3a;
    border: 2px solid #fb3a3a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-pink:checked+label:before {
    border: 2px solid #E91E63;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-pink:checked+label:after {
    background-color: #E91E63;
    border: 2px solid #E91E63;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-purple:checked+label:before {
    border: 2px solid #ebc51a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-purple:checked+label:after {
    background-color: #ebc51a;
    border: 2px solid #ebc51a;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-deep-purple:checked+label:before {
    border: 2px solid #673AB7;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-deep-purple:checked+label:after {
    background-color: #673AB7;
    border: 2px solid #673AB7;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-indigo:checked+label:before {
    border: 2px solid #3F51B5;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-indigo:checked+label:after {
    background-color: #3F51B5;
    border: 2px solid #3F51B5;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-blue:checked+label:before {
    border: 2px solid #02bec9;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-blue:checked+label:after {
    background-color: #02bec9;
    border: 2px solid #02bec9;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-light-blue:checked+label:before {
    border: 2px solid #03A9F4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-light-blue:checked+label:after {
    background-color: #03A9F4;
    border: 2px solid #03A9F4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-cyan:checked+label:before {
    border: 2px solid #00BCD4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-cyan:checked+label:after {
    background-color: #00BCD4;
    border: 2px solid #00BCD4;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-teal:checked+label:before {
    border: 2px solid #009688;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-teal:checked+label:after {
    background-color: #009688;
    border: 2px solid #009688;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-green:checked+label:before {
    border: 2px solid #26c6da;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-green:checked+label:after {
    background-color: #26c6da;
    border: 2px solid #26c6da;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-light-green:checked+label:before {
    border: 2px solid #8BC34A;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-light-green:checked+label:after {
    background-color: #8BC34A;
    border: 2px solid #8BC34A;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-lime:checked+label:before {
    border: 2px solid #CDDC39;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-lime:checked+label:after {
    background-color: #CDDC39;
    border: 2px solid #CDDC39;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-yellow:checked+label:before {
    border: 2px solid #ffe821;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-yellow:checked+label:after {
    background-color: #ffe821;
    border: 2px solid #ffe821;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-amber:checked+label:before {
    border: 2px solid #FFC107;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-amber:checked+label:after {
    background-color: #FFC107;
    border: 2px solid #FFC107;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-orange:checked+label:before {
    border: 2px solid #FF9800;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-orange:checked+label:after {
    background-color: #FF9800;
    border: 2px solid #FF9800;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-deep-orange:checked+label:before {
    border: 2px solid #FF5722;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-deep-orange:checked+label:after {
    background-color: #FF5722;
    border: 2px solid #FF5722;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-brown:checked+label:before {
    border: 2px solid #795548;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-brown:checked+label:after {
    background-color: #795548;
    border: 2px solid #795548;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-grey:checked+label:before {
    border: 2px solid #9E9E9E;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-grey:checked+label:after {
    background-color: #9E9E9E;
    border: 2px solid #9E9E9E;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-blue-grey:checked+label:before {
    border: 2px solid #607D8B;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-blue-grey:checked+label:after {
    background-color: #607D8B;
    border: 2px solid #607D8B;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-black:checked+label:before {
    border: 2px solid #000000;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-black:checked+label:after {
    background-color: #000000;
    border: 2px solid #000000;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-white:checked+label:before {
    border: 2px solid #ffffff;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

[type="radio"].with-gap.radio-col-white:checked+label:after {
    background-color: #ffffff;
    border: 2px solid #ffffff;
    -webkit-animation: ripple 0.2s linear forwards;
    animation: ripple 0.2s linear forwards;
}

.switch label {
    font-weight: normal;
    font-size: 13px;
}

.switch label .lever {
    margin: 0 14px;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-red:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(251, 58, 58, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(251, 58, 58, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-red {
    background-color: rgba(251, 58, 58, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-red:after {
    background-color: #fb3a3a;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-pink:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(233, 30, 99, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(233, 30, 99, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-pink {
    background-color: rgba(233, 30, 99, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-pink:after {
    background-color: #E91E63;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-purple:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(116, 96, 238, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(116, 96, 238, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-purple {
    background-color: rgba(116, 96, 238, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-purple:after {
    background-color: #ebc51a;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-deep-purple:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(103, 58, 183, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(103, 58, 183, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-deep-purple {
    background-color: rgba(103, 58, 183, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-deep-purple:after {
    background-color: #673AB7;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-indigo:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(63, 81, 181, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(63, 81, 181, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-indigo {
    background-color: rgba(63, 81, 181, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-indigo:after {
    background-color: #3F51B5;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-blue:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(2, 190, 201, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(2, 190, 201, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-blue {
    background-color: rgba(2, 190, 201, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-blue:after {
    background-color: #02bec9;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-light-blue:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(3, 169, 244, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(3, 169, 244, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-light-blue {
    background-color: rgba(3, 169, 244, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-light-blue:after {
    background-color: #03A9F4;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-cyan:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 188, 212, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 188, 212, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-cyan {
    background-color: rgba(0, 188, 212, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-cyan:after {
    background-color: #00BCD4;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-teal:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-teal {
    background-color: rgba(0, 150, 136, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-teal:after {
    background-color: #009688;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-green:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 198, 218, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 198, 218, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-green {
    background-color: rgba(38, 198, 218, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-green:after {
    background-color: #26c6da;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-light-green:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(139, 195, 74, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(139, 195, 74, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-light-green {
    background-color: rgba(139, 195, 74, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-light-green:after {
    background-color: #8BC34A;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-lime:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(205, 220, 57, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(205, 220, 57, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-lime {
    background-color: rgba(205, 220, 57, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-lime:after {
    background-color: #CDDC39;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-yellow:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 232, 33, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 232, 33, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-yellow {
    background-color: rgba(255, 232, 33, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-yellow:after {
    background-color: #ffe821;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-amber:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 193, 7, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 193, 7, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-amber {
    background-color: rgba(255, 193, 7, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-amber:after {
    background-color: #FFC107;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-orange:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 152, 0, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 152, 0, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-orange {
    background-color: rgba(255, 152, 0, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-orange:after {
    background-color: #FF9800;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-deep-orange:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 87, 34, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 87, 34, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-deep-orange {
    background-color: rgba(255, 87, 34, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-deep-orange:after {
    background-color: #FF5722;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-brown:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(121, 85, 72, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(121, 85, 72, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-brown {
    background-color: rgba(121, 85, 72, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-brown:after {
    background-color: #795548;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-grey:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(158, 158, 158, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(158, 158, 158, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-grey {
    background-color: rgba(158, 158, 158, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-grey:after {
    background-color: #9E9E9E;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-blue-grey:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(96, 125, 139, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(96, 125, 139, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-blue-grey {
    background-color: rgba(96, 125, 139, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-blue-grey:after {
    background-color: #607D8B;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-black:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-black {
    background-color: rgba(0, 0, 0, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-black:after {
    background-color: #000000;
}

.switch label input[type=checkbox]:checked:not(:disabled)~.lever.switch-col-white:active:after {
    -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 255, 255, 0.1);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-white {
    background-color: rgba(255, 255, 255, 0.5);
}

.switch label input[type=checkbox]:checked+.lever.switch-col-white:after {
    background-color: #ffffff;
}

main.py-4 {
    padding: 0 !important;
}

.card-title {
    font-weight: 600;
    color: #000;
    margin-bottom: 0;
}

.profile-text h5 {
    color: var(--admin-panel-color);
    font-weight: 700;
}

.profile-text h3 {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.daes-sec-sec .card {
    height: 100%;
}

.daes-top-sec .card {
    overflow: hidden;
}

.daes-top-sec h3.box {
    font-size: 35px;
}

.daes-top-sec h3.text-info {
    font-weight: 600;
    font-size: 30px;
}

.daes-top-sec h5.text-muted {
    padding-top: 10px;
    padding-bottom: 10px;
    color: #000 !important;
    ;
}

.daes-top-sec a.small-box-footer {
    display: block;
    padding: 10px 0;
    background: #fbdfd6;
    margin: 0 -15px;
}

.table tr td {
    vertical-align: middle;
    font-size: 15px;
    color: #0C111C;
    font-weight: 500;
    letter-spacing: 0.5px;
}

.table tr td.redirecttopage {
    color: var(--admin-panel-color);
    cursor: pointer;
}

/*.table tr td.link-td:hover{background: var(--admin-panel-color);}*/
.table tr td.redirecttopage:hover {
    color: #000;
}

.table tr td>img {
    object-fit: cover;
    border-radius: 5px;
    width: 50px !important;
    height: 50px !important;
}

.table.dataTable tr td>img {
    margin-right: 15px
}

.daes-sec-sec .table tr {
    cursor: pointer;
}

.table tr td.address-list {
    max-width: 200px;
    white-space: normal;
}

.daes-sec-sec .table tr th:last-child,
.daes-sec-sec .table tr td:last-child {
    text-align: center;
}

.table thead th,
.table th {
    color: #000;
    background: #f8fafd;
    position: relative;
}

.table-bordered.dataTable {
    border-radius: 10px;
    overflow: hidden;
}

.table.dataTable thead th,
.table.dataTable th {
    font-weight: 400 !important;
    font-size: 15px;
    background: #F3F4F6;
    padding: 15px 10px;
    border-color: #E5E7EB;
}

.table tr td.action-btn a,
.table tr td.business-action-btn a {
    padding: 0 5px;
}

.mini-sidebar .topbar .top-navbar .navbar-header .navbar-brand .dark-logo {
    display: none;
}

.mini-sidebar .topbar .top-navbar .navbar-header .navbar-brand .light-logo {
    display: block;
    max-width: 50px;
}

.table tr td>span {
    display: inline-block;
}

.table tr td>span.product-name{white-space: wrap;display: flex; align-items: center;min-width: 200px;}
.table tr td>span.category-name-list{white-space: wrap;;min-width: 200px;}
.table tr td>span.product-name img{margin-right: 15px;object-fit: cover;border-radius: 5px;
  width: 50px !important;
  height: 50px !important;
}

.table tr td>span.review-satar{white-space: nowrap;}
.table tr td>span.review-satar i{font-size: 14px;padding: 0px 3px;line-height: 1.5;}
  

span.order_completed span {
    background: green;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.success span {
    background: green;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.refund_success span {
    background: green;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.undefined span {
    background: #ffa500;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.order_rejected span,
.table tr td.driver_rejected span {
    background: red;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.table tr td.in_transit span,
.table tr td.order_placed span,
.table tr td.order_accepted span,
.table tr td.order_shipped span,
.table tr td.order_pending span,
.table tr td.driver_pending span {
    background: orange;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.in_transit span,
.order_placed span,
.order_accepted span,
.order_shipped span,
.order_pending span,
.driver_pending span {
    background: orange;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.order_placed span {
    background: orange;
    color: #fff;
    padding: 3px 10px;
    border-radius: 5px;
}

.vendor_avtive.closed {
    color: red;
    font-weight: 600;
}

.vendor_avtive.open {
    color: green;
    font-weight: 600;
}

.card-body #users-table_filter {
    width: 100%;
    text-align: center;
}

#users-table_filter #selected_search.form-control,
#users-table_filter .form-group,
#users-table_filter .form-group .form-control,
#users-table_filter .form-group button.btn {
    display: inline-block;
    width: auto;
    height: 40px;
}

body.sticky header.topbar {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    bottom: auto !important;
}

.sticky .fix-sidebar .left-sidebar {
    padding-top: 60px;
}

.form-control {
    background-color: #f5f5f5;
    border: 1px solid #ccc;
}

.row.sis-card-content {
    max-width: 70%;
    margin: 0 auto;
    display: table;
    width: 100%;
}

.page-wrapper>.card-body {
    padding: 0;
    position: relative;
}

.row.sis-card-content .form-group.row .col-7 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.row.sis-card-content .form-group.row .col-7>span.business-name {
    font-size: 15px;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    font-weight: 500;
    width: 100%;
    display: block;
    color: #67757c;
    min-height: 38px;
    border-radius: 0.25rem;
    padding: 0.375rem 0.75rem;
}

.row.sis-card-content .form-group.row .col-7 .control-inner {
    position: relative;
}

.row.sis-card-content .form-group.row .col-7 .control-inner>span {
    position: absolute;
    right: 35px;
    top: 8px;
    color: #000;
    font-weight: 500;
    font-size: 14px;
}

.row.sis-card-content .form-group.row .col-7 .form-control {
    width: 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.row.sis-card-content .form-group.row .col-7 .control-inner>.currentCurrency {
    position: absolute;
    left: 6px;
    top: 6px;
    color: #67757c;
    font-weight: 500;
    font-size: 17px;
    max-width: 15px;
}

.row.sis-card-content .form-group.row .col-7 .form-control.referral_amount {
    padding-left: 22px;
}

.sis-card-content .sis-card-content-inner {
    margin: 0 -10px;
}

.form-group.row {
    display: inline-block;
    width: 100%;
    padding: 0 5px;
    margin: 0;
    margin-right: -3px;
    margin-bottom: 25px;
    vertical-align: top;
}

.form-groupa.row {
    display: inline-block;
    width: 100%;
    padding: 0 5px;
    margin: 0;
    margin-right: -3px;
    margin-bottom: 0px;
    vertical-align: top;
}

.whvptitle {
    padding-left: 1px !important;
}

.whclosetx {
    color: #ff0000;
    font-weight: 600;
}

.form-group.row.width-50 {
    width: 50%;
}

.btm-btn.form-group i.fa {
    margin-right: 10px;
}

.btm-btn.form-group {
    margin-top: 25px;
    margin-bottom: 0;
}

.sis-card-content-inner fieldset {
    padding: 10px;
    border: 1px solid #ccc;
    margin-bottom: 15px;
    border-radius: 5px;
    background: #fff;
    position: relative;
}

.sis-card-content-inner {
    position: relative;
}

.sis-card-content-inner a.add-wallate {
    position: absolute;
    top: 0px;
    right: 19px;
    z-index: 1;
}

.sis-card-content-inner a.add-wallate:focus {
    color: #fff !important;
}

.sis-card-content-inner fieldset legend {
    display: inline-block;
    width: auto;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    color: #fff;
    padding: 7px 14px;
    background: var(--admin-panel-color);
    border-radius: 5px;
}

.btm-btn.form-group a.btn.btn-default {
    background: #979797;
    color: #fff;
}

.row.sis-card-content label.control-label {
    color: #000;
    font-weight: 500;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.row.sis-card-content .booking-table label.control-label {
    padding: 0;
}

.btn-warning:hover {
    background-color: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.optionslist-box {
    padding-top: 15px
}

.optionslist-box ul {
    padding: 0;
    margin: 0
}

.optionslist-box ul li {
    border-bottom: 1px solid #eaeaea;
    padding-bottom: 10px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 500;
    color: #000;
    letter-spacing: 0.5px;
}

.nav.nav-tabs.align-items-end.card-header-tabs {
    justify-content: center;
    background: none;
    border: 0;
}

.nav-tabs.card-header-tabs .nav-link {
    color: #000;
}

.nav-tabs.card-header-tabs .nav-link.active,
.nav-tabs.card-header-tabs .nav-link:hover {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
    color: #fff;
}

/* Payment gateway tab strip — clean rounded pills, wrapping row, no clipped edges.
   (Bootstrap's .card-header-tabs negative margins caused the cut-off look.) */
.payment-top-tab { margin: 0 0 22px; }
.payment-top-tab .nav.nav-tabs.card-header-tabs { margin: 0; border: 0; flex-wrap: wrap; gap: 8px; justify-content: center; }
.payment-top-tab .nav-tabs.card-header-tabs .nav-item { margin: 0; }
.payment-top-tab .nav-tabs.card-header-tabs .nav-link {
    border: 1px solid #e2e6ef;
    border-radius: 9px;
    padding: 8px 14px;
    margin: 0;
    background: #fff;
    font-weight: 600;
    font-size: 13.5px;
}
.payment-top-tab .nav-tabs.card-header-tabs .nav-link.active,
.payment-top-tab .nav-tabs.card-header-tabs .nav-link:hover {
    border-color: var(--admin-panel-color);
    background: var(--admin-panel-color);
    color: #fff;
}

.nav-tabs.card-header-tabs .nav-link span.badge-success {
    background: var(--admin-panel-color);
    color: #fff;
}

.nav-tabs.card-header-tabs .nav-link.active span.badge-success,
.nav-tabs.card-header-tabs .nav-link:hover span.badge-success {
    background: #fff;
    color: var(--admin-panel-color);
}

.sis-card-content .form-text.text-muted {
    font-size: 13px;
    padding-top: 2px;
}

.checkbox {
    position: relative;
    padding-left: 50px;
}

.checkbox input[type=checkbox] {
    box-sizing: border-box;
    padding: 0;
    border: 1px solid #000;
    appearance: none;
    opacity: 1;
    left: 20px;
    width: 20px;
    height: 20px !important;
    display: inline-block;
    vertical-align: middle;
    max-width: inherit;
    min-height: inherit;
    cursor: pointer;
}

.checkbox [type="checkbox"]:checked {
    background: var(--admin-panel-color);
}

.resttab-section {
    position: relative;
}

.overlay {
    text-align: center;
    font-size: 27px;
    color: #fff;
    font-weight: 700;
    position: absolute;
    left: -80px;
    right: -80px;
    top: -80px;
    bottom: -150px;
    align-items: center;
    background: rgba(0, 0, 0, 0.5);
    z-index: 5;
    padding-top: 10%;
}

.overlay>span {
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
}

ul.rating {
    padding: 0;
    margin: 0;
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: var(--admin-panel-color);
}

ul.rating li {
    padding: 0 2px;
}

.rating__item {
    font-size: 15px;
    display: block;
    font-family: FontAwesome;
}

.rating__item::after {
    content: "\f006";
}

.rating[data-rating="5.5"] .rating__item:nth-child(-n+5):after,
.rating[data-rating="5"] .rating__item:nth-child(-n+5):after,
.rating[data-rating="4.5"] .rating__item:nth-child(-n+4):after,
.rating[data-rating="4"] .rating__item:nth-child(-n+4):after,
.rating[data-rating="3.5"] .rating__item:nth-child(-n+3):after,
.rating[data-rating="3"] .rating__item:nth-child(-n+3):after,
.rating[data-rating="2.5"] .rating__item:nth-child(-n+2):after,
.rating[data-rating="2"] .rating__item:nth-child(-n+2):after,
.rating[data-rating="1.5"] .rating__item:nth-child(-n+1):after,
.rating[data-rating="1"] .rating__item:nth-child(-n+1):after,
.rating[data-rating="0.5"] .rating__item:nth-child(-n+0):after,
.rating[data-rating="0"] .rating__item:nth-child(-n+0):after {
    content: "\f005";
}

.rating[data-rating="1.5"] .rating__item:nth-child(2):after,
.rating[data-rating="2.5"] .rating__item:nth-child(3):after,
.rating[data-rating="3.5"] .rating__item:nth-child(4):after,
.rating[data-rating="4.5"] .rating__item:nth-child(5):after {
    content: "\f123";
}

.reviewhtml ul.rating {
    justify-content: center;
    margin-top: 0px;
    margin-right: 15px;
}

.reviewhtml ul.rating li.rating__item {
    font-size: 20px;
    padding: 0 3px;
}

.review-box .review_count {
    color: #000;
    font-weight: 500;
}

.review-box .review_count>span {
    color: var(--admin-panel-color);
    font-weight: 600;
    padding-left: 10px;
}

.bellow-text ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.bellow-text ul li {
    display: block;
    color: #000;
    padding-top: 5px;
}

.bellow-text ul li label {
    margin-bottom: 0;
    font-weight: 600;
    padding-right: 10px;
}

.bellow-text ul li>span {
    color: var(--admin-panel-color);
    font-size: 19px;
    font-weight: 600;
}

.menu-tab {
    margin-bottom: 25px;
}

.menu-tab ul {
    padding: 0;
    border-bottom: 1px solid #E5E7EB;
}

.menu-tab ul li {
    display: inline-block;
}

.menu-tab ul li a {
    display: block;
    padding: 12px 12px;
    color: #000;
    font-size: 17px;
    font-weight: 600;
    border-bottom: 1px solid transparent;
    margin-bottom: -1px;
}

.menu-tab ul li.active a,
.menu-tab ul li a:hover {
    color: var(--admin-panel-color);
    border-bottom: 1px solid var(--admin-panel-color);
}

.pagination>li>a.page-link:hover {
    color: #fff;
    background-color: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
}

.form-group.row.business-image .business-image img {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
}

.error_top {
    padding: 0px;
    max-width: 70%;
    margin: 0 auto;
    margin-bottom: 20px;
}

.error_top p {
    color: red;
    background: #fff;
    border-radius: 10px;
    border-left: 4px solid red;
    padding: 10px 20px;
    font-weight: 400;
}

.success_top {
    padding: 0px;
    max-width: 70%;
    margin: 0 auto;
    margin-bottom: 20px;
}

.success_top p {
    color: green;
    background: #fff;
    border-radius: 10px;
    border-left: 4px solid green;
    padding: 10px 20px;
    font-weight: 400;
}

.form-group.extra-row {
    padding: 0 20px;
    display: table;
    width: 100%;
}

.btn-primary.active,
.btn-primary:active,
.btn-primary:focus,
.btn-primary.disabled.active,
.btn-primary.disabled:active,
.btn-primary.disabled:focus,
.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary.focus:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open>.dropdown-toggle.btn-primary.focus,
.open>.dropdown-toggle.btn-primary:focus,
.open>.dropdown-toggle.btn-primary:hover,
.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show>.btn-primary.dropdown-toggle:focus {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
    box-shadow: 0 0 0 0.2rem var(--admin-panel-color);
}

.business-image{text-align: center;position: relative;}
.business-image > div {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}
.business-image > div > P{text-align: center;
  display: block;
  width: 100%;
  font-weight: 600;
  font-size: 15px;}
.business-image .image-item-list,.business-image > div#photos_1 .image-item,.business-image #menu_photos .image-item,.business-image .sis-item-photo .image-item{
    padding: 0px 10px;
    display: inline-block;
    position: relative;
    width: 20%;
    cursor: pointer;
    margin-bottom: 20px;
}

.business-image > div#photos_1 .image-item,.business-image .sis-item-photo .image-item{
    width: 50%;
}
.business-image .image-item:hover {
    opacity: 0.8;
}

.business-image .image-item img,
.business-image .image-item video {
    border-radius: 5px;
    width: 100%;
    height: 200px;
    object-fit: cover;
    display: block;

}

.business-image .image-item-list .select-checkbox{position: absolute; background: #fff;border-radius: 3px;padding: 1px 2px;width: 23px;
  height: 24px; top: 8px; left: 15px; z-index: 5}  
.business-image .image-item-list .select-checkbox [type="checkbox"] + label{padding: 0px;margin: 0; line-height: 1;display: block;}   
.business-image .image-item-list .select-checkbox [type="checkbox"]:not(:checked),.business-image .image-item-list .select-checkbox [type="checkbox"]:checked{position: absolute;left: 0;width: 100%;height: 100%;z-index: 4; cursor: pointer;}

.all-delete-btn{position: sticky;display: flex;-webkit-box-pack: end;justify-content: flex-end;top: 80px;
  z-index: 6;
  bottom: 20px;
  margin-bottom: 15px;}


.business-reviews .reviews-card .review-delete {
    cursor: pointer;
}

.business-reviews .reviews-card .reviews-pro-detail > h4{
  display: flex;
  gap: 10px;}
.business-reviews .reviews-card .reviews-pro-detail span.pro-info{
    background: #e8e8e8;
    color: var(--admin-panel-color);
    width: 25px;
    height: 25px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;   
    padding: 0 !important;
  font-size: 15px; 
}

.modal-header .btn-close {
    cursor: pointer;
    cursor: pointer;
    right: 23px;
    top: 12px; 
    position: absolute;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    z-index: 5;
    border: 0; 
}

.business-image .image-item-list span.remove-btn,.image-item span.remove-btn {
    position: absolute;
    top: 6px;
    right: 15px;
    background: var(--admin-panel-color);
    border-radius: 50px;
    padding: 3px 8px;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
    z-index: 5;
}

.gallery-popup .modal-header {
    padding: 0;
    border: 0;
}

.gallery-popup .modal-body {
    padding: 0
}

.gallery-popup .modal-dialog {
    max-width: 95%;
    height: 90%;
    min-height: inherit;
}

.gallery-popup .modal-dialog .modal-content {
    height: 100%;
}

.gallery-popup .modal-body #modalImageContainer {
    height: 100%
}

.gallery-popup .modal-body img,.gallery-popup .modal-body video {
    height: 100%;
    object-fit: contain;
}

.gallery-popup-row {
    height: 100%;
    margin: 0;
}

.gallery-popup-row .bg-black {
    background: #000;
}

.galler-img-slide {
    padding: 0 80px;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    box-sizing: border-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    left: 0;
    right: 2%;
    justify-content: center;
}

.galler-img-slide .btn {
    position: absolute;
    top: 50%;
    width: 35px;
    height: 35px;
    border-radius: 50px;
    padding: 0;
    font-size: 24px;
}

.galler-img-slide .btn.btn-pre {
    left: 28px
}

.galler-img-slide .btn.btn-next {
    right: 28px
}

.galler-img-detail {
    text-align: left;
    height: 100%;
    padding: 70px 30px 10px 30px;
}

.galler-img-detail .modal-title {
    color: #000;
    font-size: 26px
}

ul.galler-detail-list {
    list-style-type: none;
    padding: 20px 0;
    margin: 0
}

ul.galler-detail-list li {
    padding-bottom: 15px;
    color: #333;
    display: flex;
    flex-wrap: wrap;
    font-size: 15px
}

ul.galler-detail-list li strong {
    color: #000;
    width: 50%
}

ul.galler-detail-list li>span {
    width: 50%;
}

.gallery-popup .modal-body .pro-detail-icon img {
    width: 20px;
    height: 20px;
    object-fit: cover;
    border-radius: 50px !important;
}

.gap-2 {
    gap: 10px;
}

.pro-detail-like span.icon-box {
    background: #dbdbdb;
    color: #000;
    width: 35px;
    display: inline-block;
    text-align: center;
    height: 35px;
    border-radius: 50px;
    vertical-align: middle;
    padding: 5px;
}

.upload-image-box .upload-image-box-inner {
    border: 2px dashed #ccc;
    height: 140px;
    border-radius: 5px;
    position: relative;
    aspect-ratio: 1;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: column;
    width: 100%;
}

.upload-image-box .upload-image-box-inner input[type="file"] {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 1;
}

.upload-image-box .upload-image-box-inner i {
    font-size: 25px;
}

.upload-image-box .upload-image-box-inner label {
    display: block;
    font-size: 16px;
    font-weight: 600;
    margin-top: 10px;
}

.upload-image-box .business-image #business_photos,.upload-image-box .business-image > div {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
}

.upload-image-box .business-image .image-item {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    display: block;
    width: 20%;
    padding: 0 10px;
}

.upload-image-box .business-image .remove-btn,
.sis-project-upload-image .project-image .remove-btn {
    position: absolute;
    right: 15px;
    top: 10px;
    background: #fff;
    border-radius: 50px;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    cursor: pointer;
}

.upload-image-box .business-image .image-item img,
.upload-image-box .business-image .image-item video {
    width: 100%;
    height: 150px;
    object-fit: cover;
    border-radius: 10px;
}


#lightSlider {
    list-style-type: none;
    padding: 0;
    margin: 0
}


.uploaded_image {
    margin-top: 15px;
}

.uploaded_image img#uploaded_image {
    border-radius: 5px;
}

.uploaded_image_owner {
    margin-top: 15px;
    padding-left: 15px;
}

.placeholder_img_thumb,
.logo_img_thumb,
.favicon_img_thumb {
    padding: 15px 15px;
}

.placeholder_img_thumb img,
.logo_img_thumb img {
    margin-right: 5px;
}

.order_detail {
    padding: 0px;
}

.order_detail h3,
.box-header h3 {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 0px;
    /*border-bottom: 1px solid rgba(120, 130, 140, 0.13);*/
    padding-bottom: 0px;
}

.order_detail .orderdetail-top ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.order_detail .orderdetail-top ul li {
    display: inline-block;
    padding-right: 15px;
    border-right: 1px dashed var(--admin-panel-color);
    width: 25%;
    margin-right: -4px;
    padding-left: 15px;
}

.order_detail .orderdetail-top ul li:last-child {
    border: 0;
}

.order_detail .orderdetail-top ul li:first-child {
    padding-left: 0;
}

.order_detail .orderdetail-top ul li strong {
    display: block;
    padding-bottom: 5px;
    color: #000;
    font-weight: 600;
}

.order_edit-genrl .form-group.row {
    padding: 0;
    margin: 0px 0px;
    width: auto;
    display: inherit;
}

.order_edit-genrl .form-group.row.widt-50 {
    width: 50%;
    display: inline-block;
    margin-bottom: 15px;
}

.order_edit-genrl .form-group.row .control-label {
    width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.order_edit-genrl .form-group.row.gendetail-col .control-label {
    font-weight: 400;
    color: #000;
    font-size: 15px;
    padding-bottom: 10px;
    border-bottom: 2px dashed #e9e9e9;
    padding-left: 0;
    padding-right: 0;
}

.order_edit-genrl .form-group.row.gendetail-col .control-label>strong {
    padding-right: 5px;
    width: 35%;
    float: left;
    font-weight: 500;
}

.order_edit-genrl .form-group.row.gendetail-col .control-label>span {
    margin-left: 35%;
    display: block;
}

.order_edit-genrl .form-group.row>.col-7 {
    width: 100%;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}

.order_edit-genrl .form-group.row .input-group.date {
    margin: 0 -5px;
    width: auto;
}

.order_edit-genrl .form-group.row .input-group.date input {
    margin: 0 5px;
    color: #000;
    font-size: 14px;
}

.order_edit-genrl .form-group.row.width-100 {
    width: 100%;
    margin: 0;
}

.order_edit-genrl .form-group.row.width-100 .control-label,
.order_edit-genrl .form-group.row.width-100 .col-7 {
    padding: 0;
}

.order_addre-edit>h3 a.edit_address {
    float: right;
    margin-top: 5px;
}

.address p {
    color: #000;
    font-weight: 400;
    border-bottom: 2px dashed #e9e9e9;
    padding-bottom: 10px;
    font-size: 15px;
}

.address p strong {
    width: 35%;
    float: left;
    font-weight: 500;
}

.order-items-list {
    /*padding-top: 25px;margin-top: 25px;border-top: 1px solid #ccc;*/
    margin-bottom: 15px;
    background: #fff;
}

.order-items-list td.order-product {
    width: 45%;
}

.order-items-list td.order-product>div {
    display: inline-block;
    vertical-align: middle;
}

.order-items-list td.order-product>div.orders-tracking {
    width: 70%;
}

.order-items-list td.order-product>div>h6 {
    font-weight: 500;
    margin-bottom: 5px;
    color: #000;
    padding: 7px 0;
    font-size: 16px;
}

.woo-orders-tracking-container {
    background: #f5f5f5;
    padding: 4px;
    width: 100%;
    max-width: 500px;
}

.woo-orders-tracking-container .woo-orders-tracking-item-details {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    background: #f1f0f0;
    font-size: 12px;
}

.woo-orders-tracking-container .woo-orders-tracking-item-details>div {
    margin: 4px 0;
    text-align: left;
    padding: 5px;
}

.woo-orders-tracking-item-tracking-code-label {
    width: 20%;
    font-weight: 600;
    color: #000;
    padding: 0 9px !important;
    font-size: 14px;
}

.woo-orders-tracking-container .woo-orders-tracking-item-details .woo-orders-tracking-item-tracking-code-value {
    background: #ffffff;
    line-height: 27px;
    width: 80%;
    min-width: 100px;
    min-height: 25px;
    font-size: 13px;
    font-weight: 500;
    color: #000;
}

.woo-orders-tracking-item-tracking-button-edit-container {
    width: 60px;
}

.woo-orders-tracking-container .woo-orders-tracking-item-details .woo-orders-tracking-item-tracking-code-value>span {
    padding-right: 5px;
}

.woo-orders-tracking-item-tracking-button-edit-container a {
    font-size: 17px;
}

.order_detail-top-box {
    /*background: #fff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);
    box-shadow: 0px 5px 20px rgb(0 0 0 / 5%);*/
    padding: 0;
    height: calc(100% - 62px);
}

.orders-tracking-item-details>strong {
    color: #000;
    padding-bottom: 5px;
    font-weight: 600;
    text-decoration: underline;
    font-size: 14px;
}

.orders-tracking-item-details>div {
    padding-bottom: 3px;
    font-size: 13px;
}

.orders-tracking-item-details>div>span {
    padding-right: 10px;
    font-weight: 400;
}

.orders-tracking-item-details>div>span:last-child {
    font-weight: 600;
}

.order-totals-items {
    /*border-top: 1px solid #ccc;
    padding-top: 15px;
    margin-top: 15px;
    background: #fff;*/
}

.order-totals-items table.order-totals {
    float: right;
    width: 100%;
}

.order-totals-items table.order-totals tr td {
    color: #000;
    font-size: 16px;
    padding: 10px 15px;
    line-height: 1.2;
}

.order-totals-items table.order-totals tr td:last-child {
    text-align: right;
    padding-right: 0;
    font-weight: 600;
}

.order-totals-items table.order-totals tr td.seprater {
    padding: 0;
    position: relative;
}

.order-totals-items table.order-totals tr.grand-total {
    position: relative;
}

.order-totals-items table.order-totals tr td.seprater span {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: auto;
    top: 2px;
    background: #fff;
    z-index: 1;
    padding: 5px 7px;
    text-align: center;
    text-transform: none;
    font-weight: 400;
    font-size: 14px;
    color: #67757c;
    display: inline-block;
    max-width: 140px;
}

.order-totals-items table.order-totals tr.grand-total::before {
    content: "Total";
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    width: 80px;
    top: -30px;
    background: #fff;
    z-index: 1;
    padding: 5px 7px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 400;
    font-size: 14px;
}

.order-totals-items table.order-totals tr td.label {
    font-weight: 500;
    text-align: left;
    width: 100%;
    padding-right: 15px;
    padding-left: 0;
    font-size: 14px;
}

.order-totals-items table.order-totals tr.final-rate {
    background: #e1ffe1;
}

.order-totals-items table.order-totals tr.final-rate td {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 0;
    font-weight: 700;
}

.order-totals-items table.order-totals tr td.total {
    font-weight: 600;
    text-align: right;
}

.order_detail .card {
    margin-bottom: 0;
}

.order-totals-items table.order-totals tr.paid {
    border-top: 1px solid #000;
}

.print-btn {
    padding-right: 30px;
}

.print-btn button {
    border: 2px solid var(--admin-panel-color);
    font-size: 16px;
    border-radius: 5px;
    padding: 5px;
    color: var(--admin-panel-color);
    cursor: pointer;
}

.business-detail .card-header h4 {
    margin-bottom: 0;
    color: #000;
}

.business-detail a.row.redirecttopage {
    align-items: center !important;
}

.business-detail .card-body h5.contact-info {
    margin-top: 25px;
    font-size: 17px;
    margin-bottom: 15px;
    font-weight: 600;
}

.business-detail .card-body p {
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    padding-bottom: 10px;
}

.business-detail .card-body p strong {
    padding-right: 5px;
    font-weight: 600;
    color: #000;
    float: left;
    width: 25%;
}

.business-detail .card-body p>span {
    display: block;
    margin-left: 25%;
}

img.rounded-circle {
    object-fit: cover;
}

.topbar .top-navbar .navbar-header .navbar-brand img#logo_web {
    max-width: 100px;
}

.table tr td span.badge-success {
    background: #28a745;
    color: #fff;
}

.table tr td span.badge-danger {
    background: #dc3545;
    color: #fff;
}

.table tr td span.badge-warning {
    background: #ffc107;
    color: #fff;
}

.table tr td.action-btn a,
.table tr td.vendor-action-btn a {
    padding: 0 5px;
}

.table tr td.action-btn a i.fa-edit,
.table tr td.action-btn a i.fa-ellipsis-h,
.daes-sec-sec .table span.fa-edit,
.table tr td.vendor-action-btn a i.fa-edit,
.table tr td.vendor-action-btn a i.fa-ellipsis-h,
.table tr td.vendor-action-btn a i.fa-eye,
.table tr td.action-btn a i.fa-check,
ul.dtr-details>li span a i.fa-edit,
ul.dtr-details>li span a i.fa-ellipsis-h,
ul.dtr-details>li span a i.fa-ellipsis-h,
ul.dtr-details>li span a i.fa-eye,
ul.dtr-details>li span a i.fa-check {
    background: #E1E7E9;
    width: 28px;
    height: 28px;
    color: #000;
    border-radius: 50px;
    text-align: center;
    padding: 7px;
    font-size: 15px;
}

.table tr td.action-btn a i.fa-edit::before,
.redirecttopage .fa-edit::before,
ul.dtr-details>li span a i.fa-edit::before,
.daes-sec-sec .table span.fa-edit:before {
    content: "\f040";
}

.table tr td.action-btn a i.fa-eye,
.table tr td.action-btn a i.fa-file,
.table tr td.action-btn a i.fa-print,
ul.dtr-details>li span a i.fa-file,
ul.dtr-details>li span a i.fa-eye,
ul.dtr-details>li span a i.fa-eye,
ul.dtr-details>li span a i.fa-print,
.table tr td span.action-btn a i.fa-print {
    background: #E1E7E9;
    width: 28px;
    height: 28px;
    color: #000;
    border-radius: 50px;
    text-align: center;
    padding: 7px 5px;
    font-size: 15px !important;
    font-weight: normal !important;
}

.table tr td.action-btn i.fa-info {
    background: #000;
    width: 28px;
    height: 28px;
    color: #fff !important;
    border-radius: 50px;
    text-align: center;
    padding: 7px;
    font-size: 15px;
    position: relative;
    display: inline-block;
    margin-top: 0px;
}

.table tr td.action-btn a i.fa-edit,
.daes-sec-sec .table span.fa-edit,
.table tr td.vendor-action-btn a i.fa-edit,
ul.dtr-details>li span a i.fa-edit,
.table tr td.action-btn a i.fa-check,
ul.dtr-details>li span a i.fa-check {
    background: green;
    color: #fff;
}

.table tr td span.action-btn a {
    padding: 0 5px;
}

.table-responsive tr td.action-btn i,
.table-responsive tr td .action-btn i {
    border: 1px solid;
    border-radius: 5px;
    padding: 2px 5px;
    display: inline-block;
}

.table-responsive tr td.action-btn a:hover i,
.table-responsive tr td .action-btn a:hover i {
    background: #efefef;
}

.table tr td span.action-btn a i.fa-edit,
.table tr td span.action-btn a i.fa-check,
.table tr td span.action-btn a i.fa-trash,
.table tr td span.action-btn a i.fa-eye {
    background: green;
    color: #fff;
    width: 28px;
    height: 28px;
    border-radius: 50px;
    text-align: center;
    padding: 7px;
    font-size: 15px;
}

.table tr td.action-btn a i.fa-trash,
.table tr td.vendor-action-btn a i.fa-trash,
ul.dtr-details>li span a i.fa-trash,
.table tr td.action-btn a i.fa-close,
ul.dtr-details>li span a i.fa-close,
.table tr td.action-btn a i.fa-file-pdf-o,
.table tr td span.action-btn a i.fa-trash {
    background: red;
    width: 28px;
    height: 28px;
    color: #fff;
    border-radius: 50px;
    text-align: center;
    padding: 7px;
    font-size: 15px;
}

.table tr td span.action-btn a i.fa-eye {
    background: #E1E7E9;
    color: #000;
}

table.dataTable>tbody>tr.child ul.dtr-details {
    width: 100%;
}

table.dataTable>tbody>tr.child span.dtr-title {
    width: 50%;
}

.table tr td.action-btn a,
.table tr td.vendor-action-btn a,
ul.dtr-details>li span a {
    padding: 0 5px;
}

.table-responsive .dataTables_wrapper .dataTables_info {
    font-size: 14px;
}

.table-responsive .dataTables_wrapper .dataTables_paginate {
    padding-top: 5px;
}

.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
    font-size: 14px;
}

.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 3px 10px;
}

.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: var(--admin-panel-color);
    color: #fff !important;
    border: 1px solid var(--admin-panel-color);
    border-radius: 5px;
}

.language-options select {
    background: none;
    border: 0;
    color: #0C111C !important;
    cursor: pointer;
}

.language-list.icon {
    color: #0C111C !important;
}

.language-options select:focus,
.language-options select:hover {
    background: none !important;
    border: 0;
    color: #0C111C !important;
    box-shadow: none;
    outline: none;
}
 
.language-options select option {
    color: #fff;
    background: var(--admin-panel-color)
} 
.language-options select option:hover{background: var(--admin-panel-color)}


#story_vedios .video-inner,
.thumbnail-inner {
    position: relative;
    /*border: 1px solid #ccc;*/
    border-radius: 10px;
    overflow: hidden;
}

#story_vedios .video-inner video {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 10px;
}

#uploding_story_video,
#uploding_story_thumbnail {
    margin-top: 10px;
    color: green;
    font-weight: 500;
}

.thumbnail-inner img {
    width: 100%;
}

#story_thumbnail {
    position: relative;
}

.remove-story-video,
.remove-story-thumbnail {
    position: absolute;
    top: 5px;
    right: 4px;
    background: var(--admin-panel-color);
    border-radius: 50px;
    padding: 3px 8px;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
}

.working_hours_div table.booking-table {
    width: 100%;
}

.working_hours_div table.booking-table td {
    padding: 5px 5px 5px 0px;
}

.working_hours_div table.booking-table td {
    width: 50% !important;
}

.working_hours_div table.booking-table td:last-child {
    width: 20% !important;
    padding-left: 10px;
}
.working_hours_div .input-box .add-btn{display: flex;justify-content: space-between; align-items: center;}
.row.sis-card-content .working_hours_div .input-box .add-btn label.control-label{-ms-flex: 0 0 0%; flex: 0 0 0%; margin: 0}


/**************************new admin css*************************/
.font-semibold {
    font-weight: 600;
}

.font-weight-medium {
    font-weight: 500 !important;
}

.dashboard_page {
    background: #F7F7F7;
}

.top-title-section {
    font-family: "Urbanist", serif;
}

.text-dark-2 {
    color: #0C111C;
}

.top-title-section .select-box .form-control,
.top-title-section .select-box #daterange,
.sis-card-head-select-box .form-control {
    background: #F3F4F6;
    border-radius: 20px;
    padding: 8px 18px;
    font-size: 14px;
    color: #6B7280;
    height: auto !important;
}

.head-select-box label {
    min-width: 75px
}

.box-icon {
    width: 65px;
    height: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
}

.box-icon img {
    max-width: 100%;
    height: 100%;
    object-fit: contain;
}

.box-icon i {
    font-size: 30px;
}

.dashboard_top_right .card {
    border-radius: 8px;
    background: linear-gradient(180deg, #0398BE -31.71%, #258CFA 100%);
    height: calc(100% - 25px);
}

.das-category-list ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.das-category-list ul li {
    padding-bottom: 15px
}

.das-category-list ul li a {
    color: #000;
}

.das-category-list ul li a:hover {
    color: var(--admin-panel-color);
}

.blue-text {
    color: #007692 !important
}

.btn-link {
    text-decoration: underline !important;
}

.card-body img {
    max-width: 100%
}

.top-title-section .select-box #daterange {
    line-height: 2;
}

.select-box .select2.select2-container {
    position: static;
    min-width: 150px;
}

.select-box .select2-container--default .select2-selection--single {
    background: #F3F4F6;
    border-radius: 20px;
    padding: 8px 18px;
    font-size: 14px;
    color: #6B7280;
    position: relative;
    height: auto;
}

.select-box .select2-container--default .select2-selection--single .select2-selection__rendered {
    max-width: inherit;
    padding-left: 0;
}

.select-box .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
    right: 15px;
}

.select-box .select2-container .select2-selection--single .select2-selection__rendered>span {
    padding-right: 0;
    padding-left: 10px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--admin-panel-color) !important;
    color: #fff !important;
}
/* Inner spans (country name, muted +code) must also invert on the brand highlight */
.select2-results__option--highlighted[aria-selected] span,
.select2-results__option--highlighted[aria-selected] .phone-country-name,
.select2-results__option--highlighted[aria-selected] .text-muted {
    color: #fff !important;
}
.select2-container--default .select2-results__option[aria-selected="true"] {
    background-color: rgba(var(--admin-panel-rgb, 132, 74, 239), .08);
    color: #1f2937;
}
/* Select2 dropdown — align with the form design system */
.select2-dropdown {
    border: 1px solid #e2e6ef !important;
    border-radius: 10px !important;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .10);
    overflow: hidden;
}
.select2-search--dropdown { padding: 8px; }
.select2-search--dropdown .select2-search__field {
    border: 1px solid #e2e6ef !important;
    border-radius: 8px;
    padding: 8px 10px;
    font-size: 14px;
    outline: none;
}
.select2-results__option { padding: 8px 12px; font-size: 14px; }

.top-title-section .top-title-left h3 {
    font-family: Urbanist;
    font-size: 22px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    color: #0C111C;
}

.top-title-section .top-title-left .icon img {
    max-width: 32px
}

.top-title-section .top-title-left .counter {
    color: #FF6839;
    font-size: 16px;
    display: flex;
    width: 32px;
    height: 32px;
    padding: 4px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    border-radius: 50px;
    background: #FFEBE5;
    margin-top: 10px;
}

.card.border {
    border-radius: 20px;
    border: 1px solid #F3F4F6 !important;
}

.card.border .card-header {
    border-radius: 20px 20px 0 0;
    background: none;
    padding: 1.25rem 1.25rem 0.2rem 1.25rem
}

.card.card-box-with-icon {
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    margin-bottom: 25px;
}

.card-body.card-box-with-icon {
    padding: 24px;
}

.card.card-box-with-icon .box-icon img {
    width: 48px;
    height: 48px;
    object-fit: cover;
}

.table-list {
    font-family: Urbanist;
}

.card-header-title h3 {
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
}

.card-header-title p {
    color: #6B7280
}

.card-header-search {
    position: relative;
}

.card-header-search input {
    background: #F9FAFB;
    border-radius: 20px;
    padding: 12px 25px;
    font-size: 14px;
    color: #6B7280;
    height: auto !important;
    border: 0px;
}

.card-header-search img {
    position: absolute;
    right: 20px;
    top: 0;
    bottom: 0;
    margin: auto;
}

.card-header-right .select-box .form-control {
    background: #F3F4F6;
    border-radius: 20px;
    padding: 12px 18px;
    font-size: 14px;
    color: #6B7280;
    height: auto !important;
}

.card-header .card-head-count {
    background: #0398BE;
    padding: 5px 10px;
    font-size: 14px;
    color: #fff;
    font-weight: 600;
    margin-left: 10px;
    border-radius: 50px;
}

.rounded-full {
    border-radius: 50px
}

.card-header-right .btn {
    padding: 8px 20px;
}

.table-responsive .dataTables_wrapper .dataTables_filter input {
    background: #F3F4F6 url(../images/search_icon.png) no-repeat right 10px center;
    padding: 12px 25px;
    font-size: 14px;
    color: #6B7280;
    height: auto !important;
    border: 0px;
}

.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons {
    float: none;
    margin-left: 15px
}

.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons .dt-button {
    border-radius: 120px;
    background: #F3F4F6;
    color: #0C111C;
    font-size: 14px;
    border: 0;
    padding: 12px 35px
}

.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons .dt-button i.mdi {
    font-size: 18px;
    margin-right: 10px;
}

.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons .dt-button.buttons-html5 {
    padding: 12px 15px
}

.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons .dt-button-collection {
    width: auto;
}

.table.dataTable tr,
.table.dataTable tr td {
    border-top: 0 !important;
    border-color: #E5E7EB;
    position: relative;
}
.table.dataTable tr td i.verified-icon{
    position: absolute;
  right: 10px;
  top: 5px;
  background: #fff;
  border-radius: 50px;
  width: 20px;
  text-align: center;
  height: 20px;
  line-height: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  box-shadow: 0 2px 4px 2px rgba(0,0,0,0.2);
}
table.dataTable.display>tbody>tr.odd>.sorting_1,
table.dataTable.order-column.stripe>tbody>tr.odd>.sorting_1 {
    box-shadow: none !important
}

table.dataTable.display tbody tr:hover>.sorting_1,
table.dataTable.order-column.hover tbody tr:hover>.sorting_1 {
    background: rgba(0, 0, 0, 0.01);
    box-shadow: inset 0 0 0 9999px rgba(0, 0, 0, 0.01) !important
}

.table tr td>span.action-btn a,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a {
    font-size: 18px;
    position: relative;
}

.table tr td>span.action-btn a i.mdi-food,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a i.mdi-food {
    color: #097969
}

.table tr td>span.action-btn a i.mdi-content-copy,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a i.mdi-content-copy {
    color: #26B246;
}

.table tr td>span.action-btn a i.mdi-eye,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a i.mdi-eye {
    color: #B700BD
}

.table tr td>span.action-btn a i.mdi-lead-pencil,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a i.mdi-lead-pencil {
    color: #1FCAFF
}

.table tr td>span.action-btn a i.mdi-delete,
table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a i.mdi-delete {
    color: #FF3840
}

.table tr td>span.action-btn a .unread-count,table.dataTable>tbody>tr.child ul.dtr-details>li .dtr-data .action-btn a .unread-count{
    background: var(--admin-panel-color);
  color: #fff;
  border-radius: 100px;
  width: 20px;
  height: 20px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -13px;
  right: 0;
  font-size: 13px;
}

.table-responsive .dataTables_wrapper .dataTables_length select {
    padding: 7px 15px;
    background: #F3F4F6;
    border-color: #F3F4F6;
}

.card-header-tab ul.nav-tab {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
}

.card-header-tab ul.nav-tab li {
    margin-left: 5px
}

.card-header-tab ul.nav-tab li a {
    color: #6B7280;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    padding: 10px 12px;
    border-radius: 50px
}

.card-header-tab ul.nav-tab li.active a,
.card-header-tab ul.nav-tab li a:hover {
    background: #FF6839;
    color: #fff
}

.card-box-with-icon .card-body .background-img {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 76px;
    height: 73px;
    text-align: right;
    justify-content: center;
    align-items: center;
    display: flex;
    opacity: 0.2;
}

.card-box-with-icon .card-body .background-img img {
    width: 100%
}

.edit-form-group {
    margin-bottom: 15px
}

.edit-form-group label.control-label {
    color: #0C111C;
    font-size: 14px;
    font-weight: 500;
}

.edit-form-group .form-control {
    border-radius: 16px;
    background: #F9FAFB;
    padding: 16px;
    font-size: 16px;
    font-weight: 400;
    color: #6B7280;
    border: 0;
}

.edit-form-group select.form-control {
    height: 56px !important;
}

.edit-form-group.btm-btn .btn {
    padding: 8px 25px;
}

.edit-form-group.btm-btn .btn.btn-default {
    background: #F3F4F6;
    color: #0C111C;
}

.box-shadow-0 {
    box-shadow: none !important;
}

.edit-form-group .form-check {
    padding-left: 0
}

.form-check span.mdi-check {
    font-size: 22px;
}

.edit-form-group .form-check label {
    margin-right: 10px;
    align-items: center;
    padding-left: 35px;
    display: flex;
}

.edit-form-group .form-check [type="checkbox"]+label::before {
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #4B5563;
    border-bottom: 2px solid #4B5563;
    width: 8px;
    height: 14px;
    -webkit-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    top: 3px;
    left: 2px;
    z-index: 1
}

.edit-form-group .form-check [type="checkbox"]:checked+label::before {
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
}

.edit-form-group .form-check [type="checkbox"]:not(.filled-in)+label::after {
    width: 24px;
    height: 24px;
    border: 2px solid #4B5563;
    border-radius: 50px
}

.edit-form-group .form-check [type="checkbox"]:not(.filled-in)+label::after {
    border: 2px solid #4B5563;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.edit-form-group .form-check [type="radio"]+label::before {
    border: 2px solid #4B5563;
    width: 24px;
    height: 24px;
    margin: 0
}

.edit-form-group .form-check [type="radio"]+label::after {
    left: 4px;
    top: 4px;
    border: 2px solid #fff;
    margin: 0
}

.edit-form-group .form-check [type="radio"]:checked+label::before {
    background: #FF6839;
    border-color: #FF6839
}

.pricing-card-inner {
    border-radius: 16px;
    border: 1px solid #E5E7EB;
    background: #FFF;
    padding: 24px 24px 150px 24px;
    height: 100%
}

.pricing-card-btm {
    margin-top: 50px
}

.pricing-card-btm {
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 30px;
}

.pricing-card-btm .btn {
    width: 100%;
    text-align: center;
    background: #E5E7EB;
    font-size: 16px;
    color: #6B7280;
    padding: 12px 24px;
    border-color: #E5E7EB
}

.pricing-card-btm .btn:hover {
    background: #FF6839;
    border-color: #FF6839;
    color: #fff
}

.pricing-card-content ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.pricing-card-content ul li {
    padding-bottom: 10px
}

.pricing-card-content ul li span {
    color: #26B246;
    margin-right: 5px
}

.pricing-card-icon img {
    width: 48px;
    height: 48px;
    object-fit: cover;
}

.top-title-section .breadcrumb {
    padding: 0;
    background: none;
}

.top-title-section .breadcrumb-item+.breadcrumb-item::before {
    color: #0C111C;
}

.sis-img img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 16px
}

.businessImage img {
    width: 100%;
    height: 200px;
    border-radius: 10px;
    object-fit: cover;
    object-position: top;
}

.info-list label {
    margin-bottom: 0;
    min-width: 100px;
}

.sis-review {
    border-radius: 100px;
    background: #FFCB39;
    color: #665013;
    font-weight: 600;
    padding: 3px 10px;
    margin-left: 10px;
    line-height: 1;
    display: flex;
    align-items: center;
}

.sis-review i {
    margin-left: 2px;
    font-size: 18px;
}

.map-box {
    border-radius: 16px;
    overflow: hidden;
}

.green {
    color: #26B246
}

.red {
    color: #FF3840
}

.business-info-section p {
    font-size: 14px
}

.business-gallery ul {
    margin: 0 -10px;
    display: flex;
    flex-wrap: wrap;
}

.business-gallery ul li {
    list-style-type: none;
    width: 25%;
    padding: 0 10px
}

.business-gallery ul li img {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 16px
}

.business-service ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    column-count: 3;
}

.business-service ul li {
    color: #1F2937;
    font-weight: 500;
    font-size: 14px;
    padding-bottom: 16px
}

.business-service ul li span {
    font-size: 22px
}


.gap-25 {
    gap: 25px;
}

.reviews-card.shadow-none {
    box-shadow: none !important
}

.reviews-pro-detail .pro-info a {
    line-height: normal;
    display: inline-block;
    font-size: 12px;
}

.review-count {
    font-size: 14px;
    font-weight: 600;
}

.review-satar i {
    display: inline-block;
    border-color: rgb(240, 240, 240);
    width: 20px;
    height: 20px;
    margin-right: 2px;
    text-align: center;
    background: var(--admin-panel-color) !important;
    border-radius: 5px;
    color: #fff !important;
    line-height: 1;
    padding: 1px 0;
}

.review-satar i.text-secondary {
    background: #6c757d !important
}

.review-iconinfo-lists {
    flex-wrap: wrap;
    text-align: right;
    justify-content: end;
}

.review-iconinfo-lists .review-iconinfo-list {
    width: 20%;
    padding-bottom: 5px
}

.review-iconinfo-list .review-iconinfo-inner {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.review-iconinfo-list span.ico {
    background-color: rgb(255, 255, 255);
    border-style: solid;
    border-radius: 100%;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    height: 40px;
    width: 40px;
    border-width: 1px;
    border-color: rgb(227, 227, 227) !important;
    font-size: 12px;
    padding: 3px 0;
}

.review-iconinfo-list .review-iconinfo-inner h6 {
    width: 100%;
}

.review-iconinfo-list:hover span.ico {
    background-color: rgba(227, 227, 227, 0.5);
}
.review-photo-img .image-item{cursor: pointer;}
.review-photo-img img {
    border-radius: 10px;
    max-width: 100%;
    height: 95px;
    object-fit: cover;
    width: 100%
}


.business-info_left .review-star-date.mb-3 {
    margin-bottom: 0 !important;
    margin-left: 15px !important
}

.business-info_left .sis-content-title {
    margin-bottom: 20px !important
}

.business-info_left .info-list li {
    margin-bottom: 15px !important
}

.business-info_left .review-satar i {
    padding: 0px 2px;
}

.sis-working-hours-box {
    border: 1px solid #e7e7e7;
    border-radius: 5px;
    margin-bottom: 10px;
    text-align: center;
    padding: 10px;
    height: calc(100% - 10px);
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.business-info-section .sis-working-hours-box p {
    margin-bottom: 0 !important;
}

.highlight-option-wrapper {
    max-height: 270px;
    overflow-y: auto;
    padding: 15px;
}

.highlight-option-list {
    display: flex;
    flex-wrap: wrap;
    row-gap: 10px;
}

.row.sis-card-content .highlight-option-list label.control-label img{
  max-width: 22px;
  vertical-align: middle;
  display: inline-block;
  margin: 0 5px;
}


.upload-icon {
    position: relative;
    border: 1px dashed #ccc;
    padding: 10px;
    width: 100%;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
}

.upload-icon input {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.upload-icon .upload-text {
    text-align: center;
    font-size: 15px;
}

.upload-icon .option-image {
    position: absolute;
    right: 15px;
    top: 5px;
}

.rating-star {
  gap: 5px;
  display: flex;
  align-items: center;
  margin: 5px 0px;
}
.rating-star a {
  width: 25px;
  height: 25px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgb(176, 176, 176);
  transition: 0.4s ease-in-out;
}

.rating-star a i {
  display: inline-block;
  color: #fff;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: 0.4s ease-in-out;
  font-size: 20px;
  
}
.rating-star a.active,.rating-star a:hover {
  background-color: var(--admin-panel-color) ;
  transition: 0.4s ease-in-out;
}

.rating-star a.half-active,.rating-star a.half-active:hover {
  background: linear-gradient(90deg,var(--admin-panel-color) 50%, rgba(176, 176, 176, 1) 50%);
}
/**************************new admin css*************************/
@media screen and (max-width: 1370px) {

    .table thead th,
    .table th {
        font-size: 14px;
    }

    .table tr td {
        font-size: 13px;
    }
}

@media screen and (max-width: 1023px) {
    .mini-sidebar .page-wrapper {
        padding-left: 0px;
    }
}

@media screen and (max-width: 991px) {
    .row.sis-card-content {
        max-width: 100%;
    }

    .row.sis-card-content label.control-label {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media screen and (max-width: 767px) {

    #users-table_filter #selected_search.form-control,
    #users-table_filter .form-group,
    #users-table_filter .form-group .form-control,
    #users-table_filter .form-group button.btn {
        width: 100%;
    }
}

.form-group.row .chosen-container-multi .chosen-choices {
    padding: 10px 10px;
    border-radius: 4px;
}

.form-group.row .chosen-container-multi .chosen-choices li.search-choice {
    padding: 8px 25px 8px 10px;
    font-size: 15px;
    font-weight: 500;
}

.form-group.row .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
    top: 9px;
    right: 6px;
}

.form-group.row .chosen-container-multi .chosen-drop .result-selected {
    color: #333;
    padding: 8px 6px;
    font-size: 15px;
}

.chosen-container-multi .chosen-choices li.search-field input[type="text"] {
    color: #333 !important;
    font-size: 15px !important;
}

.form-group.row .item_attributes {
    padding: 15px;
}

.form-group.row .item_attributes>div {
    margin-bottom: 10px;
}

.form-group.row .item_attributes label {}

.item_attributes .bootstrap-tagsinput {
    width: 100%;
}

.item_attributes .bootstrap-tagsinput .tag {
    padding: 7px 10px;
    font-size: 15px;
}

.item_attributes .bootstrap-tagsinput .tag [data-role="remove"] {
    background: #ffff;
    border-radius: 50px;
    width: 18px;
    height: 18px;
    color: #000;
    display: inline-block;
    text-align: center;
    font-weight: 600;
    line-height: 16px;
    vertical-align: middle;
}

.item_variants .table .thead-light th {
    vertical-align: middle;
}

.item_variants .table td .variant-image .upload .icon {
    text-align: center;
    font-size: 20px;
    cursor: pointer;
    display: inline-block;
    margin-left: 15px;
}

.item_variants .table td .variant-image .upload {
    text-align: center;
}

.item_variants .table td .variant-image .upload .image {
    text-align: center;
    position: relative;
    max-width: 55px;
    display: inline-block;
}

.item_variants .table td .variant-image .upload .image i.mdi-delete {
    font-size: 12px;
    cursor: pointer;
    position: absolute;
    right: -8px;
    background: var(--admin-panel-color);
    color: #fff;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    display: inline-block;
    top: -6px;
}

.version-info {
    text-align: center;
    color: #fff;
    padding: 8px 35px 8px 15px;
    display: block;
    font-size: 15px;
    font-weight: 700;
}

.mini-sidebar .version-info {
    padding: 8px 11px 8px 5px;
    width: 60px;
}

.radio-form input[type="radio"] {
    position: absolute;
    z-index: 1 !important;
    left: 15px;
    right: 15px;
    height: 100%;
    width: auto;
    opacity: 0;
    cursor: pointer;
}

.table tr td .switch {
    display: inline-block;
    width: 40px;
    height: 21px;
    cursor: pointer;
    margin: auto;
    position: relative;
}

.table tr td .switch input {
    opacity: 0;
    height: 100%;
    z-index: 5;
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    top: 0;
    bottom: 0;
    cursor: pointer;
}

.table tr td .switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: red;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 34px;
    width: auto;
    height: auto;
}

.table tr td .switch .slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: 1px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50%;
}

.table tr td .switch input:checked+.slider {
    background-color: green;
}

.table tr td .switch input:checked+.slider::before {
    -webkit-transform: translateX(19px);
    -ms-transform: translateX(19px);
    transform: translateX(19px);
}

.placeholder_img_thumb,
.logo_img_thumb {
    padding: 15px 15px;
}

.form-group .placeholder_img_thumb {
    padding: 15px 15px;
}

/* Fixed box + contain so thumbs never stretch or reflow while loading */
.placeholder_img_thumb img,
.logo_img_thumb img {
    width: 56px !important;
    height: 56px !important;
    object-fit: contain;
    border-radius: 8px;
    background: #f5f7fb;
    margin-right: 5px;
}

.placeholder_img_thumb .image-item {
    position: relative;
    margin-right: 10px;
    display: inline-block;
}

.placeholder_img_thumb .image-item .delete-btn,
.placeholder_img_thumb .image-item .remove-btn {
    position: absolute;
    right: 4px;
    top: -4px;
    width: 20px;
    height: 20px;
    background: var(--admin-panel-color);
    color: #fff;
    font-size: 9px;
    text-align: center;
    border-radius: 50px;
    line-height: 20px;
    padding: 0 4px 0 2px;
    cursor: pointer;
}

.rental-detailed-ratings-and-reviews h3 {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    letter-spacing: 0.03em;
    color: #000000;
    margin-bottom: 11px;
}

.rental-review .reviews-members-header .feather-star {
    /*color: #eca700 !important;*/
}

.rental-review .reviews-members {
    background: #FFFFFF;
    border: 1px solid #E5EAF1;
    border-radius: 15px;
    padding: 14px 17px;
}

.rental-review .reviews-members .media {
    padding-bottom: 15px;
    border: 0;
    border-bottom: 1px solid #E5EAF1;
    margin-bottom: 10px;
    padding-left: 0;
    padding-right: 0;
}

.rental-review .reviews-members .reviews-members-body p {
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0.05em;
}

.review-date span {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    letter-spacing: 0.03em;
    color: #666666;
}

.carbook-detail-left .card {
    background: #FFFFFF;
    border: 0;
    border-radius: 0;
    /*height: 100%;*/
}

.rental-review .reviews-members-header h6 {
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0.03em;
    color: #333333;
}

.attribute-ratings .feature-reviews-members-header {
    position: relative;
    z-index: 1;
}

.attribute-ratings .feature-reviews-members-header:before {
    position: absolute;
    content: "";
    background: #E5EAF1;
    height: 1px;
    left: 0;
    right: 0;
    bottom: 8px;
    z-index: -1;
}

.attribute-ratings .feature-reviews-members-header h6 {
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    letter-spacing: 0.05em;
    color: #333333;
    background: #fff;
    padding-right: 10px;
    min-width: 150px;
}

.attribute-ratings .feature-reviews-members-header .rating-info {
    background: #fff;
    padding-left: 10px;
}

.rating-info .feather-star {
    font-size: 17px;
    margin-right: 4px;
}

.attribute-ratings .rating-info .count-rating {
    width: 20px;
    text-align: right;
}

.rental-review .reviews-members .reviews-members-body .photos ul {
    padding-left: 0;
    list-style-type: none;
    margin-bottom: 0;
}

.rental-review .reviews-members .reviews-members-body .photos ul li {
    display: inline-block;
    margin-right: 10px;
    width: 15%;
    vertical-align: middle;
}

.rental-review .reviews-members .reviews-members-body .photos ul li img {
    display: block;
    width: 100%;
    border-radius: 5px;
    background: #E7E7E7;
    height: 53px;
    object-fit: contain;
}

.order_detail .attribute-ratings {
    border-top: 1px solid rgba(120, 130, 140, 0.13);
    padding-top: 10px;
}

.order_detail .attribute-ratings h3 {
    border: 0;
    padding-bottom: 0;
}

/*dashnoard*/
.business-analytics .card-box {
    background-color: #fff;
    border-radius: 10px;
    padding: 20px 60px 20px 20px;
    position: relative;
    border: 1px solid rgba(180, 208, 224, .5);
    box-shadow: 0 5px 10px rgba(0, 0, 0, .05);
    height: 100%;
    transition: all .3s ease;
    cursor: pointer;
}

.business-analytics .card-box h5 {
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: 600;
    color: #666;
}

.business-analytics .card-box h2 {
    font-weight: 700;
    font-size: 22px;
    color: #000;
    margin: 0;
}

.business-analytics .card-box i {
    position: absolute;
    inset-block-start: 16px;
    inset-inline-end: 16px;
    font-size: 30px;
    color: #fff;
    width: 40px;
    text-align: center;
    height: 40px;
    background: #000;
    border-radius: 5px;
    line-height: 40px;
}

.business-analytics__img {
    position: absolute;
    inset-block-start: 16px;
    inset-inline-end: 16px;
}

.business-analytics_list>div {
    padding-bottom: 10px;
}

.order-status {
    background-color: rgba(110, 137, 175, .0509803922);
    border-radius: 10px;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    height: 100%;
    transition: all .3s ease;
}

.order-status .data {
    display: flex;
    align-items: center;
    gap: 10px;
}

.order-status:hover {
    box-shadow: 2px 2px 15px rgba(7, 59, 116, .15);
}

.order-status .data i {
    font-size: 22px;
}

.order-status span.count {
    color: #0661cb;
    font-size: 18px;
    font-weight: 700;
    margin: 0;
}

.order-status .data h6 {
    margin: 0;
    font-weight: 600;
    font-size: 15px;
    color: #595959;
    margin-bottom: 0;
}

.order_stats_header h4 {
    font-weight: 600;
    color: #000;
    line-height: 30px;
    font-size: 21px;
}

.order_stats_header h4 i {
    font-size: 15px;
    margin-right: 10px;
}

.business-analytics .order-stats__content i {
    font-size: 23px;
}

/*end dashboard*/
.text-green {
    color: green;
    font-weight: 600;
}

.text-red {
    color: red;
    font-weight: 600;
}

.login-logo img {
    max-width: 180px;
    display: inline-block;
  padding: 5px 10px;
  background: #fff;
  border-radius: 10px;
}

.select-theme-radio .form-check-label {
    position: relative;
    margin-right: 15px;
    padding: 10px;
    border-radius: 5px;
}

.select-theme-radio .form-check-label [type="radio"] {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    appearance: none;
    -webkit-appearance: none;
    opacity: 1;
    cursor: pointer;
    border: 2px solid #e1e1e1;
    border-radius: 8px;
}

.select-theme-radio .form-check-label [type="radio"]:before {
    content: '';
    position: absolute;
    top: 2px;
    right: 13px;
    width: 22px;
    height: 22px;
    z-index: 0;
    border: 1px solid #b1b8bb;
    border-top-color: rgb(177, 184, 187);
    border-top-style: solid;
    border-top-width: 1px;
    border-right-color: rgb(177, 184, 187);
    border-right-style: solid;
    border-right-width: 1px;
    border-bottom-color: rgb(177, 184, 87);
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-color: rgb(177, 184, 187);
    border-left-style: solid;
    border-left-width: 1px;
    border-radius: 1px;
    margin-top: 2px;
    -webkit-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
    z-index: 2;
    opacity: 0;
}

.select-theme-radio .form-check-label [type="radio"]:checked {
    border-color: var(--admin-panel-color);
}

.select-theme-radio .form-check-label [type="radio"]:checked:before {
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    -webkit-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    width: 9px;
    height: 15px;
    opacity: 1;
}

.select-theme-radio .form-check-label [type="radio"]:after {
    background: #e1e1e1;
    content: "";
    width: 25px;
    height: 25px;
    border-radius: 0px 5px 0px 8px;
    position: absolute;
    right: 0;
    top: 0;
}

.select-theme-radio .form-check-label [type="radio"]:checked:after {
    background: var(--admin-panel-color);
}

.select-theme-radio .form-check-label img {
    width: 100px;
    object-fit: cover;
}

.modal-body img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto;
}

.ride-list.table-responsive {
    overflow-y: auto;
    height: 460px;
}

.ride-list.table-responsive>input {
    background: #F3F4F6 url(../images/search_icon.png) no-repeat right 10px center;
    border-radius: 20px;
    padding: 12px 25px;
    font-size: 14px;
    color: #6B7280;
    height: auto !important;
    border: 0px;
    width: 98%;
    margin-bottom: 20px;
}

.ride-list.table-responsive .live-tracking-list {
    padding-right: 10px;
}

.live-tracking-list .live-tracking-box {
    position: relative;
    padding-bottom: 15px;
    border-bottom: 1px solid #eaeaea;
    margin-bottom: 15px;
    cursor: pointer;
}

/*.live-tracking-list .live-tracking-box .listicon{position: absolute; width: 25px; height: 25px; border-radius: 50px; border: 3px solid #000000;left: 0; top: 0;display: inline-block;background: #fff;}*/
.live-tracking-list .live-tracking-box .location-ride>div {
    position: relative;
    padding-left: 40px;
    padding-bottom: 32px;
    font-size: 15px !important;
}

.live-tracking-list .live-tracking-box .location-ride>div:after {
    position: absolute;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    border: 3px solid #000000;
    left: 3px;
    top: 0;
    display: inline-block;
    background: #fff;
    content: "";
}

.live-tracking-list .live-tracking-box .location-ride>div:before {
    border: 1px dashed #7D7D7D;
    content: "";
    width: 2px;
    left: 12px;
    top: 0;
    bottom: 0;
    display: inline-block;
    position: absolute;
}

.live-tracking-list .live-tracking-box .location-ride>div:last-child:before {
    display: none;
}

.live-tracking-list .live-tracking-box .location-ride>div.to-ride:after {
    background: #fff url(../images/location.png) no-repeat center;
    width: 23px;
    height: 23px;
    background-size: 100%;
    border: 0;
}

.live-tracking-list .live-tracking-box .location-ride>div span {
    /*padding: 5px 10px;background: #FFFFFF;border: 1px solid #BFCED2;box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.07);border-radius: 5px;*/
    display: inline-block;
}

.live-tracking-box h3.drier-name {
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 5px;
}

.live-tracking-box h4.user-name {
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
}

.live-tracking-box p,
.live-tracking-list .live-tracking-box .location-ride>div {
    color: #000;
    font-size: 13px;
    text-align: left;
}

.live-tracking-list .live-tracking-box .location-ride>div.to-ride {
    padding-bottom: 0;
}

.live-tracking-box .badge {
    padding: 5px 15px;
    font-size: 15px;
    border-radius: 50px;
    margin-top: 20px;
}

.live-tracking-box .badge.badge-info {
    background-color: #17a2b8;
}

.live-tracking-box .badge.badge-success {
    background-color: #28a745;
}

.live-tracking-list .live-tracking-box:last-child:before {
    display: none;
}

.applied_drivers_list {
    background: #FFFFFF;
    border: 1px solid #E5EAF1;
    border-radius: 15px;
    padding: 14px 17px;
    margin-bottom: 15px;
}

.applied_drivers_list>.d-flex {
    align-items: center;
}

.applied_drivers_list .user-img {
    margin-right: 20px;
}

.applied_drivers_list .user-img img {
    border-radius: 100px !important;
    border: 2px solid #eaeaea;
    height: 50px;
    object-fit: cover;
}

.applied_drivers_list .driver_apply-left h4 {
    font-size: 17px;
    color: #000;
    font-weight: 700 !important;
}

.applied_drivers_list .confirm-tag {
    margin-top: 15px;
}

.applied_drivers_list .confirm-tag span.badge {
    padding: 5px 15px;
}

.applied_drivers_list .driver-rate {
    font-size: 18px;
    font-weight: 500;
    color: #000;
    font-size: 18px;
    font-weight: 600;
    display: block;
    margin-bottom: 10px;
}

.applied_drivers_list .drivers-suggest>span {
    display: block;
    font-size: 14px;
    color: #333;
}

.applied_drivers_list .drivers-suggest>span label {
    font-weight: 700;
    color: #000;
}

.table tr td .live-tracking-list .live-tracking-box {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
}

.table tr td .live-tracking-list .live-tracking-box .location-ride>div {
    font-size: 13px !important;
    padding-bottom: 15px;
}

.table tr td .live-tracking-list .live-tracking-box .location-ride>div.to-ride {
    padding-bottom: 0px;
}

.page-wrapper div.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    margin-left: 0px;
    margin-top: 0;
    text-align: center;
    padding: 2px;
    padding-top: 2px;
    padding-top: 15%;
    z-index: 5
}

#phone-box .col-xs-12 {
    position: relative;
}

.form-material .form-control#phone {
    padding-left: 110px;
}

.select2.select2-container .select2-selection--single {
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    height: 40px;
}

.form-group .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px;
}

.form-group .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 38px;
}

.select2-container .select2-selection--single .select2-selection__rendered>span .img-flag {
    max-width: 25px;
}

.select2-container .select2-selection--single .select2-selection__rendered>span {
    font-size: 13px;
    padding-right: 5px;
}

.select2-results__option span img.img-flag {
    max-width: 25px;
}

.select2-container--open .select2-dropdown {
    min-width: 250px;
    top: 7px;
    border: 0;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    background-color: #f5f5f5;
    border: 1px solid #ccc;
}

/* Phone + country — joined group: ql-cc picker flush against the number input */
.phone-box { display: flex; align-items: flex-start; gap: 0; flex-wrap: wrap; }
.phone-box .form-control.user_phone,
.phone-box .form-control.business-phone { flex: 1; min-width: 0; padding-left: 12px; }
.phone-box .err { flex-basis: 100%; }

.add-image-box {
    border: 2px dashed #ccc;
    height: 140px;
    border-radius: 5px;
    position: relative;
    aspect-ratio: 1;
    max-width: 100%;
    position: relative;
    min-width: 150px;
}

.add-image-box .upload-text {
    font-size: 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.add-image-box .upload-text i {
    background: #ccc;
    padding: 10px;
    border-radius: 50px;
    margin-bottom: 5px;
}

.add-image-box .upload-text span {
    display: block;
}

.add-image-box input[type="file"] {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 100%;
    opacity: 0;
    z-index: 1;
    cursor: pointer;
}

.add-image-box .placeholder_img_thumb {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    padding: 0;
}

.add-image-box .placeholder_img_thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

span.remove-menu-btn {
    position: absolute;
    top: -3px;
    right: 4px;
    background: var(--admin-panel-color);
    border-radius: 50px;
    padding: 3px 8px;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
}

.address .transactions-list-view,
.address .transactions-list-view .transactions-list,
.address .transactions-list-view .transactions-list .transactions-list-left {
    height: 100%;
}

.address .transactions-list-view .date {
    margin-bottom: 20px;
    min-height: 40px;
}

.switch-box .switch {
    float: right;
}

.switch-box .switch-box-inner {
    padding: 5px 15px;
    background: #ecf3fb;
    border-radius: 4px;
}

.switch-box .switch-box-inner label.control-label {
    margin-bottom: 0 !important;
}

.switch-box .switch {
    display: inline-block;
    width: 40px;
    height: 21px;
    cursor: pointer;
    margin: auto;
    position: relative;
    vertical-align: middle;
    margin-left: 15px;
}

.switch-box .switch input {
    opacity: 0;
    height: 100%;
    z-index: 5;
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    top: 0;
    bottom: 0;
    cursor: pointer;
}

.switch-box .switch .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 34px;
    width: auto;
    height: auto;
}

.switch-box .switch .slider:before {
    position: absolute;
    content: "";
    height: 19px;
    width: 19px;
    left: 1px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 50%;
}

.switch-box .switch input:checked+.slider {
    background-color: var(--admin-panel-color);
}

.switch-box .switch input:checked+.slider::before {
    -webkit-transform: translateX(19px);
    -ms-transform: translateX(19px);
    transform: translateX(19px);
}

i.fa-info {
    background: #000;
    width: 20px;
    height: 20px;
    color: #fff !important;
    border-radius: 50px;
    text-align: center;
    padding: 3px;
    font-size: 13px;
}

/*Custom Background CSS*/
.bg--1 {
    background: #D9F6FD !important;
    color: #007692;
}

.bg--2 {
    background: #DEF6E7 !important;
    color: #007C52;
}

.bg--3 {
    background: #E1F4FE !important;
    color: #1A6DC3;
}

.bg--4 {
    background: #FFECEC !important;
    color: #D71616;
}

.bg--5 {
    background: #FFEDDD !important;
    color: #C04214;
}

.bg--6 {
    background: rgba(248, 59, 218, 0.11) !important;
}

.bg--7 {
    background: rgba(255, 46, 83, 0.15) !important;
}

.bg--8 {
    background: rgba(0, 170, 17, 0.15) !important;
}

.bg--9 {
    background: rgba(59, 191, 248, 0.1) !important;
}

.bg--10 {
    background: rgba(0, 170, 109, 0.15) !important;
}

.bg--11 {
    background: rgba(248, 146, 59, 0.1) !important;
}

.bg--12 {
    background: rgba(247, 25, 25, 0.11) !important;
}

.bg--13 {
    background: #cceaff !important;
}

.bg--14 {
    background: rgba(255, 0, 0, 0.2) !important;
}

.bg--15 {
    background: rgba(230, 230, 250, 0.8) !important;
}

.bg--16 {
    background: rgba(135, 206, 235, 0.8) !important;
}

.bg--17 {
    background: rgba(152, 251, 152, 0.8) !important;
}

.bg--18 {
    background: rgba(255, 218, 185, 0.8) !important;
}

.bg--19 {
    background: rgba(240, 128, 128, 0.8) !important;
}

.bg--20 {
    background: rgba(255, 215, 0, 0.8) !important;
}

.bg--21 {
    background: rgba(255, 160, 122, 0.8) !important;
}

.bg--22 {
    background: rgba(32, 178, 170, 0.8) !important;
}

.bg--23 {
    background: rgba(224, 255, 255, 0.8) !important;
}

.bg--24 {
    background: rgba(189, 252, 201, 0.8) !important;
}

.bg--25 {
    background: rgba(132, 112, 255, 0.8) !important;
}

.bg--25 {
    background: rgba(132, 112, 255, 0.8) !important;
}

/*Subscription Plans CSS*/
.pricing-card-inner {
    border-radius: 16px;
    border: 1px solid #E5E7EB;
    background: #FFF;
    padding: 24px 24px 150px 24px;
    height: 100%;
    background-size: cover !important;
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
    transition: all ease 0.5s;
}

.pricing-card-inner:hover {
    background: #000 url(../images/commission_base-bg.png) no-repeat center bottom;
    border: 1px solid transparent;
    color: #fff !important;
    transition: all ease 0.5s;
}

.pricing-card.pricing-card-commission .pricing-card-inner:hover {
    background: url(../images/commission_base-bg.png) no-repeat center bottom;
    transition: all ease 0.5s;
}

.pricing-card.Basic .pricing-card-inner:hover {
    background: #000 url(../images/basic-bg.png) no-repeat center bottom;
    transition: all ease 0.5s;
}

.pricing-card.Standard .pricing-card-inner:hover {
    background: #000 url(../images/standard-bg.png) no-repeat center bottom;
    transition: all ease 0.5s;
}

.pricing-card.Pro .pricing-card-inner:hover {
    background: #000 url(../images/pro-bg.png) no-repeat center bottom;
    transition: all ease 0.5s;
}

.pricing-card-btm {
    margin-top: 50px
}

.pricing-card-btm {
    position: absolute;
    left: 40px;
    right: 40px;
    bottom: 30px;
}

.pricing-card-btm .btn {
    width: 100%;
    text-align: center;
    background: #E5E7EB;
    font-size: 16px;
    color: #6B7280;
    padding: 12px 24px;
    border-color: #E5E7EB
}

.pricing-card-btm .btn:hover {
    background: #FF6839;
    border-color: #FF6839;
    color: #fff
}

.pricing-card-content ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.pricing-card-content ul li {
    padding-bottom: 15px
}

.pricing-card-content ul li span.mdi-check {
    color: #26B246;
    margin-right: 5px
}

.pricing-card-content ul li span.mdi-close {
    color: red;
    margin-right: 5px
}

.pricing-card-inner:hover .pricing-card-btm .btn {
    background: #FF6839;
    border-color: #FF6839;
    color: #fff;
    transition: all ease 0.5s;
}

.pricing-card-inner:hover .pricing-card-btm .btn:hover {
    background: #fff;
    color: #FF6839;
    transition: all ease 0.5s;
}

.pricing-card-inner:hover .text-dark-2 {
    color: #fff !important;
    transition: all ease 0.5s;
}

.pay-method-box {
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);
    flex-wrap: wrap;
    padding: 12px;
    margin-bottom: 15px
}

.pay-method-box .pay-method-icon {
    width: 15%;
}

.pay-method-box .form-check {
    width: 85%;
    padding-left: 10px;
    padding-right: 0px;
    font-size: 16px;
    font-weight: 500;
    color: #0C111C;
    justify-content: space-between;
    display: flex;
    align-items: center;
}

.pay-method-box .form-check [type="radio"]+label::before {
    border: 2px solid #4B5563;
    width: 24px;
    height: 24px;
    margin: 0
}

.pay-method-box .form-check [type="radio"]+label::after {
    left: 4px;
    top: 4px;
    border: 2px solid #fff;
    margin: 0;
    background: #FF6839;
}

.pay-method-box .form-check [type="radio"]:checked+label::before {
    background: #FF6839;
    border-color: #FF6839
}

/*End - Subscription Plans CSS*/

.page-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: auto;
    text-align: center;
    bottom: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 99;
}

.page-overlay .overlay-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 0;
    height: auto;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    color: #fff;
    font-weight: 700;
    font-size: 28px;
    letter-spacing: 1px
}

.page-overlay .overlay-text img {
    max-width: 40px;
    margin-right: 15px
}
/* Brand loader — identical to the public-site (quicklist-web) loader: a
   conic-gradient masked ring + a leading dot, with a pulsing gradient app name.
   Colours inherit the admin theme (purple/orange/etc). */
.ec-loader-box {
    position: fixed; inset: 0; margin: auto;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.1rem;
}
.ec-spinner {
    position: relative;
    width: 68px; height: 68px; border-radius: 50%;
    border: 0; box-sizing: border-box;
    background: conic-gradient(from 90deg,
        var(--admin-panel-color) 0%,
        rgba(var(--admin-panel-rgb, 132, 74, 239), .55) 42%,
        rgba(var(--admin-panel-rgb, 132, 74, 239), 0) 76%);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 7px));
            mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 7px));
    animation: ec-spin .85s linear infinite;
}
.ec-spinner::after {
    content: ''; position: absolute; top: 0; left: 50%;
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--admin-panel-color); transform: translateX(-50%);
}
.ec-spinner-label {
    font-size: 18px; font-weight: 800; letter-spacing: .4px; margin: 0; text-align: center;
    background: linear-gradient(90deg, var(--admin-panel-color), color-mix(in srgb, var(--admin-panel-color) 55%, #fff));
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
    color: var(--admin-panel-color);
    animation: ec-pulse 1.3s ease-in-out infinite;
}
@keyframes ec-spin { to { transform: rotate(360deg); } }
@keyframes ec-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
/* Frosted, mostly-transparent backdrop — content shows through, softly blurred
   (nicer than a solid white flash). */
.page-overlay { background: rgba(255, 255, 255, .38) !important; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); z-index: 3000; }

.form-group.default-admin {
    padding: 10px;
    font-size: 14px;
    color: #000;
    font-weight: 600;
    border-radius: 10px;
    box-shadow: 0 0px 6px 0px rgba(0, 0, 0, 0.5);
    margin: 20px 10px 10px 10px;
}

.form-group.default-admin .crediantials-field {
    position: relative;
    padding-right: 15px;
    text-align: left;
    padding-top: 5px;
    padding-bottom: 5px;
}

.form-group.default-admin .crediantials-field>a {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 20px;
}

.column-isverified {
    max-width: 120px;
}

.verified-icon {
    color: #4caf50;
    font-size: 20px;
    vertical-align: middle;
}

.waves-dark {
    color: #000000;
    transition: 0.4s ease-in-out;
}

.waves-dark:hover {
    color: #D71616;
    transition: 0.4s ease-in-out;
}



/********************Live tracking******************/
@media screen and (max-width: 1282px) {
    .business-analytics .card-box h2 {
        font-size: 18px;
    }
}

@media screen and (max-width: 767px) {
    .container-fluid {
        padding: 0 15px 25px 15px;
    }

    .business-analytics .card-box {
        padding: 15px 10px 10px;
    }

    .business-analytics .card-box h5 {
        font-size: 12px;
    }

    .business-analytics .card-box h2 {
        font-size: 17px;
    }

    .order-status {
        padding: 8px;
    }

    .daes-sec-sec .card-body {
        overflow-y: auto;
    }

    .mini-sidebar .version-info {
        width: 100%;
    }

    .reviews-top {
        flex-wrap: wrap;
    }

    .reviews-top-right.text-right {
        text-align: left !important;
        padding-top: 15px
    }

    .review-photo-img img {
        height: 250px;
    }
}

@media screen and (max-width: 360px) {
    .review-photo-img img {
        height: auto;
    }
}

.card.chat-app {
    max-width: 900px;
    margin: 0 auto;
}

.chat .chat-header {
    padding: 15px 20px;
    border-bottom: 1px solid #e6e6e6
}

.chat .chat-header .profile-image {
    margin-right: 15px;
}
.chat .chat-header .text-right .profile-image {
    margin-right: 0px;
    padding-left: 15px;
}

.chat .chat-header img,.chat-massage-user img {
    float: left;
    border-radius: 40px;
    width: 50px;
    height: 50px;
    object-fit: cover;
    object-position: top;
}

.chat .chat-header .chat-about {
    padding-left: 0px
}

.chat .chat-history {
    padding: 20px;
    border-bottom: 2px solid #fff;
    height: 70vh;
    overflow-y: auto;
    scrollbar-width: thin;
    min-height: 300px;
}

.chat .chat-history::-webkit-scrollbar-track,
.sis-sidebar-content::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    border-radius: 10px;
    background-color: #F5F5F5;
}

.chat .chat-history::-webkit-scrollbar,
.sis-sidebar-content::-webkit-scrollbar {
    width: 12px;
    background-color: #F5F5F5;
}

.chat .chat-history::-webkit-scrollbar-thumb,
.sis-sidebar-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}


.chat .chat-history ul {
    padding: 0
}

.chat .chat-history ul li {
    list-style: none;
    margin-bottom: 30px;
    padding-bottom: 20px;

}

.chat .chat-history ul li:last-child {
    margin-bottom: 0px
}

.chat .chat-history .message-data {
    margin-bottom: 15px;
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.5px;
}

.chat .chat-history .message-data img {
    border-radius: 40px;
    width: 40px
}

.chat .chat-history .message-data-time {
    color: #434651;
    padding-left: 6px
}

.chat .chat-history .message {
    color: #000;
    padding: 10px 20px;
    line-height: 26px;
    font-size: 16px;
    border-radius: 7px;
    display: inline-block;
    position: relative;
    font-weight: 500;
}

.chat .chat-history .message:after {
    bottom: 100%;
    left: 7%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-bottom-color: #fff;
    border-width: 10px;
    margin-left: -10px
}

.chat .chat-history .my-message {
    background: #e3e3e3
}

.chat .chat-history .my-message:after {
    bottom: 100%;
    left: 30px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-bottom-color: #e3e3e3;
    border-width: 10px;
    margin-left: -10px
}

.chat .chat-history .other-message {
    background: #ffd8d8;
    text-align: right
}

.chat .chat-history .other-message:after {
    border-bottom-color: #ffd8d8;
    left: auto;
    right: 10px
}

.chat .chat-message {
    padding: 20px
}

.sis-content ul li .description-box {
    height: 100px;
    overflow-y: auto;
}

/****************************************
 * eClassified — Custom Fields module
 ****************************************/
.options-row .bootstrap-tagsinput {
    width: 100%;
}

/****************************************
 * eClassified — Shared utilities
 ****************************************/
/* Tight label-toggle pair: overrides .switch-box's `float:right` so the
   toggle sits close to its label regardless of container width. */
.switch-box.switch-box-tight {
    display: flex;
    align-items: center;
    gap: 12px;
}
.switch-box.switch-box-tight .control-label {
    margin-bottom: 0;
}
.switch-box.switch-box-tight .switch {
    float: none !important;
    margin-left: 0 !important;
}

/* DataTables top bar: keep Search input + export buttons vertically aligned. */
.dataTables_wrapper .dataTables_filter label {
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
.dataTables_wrapper .dataTables_filter input.form-control,
.dataTables_wrapper .dataTables_length select.form-control {
    height: 38px;
}
.dataTables_wrapper .dt-buttons .btn {
    height: 38px;
    padding: 0 12px;
    display: inline-flex;
    align-items: center;
    line-height: 1;
    margin: 0;
}
/* Right-align the Export-as dropdown collection so it stays within the card's right edge
   instead of overflowing into the clipped area beside the table-responsive scroller. */
.dataTables_wrapper div.dt-button-collection {
    right: 8px !important;
    left: auto !important;
    transform: none !important;
    background: #fff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 4px;
    padding: 8px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
    min-width: 160px;
}
/* Caret arrow on the collection points at the original (left) trigger position; hide it
   since we've right-aligned the menu. */
.dataTables_wrapper div.dt-button-collection::before,
.dataTables_wrapper div.dt-button-collection::after {
    display: none !important;
}
/* Style the collection items as standard Bootstrap dropdown items (white bg, dark text,
   hover) so the DataTables Export-as menu matches the Bootstrap-dropdown Export-as menus
   used by city/area. Overrides the inherited `btn-info` teal styling from the trigger. */
.dataTables_wrapper div.dt-button-collection .dt-button,
.dataTables_wrapper div.dt-button-collection a.dt-button {
    display: block;
    width: 100%;
    margin: 0;
    padding: 8px 16px;
    background: #fff !important;
    background-image: none !important;
    color: #1f2937 !important;
    border: 0 !important;
    border-radius: 0 !important;
    text-align: left;
    height: auto;
    line-height: 1.4;
    box-shadow: none !important;
    font-weight: 400;
}
.dataTables_wrapper div.dt-button-collection .dt-button:hover,
.dataTables_wrapper div.dt-button-collection a.dt-button:hover {
    background: #f3f4f6 !important;
    color: #1f2937 !important;
}
/* When `.table-responsive` wraps a DataTables-driven table, its `overflow-x: auto` clips
   the Export-as dropdown horizontally. Disable the scroller in that case — DataTables'
   `responsive: true` extension already handles narrow viewports by collapsing columns. */
.table-responsive:has(.dataTables_wrapper) {
    overflow: visible;
}
.dataTables_wrapper .dataTables_length label {
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Inline-form gap utilities (replaces ad-hoc style="gap:Npx") */
.gap-8  { gap: 8px; }
.gap-12 { gap: 12px; }
.gap-16 { gap: 16px; }
.gap-24 { gap: 24px; }

/* Form-control / select max-widths used by toolbar dropdowns and search inputs */
.mw-170 { max-width: 170px; }
.mw-200 { max-width: 200px; }
.mw-220 { max-width: 220px; }
.mw-240 { max-width: 240px; }
.mw-260 { max-width: 260px; }

/* Map picker container shared by City/Area/Ad-form Address tabs */
.location-map { height: 380px; border-radius: 8px; }

/* Page-title module icon (inline mdi at the top of every list page) */
.module-title-icon { font-size: 32px; }

/* Standard list-page thumbnail cell */
.list-thumb {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 6px;
}

/* Country flag thumbnails (list page = 32px wide, inline column = 20px wide) */
.flag-32 { width: 32px; height: auto; border-radius: 3px; }
.flag-20 { width: 20px; height: auto; vertical-align: middle; margin-right: 6px; }

/* Page-size selector (custom-table pagination) */
.w-80 { width: 80px; }
/* NOTE: do NOT define `.w-100` here — Bootstrap 4's `.w-100` is `width: 100% !important`
   and any redefinition silently loses the cascade. For pixel widths use `.w-80` etc. */

/* Shrink-wrap a table column to its content (used in Log Viewer for the Level badge column) */
.col-shrink {
    width: 1%;
    white-space: nowrap;
}

/* Sortable header cell */
.sortable { cursor: pointer; }

/* ─── Settings Hub cards (resources/views/settings/index.blade.php) ─── */
.settings-card-link { display: block; color: inherit; text-decoration: none; }
.settings-card-link:hover { text-decoration: none; color: inherit; }
.settings-card { transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease; }
.settings-card-link:hover .settings-card {
    box-shadow: 0 6px 18px rgba(0,0,0,.08);
    border-color: #FF7E56 !important;
    transform: translateY(-1px);
}
.settings-card-icon {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    background: rgba(255, 126, 86, .12);
    color: #FF7E56;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}
.settings-card-arrow { color: #9ca3af; font-size: 22px; line-height: 1; }
.settings-card-link:hover .settings-card-arrow { color: #FF7E56; }

/* Branding panel-color picker (gives the native <input type="color"> a presentable size) */
.brand-color-input {
    width: 60px;
    height: 38px;
    padding: 2px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    cursor: pointer;
    background: #fff;
}

/* ─── Ad-create wizard (resources/views/advertisement/create.blade.php) ─── */

/* Wizard tab strip — flat, no fade, no Bootstrap underline distractions */
/* The theme's customized bootstrap gives bare ul.nav a grey box + border — kill it here. */
.ad-wizard-tabs { border: 0 !important; border-bottom: 2px solid #e5e7eb !important; border-radius: 0 !important; box-shadow: none !important; padding-left: 0; margin-bottom: 24px; background: transparent !important; list-style: none; display: flex; flex-wrap: wrap; }
.ad-wizard-tabs .nav-item { margin-bottom: -2px; background: transparent !important; }
.ad-wizard-tabs .nav-link {
    color: #374151;
    background: transparent !important;
    border: 0;
    border-bottom: 2px solid transparent;
    padding: 11px 16px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease;
}
/* Wizard typography — align with the form design system (ec-form-label scale) */
.ad-wizard-pane label.control-label { display: block; font-size: 13px; font-weight: 600; color: #3b4060; margin-bottom: 6px; }
.ad-wizard-pane h4 { font-size: 16px; font-weight: 700; color: #0C111C; }
.ad-wizard-pane .form-control { font-size: 14px; }
.ad-wizard-tabs .nav-link:hover {
    color: var(--admin-panel-color);
    border-bottom-color: rgba(var(--admin-panel-rgb), .25);
}
.ad-wizard-tabs .nav-link.active {
    color: var(--admin-panel-color);
    border-bottom-color: var(--admin-panel-color);
    background: transparent !important;
}
.ad-wizard-tabs .nav-link.disabled {
    color: #94a3b8;
    cursor: not-allowed;
    background: transparent !important;
}
.ad-wizard-tabs .nav-link.disabled:hover { color: #94a3b8; border-bottom-color: transparent; }

/* Category drill-down grid */
.cat-breadcrumb { color: var(--admin-panel-color); font-size: 14px; font-weight: 600; }
.cat-breadcrumb a { color: var(--admin-panel-color); text-decoration: none; }
.cat-breadcrumb a:hover { text-decoration: underline; }
.cat-breadcrumb .sep { color: #9ca3af; margin: 0 6px; }
.cat-breadcrumb .leaf { color: #1f2937; }

.cat-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 16px; }
.cat-card {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 18px 20px;
    display: flex;
    align-items: center;
    cursor: pointer;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease, transform .1s ease;
}
.cat-card:hover {
    border-color: var(--admin-panel-color);
    box-shadow: 0 4px 12px rgba(var(--admin-panel-rgb), .08);
}
.cat-card.is-leaf-selected { border-color: var(--admin-panel-color); background: rgba(var(--admin-panel-rgb), .06); }
.cat-card-icon {
    width: 56px; height: 56px;
    display: inline-flex; align-items: center; justify-content: center;
    margin-right: 14px;
    flex-shrink: 0;
}
.cat-card-icon img { max-width: 100%; max-height: 100%; }
.cat-card-icon i { font-size: 32px; color: var(--admin-panel-color); }
.cat-card-name { font-size: 14px; font-weight: 600; color: #1f2937; }
.cat-card-meta { font-size: 12px; color: #9ca3af; margin-top: 2px; }

.ad-go-back-btn {
    background: #6b7280;
    color: #fff;
    border: 0;
    border-radius: 6px;
    padding: 8px 14px;
    cursor: pointer;
}
.ad-go-back-btn:hover { background: #4b5563; color: #fff; }
.ad-go-back-btn:disabled { background: #d1d5db; cursor: not-allowed; }

/* Wizard footer (Previous / Next / Post) */
.ad-wizard-footer { display: flex; justify-content: space-between; margin-top: 24px; }

/* Feature Section style picker (4 visual variants — admin clicks one) */
.fs-style-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 14px; }
.fs-style-card {
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px;
    cursor: pointer;
    background: #fff;
    transition: border-color .15s ease, box-shadow .15s ease;
    text-align: center;
}
.fs-style-card:hover { border-color: var(--admin-panel-color); }
.fs-style-card.is-selected { border-color: var(--admin-panel-color); box-shadow: 0 4px 12px rgba(var(--admin-panel-rgb), .15); }
.fs-style-thumb {
    height: 120px;
    border-radius: 6px;
    background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    padding: 12px;
    margin-bottom: 8px;
    overflow: hidden;
}
.fs-style-name { font-weight: 500; color: #1f2937; }

/* Compact thumb used inside the list-page Style column */
.fs-style-thumb-sm {
    width: 88px;
    height: 56px;
    border-radius: 4px;
    padding: 6px;
    overflow: hidden;
    display: inline-block;
}
.fs-style-thumb-sm[data-style="grid"]   { background: linear-gradient(135deg, #fde2e4, #f9d4d6); }
.fs-style-thumb-sm[data-style="list"]   { background: linear-gradient(135deg, #d1fae5, #a7f3d0); }
.fs-style-thumb-sm[data-style="horizontal_scroll"] { background: linear-gradient(135deg, #dbeafe, #bfdbfe); }
.fs-style-thumb-sm[data-style="banner"] { background: linear-gradient(135deg, #fef3c7, #fde68a); }
.fs-style-thumb-sm .fs-mini-list-row { height: 12px; gap: 3px; }
.fs-style-thumb-sm .fs-mini-list-row .fs-mini-thumb { width: 14px; }
.fs-style-thumb-sm .fs-mini-list-row .fs-mini-bar { height: 2px; }
.fs-style-thumb-sm .fs-mini-list { gap: 2px; }
.fs-style-thumb-sm .fs-mini-grid { gap: 2px; }
.fs-style-thumb-sm .fs-mini-hero { gap: 2px; }
.fs-style-thumb-sm .fs-mini-hero .fs-mini-stack { gap: 2px; }
.fs-style-thumb-sm .fs-mini-banner { padding: 4px; }
.fs-style-thumb-sm .fs-mini-banner .fs-mini-bar { height: 3px; margin-bottom: 2px; }

/* Mini layout mockups — each thumb is a tiny visual of the actual section layout */
/* Card-tile (rounded chip) used inside multiple mockups */
.fs-mini-tile { background: #fff; border-radius: 3px; box-shadow: 0 1px 2px rgba(0,0,0,.08); }

/* Grid — uniform 3×2 tiles */
.fs-style-card[data-style="grid"] .fs-style-thumb { background: linear-gradient(135deg, #fde2e4, #f9d4d6); }
.fs-mini-grid { display: grid; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); gap: 4px; height: 100%; }
.fs-mini-grid .fs-mini-tile { width: 100%; height: 100%; }

/* List — image + text rows stacked vertically */
.fs-style-card[data-style="list"] .fs-style-thumb { background: linear-gradient(135deg, #d1fae5, #a7f3d0); }
.fs-mini-list { display: flex; flex-direction: column; gap: 5px; height: 100%; justify-content: center; }
.fs-mini-list-row { display: flex; align-items: center; gap: 6px; height: 22px; }
.fs-mini-list-row .fs-mini-thumb { width: 28px; height: 100%; background: #fff; border-radius: 3px; flex-shrink: 0; }
.fs-mini-list-row .fs-mini-bars { flex: 1; display: flex; flex-direction: column; gap: 3px; }
.fs-mini-list-row .fs-mini-bar { height: 5px; background: rgba(255,255,255,.85); border-radius: 2px; }
.fs-mini-list-row .fs-mini-bar.short { width: 60%; }

/* Stack — hero + 2-up side stack (1 large left, 2 small right) */
.fs-style-card[data-style="horizontal_scroll"] .fs-style-thumb { background: linear-gradient(135deg, #dbeafe, #bfdbfe); }
/* Horizontal Scroll / Slider — a single row of items that scrolls sideways.
   Tiles have a fixed basis and the row is clipped on the right, so the last
   tile is cut off → conveys "scrollable row". */
.fs-mini-hscroll { display: flex; align-items: center; gap: 5px; height: 100%; overflow: hidden; }
.fs-mini-hscroll .fs-mini-tile { flex: 0 0 32%; height: 74%; }
.fs-style-thumb-sm .fs-mini-hscroll { gap: 2px; }

/* Banner — single full-width hero with title bar */
.fs-style-card[data-style="banner"] .fs-style-thumb { background: linear-gradient(135deg, #fef3c7, #fde68a); }
.fs-mini-banner { height: 100%; background: #fff; border-radius: 4px; box-shadow: 0 1px 2px rgba(0,0,0,.08); display: flex; flex-direction: column; justify-content: flex-end; padding: 8px; }
.fs-mini-banner .fs-mini-bar { height: 6px; background: #fde68a; border-radius: 2px; margin-bottom: 4px; }
.fs-mini-banner .fs-mini-bar.short { width: 50%; background: #fcd34d; }

/* Drag handles on reorderable list rows (feature-section, safety-tip, slider, seller-document) */
.fs-row-handle, .st-row-handle, .sl-row-handle, .sd-row-handle { cursor: grab; color: #9ca3af; user-select: none; }
.fs-row-handle:hover, .st-row-handle:hover, .sl-row-handle:hover, .sd-row-handle:hover { color: var(--admin-panel-color); }

/* Seller Verification — status badges */
.sv-status-badge { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.sv-status-badge.pending  { background: #fef3c7; color: #92400e; }
.sv-status-badge.approved { background: #d1fae5; color: #047857; }
.sv-status-badge.rejected { background: #fee2e2; color: #b91c1c; }
.sv-status-inline { border-radius: 999px; padding: 4px 24px 4px 12px; font-size: 12px; font-weight: 600; border: 1px solid transparent; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-position: right 6px center; background-repeat: no-repeat; background-size: 12px; }
.sv-status-inline.sv-status-pending  { background-color: #fef3c7; color: #92400e; background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%2392400e' d='M2 4l4 4 4-4'/%3E%3C/svg%3E"); }
.sv-status-inline.sv-status-approved { background-color: #d1fae5; color: #047857; background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23047857' d='M2 4l4 4 4-4'/%3E%3C/svg%3E"); }
.sv-status-inline.sv-status-rejected { background-color: #fee2e2; color: #b91c1c; background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath fill='%23b91c1c' d='M2 4l4 4 4-4'/%3E%3C/svg%3E"); }

/* Seller Verification — detail-page document cards */
.sv-user-card { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin-bottom: 20px; }
.sv-user-card .sv-user-name { font-size: 18px; font-weight: 600; color: #1f2937; margin-bottom: 4px; }
.sv-user-card .sv-user-meta { color: #6b7280; font-size: 13px; }

.sv-doc-card { border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin-bottom: 16px; background: #fff; }
.sv-doc-card .sv-doc-head { font-weight: 600; color: #1f2937; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
.sv-doc-images { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.sv-doc-image-wrap { border: 1px dashed #d1d5db; border-radius: 6px; padding: 8px; text-align: center; background: #f9fafb; }
.sv-doc-image-wrap .sv-doc-image-label { font-size: 12px; color: #6b7280; margin-bottom: 6px; text-transform: uppercase; letter-spacing: .04em; }
.sv-doc-image-wrap img { max-width: 100%; max-height: 180px; object-fit: contain; border-radius: 4px; cursor: zoom-in; }
.sv-doc-image-wrap .sv-doc-no-image { padding: 40px 8px; color: #9ca3af; font-size: 13px; font-style: italic; }

.sv-status-panel { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 20px; margin-top: 16px; }
.sv-status-panel .sv-reason-row { display: none; }
.sv-status-panel.is-rejected .sv-reason-row { display: block; }

/* Lightbox overlay for full image */
.sv-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.85); z-index: 10000; display: none; align-items: center; justify-content: center; cursor: zoom-out; }
.sv-lightbox.is-open { display: flex; }
.sv-lightbox img { max-width: 92vw; max-height: 92vh; box-shadow: 0 20px 60px rgba(0,0,0,.5); border-radius: 4px; }

/* Subscription History — status badges (read-only list + detail) */
.sh-status-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.sh-status-badge.active    { background: #d1fae5; color: #047857; }
.sh-status-badge.expired   { background: #fee2e2; color: #b91c1c; }
.sh-status-badge.cancelled { background: #e5e7eb; color: #4b5563; }
.sh-usage-bar { background: #e5e7eb; border-radius: 999px; height: 6px; overflow: hidden; min-width: 80px; max-width: 160px; }
.sh-usage-bar > div { background: var(--admin-panel-color); height: 100%; transition: width .2s ease; }
.sh-usage-bar.is-full > div { background: #b91c1c; }
.sh-usage-text { font-size: 12px; color: #6b7280; white-space: nowrap; }
.sh-card { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; margin-bottom: 16px; }
.sh-card .sh-card-title { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; margin-bottom: 6px; }
.sh-card .sh-card-value { font-size: 18px; font-weight: 600; color: #1f2937; }
.sh-detail-row { display: grid; grid-template-columns: 180px 1fr; gap: 16px; padding: 10px 0; border-bottom: 1px solid #f1f2f6; }
.sh-detail-row:last-child { border-bottom: none; }
.sh-detail-row .sh-label { font-size: 13px; font-weight: 600; color: #6b7280; }
.sh-value { font-size: 14px; color: #0C111C; }
.sh-pay-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; text-transform: capitalize; background: #e5e7eb; color: #4b5563; }
.sh-pay-badge.stripe       { background: #ede9fe; color: #6d28d9; }
.sh-pay-badge.razorpay     { background: #dbeafe; color: #1d4ed8; }
.sh-pay-badge.paypal       { background: #fef3c7; color: #92400e; }
.sh-pay-badge.paystack     { background: #d1fae5; color: #047857; }
.sh-pay-badge.payfast      { background: #fce7f3; color: #be185d; }
.sh-pay-badge.flutterwave  { background: #ffedd5; color: #c2410c; }
.sh-txn-id { font-family: ui-monospace, "SF Mono", Consolas, monospace; font-size: 12px; color: #6b7280; word-break: break-all; }
.sh-strike { text-decoration: line-through; color: #9ca3af; font-size: 12px; margin-right: 4px; }

/* Advertisement detail page */
.adv-hero { display: grid; grid-template-columns: 7fr 5fr; gap: 24px; align-items: start; }
.adv-cover { position: relative; border-radius: 8px; overflow: hidden; background: #f3f4f6; aspect-ratio: 4/3; }
.adv-cover img { width: 100%; height: 100%; object-fit: cover; display: block; cursor: zoom-in; }
.adv-thumbs { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.adv-thumbs img { width: 72px; height: 56px; object-fit: cover; border-radius: 4px; cursor: pointer; opacity: .65; transition: opacity .15s ease, transform .15s ease; }
.adv-thumbs img:hover { opacity: 1; transform: translateY(-1px); }
.adv-thumbs img.is-active { opacity: 1; outline: 2px solid var(--admin-panel-color); }

.adv-side { display: flex; flex-direction: column; gap: 12px; }
.adv-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 4px; }
.adv-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.adv-badge.active { background: #d1fae5; color: #047857; }
.adv-badge.pending { background: #fef3c7; color: #92400e; }
.adv-badge.sold { background: #e5e7eb; color: #374151; }
.adv-badge.inactive { background: #e5e7eb; color: #4b5563; }
.adv-badge.expired { background: #fde68a; color: #78350f; }
.adv-badge.soft-rejected { background: #ffe4e6; color: #be123c; }
.adv-badge.permanent-rejected { background: #fecaca; color: #7f1d1d; }
.adv-badge.featured { background: #fef3c7; color: #92400e; }
.adv-badge.published { background: #dbeafe; color: #1d4ed8; }
.adv-badge.unpublished { background: #fee2e2; color: #b91c1c; }

.adv-price { font-size: 30px; font-weight: 800; color: var(--admin-panel-color); letter-spacing: -.01em; }
.adv-title { font-size: 22px; font-weight: 600; color: #1f2937; line-height: 1.3; }

.adv-row { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px; }
.adv-row .adv-row-title { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; margin-bottom: 6px; font-weight: 600; }
.adv-row .adv-row-body { color: #1f2937; }

.adv-section { margin-top: 26px; }
.adv-section h5 { display: inline-block; background: var(--admin-panel-color); color: #fff; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 6px 14px; border-radius: 8px; margin-bottom: 14px; }

.adv-breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: #6b7280; }
.adv-breadcrumb-chip { background: #ede9fe; color: #5b21b6; padding: 4px 10px; border-radius: 4px; font-size: 13px; }
.adv-breadcrumb-sep { color: #9ca3af; }

.adv-custom-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.adv-custom-field { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px; display: flex; gap: 10px; align-items: flex-start; }
.adv-custom-field .adv-cf-icon { width: 32px; height: 32px; border-radius: 6px; object-fit: contain; background: #f3f4f6; padding: 4px; flex-shrink: 0; }
.adv-custom-field .adv-cf-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; font-weight: 600; }
.adv-custom-field .adv-cf-value { color: #1f2937; font-weight: 500; margin-top: 2px; word-break: break-word; }

.adv-meta-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.adv-meta-item { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 12px; }
.adv-meta-item .adv-meta-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; }
.adv-meta-item .adv-meta-value { font-size: 16px; font-weight: 600; color: #1f2937; margin-top: 4px; }

.adv-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.9); z-index: 10000; display: none; align-items: center; justify-content: center; cursor: zoom-out; padding: 32px; }
.adv-lightbox.is-open { display: flex; }
.adv-lightbox img { max-width: 100%; max-height: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.5); border-radius: 4px; }

/* Image slider arrows */
.adv-cover-wrap { position: relative; }
.adv-cover-arrow { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; background: color-mix(in srgb, var(--admin-panel-color) 14%, #fff); color: var(--admin-panel-color); border: none; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.15); z-index: 5; transition: background .15s ease, transform .15s ease; }
.adv-cover-arrow:hover { background: var(--admin-panel-color); color: #fff; transform: translateY(-50%) scale(1.05); }
.adv-cover-arrow.prev { left: 14px; }
.adv-cover-arrow.next { right: 14px; }
.adv-cover-arrow i { font-size: 24px; line-height: 1; }
.adv-cover-arrow:disabled { opacity: .35; cursor: not-allowed; }
.adv-cover-arrow:disabled:hover { background: color-mix(in srgb, var(--admin-panel-color) 14%, #fff); color: var(--admin-panel-color); transform: translateY(-50%); }
/* Hide the broken-image icon before JS assigns a real cover src */
.adv-cover img[src=""], .adv-cover img:not([src]) { visibility: hidden; }

/* Map embed for location section */
.adv-map-embed { border-radius: 8px; overflow: hidden; border: 1px solid #e5e7eb; background: #f3f4f6; }
.adv-map-embed iframe { display: block; width: 100%; border: 0; }

/* Sidebar info cards (Owner / Contact / Quick Actions) */
.adv-card { background: #fff; border: 1px solid #eceef3; border-radius: 12px; padding: 16px; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.adv-card-label { font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--admin-panel-color); margin-bottom: 8px; font-weight: 700; }
.adv-card-body { color: #1f2937; }
.adv-quick-row { display: flex; justify-content: space-between; align-items: center; padding: 4px 0; }
.adv-quick-row + .adv-quick-row { border-top: 1px solid #eef0f3; margin-top: 6px; padding-top: 10px; }
.adv-quick-row .adv-quick-label { font-weight: 500; color: #1f2937; }

.adv-price-type { font-size: 13px; font-weight: 500; color: #6b7280; }

/* Combined Title & Description multilang pane */
.adv-td-pane .adv-td-title { font-size: 22px; font-weight: 600; color: #1f2937; line-height: 1.3; margin-bottom: 12px; }
.adv-td-pane .adv-td-desc { color: #374151; white-space: pre-wrap; line-height: 1.55; }

/* Multilang tabs on view page — keep the strip content-width, not full-row */
.adv-section .nav-tabs,
.adv-side .nav-tabs { display: inline-flex; max-width: 100%; }
.adv-section .nav-tabs .nav-link,
.adv-side .nav-tabs .nav-link { padding: 6px 14px; }

/* Advertisement edit page — image slots + gallery + custom fields */
.ad-cover-slot { border: 1px dashed #cbd5e1; border-radius: 8px; padding: 8px; background: #f9fafb; text-align: center; min-height: 160px; display: flex; align-items: center; justify-content: center; }
.ad-cover-slot img { max-width: 100%; max-height: 200px; border-radius: 4px; object-fit: contain; }
.ad-gallery { display: flex; flex-wrap: wrap; gap: 10px; min-height: 110px; padding: 8px; border: 1px dashed #cbd5e1; border-radius: 8px; background: #f9fafb; }
.ad-gallery-item { position: relative; width: 110px; height: 90px; border-radius: 6px; overflow: hidden; background: #fff; border: 1px solid #e5e7eb; }
.ad-gallery-item img { width: 100%; height: 100%; object-fit: cover; }
.ad-gallery-item .ad-gallery-remove,
.ad-gallery-item .ad-gallery-remove-new { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.65); color: #fff; border: none; line-height: 1; font-size: 14px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.ad-gallery-item .ad-gallery-remove:hover,
.ad-gallery-item .ad-gallery-remove-new:hover { background: #b91c1c; }
.ad-gallery-item.ad-gallery-new { border-color: var(--admin-panel-color); }
.ad-gallery-badge { position: absolute; bottom: 4px; left: 4px; background: var(--admin-panel-color); color: #fff; font-size: 10px; padding: 1px 6px; border-radius: 3px; font-weight: 600; letter-spacing: .05em; }

.cf-multi { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 6px; padding: 8px 12px; max-height: 180px; overflow-y: auto; }
.cf-check { padding: 4px 0; cursor: pointer; margin-bottom: 0; }
.cf-check input { margin-right: 8px; }

/* Address autocomplete (Nominatim typeahead) */
.addr-search-wrap { position: relative; }
.addr-suggest { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #e5e7eb; border-top: none; border-radius: 0 0 6px 6px; box-shadow: 0 6px 16px rgba(0,0,0,.08); z-index: 1000; max-height: 260px; overflow-y: auto; display: none; }
.addr-suggest.is-open { display: block; }
.addr-suggest-item { padding: 10px 14px; cursor: pointer; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #f3f4f6; font-size: 14px; color: #1f2937; }
.addr-suggest-item:last-child { border-bottom: none; }
.addr-suggest-item:hover, .addr-suggest-item.is-active { background: #f0fdfa; color: #0a4751; }
.addr-suggest-item .addr-suggest-icon { color: var(--admin-panel-color); flex-shrink: 0; font-size: 18px; }
.addr-suggest-empty { padding: 10px 14px; color: #9ca3af; font-size: 13px; }

/* Address display row below map */
.addr-display { display: flex; align-items: flex-start; gap: 12px; background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px 16px; margin-top: 14px; }
.addr-display .addr-display-icon { color: var(--admin-panel-color); font-size: 22px; flex-shrink: 0; line-height: 1; padding-top: 2px; }
.addr-display .addr-display-body { flex: 1; min-width: 0; }
.addr-display .addr-display-label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #6b7280; font-weight: 600; margin-bottom: 4px; }
.addr-display .addr-display-text { color: #1f2937; word-break: break-word; }
.addr-display .addr-display-input { border: none; background: transparent; width: 100%; padding: 0; font-size: 15px; color: #1f2937; outline: none; }
.addr-display .addr-display-input:focus { box-shadow: none; }
.addr-display .addr-display-coords { font-size: 12px; color: #9ca3af; margin-top: 4px; }

@media (max-width: 991px) {
    .adv-hero { grid-template-columns: 1fr; }
}

/* Subscription Package — list + form */
.sp-icon-thumb { width: 56px; height: 56px; object-fit: contain; border-radius: 6px; background: #f3f4f6; padding: 4px; }

/* Notifications — composer form + history */
.notif-status-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .03em; }
.notif-status-pill.queued  { background: #fef3c7; color: #92400e; }
.notif-status-pill.sending { background: #dbeafe; color: #1d4ed8; }
.notif-status-pill.sent    { background: #d1fae5; color: #047857; }
.notif-status-pill.failed  { background: #fee2e2; color: #b91c1c; }
.notif-image-thumb { width: 48px; height: 48px; object-fit: cover; border-radius: 6px; background: #f3f4f6; }
.notif-image-preview { max-width: 220px; max-height: 160px; border-radius: 6px; border: 1px solid #e5e7eb; padding: 4px; background: #fff; }
.notif-user-pick-table { max-height: 60vh; overflow-y: auto; }
.notif-user-row { display: flex; align-items: center; gap: 12px; padding: 8px 14px; border-bottom: 1px solid #f3f4f6; cursor: pointer; }
.notif-user-row:hover { background: #f9fafb; }
.notif-user-row.is-picked { background: #ecfeff; }
.notif-user-row .notif-user-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: #f3f4f6; flex-shrink: 0; }
.notif-user-row .notif-user-name { font-weight: 500; color: #1f2937; }
.notif-user-row .notif-user-meta { font-size: 12px; color: #6b7280; }
.notif-picked-summary { background: #ecfeff; border: 1px solid #a5f3fc; border-radius: 6px; padding: 8px 12px; color: #155e75; font-size: 13px; margin-top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* Chats — 3-pane admin chat (Products / Conversations / Messages) */
.chat-page { display: grid; grid-template-columns: 320px 320px 1fr; grid-template-rows: minmax(0, 1fr); gap: 16px; height: calc(100vh - 200px); min-height: 500px; }
@media (max-width: 1199px) { .chat-page { grid-template-columns: 280px 280px 1fr; } }
@media (max-width: 991px)  { .chat-page { grid-template-columns: 1fr; grid-template-rows: none; height: auto; } }

/* min-height:0 lets the panes shrink inside the fixed-height grid so their
   inner .chat-list / .chat-messages-body scroll instead of the whole page. */
.chat-pane { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
.chat-pane-header { padding: 14px 18px; border-bottom: 1px solid #f3f4f6; display: flex; align-items: center; justify-content: space-between; }
.chat-pane-header h5 { margin: 0; font-size: 18px; font-weight: 600; color: #1f2937; }
.chat-pane-header .chat-pane-meta { font-size: 12px; color: #6b7280; margin-top: 2px; }
.chat-icon-btn { color: var(--admin-panel-color); background: transparent; border: none; padding: 4px 8px; cursor: pointer; font-size: 20px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; width: 36px; height: 36px; transition: background .15s ease, color .15s ease; }
.chat-icon-btn:hover { color: #fff; background: var(--admin-panel-color); }
.chat-icon-btn.is-danger { color: #b91c1c; }
.chat-icon-btn.is-danger:hover { color: #fff; background: #ef4444; }

.chat-search { padding: 10px 16px; border-bottom: 1px solid #f3f4f6; }
.chat-search .input-group { position: relative; }
.chat-search .input-group i { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: #9ca3af; pointer-events: none; }
.chat-search input { padding-left: 38px; border-radius: 999px; background: #f3f4f6; border: 1px solid transparent; }
.chat-search input:focus { border-color: var(--admin-panel-color); background: #fff; outline: none; box-shadow: none; }

.chat-list { flex: 1; overflow-y: auto; padding: 4px 0; }
.chat-list-empty { text-align: center; color: #9ca3af; padding: 40px 20px; font-size: 13px; }

.chat-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; cursor: pointer; border-left: 3px solid transparent; transition: background .15s ease; }
.chat-item:hover { background: #f9fafb; }
.chat-item.is-active { background: color-mix(in srgb, var(--admin-panel-color) 9%, #fff); border-left-color: var(--admin-panel-color); }
.chat-item-thumb { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: #f3f4f6; }
.chat-item-thumb.product-thumb { width: 52px; height: 52px; border-radius: 6px; }
.chat-item-body { flex: 1; min-width: 0; }
.chat-item-row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.chat-item-title { font-weight: 600; color: #1f2937; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-item-time { font-size: 11px; color: #9ca3af; flex-shrink: 0; }
.chat-item-sub { font-size: 12px; color: #6b7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-item-price { color: var(--admin-panel-color); font-weight: 600; font-size: 13px; }

/* Messages pane */
.chat-messages-pane { background: #fff; }
.chat-messages-header { padding: 14px 18px; border-bottom: 1px solid #f3f4f6; display: flex; align-items: center; gap: 12px; }
.chat-messages-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; padding: 40px 30px; color: #6b7280; text-align: center; }
.chat-messages-empty i { font-size: 64px; color: #cbd5e1; margin-bottom: 16px; }
.chat-messages-empty h4 { font-size: 18px; color: #374151; font-weight: 600; margin: 0 0 6px; }
.chat-messages-empty p { margin: 0; color: #9ca3af; font-size: 13px; max-width: 320px; }

.chat-messages-body { flex: 1; min-height: 0; overflow-y: auto; padding: 18px 20px; display: flex; flex-direction: column; gap: 10px; background: #fafafa; }
.chat-message { max-width: 70%; padding: 10px 14px; border-radius: 14px; font-size: 14px; line-height: 1.4; word-wrap: break-word; }
.chat-message.is-buyer { align-self: flex-start; background: #fff; border: 1px solid #e5e7eb; border-bottom-left-radius: 4px; }
/* Outgoing bubbles use a light brand tint (matching the selected conversation
   item) with dark text, instead of a solid fill. */
.chat-message.is-seller { align-self: flex-end; background: color-mix(in srgb, var(--admin-panel-color) 14%, #fff); color: #1f2430; border: 1px solid color-mix(in srgb, var(--admin-panel-color) 24%, #fff); border-bottom-right-radius: 4px; }
.chat-message.is-admin { align-self: flex-end; background: color-mix(in srgb, var(--admin-panel-color) 26%, #fff); color: #1f2430; border: 1px solid color-mix(in srgb, var(--admin-panel-color) 38%, #fff); border-bottom-right-radius: 4px; }
.chat-message .chat-message-meta { font-size: 10px; opacity: .8; margin-top: 4px; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.chat-message.is-buyer .chat-message-meta,
.chat-message.is-seller .chat-message-meta,
.chat-message.is-admin .chat-message-meta { color: #6b7280; }

/* Role pill on every message bubble so admin/seller/buyer are crystal-clear */
.chat-role-pill { display: inline-block; font-size: 9px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; line-height: 1.4; }
.chat-role-pill.role-buyer  { background: #e5e7eb; color: #374151; }
.chat-role-pill.role-seller { background: color-mix(in srgb, var(--admin-panel-color) 20%, #fff); color: var(--admin-panel-color); }
.chat-role-pill.role-admin  { background: color-mix(in srgb, var(--admin-panel-color) 30%, #fff); color: var(--admin-panel-color); }
.chat-message.is-offer { background: #fef3c7; border: 1px solid #fde68a; color: #92400e; align-self: center; max-width: 80%; text-align: center; font-weight: 600; border-radius: 8px; }

.chat-input-bar { border-top: 1px solid #f3f4f6; padding: 12px 16px; display: flex; align-items: center; gap: 10px; background: #fff; }
.chat-input-bar .chat-input { flex: 1; border: 1px solid #e5e7eb; border-radius: 999px; padding: 10px 18px; outline: none; font-size: 14px; }
.chat-input-bar .chat-input:focus { border-color: var(--admin-panel-color); }
.chat-input-bar .chat-send-btn { background: var(--admin-panel-color); color: #fff; border: none; width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s ease; flex-shrink: 0; }
.chat-input-bar .chat-send-btn:hover { background: color-mix(in srgb, var(--admin-panel-color) 82%, #000 18%); }
.chat-input-bar .chat-send-btn:disabled { background: #cbd5e1; cursor: not-allowed; }
.chat-input-bar .chat-offer-btn { background: #fef3c7; color: #92400e; border: none; width: 42px; height: 42px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background .15s ease; flex-shrink: 0; font-size: 18px; }
.chat-input-bar .chat-offer-btn:hover { background: #fde68a; }
.chat-input-bar .chat-offer-btn:disabled { background: #f3f4f6; color: #cbd5e1; cursor: not-allowed; }

.chat-banner-info { background: color-mix(in srgb, var(--admin-panel-color) 8%, #fff); border: 1px solid color-mix(in srgb, var(--admin-panel-color) 22%, #fff); border-radius: 8px; padding: 12px 16px; color: #374151; font-size: 13px; margin: 12px 16px 0; }
.chat-banner-info i { color: var(--admin-panel-color); margin-right: 6px; }
.chat-banner-info a { color: var(--admin-panel-color); font-weight: 600; }

/* Subscription package drag-reorder */
.sp-drag-handle { cursor: grab; transition: color .15s ease; }
.sp-drag-handle:hover { color: var(--admin-panel-color) !important; }
.sp-drag-handle:active { cursor: grabbing; }
.sp-drag-ghost { opacity: .4; background: #ecfeff !important; }
.sp-type-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.sp-type-badge.adListing  { background: #dbeafe; color: #1d4ed8; }
.sp-type-badge.featuredAds { background: #fef3c7; color: #92400e; }
.sp-cat-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.sp-cat-badge.global   { background: #d1fae5; color: #047857; }
.sp-cat-badge.specific { background: #ede9fe; color: #6d28d9; }

.sp-settings-panel { border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px; background: #f9fafb; margin-bottom: 16px; }
.sp-settings-panel legend { font-size: 14px; font-weight: 600; padding: 0 8px; width: auto; }
.sp-conditional { display: none; }
.sp-conditional.is-visible { display: block; }

.sp-key-point-row { display: flex; gap: 8px; margin-bottom: 8px; }
.sp-key-point-row input { flex: 1; }
.sp-key-point-row .btn-remove { color: #b91c1c; }

.sp-cat-picker.is-hidden { display: none; }
.sp-cat-list { max-height: 480px; overflow-y: auto; border: 1px solid #e5e7eb; border-radius: 6px; padding: 12px; background: #fff; }
.sp-cat-global-note { padding: 24px 16px; text-align: center; color: #6b7280; font-style: italic; font-size: 13px; background: #f9fafb; border: 1px dashed #d1d5db; border-radius: 6px; }
.sp-cat-global-note.is-hidden { display: none; }

.sp-icon-preview img { max-width: 96px; max-height: 96px; border-radius: 6px; background: #f3f4f6; padding: 6px; }

/* Seller Reviews — star rating + inline View More */
.sr-stars { color: #f59e0b; font-size: 16px; white-space: nowrap; }
.sr-stars .mdi-star-outline { color: #d1d5db; }
.sr-review .sr-view-toggle { color: var(--admin-panel-color); font-weight: 500; margin-left: 4px; cursor: pointer; }
.sr-review .sr-view-toggle:hover { text-decoration: underline; }
tr.ui-sortable-helper { background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,.1); }
tr.ui-sortable-placeholder { visibility: visible !important; background: rgba(var(--admin-panel-rgb), .06); height: 56px; }

/* Safety-tip description: View More/Less inline toggle */
.st-desc .st-view-toggle { color: var(--admin-panel-color); font-weight: 500; margin-left: 4px; }
.st-desc .st-view-toggle:hover { text-decoration: underline; }

/* Slider — image preview thumb + radio-target panels */
.sl-image-preview img { max-width: 320px; max-height: 160px; border-radius: 6px; box-shadow: 0 2px 6px rgba(0,0,0,.08); }
.sl-list-thumb { width: 72px; height: 44px; object-fit: cover; border-radius: 4px; box-shadow: 0 1px 3px rgba(0,0,0,.1); }
.sl-target-group { display: flex; flex-direction: row; gap: 12px; flex-wrap: wrap; align-items: flex-start; }
.sl-target-row {
    flex: 1 1 0;
    min-width: 220px;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 12px 16px;
    background: #fff;
    transition: border-color .15s ease, background .15s ease;
}
.sl-target-row.is-active { border-color: var(--admin-panel-color); background: color-mix(in srgb, var(--admin-panel-color) 7%, #fff); }
.sl-target-row .sl-target-head { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.sl-target-row .sl-target-head input[type="radio"] { margin: 0; }
.sl-target-row .sl-target-head label { margin: 0; font-weight: 500; cursor: pointer; }
.sl-target-row .sl-target-body { margin-top: 10px; padding-left: 26px; display: none; }
.sl-target-row.is-active .sl-target-body { display: block; }
.sl-type-badge { display: inline-block; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.sl-type-badge.ad       { background: #dbeafe; color: #1d4ed8; }
.sl-type-badge.category { background: #d1fae5; color: #047857; }
.sl-type-badge.url      { background: #fef3c7; color: #92400e; }

/* Ad-images dropzone */
.ad-dropzone {
    border: 2px dashed #d1d5db;
    border-radius: 10px;
    background: #f9fafb;
    padding: 36px 16px;
    text-align: center;
    transition: border-color .15s ease, background .15s ease;
}
.ad-dropzone.is-dragover { border-color: var(--admin-panel-color); background: rgba(var(--admin-panel-rgb), .06); }
.ad-dropzone-icon { font-size: 56px; color: var(--admin-panel-color); }
.ad-dropzone-inner { display: flex; flex-direction: column; align-items: center; }

/* Thumbnail strip */
.ad-thumb-strip { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.ad-thumb {
    position: relative;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    overflow: hidden;
    background: #f9fafb;
}
.ad-thumb img { width: 100%; height: 140px; object-fit: cover; display: block; }
.ad-thumb-cover-badge {
    position: absolute;
    top: 6px; left: 6px;
    background: var(--admin-panel-color);
    color: #fff;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 999px;
    letter-spacing: .3px;
}
.ad-thumb-actions {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    background: rgba(0,0,0,.55);
    display: flex;
    justify-content: space-between;
    padding: 4px 6px;
    opacity: 0;
    transition: opacity .15s ease;
}
.ad-thumb:hover .ad-thumb-actions { opacity: 1; }
.ad-thumb-action {
    background: transparent;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    padding: 2px 6px;
    line-height: 1;
}
.ad-thumb-action:disabled { color: #9ca3af; cursor: not-allowed; }
.ad-thumb-action.ad-thumb-remove:hover { color: #f87171; }

/* Phone country picker (ql-cc) — same UI as the quicklist-web login picker.
   Flag+code button joined to the number input; searchable flag/name/code menu.
   Used inside .phone-box (user forms) and .phone-row (ad wizard). */
.ql-cc-native { display: none !important; }
.ql-cc { position: relative; flex-shrink: 0; }
.ql-cc-btn {
    display: flex; align-items: center; gap: 7px;
    height: 42px; padding: 0 12px;
    background: #fff;
    border: 1px solid #e2e6ef;
    border-radius: 10px 0 0 10px;   /* joined group: flat right edge against the input */
    font-size: 14px; font-weight: 600; color: #0C111C;
    white-space: nowrap; cursor: pointer;
}
.ql-cc-btn:disabled { background: #f6f7fb; cursor: not-allowed; color: #9aa1b4; }
.ql-cc-btn img { width: 22px; height: 15px; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
.ql-cc-btn .mdi { font-size: 14px; color: #9aa1b4; }
.ql-cc-menu {
    position: absolute; top: calc(100% + 6px); left: 0; z-index: 1050;
    width: 300px; background: #fff;
    border: 1px solid #e2e6ef; border-radius: 12px;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .12);
    padding: 8px;
}
.ql-cc-search {
    width: 100%; height: 38px; padding: 0 12px;
    border: 1px solid #e2e6ef; border-radius: 8px;
    font-size: 14px; color: #0C111C; outline: none;
}
.ql-cc-search:focus { border-color: var(--admin-panel-color); box-shadow: 0 0 0 3px rgba(var(--admin-panel-rgb, 132, 74, 239), .15); }
.ql-cc-list { max-height: 260px; overflow-y: auto; margin-top: 6px; }
.ql-cc-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: 14px; color: #1f2937; }
.ql-cc-item:hover { background: var(--admin-panel-color); color: #fff; }
.ql-cc-item:hover .cd { color: #fff; }
.ql-cc-item.is-active { background: rgba(var(--admin-panel-rgb, 132, 74, 239), .08); }
.ql-cc-item.is-active:hover { background: var(--admin-panel-color); }
.ql-cc-item img { width: 22px; height: 15px; object-fit: cover; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0,0,0,.08); flex-shrink: 0; }
.ql-cc-item .nm { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ql-cc-item .cd { color: #9aa1b4; font-weight: 600; }
.ql-cc-empty { padding: 10px; font-size: 13px; color: #9aa1b4; }
/* Joined input halves */
.phone-row { gap: 0 !important; }
.phone-row input.form-control,
.phone-box .form-control.user_phone,
.phone-box .form-control.business-phone { border-radius: 0 10px 10px 0; margin-left: -1px; }
.phone-row input.form-control:focus, .phone-box .form-control:focus { position: relative; z-index: 2; }

#cf-filter-group .select{
    background: #F3F4F6;
    border-color: #F3F4F6;
}
.form-control {
    background-color: #F3F4F6;
    border-color: #F3F4F6;
}
.form-control:focus{
    background-color: #F3F4F6;
    border-color: #F3F4F6;
}

/*******************
   Listings — index page redesign
   Header, KPI stat cards, Filter card + chips, table card
*******************/
.listings-page .container-fluid { padding-top: 12px; }

/* Page head — title + subtitle + primary action */
.ec-page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
}
.ec-page-head-text h3 {
    font-size: 24px;
    font-weight: 800;
    color: #0C111C;
    margin: 0;
}
.ec-page-head-text p { font-size: 14px; }
.ec-head-btn {
    background: var(--admin-panel-color);
    color: var(--admin-panel-contrast, #fff);
    border: none;
    border-radius: 10px;
    padding: 11px 22px;
    font-weight: 600;
    font-size: 14px;
    box-shadow: 0 6px 14px rgba(var(--admin-panel-rgb, 132, 74, 239), .28);
    transition: box-shadow .15s, transform .06s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.ec-head-btn:hover { color: var(--admin-panel-contrast, #fff); box-shadow: 0 10px 22px rgba(var(--admin-panel-rgb, 132, 74, 239), .38); }
.ec-head-btn:active { transform: translateY(1px); }
.ec-head-btn i { font-size: 18px; }

/* KPI horizontal stat variant — icon-left, value-top, sub-label under */
.ec-kpi.ec-kpi-stat {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px 22px;
}
.ec-kpi.ec-kpi-stat .ec-kpi-icon {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--kpi-tint);
    color: var(--kpi-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
.ec-kpi.ec-kpi-stat .ec-kpi-body { min-width: 0; }
.ec-kpi.ec-kpi-stat .ec-kpi-value { font-size: 26px; font-weight: 800; color: #0C111C; line-height: 1; margin: 0 0 4px; }
.ec-kpi.ec-kpi-stat .ec-kpi-label { font-size: 13px; color: #5a6179; font-weight: 600; margin-bottom: 2px; }
.ec-kpi.ec-kpi-stat .ec-kpi-sub   { font-size: 12px; color: #9aa1b4; font-weight: 500; }

/* Filter card ─────────────────────────────────────────── */
.ec-filter-card { border: 1px solid #eef0f4; border-radius: 14px; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.ec-filter-card .card-header {
    background: #fff;
    border-bottom: 1px solid #eef0f4;
    padding: 16px 20px;
    border-radius: 14px 14px 0 0;
}
.ec-filter-card .card-header h5 { font-size: 16px; font-weight: 700; color: #0C111C; }
.ec-filter-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px; height: 36px;
    border-radius: 10px;
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .12);
    color: var(--admin-panel-color);
    font-size: 20px;
}
.ec-quick-chips { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ec-quick-label { font-size: 12.5px; color: #8a90a6; font-weight: 500; margin-right: 4px; }
.ec-chip {
    background: #f5f7fb;
    border: 1px solid #e6e9f0;
    color: #3b4060;
    border-radius: 999px;
    padding: 6px 14px;
    font-size: 12.5px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: background .15s, color .15s, border-color .15s;
}
.ec-chip i { font-size: 15px; }
.ec-chip:hover {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .10);
    border-color: rgba(var(--admin-panel-rgb, 132, 74, 239), .28);
    color: var(--admin-panel-color);
}
.ec-chip.is-active {
    background: var(--admin-panel-color);
    border-color: var(--admin-panel-color);
    color: #fff;
}

/* Filter row inputs */
.ec-filter-label { font-size: 12.5px; color: #5a6179; font-weight: 600; margin-bottom: 6px; }
.ec-filter-card .form-control {
    background: #fff;
    border: 1px solid #e2e6ef;
    border-radius: 10px;
    height: 42px;
    font-size: 14px;
    color: #0C111C;
}
.ec-filter-card .form-control:focus {
    background: #fff;
    border-color: var(--admin-panel-color);
    box-shadow: 0 0 0 3px rgba(var(--admin-panel-rgb, 132, 74, 239), .15);
}
/* Chrome closes a just-opened native <select> dropdown if a CSS transition
   (Bootstrap's border-color/box-shadow) runs on focus — needing a second click.
   Selects don't need the focus animation, so disable it on all native selects. */
select.form-control,
select.form-control:focus {
    transition: none !important;
}
.ec-filter-actions { display: flex; gap: 6px; }
.ec-btn-brand {
    background: var(--admin-panel-color);
    color: var(--admin-panel-contrast, #fff);
    border: none;
    border-radius: 10px;
    height: 42px;
    padding: 0 16px;
    font-weight: 600;
    font-size: 13.5px;
    display: inline-flex; align-items: center; gap: 5px;
    box-shadow: 0 4px 10px rgba(var(--admin-panel-rgb, 132, 74, 239), .22);
}
.ec-btn-brand:hover { color: var(--admin-panel-contrast, #fff); box-shadow: 0 8px 18px rgba(var(--admin-panel-rgb, 132, 74, 239), .32); }
.ec-btn-ghost {
    background: #fff;
    border: 1px solid #e2e6ef;
    color: #3b4060;
    border-radius: 10px;
    height: 42px;
    padding: 0 16px;
    font-weight: 600;
    font-size: 13.5px;
    display: inline-flex; align-items: center; gap: 5px;
}
.ec-btn-ghost:hover { background: #f5f7fb; }
.ec-btn-ghost.ec-btn-danger { color: #dc2626; border-color: #f3c9c9; }
.ec-btn-ghost.ec-btn-danger:hover { background: #fef2f2; border-color: #dc2626; }

/* Listings table card */
.ec-list-card { border: 1px solid #eef0f4; border-radius: 14px; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.ec-list-card .card-header {
    background: #fff;
    border-bottom: 1px solid #eef0f4;
    padding: 16px 20px;
    border-radius: 14px 14px 0 0;
}
.ec-list-card .card-header h5 { font-size: 16px; font-weight: 700; color: #0C111C; }
/* Card body inset — matches the card-header's 20px horizontal padding so the
   length menu / info / pagination sit inside a consistent frame instead of
   flush against the card's right border (which read as a text-alignment bug). */
.ec-list-card .card-body { padding: 16px 20px; }

/* Higher specificity — DataTables' `.display` / `.dataTable` classes
   land after our rules on init, so we anchor selectors on `.dataTable` to
   keep the header size stable before AND after the table renders. */
.ec-list-table thead th,
table.ec-list-table.dataTable thead th,
table.ec-list-table.dataTable thead > tr > th {
    background: #fafbfd;
    color: #4b5563;
    font-size: 13px;
    font-weight: 700 !important;  /* beats the global `.table.dataTable th{font-weight:400!important}` in style.css:10939 */
    letter-spacing: 0;
    text-transform: none;
    border-top: 0;
    border-bottom: 1px solid #eef0f4;
    padding: 14px 16px !important;
}
.ec-list-table tbody td,
table.ec-list-table.dataTable tbody td {
    padding: 14px;
    vertical-align: middle;
    border-top: 1px solid #f1f3f7;
    font-size: 13.5px;
    color: #3b4060;
    background: #fff;
}

/* Kill DataTables' zebra stripe (`.display` adds .odd/.even) so every row
   is uniform white; only the hover tint remains. */
table.ec-list-table.dataTable tbody tr.odd,
table.ec-list-table.dataTable tbody tr.even,
table.ec-list-table.dataTable tbody tr.odd > *,
table.ec-list-table.dataTable tbody tr.even > * { background: #fff !important; box-shadow: none !important; }

/* Kill DataTables' sorted-column tint (`.sorting_1/2/3`) so the active sort
   column matches the rest; sort direction is still visible via the arrow icon. */
table.ec-list-table.dataTable tbody td.sorting_1,
table.ec-list-table.dataTable tbody td.sorting_2,
table.ec-list-table.dataTable tbody td.sorting_3 { background: #fff !important; box-shadow: none !important; }
table.ec-list-table.dataTable tbody tr:hover > * { background: #fafbfd !important; }

/* Give the active sort column's HEADER a subtle brand tint instead of the
   default gray, so the "which column is sorted" cue matches the admin colour. */
table.ec-list-table.dataTable thead th.sorting_asc,
table.ec-list-table.dataTable thead th.sorting_desc {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .08);
    color: var(--admin-panel-color);
}

/* Listing cell — thumbnail + title + short ID */
.ec-listing-cell { display: flex; align-items: center; gap: 12px; min-width: 220px; }
/* Tables always scroll horizontally instead of collapsing columns (no "+" expander) */
.dataTables_wrapper { overflow-x: auto; }
.table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.ec-list-thumb {
    width: 44px; height: 44px;
    object-fit: cover;
    border-radius: 8px;
    flex: 0 0 44px;
    background: #f5f7fb;
}
.ec-listing-meta { display: flex; flex-direction: column; min-width: 0; }
.ec-list-title {
    color: #0C111C;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ec-list-title:hover { color: var(--admin-panel-color); }
.ec-list-id { font-size: 11.5px; color: #9aa1b4; font-weight: 500; margin-top: 2px; }

/* Category chip */
.ec-cat-chip {
    display: inline-block;
    background: #f5f7fb;
    color: #3b4060;
    border-radius: 6px;
    padding: 4px 10px;
    font-size: 12.5px;
    font-weight: 500;
}
/* Category chips that wrap onto multiple lines inside a table cell.
   flex-wrap wraps the chips even when the DataTable has the `nowrap` class. */
.ec-cat-chips { display: flex; flex-wrap: wrap; gap: 6px; max-width: 560px; white-space: normal; }
.ec-cat-chips .ec-cat-chip { margin: 0; }

/* Seller / user cell — avatar + name.
   Same structure across Listings (seller) and Users (user info):
   <span class="ec-seller">
       <img class="ec-seller-avatar"> | <span class="ec-avatar-fallback">…</span>
       <a class="ec-seller-name">Name</a>
   </span>
*/
.ec-seller {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    line-height: 1;
}
/* Explicit margin-right on the avatar instead of `gap` on the container —
   Bootstrap's `<a>` reset can strip flex gap between an <img> and a following
   inline link, which is why the avatar and name were touching. */
.ec-seller-avatar,
.ec-avatar-fallback {
    width: 36px; height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex: 0 0 36px;
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .14);
    color: var(--admin-panel-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 700;
    overflow: hidden;
    box-sizing: border-box;
    margin-right: 14px !important;
}
.ec-seller-admin .ec-avatar-fallback { background: #fdecec; color: #b91c1c; }
.ec-seller-name {
    font-size: 13.5px;
    color: #3b4060;
    font-weight: 500;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}
.ec-seller-name:hover { color: var(--admin-panel-color); text-decoration: none; }

/* Status pills */
.ec-pill {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .2px;
    line-height: 1.6;
}
.ec-pill.pill-green { background: #e5f7ed; color: #1a7f4c; }
.ec-pill.pill-amber { background: #fef3d5; color: #a86400; }
.ec-pill.pill-gray  { background: #eef0f4; color: #5a6179; }
.ec-pill.pill-dark  { background: #dfe1e7; color: #2c3040; }
.ec-pill.pill-red   { background: #fdecec; color: #b91c1c; }

/* Row actions */
.ec-actions { display: inline-flex; align-items: center; gap: 4px; justify-content: flex-start; }
.ec-act {
    width: 30px; height: 30px;
    border-radius: 8px;
    background: transparent;
    color: #8a90a6;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 17px;
    transition: background .15s, color .15s;
}
.ec-act:hover {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .10);
    color: var(--admin-panel-color);
}
/* Delete icon uses the same brand hover as every other action so the row's
   action strip reads as one uniform control; the mdi-delete icon shape alone
   signals intent. Bulk-delete link in the card header stays red. */
.ec-act.ec-act-danger { color: #8a90a6; }
.ec-act.ec-act-danger:hover { background: rgba(var(--admin-panel-rgb, 132, 74, 239), .10); color: var(--admin-panel-color); }
/* Approve variant — green on hover, distinct from destructive/danger */
.ec-act.ec-act-approve { color: #8a90a6; }
.ec-act.ec-act-approve:hover { background: rgba(34, 197, 94, .10); color: #16a34a; }

/* DataTables Export button collection when it lives in a list-card header
   slot — brand-coloured pill button matching .ec-btn-brand, no odd margins. */
[id$="-export-slot"] .dt-buttons { margin: 0; }
[id$="-export-slot"] .dt-buttons .btn,
[id$="-export-slot"] .dt-buttons .btn.btn-info {
    background: var(--admin-panel-color) !important;
    border-color: var(--admin-panel-color) !important;
    color: #fff !important;
    border-radius: 10px !important;
    height: 38px;
    padding: 0 14px !important;
    font-size: 13.5px;
    font-weight: 600;
    box-shadow: 0 4px 10px rgba(var(--admin-panel-rgb, 132, 74, 239), .22);
    margin: 0 !important;
}
[id$="-export-slot"] .dt-buttons .btn:hover { box-shadow: 0 8px 18px rgba(var(--admin-panel-rgb, 132, 74, 239), .32); }
[id$="-export-slot"] .dt-buttons .btn i { margin-right: 4px; }
.dt-button-collection {
    background: #fff;
    border: 1px solid #eef0f4;
    border-radius: 10px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, .08);
    padding: 6px;
}
.dt-button-collection .dt-button {
    display: block;
    width: 100%;
    text-align: left;
    padding: 8px 12px;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #3b4060;
    font-size: 13px;
}
.dt-button-collection .dt-button:hover {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .08);
    color: var(--admin-panel-color);
}

/* DataTables — quiet the length/info/paginate to match the card */
.ec-list-card .ec-tfoot { padding: 8px 12px 4px; align-items: center; }
.ec-list-card .dataTables_length { margin: 0 20px 0 0; padding: 0; }
.ec-list-card .dataTables_info { padding: 0; }
.ec-list-card .dataTables_length label,
.ec-list-card .dataTables_info { color: #8a90a6; font-size: 12.5px; margin: 0; }
.ec-list-card .dataTables_length select {
    background: #fff;
    border: 1px solid #e2e6ef;
    border-radius: 8px;
    height: 32px;
    padding: 0 8px;
    margin: 0 6px;
    color: #3b4060;
    font-size: 12.5px;
}
.ec-list-card .dataTables_paginate { margin: 0 !important; padding: 0 !important; }
.ec-list-card .dataTables_paginate .paginate_button {
    padding: 4px 10px !important;
    margin: 0 2px !important;
    border-radius: 8px !important;
    color: #5a6179 !important;
    border: none !important;
    background: transparent !important;
}
.ec-list-card .dataTables_paginate .paginate_button:hover {
    background: #f5f7fb !important;
    color: var(--admin-panel-color) !important;
    border: none !important;
}
/* Higher specificity (0,5,1) — the theme's
   `.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button:hover`
   rule (0,5,0) forces `color: #fff !important`, which combined with our light
   hover background made the hovered page number invisible. */
.ec-list-card .dataTables_wrapper .dataTables_paginate a.paginate_button:hover {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .10) !important;
    color: var(--admin-panel-color) !important;
    border: none !important;
}
.ec-list-card .dataTables_wrapper .dataTables_paginate a.paginate_button.disabled:hover {
    background: transparent !important;
    color: #cbd0da !important;
}
.ec-list-card .dataTables_paginate .paginate_button.current,
.ec-list-card .dataTables_paginate .paginate_button.current:hover {
    background: var(--admin-panel-color) !important;
    color: #fff !important;
    border: none !important;
}
/* 5-class + element selector — outranks the DataTables plugin's
   `.dataTables_wrapper .dataTables_paginate .paginate_button.current { color: inherit !important }`
   (0,4,0). Needed for the hand-built pagination on Cities/Areas, which sits
   outside .table-responsive so the theme's 5-class rule doesn't reach it.
   Also caps the pill height so it doesn't touch the separator line above. */
.ec-list-card .dataTables_wrapper .dataTables_paginate a.paginate_button.current,
.ec-list-card .dataTables_wrapper .dataTables_paginate a.paginate_button.current:hover {
    background: var(--admin-panel-color) !important;
    color: #fff !important;
    border: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 10px !important;
    margin: 0 4px;
    line-height: 1;
    border-radius: 8px !important;
}
.ec-list-card .dataTables_paginate .paginate_button.disabled,
.ec-list-card .dataTables_paginate .paginate_button.disabled:hover {
    background: transparent !important;
    color: #cbd0da !important;
    cursor: not-allowed;
}
.ec-list-card .dataTables_length select {
    background: #fff;
    border: 1px solid #e2e6ef;
    border-radius: 8px;
    height: 34px;
    padding: 0 8px;
    color: #3b4060;
}
.ec-list-card .paginate_button {
    border-radius: 8px !important;
    color: #5a6179 !important;
}
.ec-list-card .paginate_button.current,
.ec-list-card .paginate_button.current:hover {
    background: var(--admin-panel-color) !important;
    border-color: var(--admin-panel-color) !important;
    color: #fff !important;
}

/* Responsive */
@media (max-width: 900px) {
    .ec-page-head { flex-direction: column; align-items: flex-start; }
    .ec-filter-card .card-header { flex-direction: column; align-items: flex-start; gap: 12px; }
    .ec-quick-chips { width: 100%; }
    .ec-filter-actions { flex-wrap: wrap; }
}

/* Published toggle in the listings table — override the global red/green
   pill with a slim modern switch that uses the brand color when on. */
.ec-list-table .switch-box { padding: 0; margin: 0; float: none; display: inline-block; }
.ec-list-table .switch-box .switch { width: 36px; height: 20px; margin: 0; display: inline-block; position: relative; vertical-align: middle; }
.ec-list-table .switch-box .switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.ec-list-table .switch-box .switch .slider {
    position: absolute; inset: 0;
    background: #d0d5de;
    border-radius: 999px;
    cursor: pointer;
    transition: background .18s ease;
}
.ec-list-table .switch-box .switch .slider::before {
    content: ''; position: absolute;
    top: 2px; left: 2px;
    width: 16px; height: 16px;
    background: #fff;
    border-radius: 50%;
    box-shadow: 0 1px 2px rgba(15,23,42,.18);
    transition: transform .18s ease;
}
.ec-list-table .switch-box .switch input:checked + .slider { background: var(--admin-panel-color); }
.ec-list-table .switch-box .switch input:checked + .slider::before { transform: translateX(16px); }

/*******************
   Users — index page (reuses listings scaffolding + tiny extras)
*******************/
.ec-verified-badge { color: #22c55e; font-size: 15px; vertical-align: middle; margin-left: 4px; }
.ec-cb-col { width: 32px; text-align: center; padding-left: 12px !important; padding-right: 4px !important; }
.ec-cb-col input[type="checkbox"] { cursor: pointer; }
.users-page .ec-list-table tbody td:first-child input[type="checkbox"] { cursor: pointer; }
.ec-bulk-delete {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: #b91c1c;
    background: #fdecec;
    padding: 6px 14px;
    border-radius: 8px;
    font-size: 12.5px;
    font-weight: 600;
    text-decoration: none;
    transition: background .15s;
}
.ec-bulk-delete:hover { background: #fbdada; color: #b91c1c; text-decoration: none; }
.ec-avatar-wrap { display: inline-flex; align-items: center; }

/*******************
   Create / Edit form pages — shared pattern
   Structure: ec-page-head (title + Back) → ec-form-card(s) → ec-form-actions.
   Fields: 2-per-row (`.row` > `.col-md-6.mb-3`), label above input,
   required * on English only, helper text via .ec-form-help.
*******************/
.ec-form-card { border: 1px solid #eef0f4; border-radius: 14px; box-shadow: 0 1px 2px rgba(15,23,42,.03); }
.ec-form-card .card-header {
    background: #fff;
    border-bottom: 1px solid #eef0f4;
    padding: 16px 20px;
    border-radius: 14px 14px 0 0;
}
.ec-form-card .card-header h5 { font-size: 16px; font-weight: 700; color: #0C111C; }
.ec-form-card .card-body { padding: 20px; }

.ec-form-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #3b4060;
    margin-bottom: 6px;
}
.ec-form-help { font-size: 12px; color: #9aa1b4; margin-top: 4px; }
/* Subtle divider between logical groups inside a form section */
.ec-form-divider { border: 0; border-top: 1px solid #eef0f4; margin: 6px 0 22px; }
/* Utility: aligns a label-less control (toggle, button…) with the INPUT line of an
   adjacent field that has an .ec-form-label above it. Reusable on any form page. */
.ec-label-offset { margin-top: 26px; }
/* Any leftover legacy control-label inside a form card follows the same scale */
.ec-form-card label.control-label { font-size: 13px; font-weight: 600; color: #3b4060; }
.ec-form-card .form-control {
    background: #fff;
    border: 1px solid #e2e6ef;
    border-radius: 10px;
    min-height: 42px;
    font-size: 14px;
    color: #0C111C;
}
.ec-form-card textarea.form-control { min-height: auto; }
/* Select2 inside the ad wizard (Seller) — match .ec-form-card .form-control */
.ad-wizard-pane .select2-container--default .select2-selection--single {
    height: 42px; background: #fff; border: 1px solid #e2e6ef; border-radius: 10px;
    display: flex; align-items: center;
}
.ad-wizard-pane .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.4; padding-left: 12px; padding-right: 28px; color: #0C111C; font-size: 14px;
}
.ad-wizard-pane .select2-container--default .select2-selection--single .select2-selection__arrow { height: 40px; right: 8px; }
.ad-wizard-pane .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #9aa1b4; }
.ad-wizard-pane .select2-container--open .select2-selection--single,
.ad-wizard-pane .select2-container--focus .select2-selection--single {
    border-color: var(--admin-panel-color);
    box-shadow: 0 0 0 3px rgba(var(--admin-panel-rgb, 132, 74, 239), .15);
}
.ec-form-card .form-control:focus {
    background: #fff;
    border-color: var(--admin-panel-color);
    box-shadow: 0 0 0 3px rgba(var(--admin-panel-rgb, 132, 74, 239), .15);
}

/* ── Detail / view page primitives ─────────────────────────────────────── */
.ec-detail-profile { display: flex; align-items: flex-start; gap: 22px; flex-wrap: wrap; }
.ec-detail-avatar { flex-shrink: 0; width: 96px; height: 96px; border-radius: 14px; overflow: hidden; background: #f3f4f6; display: flex; align-items: center; justify-content: center; }
.ec-detail-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ec-detail-info { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 2px; }
.ec-detail-row { display: flex; align-items: baseline; padding: 10px 0; border-bottom: 1px solid #f1f2f6; gap: 16px; }
.ec-detail-row:last-child { border-bottom: none; }
.ec-detail-label { flex: 0 0 160px; font-size: 13px; font-weight: 600; color: #6b7280; }
.ec-detail-value { flex: 1; font-size: 14px; color: #0C111C; word-break: break-word; }
.ec-detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
@media (max-width: 767px) { .ec-detail-grid { grid-template-columns: 1fr; } }

/* Deleted / missing user label */
.ec-deleted-user { color: #9ca3af; font-style: italic; }

/* Brand-tinted info note (e.g. payment currency-support hint) */
.ec-info-note { display: flex; align-items: center; gap: 8px; background: transparent; border: none; color: #374151; border-radius: 0; padding: 4px 20px 8px; font-size: 13.5px; margin: 0; max-width: 100%; }
.ec-info-note i { color: var(--admin-panel-color); font-size: 18px; flex-shrink: 0; }
.ec-info-note a { color: var(--admin-panel-color); font-weight: 600; text-decoration: underline; }

/* Section = bordered fieldset; title = brand pill legend that sits ON the top
   border (classic fieldset/legend look the settings pages had). */
.ec-section { position: relative; border: 1px solid #e2e6ef; border-radius: 10px; padding: 30px 22px 10px; margin-bottom: 28px; }
.ec-section-title { display: inline-block; background: var(--admin-panel-color); color: #fff; font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 6px 14px; border-radius: 8px; margin: 0 0 16px; border: none; }
.ec-section-title i { color: #fff; }
/* When the title is the first child of a bordered section, lift it onto the border. */
.ec-section > .ec-section-title:first-child { position: absolute; top: -14px; left: 20px; margin: 0; }

/* Payment gateway block = bordered fieldset (pill legend) + 2-column field grid.
   Checkboxes span the full width; each field takes one of the two columns. */
.ec-payment-block { position: relative; border: 1px solid #e2e6ef; border-radius: 10px; padding: 32px 22px 14px; margin-bottom: 6px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 24px; align-items: start; }
.ec-payment-block > .ec-section-title { position: absolute; top: -14px; left: 20px; margin: 0; }
/* Clean checkbox row — flush-left, no bootstrap .form-check padding to fight.
   Two checkboxes sit side by side (one per column) like the fields below. */
.ec-payment-block > .ec-pay-check { grid-column: span 1; display: flex; align-items: center; gap: 8px; margin: 0 0 6px; padding: 0; cursor: pointer; font-weight: 500; color: #1f2937; min-width: 0; }
.ec-payment-block > .ec-pay-check span { font-size: 14px; }
.ec-payment-block > .mb-3 { grid-column: span 1; min-width: 0; }
@media (max-width: 767px) { .ec-payment-block { grid-template-columns: 1fr; } }
/* Tighten the space between the fields and the currency-support note */
.ec-payment-card .card-body { padding-bottom: 6px; }
.ec-payment-card .ec-info-note { margin-top: 0; }

/* Custom checkbox — brand-filled with a white tick (replaces odd native boxes).
   Scoped to form checkboxes so it never touches .switch toggles or table selectors. */
.form-check input[type="checkbox"],
.form-check-input[type="checkbox"],
input[type="checkbox"].ec-check {
    -webkit-appearance: none; appearance: none;
    width: 20px; height: 20px; padding: 0;
    border: 1.5px solid #cbd0da; border-radius: 6px; background: #fff;
    cursor: pointer; vertical-align: middle; flex-shrink: 0;
    transition: background .15s ease, border-color .15s ease;
    /* Undo the theme's off-screen checkbox hide (position:absolute;left:-9999px;opacity:0) */
    position: relative !important; left: auto !important; opacity: 1 !important;
}
/* Non-bootstrap checkboxes (payment rows, .ec-check) get inline spacing;
   .form-check-input keeps Bootstrap's own absolute positioning untouched. */
.form-check > input[type="checkbox"]:not(.form-check-input),
input[type="checkbox"].ec-check { margin: 0; }
/* The base theme draws its OWN checkbox on the following <label> via ::before/::after.
   Our custom box already renders on the input, so suppress the theme's to avoid doubles. */
.form-check input[type="checkbox"] + label::before,
.form-check input[type="checkbox"] + label::after,
.form-check-input[type="checkbox"] + label::before,
.form-check-input[type="checkbox"] + label::after,
input[type="checkbox"].ec-check + label::before,
input[type="checkbox"].ec-check + label::after {
    display: none !important;
}
/* Category-tree checkbox label sits next to the box with normal spacing */
.form-check input[type="checkbox"] + label { padding-left: 6px; cursor: pointer; }
.form-check input[type="checkbox"]:checked,
.form-check-input[type="checkbox"]:checked,
input[type="checkbox"].ec-check:checked {
    background: var(--admin-panel-color); border-color: var(--admin-panel-color);
}
.form-check input[type="checkbox"]:checked::after,
.form-check-input[type="checkbox"]:checked::after,
input[type="checkbox"].ec-check:checked::after {
    content: ''; position: absolute; left: 6px; top: 2px; width: 5px; height: 10px;
    border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}
.form-check input[type="checkbox"]:focus,
.form-check-input[type="checkbox"]:focus,
input[type="checkbox"].ec-check:focus {
    outline: none; box-shadow: 0 0 0 3px rgba(var(--admin-panel-rgb, 132, 74, 239), .15);
}
/* Checkbox selection column — center the box in header + every row */
.ec-list-table th.ec-check-col, .ec-list-table td.ec-check-col,
th.ec-check-col, td.ec-check-col { text-align: center; vertical-align: middle; }
.ec-check-col input[type="checkbox"].ec-check { margin: 0; vertical-align: middle; }

/* Role permission matrix — the base theme reserves padding-left:35px on EVERY
   checkbox-label (for a box it draws via ::before). ec-check draws the box on the input
   instead, so kill that padding for every label in the matrix (any label class), tighten
   the spacing and shrink the text. Matches the theme's own `[type="checkbox"] + label`
   shape, scoped to .role-table + !important so it always wins. */
.role-table [type="checkbox"] + label {
    padding-left: 0 !important;
    margin: 0 14px 0 5px !important;   /* small gap to its box, clear gap before the next group */
    height: auto !important;
    line-height: 1.4 !important;
    min-height: 0 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    color: #3b4060;
    cursor: pointer;
    vertical-align: middle;
}

/* Themed inline link (e.g. clickable seller / buyer / ad names in list tables) */
.ec-link { color: var(--admin-panel-color); font-weight: 500; text-decoration: none; }
.ec-link:hover { color: var(--admin-panel-color); text-decoration: underline; }

/* Super Admin lock note — tinted with the dynamic admin panel color (not Bootstrap blue) */
.ec-superadmin-note {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), 0.10);
    border: 1px solid rgba(var(--admin-panel-rgb, 132, 74, 239), 0.28);
    color: var(--admin-panel-color);
    border-radius: 10px;
    padding: 12px 16px;
    font-weight: 600;
}
.ec-superadmin-note i { color: var(--admin-panel-color); font-size: 20px; }

/* Menu (module) name column — slightly smaller so it matches the tighter permission text */
.role-table .table tr td strong { font-size: 14px !important; }
/* Checkbox stays the standard 20px ec-check so the white tick is centered exactly like
   every other checkbox (e.g. bulk delete) — no size/tick override here. */

/* Bulk-action bar (list pages) — appears when rows are checkbox-selected */
.ec-bulk-bar {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .07);
    border: 1px solid rgba(var(--admin-panel-rgb, 132, 74, 239), .18);
    border-radius: 10px; padding: 10px 16px;
}
.ec-bulk-bar .ec-bulk-count { font-size: 14px; color: #3b4060; }
.ec-bulk-bar .ec-bulk-count strong { color: var(--admin-panel-color); }
.ec-bulk-bar .ec-bulk-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* Payment/settings toggle-checkbox rows: keep checkbox + label on one line, no bootstrap indent */
.form-check.width-100 { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-left: 0; }
.form-check.width-100 .form-check-label,
.form-check.width-100 label { margin-bottom: 0; }
.form-check.width-100 .ec-form-help { flex-basis: 100%; margin-top: 4px; }

/* Language tabs — brand underline style. The base theme paints .nav-tabs and
   .nav-item with a grey background band; strip all of it here. */
ul.nav-tabs.ec-lang-tabs,
.ec-lang-tabs {
    display: flex !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #eef0f4 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.adv-section .nav-tabs.ec-lang-tabs { display: flex !important; }
.ec-lang-tabs .nav-item { background: transparent !important; margin: 0 !important; }
.ec-lang-tabs .nav-link,
.ec-lang-tabs .nav-item .nav-link {
    border: none !important;
    border-bottom: 2px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: #8a90a6 !important;
    font-weight: 600;
    font-size: 13.5px;
    padding: 10px 16px;
}
.ec-lang-tabs .nav-link:hover { color: var(--admin-panel-color) !important; }
.ec-lang-tabs .nav-link.active,
.ec-lang-tabs .nav-item .nav-link.active {
    color: var(--admin-panel-color) !important;
    background: transparent !important;
    border-bottom: 2px solid var(--admin-panel-color) !important;
}

/* Bottom action bar */
.ec-form-actions {
    border-top: 1px solid #eef0f4;
    padding: 16px 20px;
    text-align: center;
}
.ec-form-actions .btn { min-width: 130px; justify-content: center; }
.ec-form-actions .ec-btn-ghost { margin-left: 8px; }

/* Image upload preview */
.ec-form-card .placeholder_img_thumb img,
.ec-upload-thumb img {
    height: 80px;
    width: auto;
    max-width: 200px;
    object-fit: cover;
    border-radius: 10px;
    background: #f5f7fb;
    padding: 4px;
    border: 1px solid #eef0f4;
}

/* Styled file input — hides the native control behind a dashed upload box.
   Markup: <label class="ec-upload"><input type="file" …>
             <i class="mdi …"></i>
             <span class="ec-upload-text">…</span>
             <span class="ec-upload-hint">…</span></label>
   function.js swaps .ec-upload-text for the chosen file name on change. */
.ec-upload {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 42px;
    padding: 10px 14px;
    margin: 0;
    background: #fafbfd;
    border: 1.5px dashed #d0d5de;
    border-radius: 10px;
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.ec-upload:hover {
    border-color: var(--admin-panel-color);
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .04);
}
.ec-upload input[type="file"] { display: none; }
.ec-upload > i {
    font-size: 22px;
    color: var(--admin-panel-color);
    flex: 0 0 auto;
}
.ec-upload-text {
    font-size: 13.5px;
    font-weight: 600;
    color: #3b4060;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ec-upload-hint { font-size: 12px; color: #9aa1b4; margin-left: auto; flex: 0 0 auto; }
.ec-upload.has-file { border-style: solid; border-color: rgba(var(--admin-panel-rgb, 132, 74, 239), .45); }

/*******************
   Categories — index page (custom pager + expand icons)
*******************/
.categories-page .cat-expand {
    color: var(--admin-panel-color);
    font-size: 18px;
    vertical-align: middle;
    margin-right: 6px;
    cursor: pointer;
    transition: transform .1s;
}
.categories-page .cat-expand:hover { transform: scale(1.1); }
.categories-page .cat-expand-link {
    color: var(--admin-panel-color);
    font-weight: 500;
    text-decoration: none;
}
.categories-page .cat-expand-link:hover { text-decoration: underline; }
.categories-page .sortable { user-select: none; }
.categories-page .sortable:hover { background: rgba(var(--admin-panel-rgb, 132, 74, 239), .05); }
.categories-page .sort-arrow {
    color: #9aa1b4;
    font-size: 14px;
    vertical-align: middle;
    margin-left: 2px;
}
.categories-page .sortable[data-field] .mdi-arrow-up,
.categories-page .sortable[data-field] .mdi-arrow-down { color: var(--admin-panel-color); }

/* Custom pager (previous / next) — match the rest of the pill-button family */
.ec-cat-pager .ec-btn-ghost {
    height: 34px;
    padding: 0 14px;
    font-size: 13px;
    border-radius: 8px !important;
}
.ec-cat-pager .ec-btn-ghost:first-child { margin-right: 4px; }
.ec-cat-pager .ec-btn-ghost:disabled {
    background: #f5f7fb;
    color: #cbd0da;
    cursor: not-allowed;
}

/* Cities / Areas now use DataTables' exact class names (dataTables_info,
   dataTables_length, dataTables_paginate) so all DataTables CSS in the codebase
   applies uniformly — no divergence from Currencies/Countries/States. */
.ec-list-card .dataTables_wrapper .dataTables_info,
body .table-responsive .dataTables_wrapper .dataTables_info { color: #8a90a6; font-size: 14px; }

/* DataTables-look Prev/Next pager for pages that can't use DataTables' own
   pagination (Categories, Cities, Areas — they use Firestore cursors, not
   client-side page math). Mirrors the pill style + brand hover of DataTables' `p`. */
.ec-dt-pager { display: inline-flex; gap: 4px; }
.ec-dt-pager-btn {
    height: 32px;
    padding: 0 14px;
    background: transparent;
    color: #5a6179;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.ec-dt-pager-btn:hover {
    background: rgba(var(--admin-panel-rgb, 132, 74, 239), .10);
    color: var(--admin-panel-color);
}
.ec-dt-pager-btn:disabled {
    background: transparent;
    color: #cbd0da;
    cursor: not-allowed;
}
.ec-dt-pager-btn:disabled:hover {
    background: transparent;
    color: #cbd0da;
}
/* Current-page pill for custom-pagination pages — visual parity with
   DataTables' `.paginate_button.current` used on Currencies/Countries/States.
   Uses !important on colour + background because generic `.badge` / span rules
   elsewhere in style.css otherwise reset them to grey/transparent. */
.ec-dt-pager .ec-dt-pager-current,
span.ec-dt-pager-current {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 10px;
    background: var(--admin-panel-color) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px;
    font-weight: 600;
    margin: 0 4px;
    line-height: 1;
}