/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.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 Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
@import url("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700");
/*Theme Colors*/
/*bootstrap Color*/
/*Light colors*/
/*Normal Color*/
/*Extra Variable*/
/*Preloader*/
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@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("https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700");
@import url(../css/spinners.css);
@import url(../css/animate.css);
/* Admin panel dynamic theme colors (must come AFTER all @import rules).
--primary + --secondary are the user-facing controls (Global Settings).
The --brand* names are kept as aliases so existing rules keep working. */
:root{
--primary:#86E837;
--primary-rgb:134, 232, 55;
--primary-tint:#f0fde6;
--secondary:#78d12e;
--secondary-rgb:120, 209, 46;
--brand-ink:#0C111C;
--brand:var(--primary);
--brand-rgb:var(--primary-rgb);
--brand-strong:var(--secondary);
--brand-tint:var(--primary-tint);
}
.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);
}
/*
Template Name: Admin Press Admin
Author: Themedesigner
Email: niravjoshi87@gmail.com
File: scss
*/
/**
* Table Of Content
*
* 1. Globals
* 2. Headers
* 3. Navigations
* 4. Banners
* 5. Footers
* 6. Posts
* 7. Widgets
* 8. Custom Templates
*/
/*******************
Global Styles
*******************/
* {
outline: none;
}
body {
background: #fff;
font-family: "Urbanist", sans-serif;
margin: 0;
overflow-x: hidden;
color: #67757c;
font-weight: 500;
}
html {
position: relative;
min-height: 100%;
background: #ffffff;
}
.small, small {
font-size: 90%;
font-weight: 500;
}
a {
color: #3B82F6;
}
a:hover,
a:focus {
text-decoration: none;
color: #000;
}
a.link {
color: #455a64;
}
a.link:hover, a.link:focus {
color: #000;
}
.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;
}
.table tr td > img {
object-fit: cover;
border-radius: 5px;
}
.table.dataTable tr td > img{margin-right: 15px}
.table tr td > .verified-icon{
font-size: 18px;
margin-left: 5px;
color: green;
}
/*******************
Headings
*******************/
h1,
h2,
h3,
h4,
h5,
h6 {
color: #455a64;
font-family: "Urbanist", sans-serif;
font-weight: 600;
}
h1 {
line-height: 40px;
font-size: 36px;
}
h2 {
line-height: 36px;
font-size: 24px;
}
h3 {
line-height: 30px;
font-size: 21px;
}
h4 {
line-height: 22px;
font-size: 18px;
}
h5 {
line-height: 18px;
font-size: 16px;
font-weight: 400;
}
h6 {
line-height: 16px;
font-size: 14px;
font-weight: 400;
}
.display-5 {
font-size: 3rem;
}
.display-6 {
font-size: 36px;
}
.box {
border-radius: 4px;
padding: 10px;
}
.bg-light-gray{
background: #F9FAFB !important;
}
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 #000;
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: #ef5350 !important;
}
.text-muted {
color: #99abb4 !important;
}
.text-warning {
color: #000 !important;
}
.text-success {
color: #26dad2 !important;
}
.text-info {
color: #000 !important;
}
.text-inverse {
color: #2f3d4a !important;
}
html body .text-blue {
color: #02bec9;
}
html body .text-purple {
color: #ebc51a;
}
html body .text-primary {
color: #000;
}
html body .text-megna {
color: #00897b;
}
html body .text-dark {
color: #67757c;
}
html body .text-themecolor {
color: #000;
}
/*******************
Background Colors
*******************/
.bg-primary {
background-color: #000 !important;
}
.bg-success {
background-color: #26dad2 !important;
}
.bg-info {
background-color: #000 !important;
}
.bg-warning {
background-color: #000 !important;
}
.bg-danger {
background-color: #ef5350 !important;
}
html body .bg-megna {
background-color: #00897b;
}
html body .bg-theme {
background-color: #000;
}
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: #000;
}
.round img {
border-radius: 100%;
}
.round-lg {
line-height: 65px;
width: 60px;
height: 60px;
font-size: 30px;
}
.round.round-info {
background: #000;
}
.round.round-warning {
background: #000;
}
.round.round-danger {
background: #ef5350;
}
.round.round-success {
background: #26dad2;
}
.round.round-primary {
background: #000;
}
/*******************
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: #000;
}
.label-warning {
background-color: #000;
}
.label-danger {
background-color: #ef5350;
}
.label-megna {
background-color: #00897b;
}
.label-primary {
background-color: #000;
}
.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: #000;
}
.label-light-warning {
background-color: #fff8ec;
color: #000;
}
.label-light-danger {
background-color: #f9e7eb;
color: #ef5350;
}
.label-light-megna {
background-color: #e0f2f4;
color: #00897b;
}
.label-light-primary {
background-color: #f1effd;
color: #000;
}
.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;
}
.table tr td.payment_images img{max-width: 100px;}
/*******************
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: #000;
border-color: #000;
}
.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: #E5E7EB;
}
.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: var(--brand) 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: var(--brand);
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: var(--brand);
}
/*******************
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: 400;font-size: 14px;
font-weight: 500;
}
.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);
}
.badge-success {
background-color: #28a745;
}
.badge-info {
background-color:#17a2b8; color: #fff;
}
.table tr th.delete-all, .table tr td.delete-all {
width: 60px;
}
.badge-primary {
background-color: #007bff; color: #fff;
}
.badge-warning {
background-color: #ffc107;
}
.badge-danger {
background-color: #ef5350;
}
.badge-purple {
background-color: #ebc51a;
}
.badge-red {
background-color: #fb3a3a;
}
.badge-inverse {
background-color: #2f3d4a;
}
/*******************
Buttons
******************/
.btn {
padding: 7px 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: #000;
border: 1px solid #000;
-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: #000;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
border: 1px solid #000;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle{background-color: #000;border-color: #000;}
.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: #000;
color: #ffffff;
border: 1px solid #000;
}
.btn-themecolor:hover,
.btn-themecolor.disabled:hover {
background: #000;
opacity: 0.7;
border: 1px solid #000;
}
.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(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 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: #1eacbe;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.btn-info,
.btn-info.disabled {
background: #000;
border: 1px solid #000;
-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: #000;
border: 1px solid #000;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.btn-info.active, .btn-info:active, .btn-info:focus,
.btn-info.disabled.active,
.btn-info.disabled:active,
.btn-info.disabled:focus {
background: #028ee1;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.btn-warning,
.btn-warning.disabled {
background: #000;
color: #ffffff;
-webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
border: 1px solid #000;
-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: #000;
color: #ffffff;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
border: 1px solid #000;
}
.btn-warning.active, .btn-warning:active, .btn-warning:focus,
.btn-warning.disabled.active,
.btn-warning.disabled:active,
.btn-warning.disabled:focus {
background: #000;
color: #ffffff;
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.btn-warning:not(:disabled):not(.disabled).active, .btn-warning:not(:disabled):not(.disabled):active, .show > .btn-warning.dropdown-toggle{color: #fff;background-color: #000;border-color: #000;}
.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: #000;
background-color: #ffffff;
border-color: #000;
-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: #000;
-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: #000;
}
.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(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
}
.btn-outline-success.active, .btn-outline-success:active, .btn-outline-success:focus {
-webkit-box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 26px -12px rgba(0, 0, 0, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2);
background: #1eacbe;
}
.btn-outline-info {
color: #000;
background-color: transparent;
border-color: #000;
-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: #000;
border-color: #000;
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: #000;
background-color: transparent;
border-color: #000;
-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: #000;
border-color: #000;
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: #000;
}
.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: #1eacbe;
border: 1px solid #1eacbe;
}
.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: #000;
border: 1px solid #000;
}
.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: #000;
}
/*******************
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;
}
/*******************
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: 400;
}
.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: 45px;
min-height: 850px !important;
}
.container-fluid {
padding: 0 25px 25px 25px;
}
html {
background: #fff;
}
/*******************
Topbar
*******************/
.topbar {
position: relative;
z-index: 50;
}
.topbar .top-navbar {
min-height: 50px;
padding: 0px 15px 0 0;
}
.topbar .top-navbar .dropdown-toggle::after {
display: none;
}
.topbar .top-navbar .navbar-header {
line-height: 45px;
text-align: center;
height: 90px;
padding: 10px 0;
display: flex;
justify-content: center;
align-items: center;
}
.topbar .top-navbar .navbar-header .navbar-brand {
margin-right: 0px;
padding-bottom: 0px;
padding-top: 0px;
}
.topbar .top-navbar .navbar-header .navbar-brand
.topbar .top-navbar .navbar-header .navbar-brand .light-logo {
display: none;
}
.topbar .top-navbar .navbar-header .navbar-brand b {
line-height: 47px;
display: inline-block;
}
.topbar .top-navbar .navbar-nav > .nav-item > .nav-link {
padding-left: .75rem;
padding-right: .75rem;
font-size: 24px;
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{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: #000;
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;
height: 60px;
}
.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: -265px;
width: 265px;
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: #000;
}
.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: 265px;
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: #000;
}
.red-theme {
background: #ef5350;
}
.blue-theme {
background: #000;
}
.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%, #000 23%, #000 99%);
/* FF3.6-15 */
background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #000 23%, #000 99%);
/* Chrome10-25,Safari5.1-6 */
background: -webkit-gradient(linear, left top, right top, from(#263238), color-stop(23%, #263238), color-stop(23%, #000), color-stop(99%, #000));
background: -o-linear-gradient(left, #263238 0%, #263238 23%, #000 23%, #000 99%);
background: linear-gradient(to right, #263238 0%, #263238 23%, #000 23%, #000 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: 17px 15px;
position: absolute;
right: 0;
border-top: 1px solid rgba(120, 130, 140, 0.13);
background: #ffffff;font-size: 14px;
}
/*******************
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: #000;
border-color: #000;
}
.card-info {
background: #000;
border-color: #000;
}
.card-primary {
background: #000;
border-color: #000;
}
.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: #000;
border-color: #000;
}
.card-primary {
background: #000;
border-color: #000;
}
.card-outline-info {
border-color: #000;
}
.card-outline-info .card-header {
background: #000;
border-color: #000;
}
.card-outline-inverse {
border-color: #2f3d4a;
}
.card-outline-inverse .card-header {
background: #2f3d4a;
border-color: #2f3d4a;
}
.card-outline-warning {
border-color: #000;
}
.card-outline-warning .card-header {
background: #000;
border-color: #000;
}
.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: #000;
}
.card-outline-primary .card-header {
background: #000;
border-color: #000;
}
/*==============================================================
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: #000;
}
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: #000;
}
.amp-pxl .ct-series-b .ct-bar {
stroke: #26dad2;
}
.c3-chart-arcs-title,
.c3-legend-item {
font-family: "Urbanist", 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 #000;
}
.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: #000;
fill-opacity: 0.1;
}
.campaign .ct-series-b .ct-line,
.campaign .ct-series-b .ct-point {
stroke: #000;
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: #000;
fill-opacity: 0.1;
}
.campaign2 .ct-series-b .ct-line,
.campaign2 .ct-series-b .ct-point {
stroke: #000;
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: #000;
}
.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: #000;
}
#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: "Urbanist", sans-serif !important;
font-size: 12px !important;
font-weight: 500 !important;
}
.total-revenue4 {
position: relative;
}
.total-revenue4 .ct-series-a .ct-line {
stroke: #000;
stroke-width: 1px;
}
.total-revenue4 .ct-series-a .ct-point {
stroke: #000;
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: #000;
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 #000;
color: #000;
}
.profile-tab li a.nav-link:hover,
.customtab li a.nav-link:hover {
color: #000;
}
/*==============================================================
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: #000;
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;
}
/*==============================================================
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(#000), to(#000)), -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(#000, #000), -webkit-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
background-image: linear-gradient(#000, #000), 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 #000;
}
/*******************/
/*Floating Label*/
/*******************/
.floating-labels .form-group {
position: relative;
}
.floating-labels .form-control {
padding: 10px 10px 10px 0;
display: block;
border: none;
font-family: "Urbanist", 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 #000;
}
.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: #000;
-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: #000;
}
.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: #000;
}
.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: #000;
}
.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: #000;
}
.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: #000;
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: #000;
}
.icolors > li.info {
background: #000;
}
.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: 0px;
}
.color-table.primary-table thead th {
background-color: #000;
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: #000;
color: #ffffff;
}
.color-table.warning-table thead th {
background-color: #000;
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 #000;
}
.color-bordered-table.primary-bordered-table thead th {
background-color: #000;
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 #000;
}
.color-bordered-table.info-bordered-table thead th {
background-color: #000;
color: #ffffff;
}
.color-bordered-table.warning-bordered-table {
border: 2px solid #000;
}
.color-bordered-table.warning-bordered-table thead th {
background-color: #000;
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: #000;
border: 0;
color: #ffffff;
}
.full-color-table.full-primary-table tbody td {
border: 0;
}
.full-color-table.full-primary-table tr:hover {
background-color: #000;
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: #000;
border: 0;
color: #ffffff;
}
.full-color-table.full-info-table tbody td {
border: 0;
}
.full-color-table.full-info-table tr:hover {
background-color: #000;
color: #ffffff;
}
.full-color-table.full-warning-table {
background-color: #fff8ec;
}
.full-color-table.full-warning-table thead th {
background-color: #000;
border: 0;
color: #ffffff;
}
.full-color-table.full-warning-table tbody td {
border: 0;
}
.full-color-table.full-warning-table tr:hover {
background-color: #000;
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: 0px;
}
html body .table-responsive.m-t-10{margin-top: 0 ;}
.dt-buttons {
display: inline-block;
padding-top: 5px;
margin-bottom: 15px;
}
.dt-buttons .dt-button {
padding: 5px 15px;
border-radius: 4px;
background: #000;
color: #ffffff;
margin-right: 3px;
}
.dt-buttons .dt-button:hover {
background: #2f3d4a;
}
.dataTables_info,
.dataTables_length {
display: inline-block;
}
.dataTables_length {
margin-top: 0px;
}
.dataTables_length select {
border: 0;
background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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: 0px;
}
.dataTables_filter input {
border: 0;
background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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 #000;
background-color: #000;
}
.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 #000;
background-color: #000;
}
.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: #000;
color: #ffffff;
}
/*******************
Table- Footable
******************/
#demo-show-entries {
border: 0;
background-image: -webkit-gradient(linear, left top, left bottom, from(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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(#000), to(#000)), -webkit-gradient(linear, left top, left bottom, from(#b1b8bb), to(#b1b8bb));
background-image: -webkit-linear-gradient(#000, #000), -webkit-linear-gradient(#b1b8bb, #b1b8bb);
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(#b1b8bb, #b1b8bb);
background-image: linear-gradient(#000, #000), 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: #000;
}
.bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-info,
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-info {
color: #ffffff;
background: #000;
}
.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: #000;
}
.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: #000 !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: #000;
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 #000;
margin-right: -1px;
color: #000;
}
.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: #000;
color: #ffffff;
}
.customtab2 li a.nav-link:hover {
color: #ffffff;
background: #000;
}
/*******************
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: #000;
color: #ffffff;
}
.jq-icon-success {
background-color: #26dad2;
color: #ffffff;
}
.jq-icon-error {
background-color: #ef5350;
color: #ffffff;
}
.jq-icon-warning {
background-color: #000;
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: #000;
border-color: #000;
}
.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: #000;
}
.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: #000;
border-color: #000;
}
.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: #000;
}
.timeline-badge.success {
background-color: #26dad2;
}
.timeline-badge.warning {
background-color: #000;
}
.timeline-badge.danger {
background-color: #ef5350;
}
.timeline-badge.info {
background-color: #000;
}
.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: #000;
}
.cd-horizontal-timeline .filling-line,
.cd-horizontal-timeline .events a.selected::after {
background: #000;
}
.cd-horizontal-timeline .events a.selected::after {
border-color: #000;
}
.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: "Urbanist", 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: #000;
border-left-color: #000;
}
.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: #000;
}
.ribbon-bookmark.ribbon-right.ribbon-custom:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-bookmark.ribbon-vertical-l.ribbon-custom:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-custom:before {
border-right-color: #000;
border-bottom-color: transparent;
}
.ribbon-primary {
background: #000;
}
.ribbon-bookmark.ribbon-primary:before {
border-color: #000;
border-right-color: transparent;
}
.ribbon-bookmark.ribbon-right.ribbon-primary:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-bookmark.ribbon-vertical-l.ribbon-primary:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-primary:before {
border-right-color: #000;
border-bottom-color: transparent;
}
.ribbon-primary.ribbon-corner:before {
border-top-color: #000;
border-left-color: #000;
}
.ribbon-primary.ribbon-corner.ribbon-right:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-primary.ribbon-corner.ribbon-bottom:before {
border-top-color: transparent;
border-bottom-color: #000;
}
.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: #000;
}
.ribbon-bookmark.ribbon-info:before {
border-color: #000;
border-right-color: transparent;
}
.ribbon-bookmark.ribbon-right.ribbon-info:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-bookmark.ribbon-vertical-l.ribbon-info:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-info:before {
border-right-color: #000;
border-bottom-color: transparent;
}
.ribbon-info.ribbon-corner:before {
border-top-color: #000;
border-left-color: #000;
}
.ribbon-info.ribbon-corner.ribbon-right:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-info.ribbon-corner.ribbon-bottom:before {
border-top-color: transparent;
border-bottom-color: #000;
}
.ribbon-warning {
background: #000;
}
.ribbon-bookmark.ribbon-warning:before {
border-color: #000;
border-right-color: transparent;
}
.ribbon-bookmark.ribbon-right.ribbon-warning:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-bookmark.ribbon-vertical-l.ribbon-warning:before,
.ribbon-bookmark.ribbon-vertical-r.ribbon-warning:before {
border-right-color: #000;
border-bottom-color: transparent;
}
.ribbon-warning.ribbon-corner:before {
border-top-color: #000;
border-left-color: #000;
}
.ribbon-warning.ribbon-corner.ribbon-right:before {
border-right-color: #000;
border-left-color: transparent;
}
.ribbon-warning.ribbon-corner.ribbon-bottom:before {
border-top-color: transparent;
border-bottom-color: #000;
}
.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;
}
/*******************
session ideal timeout page
******************/
#idletimeout {
background: #000;
border: 3px solid #000;
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: #000;
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 #000;
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: #000;
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: #000;
}
.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
******************/
#map{
z-index: 0;
}
.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: #000;
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 #000;
}
.gmaps-overlay_arrow.below {
top: -15px;
border-left: 16px solid transparent;
border-right: 16px solid transparent;
border-bottom: 16px solid #000;
}
/*******************
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: #000;
}
.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(#000), to(#000)), -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(#000, #000), -webkit-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
background-image: -o-linear-gradient(#000, #000), -o-linear-gradient(rgba(120, 130, 140, 0.13), rgba(120, 130, 140, 0.13));
background-image: linear-gradient(#000, #000), 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 #000;
}
.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: #000;
}
.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: #000;
color: #ffffff;
}
.jsgrid-pager-current-page {
background-color: #000;
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: 95px;
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: #000;
}
.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: 265px;
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;
}
.sidebar-nav {
background: #000;
padding: 0px;
}
.sidebar-nav ul {
margin: 0px;
padding: 0px;
transition: all ease 0.5s;
padding: 0px 10px 0px 0px;
}
.sidebar-nav ul li {
list-style: none;
}
.sidebar-nav ul li a {
color: #fff;
padding: 8px 35px 8px 15px;
display: block;
font-size: 15px;
font-weight: 400;
/*border-bottom: 1px solid rgba(255, 255, 255, 0.2) !important;*/
border-radius: 0px 0px 0px 0px;
}
/*.mini-sidebar .sidebar-nav ul li a{color: #fff !important;}*/
.sidebar-nav ul li a.active, .sidebar-nav ul li a:hover {
color: #000;
}
.sidebar-nav ul li a.active i, .sidebar-nav ul li a:hover i {
color: #000;
}
.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;
font-size: 13px;
/*color: var(--brand);*/
}
.sidebar-nav ul li ul li a::before {
content: "";
width: 10px;
height: 10px;
border: 1px 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: 43px;
top: 17px;
}
.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-left: 1px solid transparent;
}
.sidebar-nav > ul > li > a i {
width: 22px;
font-size: 17px;
display: inline-block;
vertical-align: middle;
color: #fff;
}
.mini-sidebar .sidebar-nav #sidebarnav > li:hover a i {
color: var(--brand);
}
.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: #000;
font-weight: 500;
border-left: 0px solid #000;
}
.sidebar-nav > ul > li.active > a i {
color: #000;
}
.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: 13px;
text-transform: uppercase;
background: rgba(255, 255, 255, 0.2);
line-height: 1;
display: block;
text-align: left;
color: rgba(255, 255, 255, 0.8);
border-radius: 0px 0px 0px 0px;
margin-right: -10px;
}
.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: #fff;
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: #313336;
display: none;
padding-left: 1px;
}
.mini-sidebar .sidebar-nav ul li a{color: var(--brand);padding: 7px 25px 7px 60px;position: relative;border-right: 3px solid transparent;}
.mini-sidebar .sidebar-nav ul li ul li a::after {left: 13px;}
.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: #313336;
}
.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: #000;
}
.mailbox .message-center a .user-img .offline {
background: #000;
}
.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: #000;
}
.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: #000;
}
/*******************/
/*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: 5px;
}
.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: #000;
}
.message-box .message-widget a .user-img .offline {
background: #000;
}
.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: #000;
}
.calendar-event {
cursor: move;
margin: 10px 5px 0 0;
padding: 6px 10px;
display: inline-block;
color: #ffffff;
min-width: 140px;
text-align: center;
background: #000;
}
.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: #000;
}
.has-warning .form-control-warning {
background-image: url(../../assets/images/icon/warning.svg);
}
.has-warning .form-control {
border-color: #000;
}
.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: 265px;
}
}
@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;
padding-left: 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 var(--brand);
}
[type="radio"]:checked + label:after,
[type="radio"].with-gap:checked + label:after {
background-color: var(--brand);
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;
}
[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 var(--brand);
border-bottom: 2px solid var(--brand);
-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 var(--brand);
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 var(--brand);
background-color: var(--brand);
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: var(--brand);
border-color: var(--brand);
}
[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: rgba(var(--brand-rgb),.5);
}
.switch label input[type=checkbox]:checked + .lever:after {
background-color: var(--brand);
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;
}
[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 var(--brand);
background-color: var(--brand);
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: 700;
color: #000;
margin-bottom: 0;
font-size: 18px;
}
.profile-text h5 {
color: #000;
font-weight: 700;
}
.profile-text h3 {
color: #fff;
font-size: 16px;
font-weight: 600;
}
.daes-sec-sec .card {
height:calc(100% - 30px);;
}
.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: 14px;
}
.table tr td.redirecttopage {
color: #000;
cursor: pointer;
font-weight: 500;
}
/*.table tr td.link-td:hover{background: #000;}*/
.table tr td.redirecttopage:hover {
color: #000;
}
.table tr td > img {
object-fit: contain;
border-radius: 5px;
height: 50px;
background: #f0f0f0;
}
.table#transactionListTable tr td > img,.table tr td.payment_icon > img,.table tr td.rules-icon > img{height: auto;}
.daes-sec-sec .table tr {
cursor: pointer;
}
.table tr td.address-list {
max-width: 200px;
white-space: normal;
}
.table thead th, .table th {
color: #000;
background: #f8fafd;
position: relative;
}
.table tr td{color: #222;font-weight: 500;}
.table tr td.action-btn a, .table tr td.restaurant-action-btn a {
padding: 0 5px;
}
.table-bordered.dataTable{border-radius: 10px;
overflow: hidden;}
.table.dataTable thead th, .table.dataTable th{font-weight: 600 !important;
font-size: 15px;background: #F3F4F6; padding: 15px 10px;border-color: #E5E7EB;}
.table tr td.action-btn a, .table tr td.restaurant-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.badge{padding: 3px 10px;color: #fff;}
.table tr td.order_completed span {
background: green;
color: #fff;
padding: 3px 10px;
border-radius: 5px;
}
.table tr td.success span {
background: green;
color: #fff;
padding: 3px 10px;
border-radius: 5px;
}
.table tr td.refund_success span {
background: green;
color: #fff;
padding: 3px 10px;
border-radius: 5px;
}
.table tr td.undefined span {
background: #ffa500;
color: #fff;
padding: 3px 10px;
border-radius: 5px;
}
.table tr td.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;
}
.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;animation: slideDown 0.35s ease-out;
}
@keyframes slideDown {
from {
transform: translateY(-100%);
}
to {
transform: translateY(0);
}
}
.sticky .fix-sidebar .left-sidebar {
padding-top: 95px;
}
.form-control {
background-color: #f5f5f5;
border: 1px solid #ccc;
}
.row.form-layout {
max-width: 70%;
margin: 0 auto;
display: table;
width: 100%;
}
.page-wrapper > .card-body {
padding: 0;
position: relative;
}
.row.form-layout .form-group.row .col-7 {
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.row.form-layout .form-group.row .col-7 > span.restaurant_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.form-layout .form-group.row .col-7 .control-inner {
position: relative;
}
.row.form-layout .form-group.row .col-7 .control-inner > span {
position: absolute;
right: 35px;
top: 8px;
color: #000;
font-weight: 500;
font-size: 14px;
}
.row.form-layout .form-group.row .col-7 .form-control {
width: 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.row.form-layout .form-group.row .col-7 .control-inner > .currentCurrency {
position: absolute;
left: 1px;
top: 1px;
font-weight: 500;
font-size: 13px;
max-width: 40px;
line-height: 35px;
background: #eaeaea;
padding: 0 4px;
color: #000;
border-radius: 5px 0 0 5px;
text-align: center;
}
.row.form-layout .form-group.row .col-7 .form-control.referral_amount {
padding-left: 45px;
}
.row.form-layout .form-group.row .col-7 .form-control.currency_input {
padding-left: 45px;
}
.form-layout .form-layout-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;
}
.form-group.row .select2-container--default .select2-selection--single{background-color: #f5f5f5;border: 1px solid #ccc;height: 40px;}
.form-group.row .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 40px;}
.form-group.row .select2-container--default .select2-selection--single .select2-selection__arrow{height: 40px;}
.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;
}
.form-layout-inner fieldset {
padding: 10px;
border: 1px solid #ccc;
margin-bottom: 15px;
border-radius: 5px;
background: #fff;
}
.form-layout-inner fieldset legend {
display: inline-block;
width: auto;
font-weight: 600;
font-size: 14px;
text-transform: uppercase;
color: #fff;
padding: 7px 14px;
background: #000;
border-radius: 5px;
}
.btm-btn.form-group a.btn.btn-default {
background: #979797;
color: #fff;
}
.row.form-layout label.control-label {
color: #000;
font-weight: 500;
-webkit-box-flex: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.btn-warning:hover {
background-color: #000;
border-color: #000;
}
.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: #000;
color: #fff;
}
.payment-top-tab .nav-tabs.card-header-tabs .nav-link {
border: 1px solid #f3f3f3;
border-radius: 0;
}
.payment-top-tab .nav-tabs.card-header-tabs .nav-link.active, .payment-top-tab .nav-tabs.card-header-tabs .nav-link:hover {
border-color: #000;
}
.nav-tabs.card-header-tabs .nav-link span.badge-success {
background: #000;
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: #000;
}
.form-layout .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: #000;
}
.resttab-section {
position: relative;
}
.dataTables_processing {
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: 1;
padding-top: 10%;
}
.dataTables_processing > 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: #F59E0B;
}
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: #000;
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: #000;
font-size: 19px;
font-weight: 600;
}
.menu-tab {
margin-bottom: 25px;
}
.menu-tab ul {
padding: 0;
}
.menu-tab ul li {
display: inline-block;
}
.menu-tab ul li a {
display: block;
padding: 5px 10px;
color: #000;
font-size: 17px;
font-weight: 400;
border-bottom: 1px solid transparent;
}
.menu-tab ul li.active a, .menu-tab ul li a:hover {
color: #000;
border-bottom: 1px solid #000;
}
.pagination > li > a.page-link:hover {
color: #fff;
background-color: #000;
border-color: #000;
}
.form-group.row.restaurant_image .restaurant_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: #000;
border-color: #000;
box-shadow: 0 0 0 0.2rem #000;
color: #fff;
}
.restaurant_image #photos {
}
.restaurant_image .image-item {
padding: 5px 10px;
display: inline-block;
position: relative;
}
.restaurant_image .image-item img {
border-radius: 5px;
}
.restaurant_image .image-item span.remove-btn {
position: absolute;
top: -3px;
right: 4px;
background: #000;
border-radius: 50px;
padding: 3px 8px;
font-size: 12px;
color: #fff;
cursor: pointer;
}
.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: 30px;*/
}
.order_detail h3 {
/*font-size: 16px;
font-weight: 600;
color: #333;
margin-bottom: 20px;
border-bottom: 1px solid rgba(120, 130, 140, 0.13);
padding-bottom: 10px;*/
font-size: 18px;
font-weight: 700;
color: #333;
margin-bottom: 0;
}
.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 #000;
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.gendetail-col .control-label > span#payment_method img{width: 95px !important; }
.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;
}
.address p span#vehicle_number{padding: 4px 16px;border-radius: 10px;border: 1px dashed #494949;background: #ececec;text-transform: uppercase;font-weight: 700;letter-spacing: 1px;}
.address p{display: flex;align-items: center;}
.address p .user-img{display: inline-block;vertical-align: middle;margin-right: 10px;}
.address p .user-img img{width: 50px;border-radius: 50px !important;border: 2px solid #eaeaea;display: block;height: 50px;
object-fit: cover;}
.address p .drove-det .drv-name{display: block;}
.drove-det .badge i.fa,.badge.dr-review i.fa {margin-right: 5px;font-size: 12px;vertical-align: top;display: inline-block;line-height: 12px;}
.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;
}
.order-deta-btm-left .table thead th{ white-space: nowrap; }
.table tr td.price{font-weight: 600;color: #000;}
.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: 20px;
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: 14px;
padding: 10px 15px;
line-height: 1.2;
}
.order-totals-items table.order-totals tr td.label {
font-weight: 400;
text-align: left;
width: 100%;
padding-right: 15px;padding-left: 0;font-size: 14px;/*margin-bottom: 10px*/;
}
.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.h3{text-align: center;background: #000;color: #fff;font-size: 18px;font-weight: 600;}
.order-totals-items table.order-totals tr td.total {font-weight: 600;text-align: right;}
.order-totals-items table.order-totals tr.final-rate{background: #a3cd4f;}
.order-totals-items table.order-totals tr.final-rate td{color: #fff;padding-left:15px;padding-right: 15px;margin-bottom: 0; font-weight: 700;}
.order-totals-items table.order-totals tr.grand-total td{/*border-top: 1px solid rgba(65, 83, 179, 0.15);*/}
.order-totals-items table.order-totals tr.grand-total td:last-child{color: green;}
.order-totals-items table.order-totals tr.grand-total{position: relative;}
.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.paid { border-top: 1px solid #000;}
.order-totals-items table.order-totals tr td.seprater{padding: 0;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;}
.bk-summary-table{/*background: #f1f1f1;*/padding: 0px;margin-top: 0px;border-radius: 5px;}
.print-btn {
padding-right: 0px;
}
.print-btn button {
border: 2px solid #000;
font-size: 16px;
border-radius: 5px;
padding: 5px;
color: #000;
cursor: pointer;
}
.resturant-detail .card-header h4 {
margin-bottom: 0;
color: #000;
}
.resturant-detail a.row.redirecttopage {
align-items: center;
}
.resturant-detail .card-body h5.contact-info {
margin-top: 25px;
font-size: 17px;
margin-bottom: 15px;
font-weight: 600;
}
.resturant-detail .card-body p{border-bottom: 1px solid rgba(0,0,0,.1);padding-bottom: 10px;}
.resturant-detail .card-body p strong {
padding-right: 5px;
font-weight: 600;
color: #000;
float: left;
width: 25%;
}
.resturant-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: 150px;height: 50px;
}
.table tr td > span.badge-success {
background: green;
}
/*.table tr td.action-btn{display: flex; align-items: center;}*/
.table tr td.action-btn a, .table tr td.vendor-action-btn a ,ul.dtr-details > li span a,.table tr td .action-btn a{ padding: 0 5px;}
.table tr td.action-btn a i.fa-check,.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,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,.table tr td a i.fa-check,.table tr td .action-btn a i.fa-edit,.table tr td .action-btn a i.fa-ellipsis-h {
background: #E1E7E9;
width: 28px;
height: 28px;
color: #000;
border-radius: 50px;
text-align: center;
padding: 7px 5px;
font-size: 15px;font-weight: normal !important;
}
.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,.table tr td .action-btn a i.fa-edit {
background: green;
color: #fff !important;
}
.table tr td.action-btn a i.fa-edit:before,.redirecttopage .fa-edit::before,ul.dtr-details > li span a i.fa-edit::before,.table tr td .action-btn a i.fa-edit:before {content: "\f040";}
.table tr td.action-btn a i.fa-eye,.table tr td.action-btn a i.fa-file,ul.dtr-details > li span a i.fa-file,ul.dtr-details > li span a i.fa-eye,.table tr td .action-btn a i.fa-file,.table tr td .action-btn a i.fa-eye{background: #E1E7E9;
width: 28px;
height: 28px;
color: #000;
border-radius: 50px;
text-align: center;
padding: 7px 5px;
font-size: 15px;font-weight: normal !important;}
.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 .action-btn a i.fa-file-pdf-o,.table tr td .action-btn a i.fa-trash,.table tr td .action-btn a i.fa-close {
background: red;
width: 28px;
height: 28px;
color: #fff;
border-radius: 50px;
text-align: center;
padding: 7px 5px;
font-size: 15px;font-weight: normal !important;
}
.language-options select {
background: none;
border: 0;
color: #fff !important;
}
.language-options select:focus, .language-options select:hover {
background: none !important;
border: 0;
color: #fff !important;
box-shadow: none;
outline: none;
}
.language-options select option {
background: #000;
}
#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: #000;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 18px;}
.working_hours_div table.booking-table td{width: 40% !important;}
.working_hours_div table.booking-table td:last-child{width: 20% !important;}
/********************user detail******************/
.p-card {padding: 20px;}
.card-block {display: flex;flex-direction: column;flex-grow: 1;}
.profile-box {background: #f9fbfe;border-radius: 0 0 5px 5px;padding-bottom: 0px; position: relative;}
.profile-card{background: #000;overflow: hidden;padding: 37px 0;position: relative; text-align: center;}
.profile-card:before{content: "";}
.avatar-100 {height: 100px;min-width: 100px;width: 100px;}
.avatar-rounded {border-radius: 50%;-o-object-fit: cover;object-fit: cover;overflow: hidden;border: 2px solid #fff;position: relative; z-index: 2;}
.profile-card::before {content: "";background: #111;width: 120px;height: 120px;display: inline-block;border-radius: 100px;right: -33px;
top: -10px;position: absolute;z-index: 0;}
.profile-card::after {content: "";background: #111;width: 120px;height: 120px;display: inline-block;border-radius: 100px;left: -33px;
bottom: -10px;position: absolute;z-index: 0}
.profile-card h3 {position: relative;z-index: 9;font-size: 20px; font-weight: 600;margin-bottom: 15px !important;}
.pro-content {background: #fff;-ms-box-shadow: 0 2px 25px 0 rgba(45,69,95,.06);-o-box-shadow: 0 2px 25px 0 rgba(45,69,95,.06);box-shadow: 0 2px 25px 0 rgb(45 69 95 / 6%);left: 0;margin-top: -55px;padding: 20px;position: relative;right: 0;max-width: 320px;margin: 0 auto;top: -35px;}
.p-icon {background: #000;border-radius: 5px;color: #fff;height: 30px;line-height: 29px;text-align: center;width: 45px;font-size: 13px;
min-width: 30px;max-width: 30px;margin-right: 10px !important;}
.pro-content p{font-size: 16px;}
.profile-card .user-total-ratings{}
.ride-map-dredetail .ride-map-dredetail-rg .order_addre-edit .card-body {background: #fff;}
.profile-card a.add-wallate.btn,.profile-card a.change-plan.btn{display: inline-block;position: relative;z-index: 1;margin-bottom: 25px !important;margin-left: 0 !important;padding: 6px 25px;font-size: 15px;font-weight: 600;border-radius: 50px;position: relative;z-index: 1}
.profile-card a.add-wallate.btn i.fa{font-size: 25px;vertical-align: top;margin-right: 10px;font-weight: 700;}
/********************user detail******************/
/********************Live tracking******************/
.ride-list.table-responsive {overflow-y: auto;height: 460px;}
.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-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;}
/********************Live tracking******************/
.dt-time{width: 135px; white-space: normal !important;}
.dt-time > span {display: block;white-space: nowrap;}
.dt-time > span.date {font-weight: 600;}
.card-header .nav{background: #000;border: 1px solid #000;border-radius: 5px;padding: 5px;margin-bottom: 0 !important;}
.card-header .nav-pills .nav-link{padding: 5px 10px;font-size: 13px; font-weight: 500;}
.card-header .nav-pills .nav-link.active,.card-header .nav-pills .show > .nav-link{border-radius: 5px;}
.card-header{background: #fff;}
.ride-status-info{margin-top: 20px;/*max-width: 50%;*/background: #fcfff5;padding: 15px;}
.ride-status-info ul{padding: 0 0 0 0px; margin: 0; list-style-type: none;column-count: 2;-moz-column-count: 2;}
.ride-status-info ul li{border-bottom: 1px solid #EFEFEF;padding-bottom: 10px;padding-top: 10px;color: #222;font-weight: 400;font-size: 14px;/*width: 50%;margin-right: -3px;display: inline-block;*/vertical-align: top;}
.ride-status-info ul li span.status{width: 175px;font-weight: 600;margin-right: 19px;display: inline-block;}
.ride-status-info h3{margin-bottom: 15px;margin-top: 0px;color: #000 !important;font-weight: 700;font-size: 17px;}
.badge.unknown-badge{border: 2px solid #000;}
.tip-box {background: #E6F6E6;border-left:4px solid #009400;padding: 15px 15px 15px 30px;border-radius: 10px;box-shadow: 0 2px 5px 0 rgba(0,0,0,0.09);margin-top: 15px;}
.tip-box h5 {font-size: 18px;color: #009400;padding-bottom: 10px;margin: 0px 0px 0px 0px; font-weight: 700;}
.tip-box p{color: #009400;margin-bottom: 0;}
/********************Vehicle info******************/
.vehicleinfo-list .col-group{box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);padding: 10px;margin-bottom: 20px;border-radius: 5px;font-size: 15px;color: #333;}
.vehicleinfo-list .col-group label{margin-bottom: 0; font-weight: 500;color: #000;}
.num-plat{padding: 4px 16px;border-radius: 10px;border: 1px dashed #494949;background: #ececec;text-transform: uppercase;font-weight: bold;letter-spacing: 1px;}
.dataTables_wrapper .dataTables_filter input,.dataTables_wrapper .dataTables_length select{background-position: center bottom, center calc(100% - -1px);}
.table-responsive .dataTables_wrapper .dataTables_paginate{padding-top: 5px;}
.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: #000;color: #fff !important;border: 1px solid #000;border-radius: 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_info{font-size: 14px;}
table.dataTable.display > tbody > tr.odd > .sorting_1, table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_1{box-shadow: none !important;}
.personal-detail{margin-bottom: 25px;padding: 15px 15px;background: #fcfff5;border-radius: 10px;}
.personal-detail h3{margin-bottom: 15px;margin-top: 0px;color: #000 !important;font-weight: 700; font-size: 17px;}
.user-list-table .table tr td {border-width: 0 !important; border-bottom-width: 0px;border-bottom-width: 0px;border-bottom-width: 1px !important;vertical-align: top;font-size: 14px;border: 1px solid #EFEFEF;width: 50%;vertical-align: middle;}
.user-list-table .table tr td:last-child {padding-left: 10px !important;}
table.dataTable > tbody > tr.child ul.dtr-details{width: 100%;}
table.dataTable > tbody > tr.child span.dtr-title{width: 50%;}
.table tr th.delete-all [type="checkbox"] + label, .table tr td.delete-all [type="checkbox"] + label{margin-bottom: 0;height: 20px;}
.personal-detail ul{padding: 0; margin: 0; list-style-type: none;}
.personal-detail ul li{display: flex; align-items: center; border-bottom: 1px solid #EFEFEF;padding-bottom: 10px; padding-top: 10px;color: #222;font-weight: 400;font-size: 14px;}
.personal-detail ul li:last-child{border-bottom: 0;}
.personal-detail ul li span.rule-img{margin-right: 15px;}
.personal-detail ul li span.rule-img img{width: 30px !important;}
.view-page.btn{font-weight: 600;padding: 6px 20px;}
.user-detail .box {
margin-bottom: 5px;
box-shadow: 0 1px 6px 0 rgb(0 0 0 / 20%);
margin-top: 15px;
}
.box-header h3.box-title {
margin-bottom: 20px;
font-weight: 600;
font-size: 18px;
line-height: 27px;
letter-spacing: 0.03em;
color: #333333;
padding: 15px;
background: #ececec;
margin: -11px -11px 8px -11px;
border-radius: 5px 5px 0 0;
}
/********************Vehicle info******************/
@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.form-layout {
max-width: 100%;
}
.row.form-layout label.control-label {
-webkit-box-flex: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
max-width: 100%;
}
.ride-status-info ul li{width: 100%;margin-right: 0;}
.ride-status-info ul{column-count: 1;-moz-column-count: 1;}
}
@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: #000;
color: #fff;
border-radius: 50px;
width: 20px;
height: 20px;
display: inline-block;
top: -6px;
}
.web_version {
text-align: center;
color: #fff;
padding: 8px 35px 8px 15px;
display: block;
font-size: 15px;
font-weight: 700;
}
.mini-sidebar .web_version{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;
}
.form-group .placeholder_img_thumb img {
height: 50px !important;
object-fit: contain;
width: 50px !important;
}
.placeholder_img_thumb img, .logo_img_thumb img {
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: #000;
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;
padding-top: 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;
}
.order_detail-review h4{font-size: 15px;font-weight: 500;color: #333;margin-bottom: 15px;padding-bottom: 4px;border-bottom: 1px solid rgba(0,0,0,0.06);}
h5.no-review{text-align: center;}
.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: 16px;
margin-bottom: 10px;
font-weight: 700;
color: #666;
}
.business-analytics .card-box h2 {
font-weight: 700;
font-size: 22px;
color: #000;
margin: 0;
}
.business-analytics .card-box h6{font-weight: 600; font-size: 15px;margin-top: 5px;}
.intercity-cont{display: flex;align-items: center;}
.intercity-cont span{margin-left: auto; font-size: 16px; font-weight: 700;}
.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: #80b140;
border-radius: 5px;
line-height: 40px;
align-items: center;
display: flex;
justify-content: center;
}
.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;
color: var(--brand);
}
.order-status:hover .data i{
color: #000;
}
.order-status span.count {
color: #0661cb;
font-size: 18px;
font-weight: 700;
margin: 0;
color: var(--brand);
}
.order-status .data h6 {
margin: 0;
font-weight: 600;
font-size: 15px;
color: #595959;
margin-bottom: 0;
}
.order_stats_header h4 {
font-weight: 700;
color: #000;
line-height: 30px;
font-size: 18px;
}
.order_stats_header h4 i {
font-size: 15px;
margin-right: 10px;
}
.business-analytics .order-stats__content i {
font-size: 23px;
}
/*end dashboard*/
td.text-green{
color:green;
}
td.text-red{
color:red;
}
.login-logo a{display: inline-block;padding: 10px 15px;background: #000;border: 2px solid #fff;border-radius: 10px;}
.login-logo img{max-width: 150px;}
@media screen and ( max-width: 767px ) {
.container-fluid {padding: 0 15px 25px 15px;}
.business-analytics .card-box{padding: 20px 10px 20px;}
.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;}
.form-group.row.width-50{width: 100%;}
.row.form-layout{margin: 0;width: auto !important;display: inherit;}
.pro-content{padding: 10px;}
.table-responsive .dataTables_wrapper .dataTables_info{width: 100%; text-align: center;}
.table-responsive .dataTables_wrapper .dataTables_paginate{width: 100%; text-align: center;}
.mini-sidebar .sidebar-nav > ul > li.nav-subtitle .nav-subtitle-span{width: auto ;}
.form-group .select2-container,.note-editor.note-frame{width: 100% !important;}
.page-titles{margin-bottom: 10px;}
.page-wrapper{padding-bottom: 60px;}
.applied_drivers_list .driver_apply-left h4{font-size: 15px;}
.applied_drivers_list .driver-rate{font-size: 15px;}
.mini-sidebar .web_version{width: 100%;}
}
@media screen and ( max-width: 650px ) {
.order_edit-genrl .form-group.row.gendetail-col .control-label > strong{width: 100%;margin-bottom: 10px;}
.order_edit-genrl .form-group.row.gendetail-col .control-label > span{margin-left: 0;}
.address p strong{width: 100%;margin-bottom: 10px;}
.address p > span{width: 100%}
.profile-card::before,.profile-card::after{width: 70px; height: 70px;}
.address p{display: table;width: 100%;}
.p-card {padding: 10px;}
.user-list-table .table tr td{width: auto;display: block;}
.user-list-table .table tr td:last-child {padding-left: 0px !important;}
.avatar-100 {height: 70px;min-width: 70px;width: 70px;}
.profile-card h3{font-size: 18px;}
.card-header .nav li.nav-item{width: 100%; text-align: center;}
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter{width: 100%;}
.applied_drivers_list{padding: 10px 10px;}
.applied_drivers_list .user-img {margin-right: 10px;}
.applied_drivers_list .user-img img{width: 40px !important;height: 40px;}
.ride-status-info ul li span.status{width: auto;}
.ride-status-info ul li span.info{display: block; margin-top: 10px;}
.ride-status-info{padding: 10px;}
table.dataTable > tbody > tr.child span.dtr-title{width: 40%;float: left;}
table.dataTable > tbody > tr.child span.dtr-data{white-space: normal;word-break: break-all;margin-left: 35%;display: block;}
}
.dataTables_processing.panel-default {text-align: center;font-size: 20px;font-weight: 600;letter-spacing: 4px;padding-top: 20%;
z-index: 8;align-items: center;/*display: flex;justify-content: center;*/left: 0;right: 0;margin: auto;width: auto; top: 0;}
.dataTables_processing {position: absolute;text-align: center;left: 0;right: 0;bottom: 0;top: 0;background: rgba(0, 0, 0, 00.5);z-index: 1;color: #fff;padding-top: 20%;}
.dataTables_processing.panel-default::after {content: "";background: url(../images/loading-loader.gif) no-repeat center;background-size: auto;width: 110px;height: 73px;display: inline-block;position: absolute;top: 15%;left: 0;right: 0;margin: auto;background-size: 100%;}
.required-field::before {content: "*";color: red;}
#overlay {position: fixed;display: none;width: 100%;height: 100%;top: 0;left: 0;right: 0;bottom: 0;background-color: rgba(0,0,0,0.5); z-index: 10;cursor: pointer;}
#overlay img{position: absolute; top: 50%; left: 50%; font-size: 50px; color: white; width:40px; transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%);}
i.fa-info {
background: #000;
width: 25px;
height: 25px;
color: #fff !important;
border-radius: 50px;
text-align: center;
padding: 5px;
font-size: 15px;
}
.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: #26B246;
}
.switch-box .switch input:checked+.slider::before {
-webkit-transform: translateX(19px);
-ms-transform: translateX(19px);
transform: translateX(19px);
}
/*Custom Background CSS*/
.bg--1 {
background: rgba(0, 150, 255, 0.15) !important;
}
.bg--2 {
background: rgba(0, 170, 109, 0.15) !important;
}
.bg--3 {
background: rgba(248, 59, 59, 0.1) !important;
}
.bg--4 {
background: rgba(255, 245, 0, 0.2) !important;
}
.bg--5 {
background: rgba(248, 146, 59, 0.1) !important;
}
.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:#000 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*/
/**************************new admin css*************************/
.font-semibold {
font-weight: 600;
}
.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 {
background: #F3F4F6;
border-radius: 20px;
padding: 8px 18px;
font-size: 14px;
color: #6B7280;
height: auto !important;
}
.top-title-section .select-box #daterange {
line-height: 2;
}
.select-box .select2.select2-container {
position: static;
min-width: 150px;
width: auto !important;
}
.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;
border-color: #F3F4F6;
}
.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: #0f0f0f !important;
}
.select2-container--open .select2-dropdown {}
.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;
padding: 4px;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 4px;
border-radius: 50px;
background: #FFEBE5;
}
.top-filter .sis-card-head-select-box{
justify-content: end;
gap: 10px;
white-space: nowrap;
}
.top-filter .sis-card-head-select-box .head-select-box{
gap: 10px;
display: flex;
align-items: center;
}
.top-filter .head-select-box .head-select-box-inner{
justify-content: end;
gap: 10px;
color: #000;
}
.top-filter .sis-card-head-select-box .form-control{
max-width: 150px;
color: #000;
display: inline-block;
width: auto;
height: 40px !important;
background: #fff;
}
.daes-sec-sec .table tr td > img{
border-radius: 50px;
object-fit: cover;
}
.daes-sec-sec .table{
border: 1px solid #E5E7EB;
width: 100%;
margin: 0 auto;
clear: both;
border-collapse: separate;
border-spacing: 0;
border-radius: 10px;
overflow: hidden;
}
.daes-sec-sec .table td,.daes-sec-sec .table th{
border-right: 1px solid #E5E7EB;
}
.daes-sec-sec .table tr> td:last-child,.daes-sec-sec .table tr> th:last-child{
border-right: 0;
}
.table tr td.redirecttopage .top-driver-name{
display: flex;
align-items: center;
gap: 10px;
text-align: left;
}
.chart-legend .legend-item{
text-align: center;
}
.chart-legend .legend-item .legend-text{
color: #374151;
font-size: 12px;
}
.chart-legend .legend-item .legend-text span{
font-size: 24px;
font-weight: 700;
display: block;
color: #000;
}
.card.border {
border-radius: 12px;
border: 1px solid #E5E7EB !important;
box-shadow: none;
}
.card.border .card-header {
border-radius: 12px 12px 0 0;
background: none;
padding: 1rem 1rem 1rem 1rem
}
.daes-sec-sec .card.border .card-header a{
color: #EAB308;
}
.daes-sec-sec .card.border .card-header a:hover{
color: #000;
}
.daes-sec-sec .table td a {
text-decoration: underline;
}
.card.border .card-body{
padding: 1rem 1rem 1rem 1rem
}
.card.card-box-with-icon {
border-radius: 12px;
border: 1px solid #E5E7EB;
margin-bottom: 15px;
box-shadow: 0 2px 120px 0 rgba(0, 0, 0, 0.08);
height: calc(100% - 10px);
cursor: pointer;
}
.card-body.card-box-with-icon {
padding: 24px;
}
.card-box-with-content .card-left-title{
font-size: 16px;
}
.card-box-with-content h3{
font-size: 24px;
}
.card-box-with-content .up-down-list {
font-size: 13px;
margin: 0;
}
.up-down-list i{
font-size: 12px;
padding-right: 5px;
}
.card-no-border .card-box-with-icon.card:hover{
box-shadow: 0 2px 120px 0 rgba(0, 0, 0, 0.08);
}
.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: 18px;
font-style: normal;
font-weight: 600;
}
.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;
}
.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;
border-radius: 20px;
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;
}
/* ===== Export "Export as" button + dropdown ===== */
/* Neutral (non-theme) button so it doesn't follow the dynamic color. */
.table-responsive .dataTables_wrapper .dataTables_filter .dt-buttons .dt-button.buttons-collection,
.dataTables_filter .dt-buttons .dt-button.buttons-collection {
background: #f3f4f6 !important;
background-image: none !important;
color: #0C111C !important;
border: 1px solid #e2e6ef !important;
box-shadow: none !important;
}
.dataTables_filter .dt-buttons .dt-button.buttons-collection:hover,
.dataTables_filter .dt-buttons .dt-button.buttons-collection:focus,
.dataTables_filter .dt-buttons .dt-button.buttons-collection.active,
.dataTables_filter .dt-buttons .dt-button.buttons-collection:active {
background: #e6e9f0 !important;
color: #0C111C !important;
border-color: #d3d9e6 !important;
}
.dataTables_filter .dt-buttons .dt-button.buttons-collection i.mdi { color: inherit !important; }
/* The dropdown popover — force a solid WHITE box above everything (was rendering
red/transparent behind the header). Body-scoped + !important to beat any base rule. */
body div.dt-button-collection,
body div.dt-button-collection.dropdown-menu {
z-index: 3000 !important;
background: #fff !important;
background-image: none !important;
border: 1px solid #e6e9f0 !important;
border-radius: 10px !important;
box-shadow: 0 12px 32px rgba(16,24,40,.18) !important;
padding: 6px !important;
min-width: 190px !important;
color: #3b4060 !important;
/* the export button sits at the right edge — open the menu right-aligned so it
doesn't run off the right side and get clipped by the table's overflow */
left: auto !important;
right: 0 !important;
}
body div.dt-button-collection .dt-button,
body div.dt-button-collection button.dt-button,
body div.dt-button-collection a.dt-button {
display: block !important;
width: 100% !important;
text-align: left !important;
background: #fff !important;
background-image: none !important;
color: #3b4060 !important;
border: 0 !important;
box-shadow: none !important;
border-radius: 7px !important;
padding: 10px 14px !important;
margin: 2px 0 !important;
font-size: 14px !important;
}
body div.dt-button-collection .dt-button span,
body div.dt-button-collection button.dt-button span { color: inherit !important; }
body div.dt-button-collection .dt-button:hover,
body div.dt-button-collection button.dt-button:hover {
background: #f2f4f8 !important;
color: #1a1f2e !important;
}
body div.dt-button-collection .dt-button i.mdi { color: #5a6179 !important; margin-right: 8px; }
/* keep the click-catcher (closes dropdown on outside click) but make it invisible
and sit just below the dropdown, so it no longer dims/covers the page */
div.dt-button-background {
background: transparent !important;
opacity: 0 !important;
z-index: 2999 !important;
}
.table.dataTable tr,
.table.dataTable tr td {
border-top: 0 !important;
border-color: #E5E7EB;
position: relative;
}
table.dataTable.nowrap td .mdi.mdi-check{
position: absolute;
right: 10px;
width: 20px;
height: 20px;
background: var(--brand);
color: #fff;
display: flex;
align-items: center;
justify-content: center;
top: 10px;
border-radius: 5px;
}
table.dataTable.nowrap td.action-btn .mdi.mdi-check,table.dataTable.nowrap td .action-btn .mdi.mdi-check{
position: static;
width: auto;
display: inherit;
color: #fff;
background: none;
}
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;
}
/*.table tr td > span.action-btn a i,table.dataTable > tbody > tr.child ul.dtr-details > li .dtr-data .action-btn a i{background: #0C111C;
padding: 3px 5px;
border-radius: 50px;
width: 30px;
height: 30px;
display: inline-block;
text-align: center;}*/
.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
}
a i.mdi-wechat {
color: #007bff
}
.unread-count {
position: absolute;
top: -8px;
right: -8px;
background-color: #007bff;
color: white;
border-radius: 50%;
padding: 2px 6px;
font-size: 10px;
line-height: 1;
z-index: 1;
}
i.mdi-lead-pencil {
color: #1FCAFF
}
i.mdi-delete {
color: #FF3840
}
.action-btn a {
font-size: 18px;
}
.table-responsive .dataTables_wrapper .dataTables_length select {
padding: 7px 15px;
border-radius: 50px;
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
}
.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
}
.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
}
.restaurant_info-section p {
font-size: 14px
}
.restaurant_gallery ul {
margin: 0 -10px;
display: flex;
flex-wrap: wrap;
}
.restaurant_gallery ul li {
list-style-type: none;
width: 25%;
padding: 0 10px
}
.restaurant_gallery ul li img {
width: 120px;
height: 120px;
object-fit: cover;
border-radius: 16px
}
.restaurant_service ul {
list-style-type: none;
padding: 0;
margin: 0;
column-count: 3;
}
.restaurant_service ul li {
color: #1F2937;
font-weight: 500;
font-size: 14px;
padding-bottom: 16px
}
.restaurant_service ul li span {
font-size: 22px
}
/**************************new admin css*************************/
/*******************
sidebar navigation
******************/
.scroll-sidebar {
padding-bottom: 60px;
padding-top: 0px;
}
.collapse.in {
display: block;
}
.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: #1F2937 url(../images/search_icon.png) no-repeat left 15px center;
width: 100%;
border: 0;
color: #6B7280;
}
.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: #FF683A;
}
.sidebar-nav ul li a.active i, .sidebar-nav ul li a:hover i {
color: #FF683A;
}
.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(--brand);
}
.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: #FF683A;
font-weight: 500;
border-right: 3px solid #FF683A;
}
.sidebar-nav > ul > li.active > a i {
color: #FF683A;
}
.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);
line-height: 1;
display: block;
text-align: left;
color: #4B5563;
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
*****************/
.leaflet-control-container .leaflet-routing-container.leaflet-control{
display: none;
}
.people-list .chat-list{
border-bottom: 2px solid #fff;
height: 77vh;
overflow-y: auto;
scrollbar-width: thin;
min-height: 300px;
overflow-x: hidden;
}
.chat-app .people-list {
width: 350px;
position: absolute;
left: 0;
top: 0;
padding: 20px 10px 20px 10px;
z-index: 2
}
.chat-app .chat {
margin-left: 350px;
border-left: 1px solid #eaeaea
}
.people-list {
-moz-transition: .5s;
-o-transition: .5s;
-webkit-transition: .5s;
transition: .5s
}
.people-list .chat-list li {
padding: 10px 15px;
list-style: none;
border-radius: 3px;
position: relative;
-o-transition: all .25s ease;
-moz-transition: all .25s ease;
transition: all .25s ease;
border-bottom: 1px solid #d5dfea
}
.people-list .chat-list li:hover {
cursor: pointer;
-webkit-transform: translateY(-4px) scale(1.02);
-moz-transform: translateY(-4px) scale(1.02);
-ms-transform: translateY(-4px) scale(1.02);
-o-transform: translateY(-4px) scale(1.02);
transform: translateY(-4px) scale(1.02);
-webkit-box-shadow: 0 14px 24px rgba(0, 0, 0, 0.2);
box-shadow: 0 14px 24px rgba(0, 0, 0, 0.2);
}
.people-list .chat-list li.active {
background: #efefef;
border-color: var(--brand);
}
.people-list .chat-list li .name {
font-size: 15px;
color: #000;
}
.people-list .chat-list img {
width: 45px;
border-radius: 50%;
height: 45px;
object-fit: cover;
}
.people-list .input-group{
border-radius: 50px;
border: 1px solid #ccc;
}
.people-list .input-group .input-group-prepend .input-group-text{
border-radius: 50px;
width: 45px;
height: 45px;
border: 0;
background: none;
text-align: center;
display: flex;
justify-content: center;
}
.people-list .input-group .form-control{
border-radius: 50px;
border: 0;
background: none;
box-shadow: none;
}
.people-list img {
float: left;
border-radius: 50%
}
.people-list .about {
float: left;
padding-left: 10px
}
.people-list .about .badge {
position: absolute;
right: 15px;
}
.people-list .status {
color: #475f7b;
font-size: 13px
}
.people-list .status .text-muted{
color: #475f7b !important;
}
.people-list .status i{
font-size: 10px;
}
.chat-send-col .chat-send-input {
width: calc(100% - 63px);
}
.chat-send-col .chat-send-input label {
position: absolute;
right: 10px;
top: 7px;
cursor: pointer;
}
.chat-send-col .chat-send-input .form-control {
height: 40px;
padding-right: 40px;
}
.chat-app .chat {
border: 1px solid #eaeaea;
}
.card.chat-app {
max-width: 100%;
margin: 15px auto 15px;
border: 1px solid #eaeaea;
}
.chat .chat-header {
padding: 15px 20px;
border-bottom: 1px solid #e6e6e6
}
.chat .chat-header img {
float: left;
border-radius: 40px;
width: 40px;
height: 40px;
object-fit: cover;
}
.chat .chat-header .chat-about {
float: left;
padding-left: 10px
}
.chat .chat-header .chat-about h6,.chat .chat-header .chat-about h5{
font-weight: 600;
font-size: 16px;
color: #000;
}
.chat .chat-history {
padding: 20px;
border-bottom: 2px solid #fff;
height: 67vh;
overflow-y: auto;
scrollbar-width: thin;
min-height: 300px;
}
.chat .chat-history::-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 {
width: 12px;
background-color: #F5F5F5;
}
.chat .chat-history::-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: 15px
}
.chat .chat-history ul li:last-child {
margin-bottom: 0px
}
.chat .chat-history .message-data {
margin-top: 5px;
font-size: 12px;
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 25px 20px 15px;
line-height: 26px;
font-size: 14px;
border-radius: 12px 12px 12px 0px;
display: inline-block;
position: relative;
font-weight: 500;
box-shadow: -2px 3px 5px 0px rgba(0,0,0,0.2);
position: relative;
}
.chat .chat-history .message .message-data-time{
position: absolute;
font-size: 10px;
white-space: nowrap;
bottom: 0px;
right: 5px;
padding-left: 0;
}
.chat .chat-history .message-data .message-data-date{
color: #434651;
}
.chat .chat-history .other-message{
border-radius: 12px 12px 0px 12px;
box-shadow: 2px 3px 5px 0px rgba(0,0,0,0.2);
}
.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;
display: none;
}
.chat .chat-history .my-message {
background: #f4f4f4;
color: #000;
}
.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: #b9fd82;
text-align: right
}
.chat .chat-history .other-message:after {
border-bottom-color: #ffe3d9;
left: auto;
right: 10px
}
.chat .chat-message {
padding: 20px 20px;
border-top:1px solid rgba(0, 0, 0, 0.07) ;
}
.chat .chat-message .input-group .input-group-text,.chat .chat-message .input-group .form-control{
border: 0;
background: none;
box-shadow: none;
}
.chat .chat-message .input-group .form-control{
border-left: 1px solid rgba(0, 0, 0, 0.07);
}
.chat .chat-message .input-group .btn.btn-primary{
border-radius: 50px;
width: 40px;
height: 40px;
text-align: center;
justify-content: center;
display: flex;
align-items: center;
font-size: 13px;
}
.chat-count-message{
position: relative;
display: inline-block;
}
.online,
.offline,
.me {
margin-right: 2px;
font-size: 8px;
vertical-align: middle
}
.online {
color: #86c541
}
.offline {
color: #ff4e4e
}
.me {
color: #1d8ecd
}
.clearfix:after {
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0
}
.chat .chat-history ul li.date-separator{
position: relative;
}
.chat .chat-history ul li.date-separator:after{
content: "";
width: 100%;
background: #d5dfea;
height: 1px;
display: block;
bottom: 11px;
position: relative;
}
.chat .chat-history ul li.date-separator .badge{
position: relative;
z-index: 1;
padding: 5px 15px;
border-radius: 5px;
background: #f2f2f2;
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
font-size: 12px;
}
.check-sign{
float: right;
margin-top: 0px;
margin-left: 2px;
padding-right: 10px;
}
.check-sign .fa{font-size: 9px;}
.check-sign .fa:before{content: "";
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid #606060;
border-bottom: 2px solid #606060;
-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%;
width: 6px;
height: 12px;
display: inline-block;}
.check-sign .fa.fa-check-double:before{
border-right: 2px solid var(--brand);
border-bottom: 2px solid var(--brand);
}
.check-sign .fa.fa-check-double:after{
content: "";
border-top: 2px solid transparent;
border-left: 2px solid transparent;
border-right: 2px solid var(--brand);
border-bottom: 2px solid var(--brand);
-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%;
width: 8px;
height: 12px;
display: inline-block;
margin-left: -3px;
}
.check-sign .fa.fa-check-double{color: #02a843;}
.serice-tab-wrap .card-header{
position: relative;
}
.serice-tab-wrap .card-header .btn{
position: absolute;
right: 10px;
top: 4px;
}
.serice-tab-wrap .card-header .nav{
background: #fff;
border: 1px solid #ccc;
border-radius: 5px 5px 0px 0px;
padding: 0;
margin-bottom: -2px !important;
z-index: 0;
position: relative;
text-align: center;
justify-content: center;
display: flex;
border-bottom: 0;
}
.serice-tab-wrap .card-header .nav-tabs .nav-link{
border: 0;
color: #000;
border-radius: 0;
}
.serice-tab-wrap .card-header .nav-tabs .nav-link.active{background: #e8e8e8;color: #000;}
.serice-tab-wrap .tab-content > .tab-pane{
border: 1px solid #ccc;
border-top:0px;padding: 15px;
border-radius: 0px 0px 5px 5px;
background: #e8e8e8;
}
.map-markers ul{
list-style-type: none;
padding: 0;
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
}
.map-markers ul li{
list-style-type: none;
width: 38px;
padding: 5px;
position: relative;
height: 38px;
}
.map-markers ul li [type="radio"]{
left: 0;
right: 0;
top: 0;
bottom: 0;
border: 1px solid #ccc;
opacity: 1;
background:#ffffff3d;
appearance: none;
border-radius: 50px;
cursor: pointer;
}
.map-markers ul li [type="radio"]:checked{
border: 1px solid #000;
background: transparent;
}
.map-markers ul li img{
max-width: 100%;
}
.or-line {
text-align: center;
position: relative;
margin-top: 20px;
}
.or-line::before {
position: absolute;
height: 1px;
background: #ccc;
left: 0;
right: 0;
margin: auto;
top: 0;
bottom: 0;
content: "";
}
.or-line span {
display: inline-block;
background: #fff;
font-size: 20px;
color: #000;
z-index: 1;
position: relative;
padding: 5px 10px;
}
.add-vehicle-modal .modal-dialog{
max-width: 800px
}
.control-input-box{
margin-bottom: 15px;
}
.show_ac_non_ac_div , .show_km_charges_div{
margin-bottom:10px;
}
.show_ac_non_ac_div > .row, .show_km_charges_div > .row{
padding: 15px 0;
border-radius: 10px;
border: 1px solid #ccc;
margin-left: 0; margin-right: 0;
}
.form-text{font-size: 14px;}
@media only screen and (max-width: 767px) {
.chat-app .people-list {
height: auto;
width: 100%;
overflow-x: auto;
background: #fff;
left: -400px;
position: static;
/*display: none*/
}
.chat-app .people-list.open {
left: 0
}
.chat-app .chat {
margin: 0
}
.chat-app .chat .chat-header {
border-radius: 0.55rem 0.55rem 0 0
}
.chat-app .chat-history {
height: 300px;
overflow-x: auto
}
}
@media only screen and (min-width: 768px) and (max-width: 992px) {
.chat-app .chat-list {
height: 650px;
overflow-x: auto
}
.chat-app .chat-history {
height: 600px;
overflow-x: auto
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
.chat-app .chat-list {
height: 480px;
overflow-x: auto
}
.chat-app .chat-history {
height: calc(100vh - 350px);
overflow-x: auto
}
}
@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: #313336;
display: none;
padding-left: 1px;
}
.mini-sidebar .sidebar-nav #sidebarnav > li:last-child > ul{
position: relative;
top: 0;
}
.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: #313336;
}
.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;
}
.serice-tab-wrap .card-header{
text-align: center;
border: 1px solid #ccc;
border-radius: 5px 5px 0px 0px;
}
.serice-tab-wrap .card-header .btn{
position: static;
margin-top: 5px;
margin-bottom: 5px;
}
.serice-tab-wrap .card-header .nav{
border: 0;
}
.chart-legend .legend-item .legend-text span{
font-size: 20px;
}
}
/* =============================================================
DASHBOARD — Common Layout & Wrapper
============================================================= */
.dash-wrap { padding: 24px 28px 40px; }
/* Dashboard Page Header */
.dash-header { padding: 8px 0 20px; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.dash-header-title { font-size: 22px; font-weight: 700; color: #1e1e2d; margin: 0; }
.dash-header-sub { font-size: 13px; color: #9ca3af; margin: 3px 0 0; }
/* =============================================================
DASHBOARD — Filter Bar
============================================================= */
.dash-filter {
background: #fff;
border: 1px solid #e5e7eb;
border-radius: 14px;
padding: 14px 20px;
display: flex;
align-items: center;
gap: 12px;
flex-wrap: wrap;
margin-bottom: 28px;
box-shadow: 0 1px 6px rgba(0,0,0,.05);
}
.dash-filter-label { font-size: 13px; font-weight: 600; color: #6b7280; margin: 0; white-space: nowrap; }
.dash-filter select,
.dash-filter input[type="date"] {
height: 38px;
border: 1.5px solid #e5e7eb;
border-radius: 10px;
font-size: 13px;
color: #374151;
background: #f9fafb;
padding: 0 12px;
outline: none;
transition: border-color .2s, box-shadow .2s;
max-width: 155px;
}
.dash-filter select:focus,
.dash-filter input[type="date"]:focus {
border-color: #6366f1;
box-shadow: 0 0 0 3px rgba(99,102,241,.12);
background: #fff;
}
.dash-btn-apply {
height: 38px;
padding: 0 22px;
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
color: #fff;
border: none;
border-radius: 10px;
font-size: 13px;
font-weight: 600;
cursor: pointer;
transition: opacity .2s, transform .15s;
white-space: nowrap;
}
.dash-btn-apply:hover { opacity: .9; transform: translateY(-1px); }
.dash-btn-clear {
height: 38px;
padding: 0 18px;
background: #f3f4f6;
color: #6b7280;
border: 1.5px solid #e5e7eb;
border-radius: 10px;
font-size: 13px;
font-weight: 500;
text-decoration: none;
display: inline-flex;
align-items: center;
transition: background .2s, color .2s;
white-space: nowrap;
}
.dash-btn-clear:hover { background: #e5e7eb; color: #374151; text-decoration: none; }
/* =============================================================
DASHBOARD — Stat / KPI Cards
============================================================= */
.dash-stat {
border-radius: 16px;
padding: 22px 22px 18px;
margin-bottom: 24px;
cursor: pointer;
position: relative;
overflow: hidden;
transition: transform .18s, box-shadow .18s;
color: #fff;
}
.dash-stat:hover { transform: translateY(-4px); box-shadow: 0 16px 40px rgba(0,0,0,.18); }
/* Row-1 gradient variants */
.dash-stat-rides { background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%); box-shadow: 0 8px 24px rgba(99,102,241,.35); }
.dash-stat-users { background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%); box-shadow: 0 8px 24px rgba(245,158,11,.35); }
.dash-stat-drivers { background: linear-gradient(135deg, #10b981 0%, #059669 100%); box-shadow: 0 8px 24px rgba(16,185,129,.35); }
/* Row-2 gradient variants */
.dash-stat-earnings { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); box-shadow: 0 8px 24px rgba(59,130,246,.35); }
.dash-stat-completed { background: linear-gradient(135deg, #14b8a6 0%, #0d9488 100%); box-shadow: 0 8px 24px rgba(20,184,166,.35); }
.dash-stat-cancelled { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); box-shadow: 0 8px 24px rgba(239,68,68,.35); }
.dash-stat-bg-icon {
position: absolute;
right: -12px;
bottom: -12px;
width: 90px;
height: 90px;
opacity: .15;
}
.dash-stat-bg-icon img { width: 100%; height: 100%; object-fit: contain; }
.dash-stat-icon {
width: 46px;
height: 46px;
border-radius: 12px;
background: rgba(255,255,255,.22);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 16px;
}
.dash-stat-icon img { width: 26px; height: 26px; object-fit: contain; filter: brightness(0) invert(1); }
.dash-stat-icon i { font-size: 20px; color: #fff; }
.dash-stat-label { font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; opacity: .82; margin-bottom: 6px; }
.dash-stat-value { font-size: 32px; font-weight: 800; line-height: 1; margin-bottom: 10px; }
.dash-stat-change { font-size: 12px; font-weight: 600; opacity: .9; margin: 0; }
.dash-stat-change i { margin-right: 4px; }
/* =============================================================
DASHBOARD — Chart Cards
============================================================= */
.dash-card {
background: #fff;
border: 1px solid #f0f0f0;
border-radius: 16px;
margin-bottom: 24px;
box-shadow: 0 2px 12px rgba(0,0,0,.06);
overflow: hidden;
}
.dash-card-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 22px 14px;
border-bottom: 1px solid #f3f4f6;
}
.dash-card-head h5 { font-size: 15px; font-weight: 700; color: #111827; margin: 0; }
.dash-card-head .dash-pill-tag {
font-size: 11px;
font-weight: 600;
color: #6366f1;
background: #ede9fe;
border-radius: 20px;
padding: 3px 10px;
}
.dash-card-body { padding: 18px 22px 22px; }
/* Chart legend */
.dash-legend { display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; margin-top: 14px; }
.dash-legend-item { display: flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 600; color: #6b7280; }
.dash-legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
/* =============================================================
DASHBOARD — Data Tables (Recent Rides & Top Drivers)
============================================================= */
.dash-table-card {
background: #fff;
border: 1px solid #f0f0f0;
border-radius: 16px;
margin-bottom: 24px;
box-shadow: 0 2px 12px rgba(0,0,0,.06);
overflow: hidden;
}
.dash-table-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 22px;
border-bottom: 1px solid #f3f4f6;
}
.dash-table-head h5 { font-size: 15px; font-weight: 700; color: #111827; margin: 0; }
.dash-table-head .dash-view-all {
font-size: 12px;
font-weight: 700;
color: #6366f1;
text-decoration: none;
background: #ede9fe;
border-radius: 20px;
padding: 4px 12px;
transition: background .2s;
}
.dash-table-head .dash-view-all:hover { background: #ddd6fe; text-decoration: none; }
.dash-table-card table { margin: 0; width: 100%; border-collapse: collapse; }
.dash-table-card thead th {
background: #f9fafb;
font-size: 10.5px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .07em;
color: #9ca3af;
padding: 10px 18px;
border-bottom: 1px solid #f0f0f0;
border-top: none;
white-space: nowrap;
}
.dash-table-card tbody td {
padding: 13px 18px;
font-size: 13px;
color: #374151;
border-bottom: 1px solid #f9fafb;
vertical-align: middle;
}
.dash-table-card tbody tr:last-child td { border-bottom: none; }
.dash-table-card tbody tr:hover td { background: #fafafa; }
.dash-table-card tbody a { color: #6366f1; font-weight: 600; }
/* Ride status badges */
.dash-badge {
display: inline-block;
font-size: 10.5px;
font-weight: 700;
letter-spacing: .04em;
padding: 3px 9px;
border-radius: 20px;
white-space: nowrap;
}
.dash-badge-completed { background: #d1fae5; color: #065f46; }
.dash-badge-cancelled { background: #fee2e2; color: #991b1b; }
.dash-badge-ongoing { background: #dbeafe; color: #1e40af; }
.dash-badge-placed { background: #fef3c7; color: #92400e; }
.dash-badge-default { background: #f3f4f6; color: #6b7280; }
/* Driver avatar in table */
.dash-driver-avatar {
width: 34px;
height: 34px;
border-radius: 50%;
object-fit: cover;
border: 2px solid #e5e7eb;
flex-shrink: 0;
}
.dash-driver-cell { display: flex; align-items: center; gap: 10px; }
.dash-driver-cell span { font-weight: 600; color: #111827; }
/* Ride ID chip */
.dash-ride-id {
display: inline-block;
font-size: 11px;
font-weight: 700;
font-family: monospace;
background: #f3f4f6;
color: #374151;
padding: 3px 8px;
border-radius: 6px;
text-decoration: none;
}
.dash-ride-id:hover { background: #ede9fe; color: #6366f1; text-decoration: none; }
/* Rides percent badge on stat cards */
.dash-stat-change.green,
.dash-stat-change.red { color: rgba(255,255,255,.95); }
/* Location text truncation in rides table */
.dash-loc { max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
/* ============================================================= */
/* SIDEBAR — Bordered Card Style */
/* ============================================================= */
/* Kill legacy orange right-border from base CSS on ALL states */
.sidebar-nav > ul > li > a,
.sidebar-nav ul li > a,
.sidebar-nav ul li ul li > a,
.sidebar-nav ul li ul li.active a,
.sidebar-nav ul li ul li a:hover {
border-right: none !important;
}
/* Sidebar shell */
.left-sidebar {
background: #0C111C !important;
border-right: none !important;
box-shadow: 6px 0 24px rgba(0,0,0,.5) !important;
}
/* Smooth scroll */
.scroll-sidebar { scroll-behavior: smooth !important; }
/* ── Search ─────────────────────────────────────────── */
.sidebar-search { padding: 16px 14px 8px !important; }
.sidebar-search input {
width: 100% !important;
background: rgba(255,255,255,.06) !important;
border: 1px solid rgba(255,255,255,.09) !important;
border-radius: 8px !important;
color: rgba(255,255,255,.65) !important;
font-size: 13px !important;
padding: 8px 14px !important;
outline: none !important;
box-shadow: none !important;
transition: all .2s !important;
}
.sidebar-search input::placeholder { color: rgba(255,255,255,.22) !important; }
.sidebar-search input:focus {
border-color: rgba(var(--brand-rgb),.5) !important;
background: rgba(var(--brand-rgb),.04) !important;
box-shadow: 0 0 0 3px rgba(var(--brand-rgb),.07) !important;
}
/* ── Nav wrapper ─────────────────────────────────────── */
.sidebar-nav { background: transparent !important; padding: 0 !important; }
.sidebar-nav ul { padding: 0 10px !important; margin: 0 !important; }
/* ── Section labels ──────────────────────────────────── */
.sidebar-nav > ul > li.nav-subtitle {
margin: 20px 0 5px !important;
padding: 0 6px !important;
border: none !important;
background: transparent !important;
}
.sidebar-nav > ul > li.nav-subtitle .nav-subtitle-span {
color: rgba(255,255,255,.25) !important;
font-size: 10px !important;
font-weight: 700 !important;
letter-spacing: 1.8px !important;
text-transform: uppercase !important;
background: transparent !important;
padding: 0 !important;
border: none !important;
width: auto !important;
display: block !important;
margin-right: -10px !important;
}
.sidebar-nav > ul > li.nav-subtitle::before,
.sidebar-nav > ul > li.nav-subtitle::after { display: none !important; }
/* ── List items ──────────────────────────────────────── */
.sidebar-nav ul li { list-style: none !important; margin-bottom: 3px !important; }
/* Top-level link base */
.sidebar-nav > ul > li > a {
color: rgba(255,255,255,.9) !important;
padding: 6px 10px !important;
display: flex !important;
align-items: center !important;
gap: 12px !important;
font-size: 13.5px !important;
font-weight: 500 !important;
border-radius: 10px !important;
text-decoration: none !important;
transition: background .2s, color .2s, border-color .2s !important;
background: transparent !important;
border: 1.5px solid transparent !important;
position: relative !important;
}
/* ── Icon Badge ──────────────────────────────────────── */
.sidebar-nav > ul > li > a i {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 34px !important;
height: 34px !important;
min-width: 34px !important;
border-radius: 9px !important;
background: rgba(255,255,255,.12) !important;
color: rgba(255,255,255,.92) !important;
font-size: 17px !important;
transition: background .2s, color .2s, box-shadow .2s !important;
line-height: 1 !important;
flex-shrink: 0 !important;
}
/* ── Hover ───────────────────────────────────────────── */
.sidebar-nav > ul > li > a:hover {
background: rgba(255,255,255,.05) !important;
color: rgba(255,255,255,.85) !important;
border-color: rgba(255,255,255,.1) !important;
}
.sidebar-nav > ul > li > a:hover i {
background: rgba(255,255,255,.11) !important;
color: rgba(255,255,255,.7) !important;
}
/* ── ACTIVE — full green border on all 4 sides ───────── */
.sidebar-nav > ul > li.active > a,
.sidebar-nav > ul > li > a.active {
background: transparent !important;
color: #fff !important;
font-weight: 600 !important;
border: 1.5px solid rgba(var(--brand-rgb),.55) !important;
border-radius: 10px !important;
box-shadow: none !important;
}
.sidebar-nav > ul > li.active > a i,
.sidebar-nav > ul > li > a.active i {
background: var(--brand) !important;
color: #0C111C !important;
box-shadow: 0 3px 14px rgba(var(--brand-rgb),.45) !important;
}
/* ── Expand arrow ────────────────────────────────────── */
.sidebar-nav .has-arrow::after {
border-color: rgba(255,255,255,.22) !important;
right: 12px !important;
width: 7px !important;
height: 7px !important;
transition: all .22s ease !important;
}
.sidebar-nav .has-arrow[aria-expanded="true"]::after,
.sidebar-nav .active > .has-arrow::after,
.sidebar-nav li > .has-arrow.active::after {
border-color: var(--brand) !important;
}
/* ── Sub-menu container ──────────────────────────────── */
.sidebar-nav ul li > ul {
padding: 4px 0 6px 0 !important;
background: rgba(0,0,0,.18) !important;
border-radius: 0 0 10px 10px !important;
margin: -4px 1px 4px 1px !important;
border: 1.5px solid rgba(var(--brand-rgb),.3) !important;
border-top: none !important;
}
/* Sub-menu links */
.sidebar-nav ul li ul li > a {
padding: 7px 12px 7px 18px !important;
font-size: 12.5px !important;
color: rgba(255,255,255,.42) !important;
border-radius: 7px !important;
display: flex !important;
align-items: center !important;
font-weight: 400 !important;
border: none !important;
transition: color .18s, background .18s !important;
}
.sidebar-nav ul li ul li a::before {
content: "" !important;
width: 5px !important;
height: 5px !important;
min-width: 5px !important;
border-radius: 50% !important;
background: rgba(255,255,255,.2) !important;
display: inline-block !important;
margin-right: 10px !important;
transition: background .18s, transform .18s !important;
border: none !important;
position: static !important;
flex-shrink: 0 !important;
}
.sidebar-nav ul li ul li a::after { display: none !important; }
.sidebar-nav ul li ul li a:hover {
color: rgba(255,255,255,.78) !important;
background: rgba(255,255,255,.05) !important;
}
.sidebar-nav ul li ul li a:hover::before { background: rgba(var(--brand-rgb),.75) !important; }
.sidebar-nav ul li ul li.active > a,
.sidebar-nav ul li ul li > a.active {
color: var(--brand) !important;
background: transparent !important;
font-weight: 500 !important;
border: none !important;
}
.sidebar-nav ul li ul li.active > a::before,
.sidebar-nav ul li ul li > a.active::before { background: var(--brand) !important; }
/* ── Version footer ──────────────────────────────────── */
.web_version {
color: rgba(255,255,255,.9) !important;
font-size: 11px !important;
text-align: center !important;
padding: 10px 16px 28px !important;
margin: 0 !important;
}
/* ── Scrollbar ───────────────────────────────────────── */
.scroll-sidebar::-webkit-scrollbar { width: 3px !important; }
.scroll-sidebar::-webkit-scrollbar-track { background: transparent !important; }
.scroll-sidebar::-webkit-scrollbar-thumb {
background: rgba(255,255,255,.08) !important;
border-radius: 4px !important;
}
.scroll-sidebar::-webkit-scrollbar-thumb:hover { background: rgba(var(--brand-rgb),.35) !important; }
/* ── Mini Sidebar (collapsed) ──────────────────────────────────── */
/* Hide section labels, search, footer */
.mini-sidebar .sidebar-search,
.mini-sidebar .sidebar-nav > ul > li.nav-subtitle,
.mini-sidebar .web_version { display: none !important; }
/* ul: no padding → li spans full 60px → no gap to submenu */
.mini-sidebar .sidebar-nav ul { padding: 0 !important; }
.mini-sidebar .sidebar-nav #sidebarnav > li { position: relative !important; }
/* Tooltip + submenu handled by #mini-hover-panel (position:fixed via JS) */
#mini-hover-panel {
position: fixed;
left: 64px;
min-width: 150px;
max-height: calc(100vh - 20px);
overflow-y: auto;
background: #1e2a3d;
border: 1px solid rgba(255,255,255,.13);
border-radius: 10px;
box-shadow: 4px 6px 22px rgba(0,0,0,.55);
z-index: 99999;
display: none;
padding: 5px;
}
#mini-hover-panel .mhp-label {
padding: 7px 12px 6px;
color: rgba(255,255,255,.9);
font-size: 13px;
font-weight: 600;
white-space: nowrap;
}
#mini-hover-panel .mhp-label.has-sub {
border-bottom: 1px solid rgba(255,255,255,.08);
margin-bottom: 3px;
}
#mini-hover-panel .mhp-link {
display: block;
padding: 7px 12px;
color: rgba(255,255,255,.68);
font-size: 13px;
border-radius: 7px;
text-decoration: none !important;
white-space: nowrap;
transition: background .15s, color .15s;
}
#mini-hover-panel .mhp-link:hover {
background: rgba(255,255,255,.08);
color: #fff;
}
/* ── Default: icon only, centered in 60px ── */
.mini-sidebar .sidebar-nav > ul > li > a {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 42px !important;
height: 42px !important;
margin: 0 auto !important;
padding: 0 !important;
border: 1.5px solid transparent !important;
border-radius: 10px !important;
background: transparent !important;
position: relative !important;
overflow: visible !important;
gap: 0 !important;
transition: background .18s, border-color .18s !important;
}
/* Icon — plain glyph, clearly visible */
.mini-sidebar .sidebar-nav > ul > li > a i {
font-size: 20px !important;
color: rgba(255,255,255,.9) !important;
background: transparent !important;
width: auto !important;
height: auto !important;
min-width: unset !important;
display: inline-block !important;
line-height: 1 !important;
box-shadow: none !important;
border-radius: 0 !important;
padding: 0 !important;
transition: color .18s !important;
}
/* Label span: always hidden in mini mode (panel shows label via JS) */
.mini-sidebar .sidebar-nav > ul > li > a .hide-menu { display: none !important; }
/* ── Hover: highlight icon ── */
.mini-sidebar .sidebar-nav #sidebarnav > li:hover > a {
background: rgba(255,255,255,.07) !important;
border-color: rgba(255,255,255,.12) !important;
}
.mini-sidebar .sidebar-nav #sidebarnav > li:hover > a i {
color: var(--brand) !important;
background: transparent !important;
box-shadow: none !important;
}
/* ── Active: green border + green icon ── */
.mini-sidebar .sidebar-nav > ul > li.active > a,
.mini-sidebar .sidebar-nav > ul > li > a.active {
border: 1.5px solid rgba(var(--brand-rgb),.6) !important;
background: transparent !important;
}
.mini-sidebar .sidebar-nav > ul > li.active > a i,
.mini-sidebar .sidebar-nav > ul > li > a.active i { color: var(--brand-ink) !important; background: var(--brand) !important; }
/* Collapse submenus in mini mode (panel handles them) */
.mini-sidebar .sidebar-nav #sidebarnav > li > ul { display: none !important; }
/* ============================================================= */
/* END SIDEBAR */
/* ============================================================= */
/* ============================================================= */
/* LISTING PAGE — Modern Table UI */
/* ============================================================= */
/* Page title bar */
.page-title-bar {
background: #fff;
border-bottom: 1px solid #eef0f4;
padding: 20px 30px;
margin-bottom: 0;
}
.page-title-bar .ptb-inner {
display: flex;
align-items: center;
justify-content: space-between;
}
.page-title-bar .ptb-left {
display: flex;
align-items: center;
gap: 14px;
}
.page-title-bar .ptb-icon {
width: 44px;
height: 44px;
border-radius: 12px;
background: var(--brand-tint);
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.page-title-bar .ptb-icon img {
width: 24px;
height: 24px;
object-fit: contain;
}
.page-title-bar h2 {
font-size: 20px;
font-weight: 700;
color: #1a1f2e;
margin: 0 0 3px;
line-height: 1.2;
}
.page-title-bar .breadcrumb {
background: transparent;
padding: 0;
margin: 0;
font-size: 13px;
}
.page-title-bar .breadcrumb-item a { color: var(--brand); text-decoration: none; }
.page-title-bar .breadcrumb-item.active { color: #8a93a8; }
.page-title-bar .breadcrumb-item + .breadcrumb-item::before { color: #c5cad6; }
.page-title-bar .ptb-count {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 28px;
height: 24px;
padding: 0 8px;
background: var(--brand);
color: #0f1a0a;
font-size: 12px;
font-weight: 700;
border-radius: 20px;
margin-left: 4px;
}
/* Create button */
.btn-page-create {
display: inline-flex;
align-items: center;
gap: 7px;
background: var(--brand);
color: #0C111C;
font-size: 13.5px;
font-weight: 600;
padding: 9px 20px;
border-radius: 10px;
border: none;
text-decoration: none;
transition: background .18s, box-shadow .18s;
box-shadow: 0 2px 10px rgba(var(--brand-rgb),.28);
white-space: nowrap;
}
.btn-page-create:hover {
background: var(--brand-strong);
color: #0C111C;
text-decoration: none;
box-shadow: 0 4px 16px rgba(var(--brand-rgb),.38);
}
.btn-page-create i { font-size: 16px; }
/* Listing table card */
.listing-card {
background: #fff;
border-radius: 14px;
border: 1px solid #eef0f4;
box-shadow: 0 2px 12px rgba(0,0,0,.05);
overflow: hidden;
margin: 24px 0;
}
.listing-card-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 24px;
border-bottom: 1px solid #eef0f4;
}
.listing-card-title {
font-size: 15px;
font-weight: 700;
color: #1a1f2e;
margin: 0 0 3px;
}
.listing-card-subtitle {
font-size: 13px;
color: #8a93a8;
margin: 0;
}
/* Delete-all button inside card header */
.listing-card-header .delete-all-wrap label {
display: flex;
align-items: center;
gap: 6px;
cursor: pointer;
font-size: 13px;
color: #e05454;
font-weight: 500;
margin: 0;
}
.listing-card-header .delete-all-wrap label i { font-size: 15px; }
/* Table */
.listing-card .table-responsive { margin: 0; overflow-x: auto; }
/* keep toolbar/footer pinned to the left while a wide table scrolls horizontally */
.listing-card .dt-toolbar,
.listing-card .dt-footer { position: sticky; left: 0; }
/* The table cells use position:relative, so they paint over the sticky toolbar's
stacking context — which traps the Export dropdown behind the rows. Lift the
toolbar just above the cells (z-index 5) so the dropdown shows on top — but keep
it BELOW the loading overlay (#overlay z-index 10) so it dims normally on load. */
.listing-card .dt-toolbar { z-index: 5 !important; }
.listing-card table.dataTable {
border-collapse: collapse !important;
width: 100% !important;
margin: 0 !important;
}
.listing-card table thead th {
background: #f8f9fc;
border-top: none !important;
border-bottom: 2px solid #eef0f4 !important;
color: #5a6179;
font-size: 12px;
font-weight: 700;
letter-spacing: .5px;
text-transform: uppercase;
padding: 12px 16px !important;
white-space: nowrap;
}
.listing-card table tbody tr {
border-bottom: 1px solid #f2f4f8;
transition: background .14s;
}
.listing-card table tbody tr:last-child { border-bottom: none; }
.listing-card table tbody tr:hover { background: #fafbff; }
.listing-card table tbody td {
padding: 13px 16px !important;
font-size: 14px;
color: #3b4060;
vertical-align: middle !important;
border: none !important;
}
.listing-card table tbody td a:not(.action-icon) {
color: #3b4060;
font-weight: 500;
text-decoration: none;
}
.listing-card table tbody td a:not(.action-icon):hover { color: var(--brand); }
/* Action buttons — bordered circles (icon-agnostic: every icon styled) */
/* NOTE: .action-btn is sometimes the | itself and sometimes an inner .
We must NOT set display:flex on it (that breaks | table-cell layout and
stacks icons vertically). Keep it inline and let the items flow inline. */
.listing-card .action-btn { white-space: nowrap; vertical-align: middle !important; }
.listing-card .action-btn > div { display: contents; } /* payout wraps its links in a div */
.listing-card .action-btn a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 36px !important;
height: 36px !important;
border-radius: 50% !important;
border: 1.5px solid #d8dde8 !important;
background: #fff !important;
text-decoration: none !important;
transition: all .15s ease !important;
font-size: 16px !important;
line-height: 1 !important;
padding: 0 !important;
margin: 0 3px !important;
vertical-align: middle !important;
flex-shrink: 0 !important;
position: relative;
}
.listing-card .action-btn a > i { font-size: 16px !important; color: #5a6179 !important; }
/* BLUE — view / edit / file */
.listing-card .action-btn a:has(i.mdi-eye),
.listing-card .action-btn a:has(i.mdi-lead-pencil),
.listing-card .action-btn a:has(i.mdi-pencil),
.listing-card .action-btn a:has(i.mdi-file-pdf-box),
.listing-card .action-btn a:has(i.mdi-file) { border-color: #bfe2f7 !important; }
.listing-card .action-btn a:has(i.mdi-eye) > i,
.listing-card .action-btn a:has(i.mdi-lead-pencil) > i,
.listing-card .action-btn a:has(i.mdi-pencil) > i,
.listing-card .action-btn a:has(i.mdi-file-pdf-box) > i,
.listing-card .action-btn a:has(i.mdi-file) > i { color: #3b9de0 !important; }
.listing-card .action-btn a:has(i.mdi-eye):hover,
.listing-card .action-btn a:has(i.mdi-lead-pencil):hover,
.listing-card .action-btn a:has(i.mdi-pencil):hover,
.listing-card .action-btn a:has(i.mdi-file-pdf-box):hover,
.listing-card .action-btn a:has(i.mdi-file):hover {
background: #3b9de0 !important; border-color: #3b9de0 !important;
box-shadow: 0 3px 10px rgba(59,157,224,.32) !important;
}
.listing-card .action-btn a:has(i.mdi-eye):hover > i,
.listing-card .action-btn a:has(i.mdi-lead-pencil):hover > i,
.listing-card .action-btn a:has(i.mdi-pencil):hover > i,
.listing-card .action-btn a:has(i.mdi-file-pdf-box):hover > i,
.listing-card .action-btn a:has(i.mdi-file):hover > i { color: #fff !important; }
/* RED — delete / reject(close) */
.listing-card .action-btn a.delete-btn,
.listing-card .action-btn a:has(i.mdi-delete),
.listing-card .action-btn a:has(i.mdi-close) { border-color: #f6c9c9 !important; }
.listing-card .action-btn a.delete-btn > i,
.listing-card .action-btn a:has(i.mdi-delete) > i,
.listing-card .action-btn a:has(i.mdi-close) > i { color: #e05454 !important; }
.listing-card .action-btn a.delete-btn:hover,
.listing-card .action-btn a:has(i.mdi-delete):hover,
.listing-card .action-btn a:has(i.mdi-close):hover {
background: #e05454 !important; border-color: #e05454 !important;
box-shadow: 0 3px 10px rgba(224,84,84,.32) !important;
}
.listing-card .action-btn a.delete-btn:hover > i,
.listing-card .action-btn a:has(i.mdi-delete):hover > i,
.listing-card .action-btn a:has(i.mdi-close):hover > i { color: #fff !important; }
/* GREEN — approve (check) */
.listing-card .action-btn a:has(i.mdi-check) { border-color: #bfe6a3 !important; }
.listing-card .action-btn a:has(i.mdi-check) > i { color: var(--brand) !important; }
.listing-card .action-btn a:has(i.mdi-check):hover {
background: var(--brand) !important; border-color: var(--brand) !important;
box-shadow: 0 3px 10px rgba(86,184,0,.32) !important;
}
.listing-card .action-btn a:has(i.mdi-check):hover > i { color: #fff !important; }
/* TEAL — chat (wechat) */
.listing-card .action-btn a:has(i.mdi-wechat) { border-color: #b9e4ea !important; }
.listing-card .action-btn a:has(i.mdi-wechat) > i { color: #1aacc0 !important; }
.listing-card .action-btn a:has(i.mdi-wechat):hover {
background: #1aacc0 !important; border-color: #1aacc0 !important;
box-shadow: 0 3px 10px rgba(26,172,192,.32) !important;
}
.listing-card .action-btn a:has(i.mdi-wechat):hover > i { color: #fff !important; }
/* unread count badge stays on top */
.listing-card .action-btn a .unread-count { z-index: 2; }
/* ── Search + Export inline in toolbar ── */
.listing-card .dt-toolbar .dataTables_filter {
display: flex !important;
align-items: center !important;
gap: 10px !important;
float: none !important;
margin: 0 !important;
}
.listing-card .dt-toolbar .dataTables_filter label {
margin: 0 !important;
display: flex !important;
align-items: center !important;
}
.listing-card .dt-toolbar .dt-buttons { margin: 0 !important; float: none !important; }
/* Active sort arrows & current page → follow the theme (primary) color.
(The export button itself is styled in the bulletproof block earlier.) */
.listing-card table thead .sorting_asc:after,
.listing-card table thead .sorting_desc:after { color: var(--brand) !important; }
.listing-card .dataTables_paginate .paginate_button.current,
.listing-card .dataTables_paginate .paginate_button.current:hover,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
background: var(--brand) !important; border-color: var(--brand) !important; color: var(--brand-ink) !important;
}
/* Login page button → theme color */
.login-register .btn-primary,
.login-register .btn.btn-dark,
.login-box .btn-primary,
.login-box button[type="submit"] {
background: var(--brand) !important; border-color: var(--brand) !important; color: var(--brand-ink) !important;
}
/* ── Custom checkboxes (select-all + row select) ── */
/* Base theme pushes native checkbox off-screen (left:-9999px;opacity:0) and
uses the label as the visual box. We override that to show a real custom box. */
/* Match select checkboxes by identity (.is_open rows, #is_active header) so
pages that don't wrap them in td.delete-all still get the green design. */
.listing-card .th-delete-wrap input[type="checkbox"],
.listing-card tbody td.delete-all input[type="checkbox"],
.listing-card input.is_open,
.listing-card #is_active {
-webkit-appearance: none !important;
-moz-appearance: none !important;
appearance: none !important;
width: 19px !important;
height: 19px !important;
min-width: 19px !important;
border: 1.5px solid #cbd2e0 !important;
border-radius: 6px !important;
background: #fff !important;
cursor: pointer !important;
position: relative !important;
left: auto !important;
top: auto !important;
opacity: 1 !important;
margin: 0 !important;
padding: 0 !important;
vertical-align: middle !important;
transition: background .15s, border-color .15s !important;
flex-shrink: 0 !important;
display: inline-block !important;
}
.listing-card .th-delete-wrap input[type="checkbox"]:hover,
.listing-card tbody td.delete-all input[type="checkbox"]:hover,
.listing-card input.is_open:hover,
.listing-card #is_active:hover {
border-color: var(--brand) !important;
}
.listing-card .th-delete-wrap input[type="checkbox"]:checked,
.listing-card tbody td.delete-all input[type="checkbox"]:checked,
.listing-card input.is_open:checked,
.listing-card #is_active:checked {
background: var(--brand) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%230C111C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") no-repeat center center !important;
border-color: var(--brand) !important;
}
/* Hide the empty theme labels next to checkboxes */
.listing-card .th-delete-wrap label,
.listing-card tbody td.delete-all label,
.listing-card input.is_open + label,
.listing-card #is_active + label {
display: none !important;
}
/* Delete-all header cell */
.listing-card .th-delete-wrap {
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.listing-card .th-delete-wrap .do_not_delete {
color: #aab1c2;
font-size: 15px;
line-height: 1;
display: inline-flex;
align-items: center;
transition: color .15s;
}
.listing-card .th-delete-wrap .do_not_delete:hover { color: #e05454; text-decoration: none; }
.listing-card thead th.delete-all {
width: 70px;
vertical-align: middle !important;
text-align: left !important;
padding-left: 22px !important;
}
/* Row checkbox cell — left-aligned to line up with header checkbox column */
.listing-card tbody td.delete-all {
text-align: left !important;
vertical-align: middle !important;
padding-left: 22px !important;
}
/* ── DataTable controls — using dom-injected .dt-toolbar / .dt-footer bars ── */
.listing-card .dataTables_wrapper { margin: 0 !important; padding: 0 !important; }
/* Top toolbar: Show entries (left) + Search (right) */
.listing-card .dt-toolbar {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
flex-wrap: wrap;
gap: 12px;
padding: 16px 22px !important;
background: #fafbfc !important;
border-bottom: 1px solid #eef0f4 !important;
}
.listing-card .dt-toolbar .dataTables_length,
.listing-card .dt-toolbar .dataTables_filter {
float: none !important;
margin: 0 !important;
}
/* Show entries */
.listing-card .dt-toolbar .dataTables_length label {
font-size: 13px !important;
color: #6b7280 !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
margin: 0 !important;
font-weight: 500 !important;
}
.listing-card .dt-toolbar .dataTables_length select {
border: 1px solid #dde0e8 !important;
border-radius: 8px !important;
padding: 6px 28px 6px 12px !important;
font-size: 13px !important;
color: #3b4060 !important;
background: #fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%236b7280' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") no-repeat right 10px center !important;
outline: none !important;
cursor: pointer !important;
height: auto !important;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* Search */
.listing-card .dt-toolbar .dataTables_filter label {
font-size: 13px !important;
color: #6b7280 !important;
display: flex !important;
align-items: center !important;
gap: 8px !important;
margin: 0 !important;
font-weight: 500 !important;
}
.listing-card .dt-toolbar .dataTables_filter input {
border: 1px solid #dde0e8 !important;
border-radius: 8px !important;
padding: 8px 14px 8px 36px !important;
font-size: 13px !important;
color: #3b4060 !important;
background: #fff url("../images/search_icon.png") no-repeat left 12px center !important;
background-size: 14px !important;
outline: none !important;
min-width: 240px !important;
height: auto !important;
margin: 0 !important;
transition: border-color .15s, box-shadow .15s !important;
}
.listing-card .dt-toolbar .dataTables_filter input:focus {
border-color: var(--brand) !important;
box-shadow: 0 0 0 3px rgba(var(--brand-rgb),.15) !important;
}
/* Bottom footer: info (left) + pagination (right) */
.listing-card .dt-footer {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
flex-wrap: wrap;
gap: 12px;
padding: 14px 22px !important;
background: #fafbfc !important;
border-top: 1px solid #eef0f4 !important;
}
.listing-card .dt-footer .dataTables_info {
font-size: 13px !important;
color: #8a93a8 !important;
padding: 0 !important;
margin: 0 !important;
float: none !important;
}
.listing-card .dt-footer .dataTables_paginate {
padding: 0 !important;
margin: 0 !important;
float: none !important;
}
.listing-card .dt-footer .dataTables_paginate .paginate_button {
border-radius: 8px !important;
font-size: 13px !important;
padding: 6px 12px !important;
border: 1px solid transparent !important;
background: transparent !important;
color: #5a6179 !important;
margin: 0 2px !important;
min-width: 34px;
text-align: center;
}
.listing-card .dt-footer .dataTables_paginate .paginate_button:hover {
background: #eef0f4 !important;
border: 1px solid transparent !important;
color: #1a1f2e !important;
}
.listing-card .dt-footer .dataTables_paginate .paginate_button.current,
.listing-card .dt-footer .dataTables_paginate .paginate_button.current:hover {
background: var(--brand) !important;
border: 1px solid var(--brand) !important;
color: #0C111C !important;
font-weight: 700 !important;
}
.listing-card .dt-footer .dataTables_paginate .paginate_button.disabled,
.listing-card .dt-footer .dataTables_paginate .paginate_button.disabled:hover {
color: #c5cad6 !important;
background: transparent !important;
cursor: not-allowed;
}
/* ── Stat cards (rides, transactions, etc.) ── */
.stat-cards-row {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 18px;
margin: 24px 0 0;
}
@media (max-width: 991px) { .stat-cards-row { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 575px) { .stat-cards-row { grid-template-columns: 1fr; } }
.stat-card {
background: #fff;
border: 1px solid #eef0f4;
border-radius: 14px;
box-shadow: 0 2px 12px rgba(0,0,0,.05);
padding: 20px 22px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 14px;
position: relative;
overflow: hidden;
}
.stat-card::before {
content: "";
position: absolute;
left: 0; top: 0; bottom: 0;
width: 4px;
border-radius: 4px;
}
.stat-card-info h3 {
font-size: 26px;
font-weight: 700;
color: #1a1f2e;
margin: 0 0 4px;
line-height: 1;
}
.stat-card-info p {
font-size: 13px;
color: #8a93a8;
margin: 0;
font-weight: 500;
}
.stat-card-icon {
width: 52px;
height: 52px;
border-radius: 14px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
}
.stat-card-icon img { width: 26px; height: 26px; object-fit: contain; }
.stat-card--blue::before { background: #3b9de0; }
.stat-card--blue .stat-card-icon { background: #eaf2ff; }
.stat-card--amber::before { background: #f5a623; }
.stat-card--amber .stat-card-icon { background: #fff4e5; }
.stat-card--green::before { background: var(--brand); }
.stat-card--green .stat-card-icon { background: #eafbe7; }
.stat-card--purple::before { background: #8b6ef0; }
.stat-card--purple .stat-card-icon { background: #f1ecff; }
/* ── Filter bar inside listing-card header ── */
.listing-card-header { flex-wrap: wrap; gap: 14px; }
.listing-filters {
display: flex;
align-items: center;
gap: 10px;
flex-wrap: wrap;
}
.listing-filters .select-box { padding: 0 !important; }
.listing-filters select.form-control { min-width: 150px; }
/* select2 single — match the theme */
.listing-filters .select2-container { min-width: 150px; }
.listing-filters .select2-container--default .select2-selection--single {
height: 38px !important;
border: 1px solid #dde0e8 !important;
border-radius: 8px !important;
background: #fff !important;
}
.listing-filters .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 25px !important;
color: #3b4060 !important;
font-size: 13px !important;
padding-left: 12px !important;
padding-right: 28px !important;
}
.listing-filters .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 36px !important;
right: 6px !important;
}
.listing-filters .select2-container--default .select2-selection--single .select2-selection__placeholder {
color: #8a93a8 !important;
}
/* Date range box */
.listing-filters #daterange {
border: 1px solid #dde0e8;
border-radius: 8px;
padding: 8px 14px;
font-size: 13px;
color: #3b4060;
cursor: pointer;
background: #fff;
display: flex;
align-items: center;
gap: 6px;
white-space: nowrap;
min-height: 38px;
}
.listing-filters #daterange i { color: #8a93a8; }
/* Export button (DataTables Buttons) inside toolbar */
.listing-card .dt-buttons { display: inline-flex; margin-left: 10px; }
/* only the export button itself (direct child) — NOT the nested dropdown menu items.
Neutral (non-theme) styling. */
.listing-card .dt-buttons > .btn,
.listing-card .dt-buttons > .dt-button {
background: #f3f4f6 !important;
color: #0C111C !important;
border: 1px solid #e2e6ef !important;
border-radius: 8px !important;
font-size: 13px !important;
padding: 8px 16px !important;
font-weight: 600 !important;
}
.listing-card .dt-buttons > .btn:hover,
.listing-card .dt-buttons > .dt-button:hover {
background: #e6e9f0 !important;
color: #0C111C !important;
border-color: #d3d9e6 !important;
}
/* Status-info & tip boxes keep spacing inside card */
.listing-card .ride-status-info,
.listing-card .tip-box { margin: 16px 22px 4px; }
/* ── Row striping: take full control so the sorted column follows the row
color (DataTables stripes via per-cell box-shadow, and its extra highlight
on .sorting_1 made that column look uniform). We disable DT's box-shadow
striping and apply our own background-color striping on the . ── */
.listing-card table.dataTable.display tbody tr > *,
.listing-card table.dataTable.stripe tbody tr > *,
.listing-card table.dataTable tbody td.sorting_1 {
box-shadow: none !important;
background: transparent !important;
}
.listing-card table.dataTable tbody tr.odd { background-color: #fbfcfd !important; }
.listing-card table.dataTable tbody tr.even { background-color: #ffffff !important; }
.listing-card table.dataTable tbody tr:hover { background-color: #f3f7ff !important; }
/* Highlight the sorted column's header + its up/down arrow in green */
.listing-card table.dataTable thead th.sorting_asc,
.listing-card table.dataTable thead th.sorting_desc { color: var(--brand) !important; }
.listing-card table.dataTable thead th.sorting_asc:after,
.listing-card table.dataTable thead th.sorting_desc:after { color: var(--brand) !important; }
/* ── Long-value cell truncation (e.g. airport address, faq description) ── */
.listing-card .cell-truncate {
display: inline-block;
max-width: 420px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: middle;
}
.listing-card .cell-truncate-wide { max-width: 620px; }
/* ============================================================= */
/* END LISTING PAGE */
/* ============================================================= */
/* ============================================================= */
/* DETAIL PAGE (ride / intercity show) — consistent card headers */
/* ============================================================= */
.order_detail .card {
border: 1px solid #eef0f4 !important;
border-radius: 12px !important;
box-shadow: 0 2px 10px rgba(0,0,0,.04) !important;
overflow: hidden;
margin-bottom: 24px;
}
/* Unify every card-header / box-header variant into one consistent style */
.order_detail .card .card-header,
.order_detail .card .box-header {
padding: 14px 18px !important;
background: #fafbfc !important;
border-bottom: 1px solid #eef0f4 !important;
border-radius: 0 !important;
display: flex !important;
align-items: center !important;
min-height: 54px;
}
.order_detail .card .card-header h3,
.order_detail .card .box-header h3,
.order_detail .card .card-header .box-title,
.order_detail .card .box-header .box-title {
margin: 0 !important;
font-size: 15px !important;
font-weight: 700 !important;
color: #1a1f2e !important;
line-height: 1.2 !important;
/* kill the base .box-title gray "chip" look so it matches plain headers */
background: transparent !important;
padding: 0 !important;
border-radius: 0 !important;
}
.order_detail .card .card-header .badge,
.order_detail .card .box-header .badge { margin-left: auto !important; }
/* Equal-height columns for every two-column layout row → no stagger / gaps.
Cards in each column fill the column height (last card grows) so side-by-side
blocks always align at the bottom and the next row starts cleanly. */
.order_detail .order_detail-top > .row,
.order_detail .ride-map-dredetail,
.order_detail .ride-loct-pricedet {
display: flex !important;
flex-wrap: wrap;
align-items: stretch;
}
/* Consistent gap BETWEEN rows (last card in a column has no margin, so the
spacing must live on the row container) */
.order_detail .ride-map-dredetail,
.order_detail .ride-loct-pricedet { margin-bottom: 24px !important; }
.order_detail .order_detail-top { margin-bottom: 24px !important; }
.order_detail .order_detail-top > .row > [class*="col-"],
.order_detail .ride-map-dredetail > [class*="col-"],
.order_detail .ride-loct-pricedet > [class*="col-"] {
display: flex;
flex-direction: column;
}
.order_detail .order_detail-top > .row > [class*="col-"] > .card,
.order_detail .ride-map-dredetail > [class*="col-"] > .card,
.order_detail .ride-loct-pricedet > [class*="col-"] > .card {
width: 100%;
flex: 0 0 auto;
margin-bottom: 24px;
}
/* last card in a column grows to fill remaining height → bottoms line up */
.order_detail .order_detail-top > .row > [class*="col-"] > .card:last-child,
.order_detail .ride-map-dredetail > [class*="col-"] > .card:last-child,
.order_detail .ride-loct-pricedet > [class*="col-"] > .card:last-child {
flex: 1 1 auto;
margin-bottom: 0;
}
/* map card nests an inner .box wrapper — let it fill the stretched card */
.order_detail .ride-map-dredetail .card > .box { width: 100%; flex: 1 1 auto; }
/* ── Detail-page embedded tables (driver/owner/user view .card-stretch) —
match the listing pagination (green active page) instead of base black ── */
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button {
border-radius: 8px !important;
font-size: 13px !important;
padding: 5px 11px !important;
border: 1px solid transparent !important;
background: transparent !important;
color: #5a6179 !important;
margin: 0 2px !important;
}
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
background: #eef0f4 !important;
border: 1px solid transparent !important;
color: #1a1f2e !important;
}
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
background: var(--brand) !important;
border: 1px solid var(--brand) !important;
color: #0C111C !important;
font-weight: 700 !important;
}
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.card-stretch .table-responsive .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
color: #c5cad6 !important;
background: transparent !important;
}
.card-stretch .dataTables_info { font-size: 13px !important; color: #8a93a8 !important; }
/* ============================================================= */
/* FORM PAGE — create/edit forms (modern look) */
/* ============================================================= */
.form-page .card {
border: 1px solid #eef0f4 !important;
border-radius: 14px !important;
box-shadow: 0 2px 12px rgba(0,0,0,.05) !important;
overflow: visible;
}
.form-page .card-header { background: #fff !important; border-bottom: 1px solid #eef0f4 !important; padding: 18px 24px !important; }
.form-page .card-body { padding: 24px !important; }
.form-page .error_top { color: #e05454; font-size: 13.5px; margin-bottom: 14px; }
/* ── General fieldset frame (simple forms) — green legend badge, NOT the base
theme's black `.form-layout-inner fieldset legend { background:#000 }` ── */
.form-page fieldset {
border: 1px solid #e2e6ef;
border-radius: 12px;
padding: 22px 22px 10px;
margin: 22px 0 24px;
min-width: 0;
}
.form-page fieldset > legend,
.form-page .form-layout-inner fieldset legend,
.form-page .form-layout fieldset legend {
display: inline-block !important;
width: auto !important;
max-width: none !important;
float: none !important;
margin: 0 0 0 4px !important;
padding: 5px 16px !important;
font-size: 12px !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .6px !important;
color: #0C111C !important;
background: var(--brand) !important;
border: none !important;
border-radius: 8px !important;
box-shadow: 0 2px 8px rgba(var(--brand-rgb),.3) !important;
}
/* ── Multilingual fieldset frame ── */
.form-page .lang-fieldset {
border: 1px solid #e2e6ef;
border-radius: 12px;
padding: 8px 0 10px;
margin: 22px 0 24px;
position: relative;
min-width: 0;
}
/* native legend → the badge sits IN the top border (notch), like the reference,
instead of floating above and leaving a stray line */
.form-page .lang-fieldset > legend {
width: auto;
max-width: none;
float: none;
margin: 0 0 0 16px;
padding: 5px 14px;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .6px;
color: #0C111C;
background: var(--brand);
border-radius: 8px;
border: none;
box-shadow: 0 2px 8px rgba(var(--brand-rgb),.3);
}
/* Tab bar inside the fieldset */
.form-page .lang-tabs {
display: flex !important;
flex-wrap: wrap;
gap: 4px;
list-style: none;
padding: 4px 16px 0 !important;
margin: 0 !important;
/* base theme puts a full 1px #aaa border on every ; kill it, keep only
the bottom divider under the tabs */
border: 0 !important;
border-bottom: 1px solid #eef0f4 !important;
background: transparent !important;
}
.form-page .lang-tabs .nav-item { margin: 0 !important; }
.form-page .lang-tabs .nav-link {
display: inline-flex !important;
align-items: center;
gap: 8px;
padding: 10px 18px !important;
font-size: 14px;
font-weight: 600;
color: #6b7280 !important;
border: none !important;
border-bottom: 2px solid transparent !important;
background: transparent !important;
cursor: pointer;
border-radius: 8px 8px 0 0 !important;
}
.form-page .lang-tabs .nav-link:hover { color: #1a1f2e !important; background: #f8f9fc !important; }
.form-page .lang-tabs .nav-link.active {
color: #0C111C !important;
border-bottom: 2px solid var(--brand) !important;
background: var(--brand-tint) !important;
}
.form-page .lang-tabs .nav-link .badge {
background: var(--brand) !important;
color: #0C111C !important;
font-size: 10px;
padding: 2px 7px;
border-radius: 10px;
font-weight: 700;
line-height: 1.4;
}
.form-page .lang-tabs .nav-link .badge:empty { display: none; }
.form-page .lang-fieldset .tab-content { padding: 22px 22px 4px; }
/* fields placed DIRECTLY in the language fieldset (not wrapped in .form-section
or tab-content) still need horizontal padding so they don't touch the frame */
.form-page .lang-fieldset > .form-group,
.form-page .lang-fieldset > .form-check,
.form-page .lang-fieldset > .form-hidden,
.form-page .lang-fieldset > .row,
.form-page .lang-fieldset > .how_much_div,
.form-page .lang-fieldset > .form-section { padding-left: 22px !important; padding-right: 22px !important; }
/* ── Fields (label above input) ── */
.form-page .form-group { margin-bottom: 20px; }
.form-page .control-label,
.form-page label.control-label,
.form-page label {
font-size: 13.5px !important;
font-weight: 600 !important;
color: #3b4060 !important;
margin-bottom: 7px !important;
display: block;
text-align: left !important;
padding: 0 !important;
}
.form-page .form-control,
.form-page input[type="text"].form-control,
.form-page input[type="number"].form-control,
.form-page input[type="email"].form-control,
.form-page select.form-control,
.form-page textarea.form-control {
border: 1px solid #dde0e8 !important;
border-radius: 9px !important;
padding: 11px 14px !important;
font-size: 14px !important;
color: #1a1f2e !important;
background: #fff !important;
height: auto !important;
box-shadow: none !important;
transition: border-color .15s, box-shadow .15s !important;
width: 100%;
}
.form-page .form-control:focus,
.form-page textarea.form-control:focus,
.form-page select.form-control:focus {
border-color: var(--brand) !important;
box-shadow: 0 0 0 3px rgba(var(--brand-rgb),.15) !important;
}
.form-page textarea.form-control { min-height: 110px; }
.form-page .form-text, .form-page .text-muted { font-size: 12px !important; color: #8a93a8 !important; margin-top: 6px; }
/* (base theme already adds the red asterisk via .required-field::before — don't double it) */
/* FULL-WIDTH fields: stack label over input and make EVERY field span the form.
Overrides the old half-width (.width-50) groups and the col-6/col-7 input widths. */
.form-page .form-group.row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; }
.form-page .form-group.row > .control-label,
.form-page .form-group.row > label { width: 100% !important; max-width: 100% !important; flex: none !important; }
.form-page .form-group.row > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: none !important; padding: 0 !important; }
/* half-width form groups → full width */
.form-page .form-group.width-50,
.form-page .form-group.width-100,
.form-page .width-50 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
/* inputs/selects/textareas with leftover col-* classes → full width */
.form-page .form-control,
.form-page input.form-control,
.form-page select.form-control,
.form-page textarea.form-control { width: 100% !important; max-width: 100% !important; float: none !important; }
/* the base theme centers the form wrapper at max-width:70% (big side gaps) → full width */
.form-page .row.form-layout { max-width: 100% !important; margin: 0 !important; width: 100% !important; }
.form-page .form-layout .form-layout-inner { margin: 0 !important; }
/* ── Status / standalone checkbox + radio option groups (green) ── */
.form-page .form-check {
display: flex !important; flex-wrap: wrap; align-items: center;
gap: 8px; margin: 0 0 8px 0; padding: 0; vertical-align: middle;
}
.form-page .form-check > label,
.form-page .form-check label.control-label {
width: auto !important; max-width: none !important; flex: 0 0 auto !important;
margin: 0 !important; padding-left: 0 !important; cursor: pointer; font-weight: 500;
}
/* help text under a checkbox/radio drops to its own full-width line (not squeezed right) */
.form-page .form-check > .form-text,
.form-page .form-check > .text-muted {
flex: 0 0 100% !important; width: 100% !important; margin: 4px 0 0 0 !important;
font-size: 12.5px; color: #8a90a6 !important;
}
/* a number input that sits beside a radio (Limited → Ex:1000) stays compact */
.form-page .form-check .form-control {
width: 180px !important; max-width: 180px !important; flex: 0 0 180px !important;
}
/* kill the base materialize checkbox box drawn on the label (we style the real input) */
.form-page .form-check label::before,
.form-page .form-check label::after { display: none !important; content: none !important; }
.form-page .form-check input[type="checkbox"]:not(:checked),
.form-page .form-check input[type="checkbox"]:checked,
.form-page .form-check input[type="checkbox"] {
-webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
position: static !important; left: auto !important; opacity: 1 !important;
width: 20px !important; height: 20px !important; min-width: 20px !important;
border: 1.5px solid #cbd2e0 !important; border-radius: 6px !important; background: #fff !important;
cursor: pointer !important; margin: 0 !important; display: inline-block !important; vertical-align: middle;
transition: background .15s, border-color .15s !important;
}
.form-page .form-check input[type="checkbox"]:hover { border-color: var(--brand) !important; }
.form-page .form-check input[type="checkbox"]:checked {
background: var(--brand) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%230C111C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") no-repeat center center !important;
border-color: var(--brand) !important;
}
.form-page .form-check input[type="checkbox"] + label { display: inline !important; }
/* ── Radio buttons inside form-check (base theme hides them off-screen too) ── */
.form-page .form-check input[type="radio"] {
-webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
position: static !important; left: auto !important; top: auto !important; opacity: 1 !important;
width: 19px !important; height: 19px !important; min-width: 19px !important;
border: 1.5px solid #cbd2e0 !important; border-radius: 50% !important; background: #fff !important;
cursor: pointer !important; margin: 0 !important; padding: 0 !important;
display: inline-block !important; vertical-align: middle !important; flex: 0 0 auto !important;
box-shadow: none !important; transition: background .15s, border-color .15s !important;
}
.form-page .form-check input[type="radio"]:hover { border-color: var(--brand) !important; }
.form-page .form-check input[type="radio"]:checked {
border-color: var(--brand) !important;
background: radial-gradient(var(--brand) 0 4.5px, #fff 5.5px) !important;
}
.form-page .form-check input[type="radio"] + label { padding-left: 0 !important; display: inline !important; }
/* don't let the global .width-50/.width-100 rule force inline radio-option /
number-input form-check groups to full width — only top-level field rows are full-width */
.form-page .form-check.width-50,
.form-page .form-check.width-100 { width: auto !important; max-width: none !important; flex: 0 0 auto !important; }
.form-page .d-flex { display: flex !important; align-items: center; gap: 14px; flex-wrap: wrap; }
/* our display:flex/block overrides on .form-check & .form-group.row are strong enough to
defeat Bootstrap's .d-none — restore it so JS-toggled fields stay hidden until shown */
.form-page .d-none,
.form-page .form-check.d-none,
.form-page .form-group.d-none,
.form-page .d-flex.d-none,
.form-page .form-group.row.d-none { display: none !important; }
/* ── Roles permission checkboxes (.permission / #all_permission) ── */
.form-page input[type="checkbox"].permission,
.form-page input#all_permission {
-webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
position: static !important; left: auto !important; top: auto !important; opacity: 1 !important;
width: 19px !important; height: 19px !important; min-width: 19px !important;
border: 1.5px solid #cbd2e0 !important; border-radius: 5px !important; background: #fff !important;
cursor: pointer !important; margin: 0 8px 0 0 !important; padding: 0 !important;
display: inline-block !important; vertical-align: middle !important;
box-shadow: none !important; transition: background .15s, border-color .15s !important;
}
.form-page input[type="checkbox"].permission:hover,
.form-page input#all_permission:hover { border-color: var(--brand) !important; }
.form-page input[type="checkbox"].permission:checked,
.form-page input#all_permission:checked {
background: var(--brand) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%230C111C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") no-repeat center center !important;
border-color: var(--brand) !important;
}
.form-page input[type="checkbox"].permission + label::before,
.form-page input[type="checkbox"].permission + label::after,
.form-page input#all_permission + label::before,
.form-page input#all_permission + label::after,
.form-page .control-label2::before,
.form-page .control-label2::after { display: none !important; content: none !important; }
.form-page input#all_permission + label { padding-left: 0 !important; margin: 0 !important; cursor: pointer; vertical-align: middle; }
.form-page .control-label2 {
display: inline-block !important; width: auto !important; height: auto !important;
padding: 0 24px 0 0 !important; margin: 0 0 8px 0 !important;
line-height: 19px !important; font-weight: 500; color: #3b4060;
cursor: pointer; vertical-align: middle; white-space: nowrap;
}
.form-page .role-table td { white-space: normal; vertical-align: middle; }
.form-page .role-table td strong { font-weight: 700; color: #1a1f2e; }
/* permission cell: flex so every checkbox + its label sits perfectly centered on one line */
.form-page .role-table td:has(.permission) {
display: flex; flex-wrap: wrap; align-items: center; gap: 8px 6px; padding-top: 14px; padding-bottom: 14px;
}
.form-page .role-table td:has(.permission) .permission { margin: 0 !important; top: 0 !important; }
.form-page .role-table td:has(.permission) .control-label2 {
margin: 0 20px 0 0 !important; padding: 0 !important; line-height: 19px !important; white-space: nowrap;
}
/* roles: "Assign Permissions" label + inline All-Permissions checkbox */
.form-page .assign-perm-row { margin-top: 4px; }
.form-page .assign-perm-row .form-check { margin: 6px 0 0 0; }
/* locked role (Super Administrator) → disabled checkboxes shown as clearly non-editable */
.form-page input[type="checkbox"]:disabled,
.form-page input[type="checkbox"].permission:disabled,
.form-page input#all_permission:disabled { opacity: .45 !important; cursor: not-allowed !important; background: #eef0f4 !important; }
/* ── Subscription: numeric price / limit fields a sensible moderate width (not stretched) ── */
.form-page #plan_price,
.form-page #order,
.form-page #plan_validity,
.form-page #booking_limit,
.form-page #driver_limit { max-width: 320px !important; width: 100% !important; flex: 0 0 320px !important; }
/* ── CMS & any .form-group.width-100 (no .row): stretch inner column + Summernote editor full width ── */
.form-page .form-group.width-100 > [class*="col-"],
.form-page .form-group > .col-7 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; }
.form-page textarea.col-7 { width: 100% !important; max-width: 100% !important; }
.form-page .note-editor,
.form-page .note-editor.note-frame,
.form-page .note-frame { width: 100% !important; max-width: 100% !important; }
/* ── Services "Manage prices by zone" tab block: kill stray outline/border artifacts ── */
.form-page .serice-tab-wrap { border: 0 !important; box-shadow: none !important; padding: 0 !important; margin: 22px 0 0 !important; }
.form-page .serice-tab-wrap > .card-header,
.form-page .serice-tab-wrap .nav-tabs { border: 0 !important; background: transparent !important; }
.form-page #zone-contents,
.form-page #zone-contents > .tab-pane { border: 0 !important; }
/* Non-translatable fields section (shown once, inside the fieldset below the tabs) */
.form-page .form-section { margin: 0 0 20px; padding: 0 2px; }
.form-page .lang-fieldset .form-section {
margin: 0;
padding: 8px 22px 4px;
max-width: none;
}
/* Instructions / map area */
.form-page .instructions-block h4 { font-size: 15px; font-weight: 700; color: #1a1f2e; margin-bottom: 8px; }
.form-page .instructions-block p { font-size: 13.5px; color: #5a6179; }
.form-page .instructions-block img { max-width: 100%; border-radius: 10px; margin-top: 12px; }
.form-page .zone-demo-gif { width: 100%; border-radius: 10px; border: 1px solid #e2e6ef; }
/* Equal-height GIF + map so no blank space shows between the two columns */
.form-page .zone-map-row { display: flex; flex-wrap: wrap; align-items: stretch; }
.form-page .zone-map-row > [class*="col-"] { display: flex; flex-direction: column; }
.form-page .zone-map-row .zone-demo-gif { height: 100%; min-height: 480px; object-fit: cover; flex: 1 1 auto; }
.form-page .zone-map-row .zone-map-box { flex: 1 1 auto; }
.form-page .zone-map-row .zone-map-box #map { height: 100% !important; min-height: 440px; }
/* Zone map: search on top, map below with the tool buttons overlaid top-right */
.form-page .zone-map-box { position: relative; margin-top: 12px; }
.form-page .zone-map-box #map {
width: 100% !important;
height: 480px !important;
border-radius: 10px;
overflow: hidden;
z-index: 0;
border: 1px solid #e2e6ef;
}
.form-page .zone-map-box .mapType {
position: absolute;
top: 14px;
right: 14px;
z-index: 600;
width: auto;
padding: 0;
margin: 0;
}
.form-page .zone-map-box .mapType ul { margin: 0 !important; padding: 0 !important; list-style: none; }
.form-page .zone-map-box .mapType li { margin-bottom: 8px; }
.form-page #search-box { margin-bottom: 0; }
.form-page #autocomplete-list { position: relative; z-index: 700; }
/* ── Buttons ── */
.form-page .btm-btn { margin-top: 28px; padding-top: 22px; border-top: 1px solid #eef0f4; }
.form-page .save-setting-btn,
.form-page button.btn-primary,
.form-page .btn.btn-primary {
background: var(--brand) !important;
color: #0C111C !important;
border: none !important;
border-radius: 10px !important;
padding: 11px 26px !important;
font-weight: 600 !important;
font-size: 14px !important;
box-shadow: 0 2px 10px rgba(var(--brand-rgb),.28) !important;
}
.form-page .save-setting-btn:hover,
.form-page button.btn-primary:hover,
.form-page .btn.btn-primary:hover { background: var(--brand-strong) !important; }
.form-page .btn-default {
background: #f1f3f7 !important;
color: #5a6179 !important;
border: 1px solid #e2e6ef !important;
border-radius: 10px !important;
padding: 11px 24px !important;
font-weight: 600 !important;
font-size: 14px !important;
margin-left: 8px;
}
.form-page .btn-default:hover { background: #e7eaf0 !important; }
/* ═══════════════════════════════════════════════════════════════════════
NEW-UI for pages using .form-layout but NOT wrapped in .form-page
(Reports, Settings, Payments, etc.). Scoped via
:has(.page-titles, .payment-top-tab) so it NEVER affects .form-page pages.
═══════════════════════════════════════════════════════════════════════ */
/* Header */
.row.page-titles { padding: 6px 4px 16px !important; margin: 0 0 6px !important; border-bottom: 1px solid #eef0f4; align-items: center; }
.page-titles h3.text-themecolor { font-size: 22px !important; font-weight: 700 !important; color: #0C111C !important; margin: 0 !important; }
.page-titles .breadcrumb { background: transparent !important; padding: 6px 0 0 !important; margin: 0 !important; font-size: 13px; }
.page-titles .breadcrumb-item a { color: var(--brand) !important; text-decoration: none; }
.page-titles .breadcrumb-item.active { color: #8a93a8 !important; }
/* Card — borderless so the fieldset is the ONLY frame (no double border), like badges/save */
.page-wrapper:has(.page-titles, .payment-top-tab) .card { border: none !important; border-radius: 0 !important; box-shadow: none !important; background: transparent !important; }
/* Full width — kill the base 70% centered gap on left/right */
.page-wrapper:has(.page-titles, .payment-top-tab) .row.form-layout { max-width: 100% !important; width: 100% !important; margin: 0 !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-layout-inner { margin: 0 !important; width: 100% !important; }
/* Fieldset frame + GREEN legend (2-column flex layout inside) */
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) {
border: 1px solid #e2e6ef !important; border-radius: 12px !important;
padding: 22px !important; margin: 22px 0 24px !important; min-width: 0;
display: flex !important; flex-wrap: wrap !important; gap: 0 22px !important;
align-content: flex-start; align-items: flex-start;
}
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > * { flex: 0 0 100%; max-width: 100%; }
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > legend {
display: inline-block !important; width: auto !important; max-width: max-content !important;
padding: 7px 18px !important; margin-bottom: 12px !important;
background: var(--brand) !important; color: #0C111C !important; border: none !important;
border-radius: 8px !important; font-size: 12px !important; font-weight: 700 !important;
letter-spacing: .5px !important; text-transform: uppercase !important;
box-shadow: 0 2px 8px rgba(var(--brand-rgb),.3) !important;
}
/* remove the icon that used to sit inside the legend */
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset > legend i,
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset > legend .mdi,
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset > legend .fa { display: none !important; }
/* 2 fields per row: .width-50 = half, everything else full row */
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > .form-group.width-50,
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > .form-check.width-50 {
flex: 0 0 calc(50% - 11px) !important; max-width: calc(50% - 11px) !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > button,
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > .btn,
.page-wrapper:has(.page-titles, .payment-top-tab) fieldset:not(.lang-fieldset) > a.btn { flex: 0 0 auto !important; align-self: flex-start; }
/* Inputs / selects / textareas */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-control {
border: 1px solid #e2e6ef !important; border-radius: 10px !important;
padding: 10px 14px !important; height: auto !important; box-shadow: none !important; width: 100% !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .form-control:focus {
border-color: var(--brand) !important; box-shadow: 0 0 0 3px rgba(var(--brand-rgb),.15) !important;
}
/* Label-above-input inside each field */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group.row { margin: 0 0 18px !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group.row > label,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group.row > .control-label { display: block !important; width: 100% !important; margin-bottom: 8px !important; font-weight: 600 !important; color: #3b4060 !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group.row > [class*="col-"] { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding: 0 !important; }
/* dynamic "add more" rows (schedule notification) — two fields + delete inline */
.page-wrapper:has(.page-titles, .payment-top-tab) .option-row { display: flex !important; flex-wrap: nowrap !important; gap: 14px !important; align-items: flex-start !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .option-row > .form-group { flex: 1 1 0 !important; margin: 0 !important; }
/* Buttons: primary → theme green; delete-icon buttons → compact red */
.page-wrapper:has(.page-titles, .payment-top-tab) .btn-primary {
background: var(--brand) !important; color: #0C111C !important; border: none !important;
border-radius: 10px !important; padding: 10px 24px !important; font-weight: 600 !important;
box-shadow: 0 2px 10px rgba(var(--brand-rgb),.28) !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .btn:has(> i.mdi-delete),
.page-wrapper:has(.page-titles, .payment-top-tab) .btn:has(> i.fa-trash) {
background: #fdecec !important; color: #e05454 !important; border: 1px solid #f6c9c9 !important;
width: 42px !important; height: 42px !important; min-width: 42px !important; padding: 0 !important;
border-radius: 10px !important; box-shadow: none !important; font-weight: 400 !important;
display: inline-flex !important; align-items: center !important; justify-content: center !important; font-size: 16px !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .btn:has(> i.mdi-delete) i,
.page-wrapper:has(.page-titles, .payment-top-tab) .btn:has(> i.fa-trash) i { color: #e05454 !important; margin: 0 !important; }
/* ---- Extra fixes for old-UI (page-titles / payment) pages ---- */
/* Cancel / Back button (btn-default) -> neutral gray (was blue) */
.page-wrapper:has(.page-titles, .payment-top-tab) .btn-default {
background: #f1f3f7 !important; color: #5a6179 !important; border: 1px solid #e2e6ef !important;
border-radius: 10px !important; padding: 10px 22px !important; font-weight: 600 !important; box-shadow: none !important;
}
/* button row sits clearly below the fields */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group.col-12.text-center,
.page-wrapper:has(.page-titles, .payment-top-tab) .btm-btn { flex: 0 0 100% !important; width: 100% !important; margin-top: 18px !important; padding-top: 6px !important; }
/* Checkboxes aligned + green (like create/edit forms) */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check { display: flex !important; align-items: center; gap: 10px; padding: 0; margin: 0 0 8px 0; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check > label,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check label.control-label { width: auto !important; max-width: none !important; margin: 0 !important; padding-left: 0 !important; font-weight: 500 !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check label::before,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check label::after { display: none !important; content: none !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check input[type="checkbox"] {
-webkit-appearance: none !important; -moz-appearance: none !important; appearance: none !important;
position: static !important; left: auto !important; opacity: 1 !important;
width: 20px !important; height: 20px !important; min-width: 20px !important;
border: 1.5px solid #cbd2e0 !important; border-radius: 6px !important; background: #fff !important;
cursor: pointer !important; margin: 0 !important; display: inline-block !important; vertical-align: middle;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check input[type="checkbox"]:checked {
background: var(--brand) url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%230C111C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.5l2.5 2.5 4.5-5'/%3E%3C/svg%3E") no-repeat center center !important;
border-color: var(--brand) !important;
}
/* Payment: 2 fields per row (their fields are width-100) */
.page-wrapper:has(.payment-top-tab) fieldset:not(.lang-fieldset) > .form-group.width-100,
.page-wrapper:has(.payment-top-tab) fieldset:not(.lang-fieldset) > .form-check.width-100 {
flex: 0 0 calc(50% - 11px) !important; max-width: calc(50% - 11px) !important;
}
/* Payment tabs: themed selected tab + Active badges follow theme color */
.page-wrapper:has(.payment-top-tab) .payment-top-tab .nav-link { border-radius: 10px !important; color: #5a6179 !important; font-weight: 600; border: 1px solid transparent !important; }
.page-wrapper:has(.payment-top-tab) .payment-top-tab .nav-link.active { background: var(--brand) !important; color: #0C111C !important; border-color: var(--brand) !important; }
.page-wrapper:has(.payment-top-tab) .payment-top-tab .nav-link:not(.active) .badge { background: var(--brand) !important; color: #0C111C !important; }
.page-wrapper:has(.payment-top-tab) .payment-top-tab .nav-link.active .badge { background: rgba(12,17,28,.85) !important; color: #fff !important; }
/* ---- Round 2 fixes for old-UI (page-titles / payment) pages ---- */
/* 1. Side spacing for pages whose .card-body is a DIRECT child of page-wrapper
(businessModel, schedule) so they match the container-fluid pages (Global) */
.page-wrapper:has(.page-titles) > .card-body { padding-left: 24px !important; padding-right: 24px !important; }
/* 2. Payment tab hover -> theme tint (was black) */
.page-wrapper:has(.payment-top-tab) .payment-top-tab .nav-link:not(.active):hover {
background: var(--brand) !important; color: #0C111C !important; border-color: var(--brand) !important;
}
/* 3. Privacy / Terms language tabs (in .card-header) -> clean new-UI tabs */
.page-wrapper:has(.page-titles) .card-header { background: transparent !important; border: none !important; padding: 0 0 2px !important; }
.page-wrapper:has(.page-titles) .card-header .nav-tabs { border: none !important; border-bottom: 1px solid #eef0f4 !important; background: transparent !important; }
.page-wrapper:has(.page-titles) .card-header .nav-tabs .nav-item { margin: 0 !important; }
.page-wrapper:has(.page-titles) .card-header .nav-tabs .nav-link { border: none !important; background: transparent !important; color: #5a6179 !important; font-weight: 600 !important; padding: 10px 18px !important; border-radius: 0 !important; }
.page-wrapper:has(.page-titles) .card-header .nav-tabs .nav-link.active { color: #0C111C !important; border-bottom: 2px solid var(--brand) !important; background: transparent !important; }
/* 4. Help text under fields -> left-aligned, full-width */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-text,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-group .text-muted {
display: block !important; width: 100% !important; margin: 6px 0 0 0 !important; padding-left: 0 !important;
font-size: 12.5px !important; color: #8a90a6 !important; text-align: left !important;
}
/* 5. Color pickers -> show a real swatch (the .form-control rule was collapsing them to a line) */
.page-wrapper:has(.page-titles, .payment-top-tab) input[type="color"] {
width: 56px !important; min-width: 56px !important; height: 40px !important; flex: 0 0 56px !important;
padding: 3px !important; border: 1px solid #e2e6ef !important; border-radius: 8px !important;
background: #fff !important; cursor: pointer !important; box-shadow: none !important;
}
/* Currency-prefixed inputs (.control-inner + .currentCurrency $ box) — realign with
the taller new input; my .form-control padding had overridden the base padding-left */
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner { position: relative; }
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner > .form-control.referral_amount,
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner > .form-control.currency_input { height: 44px !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner > .currentCurrency {
top: 1px !important; left: 1px !important; bottom: auto !important; height: 42px !important;
width: 44px !important; max-width: 44px !important; line-height: normal !important;
display: flex !important; align-items: center !important; justify-content: center !important;
background: #f1f3f7 !important; color: #5a6179 !important; font-weight: 600 !important;
border-radius: 9px 0 0 9px !important; border-right: 1px solid #e2e6ef !important; padding: 0 !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner > .form-control.referral_amount,
.page-wrapper:has(.page-titles, .payment-top-tab) .control-inner > .form-control.currency_input {
padding-left: 56px !important;
}
/* Language tabs moved INSIDE the fieldset (Privacy / Terms) — style like the multilingual forms */
.page-wrapper:has(.page-titles) fieldset .lang-tabs,
.page-wrapper:has(.page-titles) fieldset ul#language-tabs {
display: flex !important; flex: 0 0 100% !important; width: 100% !important; list-style: none !important;
padding: 0 !important; margin: 0 0 20px !important; gap: 4px;
border: none !important; border-bottom: 1px solid #eef0f4 !important; background: transparent !important;
}
.page-wrapper:has(.page-titles) fieldset .lang-tabs .nav-item { margin: 0 !important; }
.page-wrapper:has(.page-titles) fieldset .lang-tabs .nav-link {
border: none !important; background: transparent !important; color: #5a6179 !important;
font-weight: 600 !important; padding: 10px 18px !important; border-radius: 0 !important;
}
.page-wrapper:has(.page-titles) fieldset .lang-tabs .nav-link.active {
color: #0C111C !important; border-bottom: 2px solid var(--brand) !important; background: transparent !important;
}
.page-wrapper:has(.page-titles) fieldset .lang-tabs .nav-link .badge {
background: var(--brand) !important; color: #0C111C !important;
}
/* Remove the Back/Cancel button on all payment method pages */
.page-wrapper:has(.payment-top-tab) .btn-default { display: none !important; }
/* Consistent SMALL icon-text gap on all Save/buttons (the base .btm-btn i.fa
margin-right:10px made some buttons have a big gap).
Exclude .btn-default so the hidden payment Back button stays hidden. */
.page-wrapper:has(.page-titles, .payment-top-tab) .btn:not(.btn-default) {
display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .btn i,
.page-wrapper:has(.page-titles, .payment-top-tab) .btn i.fa,
.page-wrapper:has(.page-titles, .payment-top-tab) .btm-btn.form-group i.fa { margin: 0 !important; }
/* Help text inside a form-check (e.g. COD "Enable" note) drops full-width below,
instead of being squeezed into a narrow vertical column */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check { flex-wrap: wrap !important; }
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check > .form-text,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check > .text-muted {
flex: 0 0 100% !important; width: 100% !important; margin: 5px 0 0 0 !important;
font-size: 12.5px !important; color: #8a90a6 !important; text-align: left !important;
}
/* Payment method: supported-currency note box */
.page-wrapper:has(.payment-top-tab) .payment-currency-note {
display: flex; align-items: flex-start; gap: 10px; width: 100%;
background: rgba(var(--brand-rgb), .08);
border: 1px solid rgba(var(--brand-rgb), .28);
border-radius: 10px; padding: 12px 14px; margin-top: 4px;
font-size: 13px; color: #3b4060; line-height: 1.5;
}
.page-wrapper:has(.payment-top-tab) .payment-currency-note i { color: var(--brand); font-size: 16px; margin-top: 1px; flex-shrink: 0; }
.page-wrapper:has(.payment-top-tab) .payment-currency-note a { color: var(--brand); font-weight: 700; text-decoration: underline; }
/* Currency note: force the whole note field full-width & center it at the bottom.
Higher specificity than the 2-per-row rule that was keeping it at 50% in the right column. */
.page-wrapper:has(.payment-top-tab) fieldset:not(.lang-fieldset) > .form-group.width-100:has(.payment-currency-note),
.page-wrapper:has(.payment-top-tab) fieldset > .form-group:has(.payment-currency-note) {
flex: 0 0 100% !important; max-width: 100% !important; width: 100% !important; margin-top: 8px !important;
display: flex !important; justify-content: center !important; align-items: center !important;
}
.page-wrapper:has(.payment-top-tab) .payment-currency-note {
display: inline-flex !important; justify-content: center !important; text-align: center !important;
width: fit-content !important; max-width: 100% !important; margin: 6px auto 0 !important;
}
/* Detail-page info boxes: bordered card + brand-tint filled heading bar
(ported from owner panel — General Details / Billing Details / Map View headers) */
.page-wrapper:has(.page-titles, .payment-top-tab) .card:has(.card-header.bg-white) {
border: 1px solid #e6e9f0 !important;
border-radius: 12px !important;
background: #fff !important;
box-shadow: 0 1px 3px rgba(16, 24, 40, .05) !important;
overflow: hidden;
margin-bottom: 20px;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .card-header.bg-white {
background: var(--brand-tint) !important;
border-bottom: 1px solid #e6e9f0 !important;
padding: 14px 18px !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .card-header.bg-white h3 {
border-left: none !important; border-right: none !important;
padding-left: 0 !important; padding-right: 0 !important;
margin: 0 !important; color: #0C111C !important;
font-size: 16px !important; font-weight: 700 !important;
}
/* Checkbox rows WITHOUT a help block (e.g. Maintenance Mode) — keep the box + label on ONE line.
Rows that carry a .text-muted / .form-text help (e.g. COD) keep their wrap so the help drops below. */
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check:not(:has(.text-muted, .form-text)) {
display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important;
align-items: center !important; gap: 10px !important;
}
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check:not(:has(.text-muted, .form-text)) > label,
.page-wrapper:has(.page-titles, .payment-top-tab) .form-check:not(:has(.text-muted, .form-text)) > label.control-label {
flex: 1 1 auto !important; width: auto !important; max-width: none !important; margin: 0 !important;
}
|