.table-responsive {
  padding: 20px;
  /* background: #f8fafb; */
  background: #fff;
}

.table {
  border-spacing: 0 0.85rem !important;
}

.table .dropdown {
  display: inline-block;
}

.app-container {
  width: fit-content;
  min-width: 99vw;
}

.table td,
.table th {
  vertical-align: middle;
  margin-bottom: 10px;
  border: none;
}

.icon_img {
  height: 15px;
  width: 15px;
  object-fit: contain;
}

.table thead tr,
.table thead th {
  border: none;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  background: transparent;
}

.table td {
  background: #fff;
}

.table td:first-child {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

.table td:last-child {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.avatar {
  width: 2.75rem;
  height: 2.75rem;
  line-height: 3rem;
  border-radius: 50%;
  display: inline-block;
  background: transparent;
  position: relative;
  text-align: center;
  color: #868e96;
  font-weight: 700;
  vertical-align: bottom;
  font-size: 1rem;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.avatar-sm {
  width: 2.5rem;
  height: 2.5rem;
  font-size: 0.83333rem;
  line-height: 1.5;
}

.avatar-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.avatar-blue {
  background-color: #c8d9f1;
  color: #467fcf;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role='row'] > td:first-child:before,
table.dataTable.dtr-inline.collapsed > tbody > tr[role='row'] > th:first-child:before {
  top: 28px;
  left: 14px;
  border: none;
  box-shadow: none;
}

table.dataTable.dtr-inline.collapsed > tbody > tr[role='row'] > td:first-child,
table.dataTable.dtr-inline.collapsed > tbody > tr[role='row'] > th:first-child {
  padding-left: 48px;
}

table.dataTable > tbody > tr.child ul.dtr-details {
  width: 100%;
}

table.dataTable > tbody > tr.child span.dtr-title {
  min-width: 50%;
}

table.dataTable.dtr-inline.collapsed > tbody > tr > td.child,
table.dataTable.dtr-inline.collapsed > tbody > tr > th.child,
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {
  padding: 0.75rem 1rem 0.125rem;
}

div.dataTables_wrapper div.dataTables_length label,
div.dataTables_wrapper div.dataTables_filter label {
  margin-bottom: 0;
}

@media (max-width: 767px) {
  div.dataTables_wrapper div.dataTables_paginate ul.pagination {
    -ms-flex-pack: center !important;
    justify-content: center !important;
    margin-top: 1rem;
  }
}

.btn-icon {
  background: #fff;
}
.btn-icon .bx {
  font-size: 20px;
}

.btn .bx {
  vertical-align: middle;
  font-size: 20px;
}

.dropdown-menu {
  padding: 0.25rem 0;
}

.dropdown-item {
  padding: 0.5rem 1rem;
}

.badge {
  padding: 0.5em 0.75em;
}

.badge-success-alt {
  background-color: #d7f2c2;
  color: #7bd235;
}

.table a {
  color: #212529;
}

.table a:hover,
.table a:focus {
  text-decoration: none;
}

table.dataTable {
  margin-top: 12px !important;
}

.icon > .bx {
  display: block;
  min-width: 1.5em;
  min-height: 1.5em;
  text-align: center;
  font-size: 1.0625rem;
}

.btn {
  font-size: 0.9375rem;
  font-weight: 500;
  padding: 0.5rem 0.75rem;
}

.avatar-blue {
  background-color: #c8d9f1;
  color: #467fcf;
}

.avatar-pink {
  background-color: #fcd3e1;
  color: #f66d9b;
}
.userDetailsModal .modal-body h4 {
  font-weight: 500;
  margin-bottom: 15px;
  text-transform: uppercase;
  font-size: 20px;
}
.userDetailsModal .modal-body h4 {
  font-size: 16px;
}
.userDetailsModal .modal-body h6 > span:nth-child(1) {
  font-weight: 500;
}
.bootstrap-tagsinput .tag.label {
  background-color: #2591ff;
  color: rgb(255, 255, 255);
  padding: 2px 7px;
  border-radius: 5px;
}
.note-placeholder {
  display: none !important;
}

.error_msg {
  padding: 0 10px;
  color: #dd0000;
  font-weight: 600;
  font-size: 16px;
}

.app-sidebar .scrollbar-sidebar {
  /* background-color: #1d293e; */
  /* background-color: #eaedef; */
}

.agent_image {
  border-radius: 100%;
  height: 160px;
  width: 160px;
  object-fit: cover;
}

.main-card a {
  color: black;
  text-decoration: none;
}

.vertical-nav-menu li a,
.vertical-nav-menu ul > li > a {
  text-decoration: none;
  color: white;
}

.vertical-nav-menu li a:hover {
  background-color: transparent;
}
.vertical-nav-menu i.metismenu-state-icon,
.vertical-nav-menu i.metismenu-icon {
  opacity: 1;
}
.app-sidebar__heading {
  color: #3f6ad8;
}
.vertical-nav-menu ul > li > a:hover {
  color: white;
}
.app-header.header-shadow {
  box-shadow: none;
}
.app-theme-white .app-footer .app-footer__inner,
.app-theme-white .app-header {
  background-color: transparent;
}
.agent_drop {
  border: none;
  /* background: linear-gradient(to right, #3f6ad8, #6fa1ff); */
  border-radius: 7px;
  box-shadow: 0px 0px 10px rgb(0, 0, 0, 0.03);
  transition: all 0.3s ease-in-out;
}

.agent_drop.active,
.agent_drop:hover {
  background: linear-gradient(to right, #0059ff, #0048ff);
  position: relative;
}
.agent_drop.active::before {
  position: absolute;
  top: 0px;
  left: 5px;
  width: 10px;
  height: 100%;
  background-color: white;
}

.vertical-nav-menu li a:hover i.metismenu-icon {
  opacity: 1;
}
.scrollable_nav {
  overflow: auto !important;
}
.sub_metrics .main-card {
  background-image: linear-gradient(to right, rgb(255, 255, 255, 0.8), rgb(255, 255, 255, 0.8)),
    url('../imgs/bar_chart1.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: bottom center;
}
.sub_metrics .metrics_card:nth-child(2) .main-card,
.sub_metrics .metrics_card:nth-child(6) .main-card {
  background-image: linear-gradient(to right, rgb(255, 255, 255, 0.5), rgb(255, 255, 255, 0.5)),
    url('../imgs/bar_chart2.png');
}

.sub_metrics .metrics_card:nth-child(3) .main-card {
  background-image: linear-gradient(to right, rgb(255, 255, 255, 0.5), rgb(255, 255, 255, 0.5)),
    url('../imgs/bar_cart2.jpg');
}
.sub_metrics .metrics_card:nth-child(4) .main-card {
  background-image: linear-gradient(to right, rgb(255, 255, 255, 0.8), rgb(255, 255, 255, 0.8)),
    url('../imgs/bar_chart3.png');
}

.sub_metrics h3 span {
  font-size: 16px;
  position: relative;
}

.sub_metrics h3 .green:before {
  content: '↑';
  color: rgb(73, 199, 0);
  width: 10px;
  position: absolute;
  left: -10px;
  top: 5px;
}

.sub_metrics h3 .red:before {
  content: '↓';
  color: rgb(199, 0, 0);
  width: 10px;
  position: absolute;
  left: -10px;
  top: 5px;
}

.sub_metrics h3 .red {
  color: rgb(199, 0, 0);
}

.sub_metrics h3 .green {
  color: rgb(73, 199, 0);
}

.scrollable_nav::-webkit-scrollbar {
  width: 5px;
  height: 10px;
}

.ck-restricted-editing_mode_standard {
  min-height: 200px;
}

/* Track */
.scrollable_nav::-webkit-scrollbar-track {
  background: rgba(3, 0, 54, 1);
}

/* Handle */
.scrollable_nav::-webkit-scrollbar-thumb {
  background:  #004eff;
  border-radius: 100px;
}

/* Handle on hover */
.scrollable_nav::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

.admin_img {
  height: 100px;
  width: 100px;
  object-fit: cover;
  border-radius: 100%;
  box-shadow: 0px 0px 8px rgb(0, 0, 0, 0.3);
}

.admin_table_img {
  height: 60px;
  width: 60px;
  object-fit: cover;
  border-radius: 100%;
}
.vertical-nav-menu {
  display: flex;
  flex-direction: column;
}
.closed-sidebar.fixed-sidebar .app-main__outer {
  /* padding-left: 280px; */
}

.dropdown {
  border: 1px solid #e9e9e9;
  background: #e9e9e9;
  width: 98%;
  top: 100%;
  z-index: 2;
  display: none;
}

.dropdown li {
  list-style-type: none;
}

.dropdown li {
  cursor: pointer;
}

.dropdown hr {
  margin: 3px 0px;
}

.apartment:focus + .dropdown,
.dropdown:focus,
.dropdown:target,
.dropdown:focus-within,
.dropdown:active {
  display: block;
}

.modal-dialog {
  box-shadow: none !important;
}

.options_pd {
  background: #afafaf6e;
  padding: 5px 15px;
  border-radius: 100px;
  display: inline-block;
  width: max-content;
  margin-bottom: 5px;
}

.delete_bg_op {
  transform: rotate(45deg);
  cursor: pointer;
}

.signed.fa-circle {
  color: green;
}

.feature .feature-icon {
  position: relative;
  display: flex;
  width: 65px;
  height: 65px;
  line-height: 2em;
  vertical-align: middle;
  padding-top: 0px;
  color: #fff;
  font-size: 27px;
  border-radius: 8px;
  position: relative;
  align-items: center;
  text-align: center;
  left: 0;
  right: 0;
  justify-content: center;
}

.feature p {
  margin-bottom: 0;
}
.feature .primary {
  box-shadow: 0 20px 20px -10px rgba(74, 50, 212, 0.45), 0px 5px 10px 0px rgba(74, 50, 212, 0.15);
  transition: box-shadow 0.2s ease;
  background-image: linear-gradient(to right, #4a32d4 0%, #2575fc 100%);
}
.feature .danger {
  box-shadow: 0 20px 20px -10px rgba(200, 0, 0, 0.45), 0px 5px 10px 0px rgba(200, 0, 0, 0.15);
  transition: box-shadow 0.2s ease;
  background-image: linear-gradient(to right, #fb1c52 0%, #fd6f82 100%);
}

.feature .secondary {
  box-shadow: 0 20px 20px -10px rgba(6, 116, 222, 0.55), 0px 5px 10px 0px rgba(5, 116, 226, 0.19);
  transition: box-shadow 0.2s ease;
  background: linear-gradient(to right, #4481eb 0%, #04befe 100%);
}
.feature .success {
  box-shadow: 0 20px 20px -10px rgba(49, 206, 23, 0.45), 0px 5px 10px 0px rgba(36, 154, 11, 0.15);
  transition: box-shadow 0.2s ease;
  background-image: linear-gradient(to right, #27af06, #81ec75);
}

.agent_foot_img{
  height: 60px;
  margin: 0px auto 30px;
}