/*global settings*/

.filter-section {
  margin-top: 20px;
  margin-bottom: 20px;
}

a {
  text-decoration: none !important;
}

.form-group {
  position: relative;
}

.form-group .date-close {
  position: absolute;
  right: 5px;
  top: 6px;
  font-size: 25px;
  cursor: pointer;
}

.form-group .imagePreview-logo {
  border: 2px solid #e1e2e3;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: all 0.2s ease;
}

.form-group .imagePreview-logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}

.form-group .imagePreview-logo svg {
  transition: all 0.2s ease;
  stroke: #BDBDBD;
}

.form-group .imagePreview-logo:hover {
  transition: all 0.2s ease;
  border-color: #20BEAD;
}

.form-group .imagePreview-logo:hover svg {
  transition: all 0.2s ease;
  stroke: #20BEAD;
}

.form-control {
  border: 1px solid #e8ebf1;
  font-weight: 400;
  box-shadow: none !important;
  color: #495057;
  font-size: 0.875rem;
  height: calc(1.5em + 0.75rem + 2px);
  padding: 0 10px;
  border-radius: 0;
}

.form-control:focus {
  border: 1px solid #20BEAD;
}

.form-control.inline-edit {
  border: none;
  background-color: transparent;
}

.form-control.inline-edit:focus {
  border: 1px solid #20BEAD;
  box-shadow: 0 0 0 0.2rem rgba(32, 190, 173, 0.1);
}

.btn svg {
  position: relative;
  bottom: 1px;
}

.text-purple {
  color: #990099 !important;
}

.text-green {
  color: #339966 !important;
}

.font-small {
  font-size: 12px;
}

/*global settings*/

/*btn*/

.btn {
  font-size: 14px;
  border-radius: 0;
}

.bumbo-btn {
  font-size: 20px;
  text-transform: uppercase;
  padding: 30px 10px;
  height: 100px;
  border-radius: 10px;
}

.bumbo-btn.btn-color-1 {
  background-color: #4287f5;
  border-color: #4287f5;
}

.bumbo-btn.btn-color-2 {
  background-color: #6b49c9;
  border-color: #6b49c9;
}

.bumbo-btn.btn-color-3 {
  background-color: #62ca57;
  border-color: #62ca57;
}

.bumbo-btn.btn-color-4 {
  background-color: #bc1bba;
  border-color: #bc1bba;
}

.bumbo-btn.btn-color-5 {
  background-color: #d2b30e;
  border-color: #d2b30e;
}

.bumbo-btn.btn-color-6 {
  background-color: #088eb5;
  border-color: #088eb5;
}

.bumbo-btn.btn-color-7 {
  background-color: #0acf88;
  border-color: #0acf88;
}

.bumbo-btn.btn-color-8 {
  background-color: #f15500;
  border-color: #f15500;
}

.btn-theme {
  background-color: #20BEAD;
  border: 1px solid #20BEAD;
  color: #ffffff;
  transition: 500ms;
}

.btn-theme:hover {
  color: #ffffff;
  background-color: #199285;
  transition: 500ms;
}

.btn-outline-theme {
  border: 1px solid #20BEAD;
  color: #20BEAD !important;
  transition: 500ms;
}

.btn-outline-theme:hover {
  color: #ffffff !important;
  background-color: #20BEAD;
  transition: 500ms;
}

.btn-outline-danger {
  color: #CC0066 !important;
}

.btn-outline-danger:hover {
  color: #ffffff !important;
  background-color: #CC0066 !important;
  transition: 500ms;
}

.btn-green {
  background-color: #339966;
  border: 1px solid #339966;
  color: #ffffff;
  transition: 500ms;
}

.btn-green:hover {
  color: #ffffff;
  background-color: #26734d;
  transition: 500ms;
}

.btn-outline-green {
  border: 1px solid #339966;
  color: #339966 !important;
  transition: 500ms;
}

.btn-outline-green:hover {
  color: #ffffff !important;
  background-color: #339966;
  transition: 500ms;
}

.btn-purple {
  background-color: #990099;
  border: 1px solid #990099;
  color: #ffffff;
  transition: 500ms;
}

.btn-purple:hover {
  color: #ffffff;
  background-color: #660066;
  transition: 500ms;
}

.btn-outline-purple {
  border: 1px solid #990099;
  color: #990099 !important;
  transition: 500ms;
}

.btn-outline-purple:hover {
  color: #ffffff !important;
  background-color: #990099;
  transition: 500ms;
}

.btn-danger {
  background-color: #CC0066;
  border: 1px solid #CC0066;
  color: #ffffff;
  transition: 500ms;
}

.btn-danger:hover {
  color: #ffffff;
  background-color: #99004d;
  transition: 500ms;
}

.btn-orange {
  background-color: #FF6600;
  border: 1px solid #FF6600;
  color: #ffffff;
  transition: 500ms;
}

.btn-orange:hover {
  color: #ffffff;
  background-color: #cc5200;
  transition: 500ms;
}

.btn-outline-orange {
  border: 1px solid #FF6600;
  color: #FF6600 !important;
  transition: 500ms;
}

.btn-outline-orange:hover {
  color: #ffffff !important;
  background-color: #FF6600;
  transition: 500ms;
}

@media only screen and (max-width: 450px) {
  .btn-100 {
    width: 100%;
    margin-bottom: 10px;
  }
}

.btn-blue {
  background-color: #6653FF;
  border: 1px solid #6653FF;
  color: #ffffff;
  transition: 500ms;
}

.btn-blue:hover {
  color: #ffffff;
  background-color: #3920ff;
  transition: 500ms;
}

.btn-outline-blue {
  border: 1px solid #6653FF;
  color: #6653FF !important;
  transition: 500ms;
}

.btn-outline-blue:hover {
  color: #ffffff !important;
  background-color: #6653FF;
  transition: 500ms;
}

.btn-option {
  padding: 0 10px;
  font-size: 20px;
  color: #ffffff;
}

@media only screen and (max-width: 768px) {
  .btn-option {
    margin-top: 15px;
  }
}

.btn-round {
  padding: 0;
  font-size: 20px;
  border-radius: 50%;
  width: 32px;
  height: 32px;
  color: #ffffff;
}

@media only screen and (max-width: 1366px) {
  .btn-round {
    width: 25px;
    height: 25px;
    font-size: 13px;
  }
}

@media only screen and (max-width: 1000px) {
  .btn-round {
    width: 32px;
    height: 32px;
    font-size: 20px;
  }
}

.btn-round-small {
  padding: 0;
  font-size: 14px;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  color: #ffffff;
}

/*btn*/

/*inner section*/

.section-title {
  font-size: 1.4rem;
  line-height: 1.2;
  color: #000;
  display: table;
  width: 100%;
  font-weight: 600;
  margin-bottom: 6px;
}

.main-inner-body {
  width: 100%;
  border-radius: 0;
  display: block;
  height: calc(100vh - 175px);
  overflow: auto;
}

.main-inner-body .section-wrapper {
  padding: 20px;
  background: #fff;
}

@media only screen and (max-width: 768px) {
  .main-inner-body {
    padding: 15px;
    height: calc(100vh - 165px);
  }
}

.main-inner-body .button-left {
  display: table;
  width: 100%;
}

.back-btn {
  font-size: 28px;
  line-height: 0;
  position: relative;
  top: 3px;
  cursor: pointer;
  color: #20BEAD !important;
}

.breadcrumb-custom {
  width: 100%;
  display: table;
  font-size: 16px;
  color: #6c757d;
  list-style: none;
  margin-bottom: 15px;
}

.breadcrumb-custom a {
  color: #6c757d !important;
}

.breadcrumb-custom .active-cum {
  color: #20BEAD;
}

.table-section {
  margin-top: 20px;
  margin-bottom: 20px;
}

@media only screen and (max-width: 1024px) {
  .table-section {
    overflow: auto;
  }
}

.table-section .table-theme {
  font-size: 95%;
}

@media only screen and (max-width: 1024px) {
  .table-section .table-theme.table-res {
    min-width: 900px;
  }
}

.table-section .table-theme thead tr th {
  position: relative;
  background-color: #20BEAD;
  color: #ffffff;
  padding: 0.75rem 0.15rem;
  font-weight: 500;
  border-top: none;
  border-bottom: none;
}

.table-section .table-theme thead tr th:first-child {
  padding: 0.75rem;
}

.table-section .table-theme thead tr th:last-child {
  padding: 0.75rem;
}

.table-section .table-theme thead tr th .sorting {
  margin-top: 1px;
  margin-left: 5px;
  cursor: pointer;
}

.table-section .table-theme tbody tr.current {
  background-color: rgba(196, 233, 239, 0.79);
}

.table-section .table-theme tbody tr.child-table {
  cursor: pointer;
}

.table-section .table-theme tbody tr.child-table.selected td {
  background-color: #60e4d6;
  color: #ffffff;
}

.table-section .table-theme tbody tr td {
  padding: 0.6rem 0.15rem;
  vertical-align: middle;
}

.table-section .table-theme tbody tr td:first-child {
  padding: 0.75rem;
}

.table-section .table-theme tbody tr td:last-child {
  padding: 0.75rem;
}

.table-section .table-theme tbody tr.total td {
  border-top: 2px solid #909090;
  border-bottom: 2px solid #909090;
}

.table-section .table-theme .btn-wrapper-width {
  width: 320px;
}

@media only screen and (max-width: 1366px) {
  .table-section .table-theme .btn-wrapper-width {
    width: 250px;
  }
}

@media only screen and (max-width: 1000px) {
  .table-section .not-mobile-view-table {
    display: none;
  }
}

.table-section .mobile-view-table {
  padding-top: 20px;
  display: none;
}

@media only screen and (max-width: 1000px) {
  .table-section .mobile-view-table {
    display: block;
  }
}

.table-section .mobile-view-table .each-tr {
  width: 100%;
  display: block;
  background-color: #e8f1f9;
  border-radius: 20px;
  margin-bottom: 30px;
  position: relative;
}

.table-section .mobile-view-table .each-tr .button-section {
  position: absolute;
  right: 15px;
  top: -14px;
}

.table-section .mobile-view-table .each-tr .button-section .btn {
  border: 2px solid #ffffff;
  width: 31px;
  height: 31px;
  font-size: 18px;
}

.table-section .mobile-view-table .each-tr .name-section {
  padding: 18px 10px 10px;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  background-color: #20BEAD;
  color: #ffffff;
}

.table-section .mobile-view-table .each-tr .name-section .name {
  font-weight: bold;
}

.table-section .mobile-view-table .each-tr .info-sec {
  padding: 10px;
}

.table-section .mobile-view-table .each-tr .info-sec .info-box {
  display: flex;
  justify-content: space-between;
}

.table-section .mobile-view-table .each-tr .info-sec .info-box .title {
  width: 82px;
}

.table-section .table-slide-padding {
  padding: 0 9px 10px 0 !important;
}

.pagination .page-item.active .page-link {
  background-color: #20BEAD;
  border-color: #20BEAD;
}

.pagination .page-link {
  color: #20BEAD;
  background-color: #fff;
  border: 1px solid #dee2e6;
}

.dropdown-item:active {
  background-color: #ffffff;
  color: initial;
}

.dropdown-item {
  padding: 0.25rem 0.9rem;
}

/*inner section*/

/*checkbox*/

.custom-control-input:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #20BEAD;
  background-color: #20BEAD;
}

.custom-control-input.head-custom:checked ~ .custom-control-label::before {
  color: #fff;
  border-color: #ffffff !important;
  background-color: #20BEAD;
}

.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 0 #ffffff;
}

/*checkbox*/

/*modal*/

.modal-title {
  font-size: 1.2rem !important;
  color: #212121 !important;
  margin-bottom: 0 !important;
  line-height: 1.5 !important;
}

.sub-title {
  color: #999797;
}

@media only screen and (max-width: 768px) {
  .modal-body {
    overflow: auto;
  }
}

/*modal*/

::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 5px !important;
  height: 2px !important;
  background-color: #f6f6f6;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2) !important;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #f6f6f6;
  opacity: 1;
}

.rtl .text-left {
  text-align: right !important;
}

.rtl .text-right {
  text-align: left !important;
}

.rtl .float-left {
  float: right !important;
}

.rtl .float-right {
  float: left !important;
}

.rtl .table-section .table-theme thead tr th {
  text-align: right;
}

.rtl .table-section .table-theme tbody tr td {
  text-align: right;
}

.rtl .table-section .table-theme tbody tr.total td {
  text-align: right;
}

.rtl .table-section .table-slide-padding {
  padding: 0 0 10px 9px !important;
}

.rtl .modal-header .close {
  margin: -1rem auto -1rem -1rem;
}

.rtl .form-control.is-invalid,
.rtl .was-validated .form-control:invalid {
  background-position: left calc(.375em + .1875rem) center !important;
  padding-right: calc(0.5em + 0.25rem);
}

.rtl .text-side,
.rtl .picture-side {
  float: right;
}

.rtl .picture-side {
  border-radius: 0 80px 80px 0px/0px 90px 90px 0px;
}

.rtl .breadcrumb-custom {
  text-align: right;
}

.rtl .pagination .la-angle-right {
  transform: rotate(180deg);
}

.rtl .pagination .la-angle-left {
  transform: rotate(180deg);
}

.rtl .la-arrow-circle-left {
  transform: rotate(180deg);
}