:root {
    /* Colors */
    --pri-color: rgb(0, 130, 105);
    --primary-1: #1e6eb4;
    --dark-primary-1: #0a4b84;
    --light-primary-1: #4188c7;
    --lighter-primary-1: #c3def5;
    --secondary-1: #6b6a69;
    --sec-color:#2c2c2c;
    --light-secondary-1: #818181;
    --dark-secondary-1: #616161;
    --dark-secondary-2: #555555;
    --white: #fff;
    --black: rgb(0, 0, 0);
    --smoke-gray-1: #f5f5f5;
    --smoke-gray-2: #ccc;
    --smoke-gray-3: #e4e5ec;
    --smoke-gray-4: #dbdade;
    --smoke-blue-1: #f2f5f7;
    --gray-1: #525252;
    --gray-2: #999;
    --gray-3: #adacac;
    --gray-4: #858585;
    --gray-5: #a1a1a1;
    --dark-gray-1: #333333;
    --info-1: #007fda;
    --info-2: #0069b4;
    --info-3: #0a99ff;
    --warning-1: #e45b00;
    --warning-2: #FF9800;
    --warning-3: #e48900;
    --warning-4: #ffa723;
    --redish-1: #f5291a;
    --redish-2: #d62215;
    --redish-3: #ff3d2f;
    --purple-1: #9C27B0;
    --purple-2: #7f0096;
    --purple-3: #b433ca;
    --danger-1: #da122c;
    --danger-2: #ff0022;
    --danger-3: #ff0d2d;
    --danger-4: #c20a22;
    --success-1: #008b38;
    --success-2: #00aa44;
    --success-3: #006e2c;
    --success-4: #28c76f;
    --greenish-1: #717e00;

    /* Transparent Colors */
    --transparent: transparent;
    --transparent-primary-1: #1e6eb475;
    --transparent-primary-2: #1e6eb459;
    --transparent-primary-3: #4188c7;
    --transparent-primary-4: #1e6eb466;
    --transparent-white-1: #ffffff6e;
    --transparent-white-2: #ffffff2b;
    --transparent-white-3: #ffffffe3;
    --transparent-white-4: #ffffff0f;
    --transparent-black-1: rgb(49 49 49 / 50%);    
    --transparent-gray-1: #cfcfcf69;    
    --transparent-secondary-1: #6b6a69;

    /* Side Menu Background */
    --bg-nav: #222222;

    /* Pace Progress Loader */
    --pace-progress: #1e6eb4;

    /* Nav Menu Transition */
    --nav-menu-transition: 300ms ease all;
    --hover-transition: 300ms;

    /* Fonts */
    --heading-font-family: "Maven Pro", sans-serif;
    --button-font-family: "Quicksand", sans-serif;
    --text-font-family: "Open Sans", sans-serif;
    
    --footer-shadow: 0 -5px 10px rgb(0 0 0 / 7%);
    --header-shadow-2: 0px 3px 10px rgb(0 0 0 / 10%);
    --header-shadow-1: 0 4px 8px 0 rgb(0 0 0 / 5%), 0 6px 20px 0 rgb(0 0 0 / 5%);

    --primary-radial-1: radial-gradient(circle, #83c1f7 0%, #1e6eb4 50%, #00396b 100%);
    --grey-radial-1: radial-gradient(circle, #ffffff 0%, #e2e1e1 100%);
    --card-shadow-2: 0 5px 10px rgb(0 0 0 / 15%);
    --card-shadow-7: rgb(100 100 111 / 20%) 0px 7px 10px 0px;


    /* --blue: #1e9ff2;
    --blue1: #0d6efd;
    --blue-dark-c: blue;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #e83e8c;
    --red: #f7213d;
    --l-red: #ff1c1c;
    --error-c: #f30000;
    --orange: #ff9149;
    --yellow: #ffc107;
    --dark-green: #18ad00;
    --green: #28d094;
    --green1: #088408;
    --green2: #2ecc71;
    --teal: #20c997;
    --cyan: #f8a63c;
    --black1: #212121;
    --trans-white: #ffffffc7; 
    --gray: #505050;
    --gray-dark: #464855;
    --success: #28d094;
    --smoke-3: #E4E5EC;
    --smoke-4: #e3ebf3;
    --info: #0d6efd;
    --warning: #ff9149;
    --danger: #ff4961;
    --light: #babfc7;
    --dark: #464855;
    --grayish-black: #414143;
    --red-transparency: #ff1e1e12;
    --info-transparency: #1e9ff233;
    --warning-transparency: #ff914961;
    --transparent: #ffffff00;
    --border-color: #cacfe7;
    --border-color-1: #acacac;
    --border-light-color: #eeeeee;
    --placeholder: #999;
    --overlay1: #eeeeee94;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-family-monospace: "Quicksand", Georgia, "Times New Roman", Times, serif;
    --card-shadow-1: rgba(0, 0, 0, 0.15) 0px 1px 9px 0px;
    --card-shadow-2: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
    --btn-shadow-1: rgba(99, 99, 99, 0.3) 0px 2px 8px 0px; */
}

p{
            text-align: justify;
        }
        .logo img{
             margin-top: 0 !important;
            width:159px !important;
        }
        .headeromj {
            background-color: #c8c8c8;
            padding: 10px;
            font-size: 1.75rem !important;
        }
        .headerTopper {
            display: flex; justify-content: center; margin-top: 0.5rem;
        }
        .cntomj,.subtxtomj,.headeromj {
            width: 100%;
        }
        .headerTopImg {
            justify-content: center; align-content: center;
        }
        @media (max-width: 767px) {
            .logo img{
                width:80px !important;
            }
            .headeromj {
                font-size: 1.25rem !important;
            }
            .subtxtomj {
                font-size: 1rem !important;
            }
            .cntomj {
                font-size: 14px !important;
            }
            .filter_data {
                padding: 6px 6px !important;
            }
            .statsAccordion .card-body {
                padding: 0 !important;
            }
            .statsAccordion .card-title {
                opacity: 0.8 !important;
                font-size: 15px !important;
            }
        }
        a {
  color: #92badd;
  display:inline-block;
  text-decoration: none;
  font-weight: 400;
}

h2 {
  text-align: center;
  font-size: 16px;
  font-weight: 600;
  text-transform: uppercase;
  display:inline-block;
  margin: 40px 8px 10px 8px; 
  color: #cccccc;
}



/* STRUCTURE */

.wrapper {
  display: flex;
  align-items: center;
  flex-direction: column; 
  justify-content: center;
  width: 100%;
  min-height: 100%;
  padding: 20px;
  position: relative;
  top: 0px;
}

#formContent {
  -webkit-border-radius: 10px 10px 10px 10px;
  border-radius: 10px 10px 10px 10px;
  background: #fff;
  padding: 30px;
  width: 90%;
  max-width: 450px;
  position: relative;
  padding: 0px;
  -webkit-box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  box-shadow: 0 30px 60px 0 rgba(0,0,0,0.3);
  text-align: center;
}

#formFooter {
  background-color: #f6f6f6;
  border-top: 1px solid #dce8f1;
  padding: 25px;
  text-align: center;
  -webkit-border-radius: 0 0 10px 10px;
  border-radius: 0 0 10px 10px;
}



/* TABS */

h2.inactive {
  color: #cccccc;
}

h2.active {
  color: #0d0d0d;
  border-bottom: 2px solid #5fbae9;
}



/* FORM TYPOGRAPHY*/

input[type=button], input[type=submit], input[type=reset]  {
    background-color: #009688;
    border: 1px solid #009688 !important;
    color: #ffffff;
    border: none;
    padding: 13px 30px;
    font-size: 1em;
    cursor: pointer;
    border-radius: 5px;
    flex: 1;
    margin-top: 5px;
}

input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover  {
  opacity: 0.8;
}

input[type=button]:active, input[type=submit]:active, input[type=reset]:active  {
  -moz-transform: scale(0.95);
  -webkit-transform: scale(0.95);
  -o-transform: scale(0.95);
  -ms-transform: scale(0.95);
  transform: scale(0.95);
}

/* input[type=text] {
  background-color: #f6f6f6;
  border: none;
  color: #0d0d0d;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 5px;
  width: 85%;
  border: 2px solid #f6f6f6;
  -webkit-transition: all 0.5s ease-in-out;
  -moz-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;
}

input[type=text]:focus {
  background-color: #fff;
  border-bottom: 2px solid #5fbae9;
} */

input[type=text]:placeholder,input[type=email]:placeholder,input[type=number]:placeholder,input[type=password]:placeholder {
  color: #cccccc;
}



/* ANIMATIONS */

/* Simple CSS3 Fade-in-down Animation */
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/* Simple CSS3 Fade-in Animation */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fadeIn {
  opacity:0;
  -webkit-animation:fadeIn ease-in 1;
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fadeIn.first {
  -webkit-animation-delay: 0.4s;
  -moz-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

.fadeIn.second {
  -webkit-animation-delay: 0.6s;
  -moz-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

.fadeIn.third {
  -webkit-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

.fadeIn.fourth {
  -webkit-animation-delay: 1s;
  -moz-animation-delay: 1s;
  animation-delay: 1s;
}

/* Simple CSS3 Fade-in Animation */
.underlineHover:after {
  display: block;
  left: 0;
  bottom: -10px;
  width: 0;
  height: 2px;
  background-color: #56baed;
  content: "";
  transition: width 0.2s;
}

.underlineHover:hover {
  color: #0d0d0d;
}

.underlineHover:hover:after{
  width: 100%;
}



/* OTHERS */

*:focus {
    outline: none;
} 

#icon {
  width:60%;
}

.adminLogo{
        width: 220px;
    }
    .green{
        background-color: #009688;
    }
    /* .green{
        background-color: #008E47;
    } */    
    .yellow{
        background-color: #FF8B13;
    }
    .blue{
        background-color: #1E6EB4;
    }
    .admin{
        display:inline-block;
        color:white;
        padding:5px;
    }
    .navbar {
        padding: 1rem 2rem; 
    }
    .nav-link {
        font-size: 1.2rem; 
        margin-left: 2rem; 
    }
    .nav-link.active {
        font-weight: bold;
    }
    .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover{
        color:#009688;
    }
    .active{
        color:#009688 !important;
    }
    .toast-header {
        justify-content: space-between;
        flex-shrink: 0;
    }
    .daterangepicker .ranges li.active {
        background-color: #009688 !important;
        color: white !important;
    }
    .daterangepicker td.active, .daterangepicker td.active:hover {
        background-color: #009688 !important;
        color: white !important;
    }
    .accordion-button:not(.collapsed) {
        color: #009688 !important;
        background-color: #d4faf6 !important;
    }
    
    .page-link {
        color: #009688 !important;
    }
    
    .page-item.active .page-link {
        background-color: #009688 !important;
        border-color: #009688 !important;
        color: white !important;
    }
    
    .dropzone {
        border: 2px dashed #009688 !important;
    }
    
    .dropzone.error {
        border: 2px dashed red !important;
    }
    
    .dz-message .text {
        color: #009688;
    }
    
  .divider {                /* minor cosmetics */
            display: table; 
            font-size: 18px; 
            text-align: center; 
            width: 95%;             /* divider width */
            margin: 10px auto;          /* spacing above/below */
        }
        .divider span { display: table-cell; position: relative; }
        .divider span:first-child, .divider span:last-child {
            width: 50%;
            top: 13px;              /* adjust vertical align */
            -moz-background-size: 100% 2px;   /* line width */
            background-size: 100% 2px;      /* line width */
            background-position: 0 0, 0 100%;
            background-repeat: no-repeat;
        }
        .divider span:first-child {       /* color changes in here */
            background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), to(#c3c3c3));
            background-image: -webkit-linear-gradient(180deg, transparent, #c3c3c3);
            background-image: -moz-linear-gradient(180deg, transparent, #c3c3c3);
            background-image: -o-linear-gradient(180deg, transparent, #c3c3c3);
            background-image: linear-gradient(90deg, transparent, #c3c3c3);
        }
        .divider span:nth-child(2) {
            color: #c3c3c3; padding: 0px 5px; width: auto; white-space: nowrap;
        }
        .divider span:last-child {        /* color changes in here */
            background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#c3c3c3), to(transparent));
            background-image: -webkit-linear-gradient(180deg, #c3c3c3, transparent);
            background-image: -moz-linear-gradient(180deg, #c3c3c3, transparent);
            background-image: -o-linear-gradient(180deg, #c3c3c3, transparent);
            background-image: linear-gradient(90deg, #c3c3c3, transparent);
        }
        .footer
{
width:100%;
display: flex;
background-color:#2b2b2b;
padding:20px 0;
position: absolute;
    bottom: 0px;
    justify-content: center;
    align-items: center;
    align-self: center;
    top: unset;
}
.footer img {
    width: 150px;
}

.modal-backdrop+.modal-backdrop {
    z-index: 1065 !important;
}

#changeFModal {
    z-index: 1070 !important;
}

#changeAreaFModal {
    z-index: 1070 !important;
}

#sendRashanFModal {
    z-index: 1070 !important;
}

#cashFlowFModal {
    z-index: 1070 !important;
}

#riderFModal {
    z-index: 1070 !important;
}

.buttons-excel {
    color: white;
    background-color: #198754 !important;
}

.buttons-pdf {
    color: #000;
    background-color: #ffc107 !important;
}

.buttons-print {
    color: white;
    background-color: #0d6efd !important;
}
.dt-buttons {
    margin-bottom: 20px;
}

.margenda {
    background-color: #b41ea5;
}

.brownish {
    background-color: #915601;
}

#table__server tbody tr {
    padding: 0;
    position: relative;
    width: 100%;
    background: var(--white);
    z-index: 1;
    border-radius: 12px;
    box-shadow: var(--card-shadow-7);
    overflow: hidden;
    aspect-ratio: unset;
    height: 100%;
}

#table__server tbody tr {
    padding: 0;
    position: relative;
    width: 100%;
    background: var(--white);
    z-index: 1;
    border-radius: 12px;
    box-shadow: var(--card-shadow-7);
    overflow: hidden;
    aspect-ratio: unset;
    height: 100%;
    margin-bottom: 24px;
    border-width: 0;
}

#table__server tbody {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding-left: 4px;
    padding-right: 4px;
}

#table__server thead {
    display: none;
}

/* #maincont .table-server tbody tr td:nth-child(1) {
    display: block;
    background-color: var(--pri-color);
    width: 100%;
    text-align: center;
    padding: 10px 0;
    font-size: 18px;
    color: var(--white-color);
} */

/* #maincont .table-server tbody tr td:nth-child(n+2):nth-last-child(n+2) { */
#table__server tbody tr td {
    border: 1px solid var(--smoke-gray-4) !important;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    min-width: 100% !important;
    width: 100% !important;
    text-align: left !important;
}

#table__server tbody tr td label {
    font-size: 16px;
    padding: 3px 6px;
    width: 40%;
    min-width: 40%;
    display: flex;
    background-color: #eeeeee;
    align-items: center;
    font-weight: bold;
    font-family: var(--heading-font-family);
}

#table__server tbody tr td label>span {
    font-weight: bold;
    font-family: var(--heading-font-family);
}

#table__server tbody tr td>span {
    font-size: 16px;
    width: 60%;
    min-width: 60%;
    display: flex;
    align-items: center;
    padding: 3px 6px;
}

#table__server tbody tr td:nth-last-child(2) {
    border-bottom: 0 !important;
}

#table__server tbody tr td:nth-last-child(1).actionscol {
    padding: 0;
    display: flex;
    justify-content: space-evenly;
    max-height: 50px;
    line-height: 50px;
    bottom: 0;
    background-color: var(--smoke-gray-3);
    left: 0px;
    width: 100%;
    text-align: center;
    font-size: 27px;
    color: var(--white);
    border-bottom: 0;
}

#table__server tbody tr td:nth-last-child(1).contentsol {
    line-height: 30px;
    font-size: 20px;
}



#table__server tbody tr td:nth-last-child(1).actionscol button,#table__server tbody tr td:nth-last-child(1).actionscol a {
    width: 50%;
    color: var(--white) !important;
    padding: 6px 0 !important;
    flex: 1;
    border-radius: 0;
}

#table__server tbody tr td:nth-last-child(1).actionscol .icon-btn-group {
    width: 100%;
    gap: 1px;
}

#table__server.dataTable {
    width: 100% !important;
}

#table__server colgroup col {
    width: 100% !important;
}
#table__server tbody tr td:nth-child(1) {
    font-weight: 600;
    display: block;
    background-color: var(--pri-color);
    width: 100% !important;
    text-align: center !important;
    padding: 5px 0;
    font-size: 18px;
    color: #ffffff;
}

@media screen and (min-width: 701px) {
    #table__server tbody {
        justify-content: space-between;
    }
    
    #table__server tbody tr {
        flex-basis: 48%;
    }
    
}

.text-indigo {
    color: #6610f2;
}