.text-orange{
    color: orange;
}

.w100p{
    width: 100%;
}
@media (min-width: 840px) {
    .modal-slide-in .modal-dialog.sidebar-xl {
        width: 60rem;
    }
}

@media (max-width: 840px) {
    .modal-slide-in .modal-dialog.sidebar-xl {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .modal-slide-in .modal-dialog.sidebar-lg {
        width: 100%;
    }

    .modal-slide-in .modal-dialog.sidebar-sm {
        width: 100%;
    }
}

.font-size-20{
    font-size: 20px;
}
form #editorjs.form-control {
    height: auto;
}
.img-container {
    height: 300px;
    background-color: #f7f7f7;
    text-align: center;
    width: 100%;
}
.hight-z-index{
    z-index: 99999;
}
.circle-image{
    border-radius: 50%;
}
.mt-05{
    margin-top: 0.5rem !important;
}
.h-24px{
    height: 24px !important;
}
.w-24px{
    width: 24px !important;
}
.h-36px{
    height: 36px !important;
}
.w-36px{
    width: 36px !important;
}
.h-42px{
    height: 42px !important;
}
.w-42px{
    width: 42px !important;
}
.h-50px{
    height: 50px !important;
}
.w-50px{
    width: 50px !important;
}
.dropdown-menu{
    z-index: 15 !important;
}
.h-200px{
    height: 200px !important;
}
.h-450px{
    height: 450px !important;
}
.w-600px{
    width: 600px !important;
}
.h-60px{
    height: 60px !important;
}
.w-60px{
    width: 60px !important;
}
.preloader {
    opacity: 0.8;
    display: none;
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(/themes/vuexy/images/preloader.gif) 50% 50% no-repeat rgb(249, 249, 249);
}

.invoice-preview .invoice-total-wrapper, .invoice-edit .invoice-total-wrapper, .invoice-add .invoice-total-wrapper{
    max-width: 14rem !important;
}
.hide{
    display: none;
}

.page-search {
    background-size: cover;
    background-color: rgba(115, 103, 240, 0.12) !important;
}

.page-search .page-search-input .input-group:focus-within {
    box-shadow: none;
}

@media (min-width: 992px) {
    .page-search .card-body {
        padding: 8rem !important;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .page-search .card-body {
        padding: 6rem !important;
    }
}

@media (min-width: 768px) {
    .page-search .page-search-input .input-group {
        width: 576px;
        margin: 0 auto;
    }
    .faq-navigation {
        height: 550px;
    }
}
.color-picker__dialog--no-alpha .color-picker__control--a {
    display: none;
}


.progress-bar-warning {
    background-color: #ffc107!important;
}


.progress-bar-success {
    background-color: #198754!important;
}

.card.participant-item{
    min-height: 340px;
}

.user-profile-header-banner img {
    width: 100%;
    object-fit: cover;
    height: 250px;
  }

  .user-profile-header {
    margin-top: -2rem;
  }
  .user-profile-header .user-profile-img {
    border: 5px solid;
    width: 120px;
  }

  .light-style .user-profile-header .user-profile-img {
    border-color: #fff;
  }

  .dark-style .user-profile-header .user-profile-img {
    border-color: #2f3349;
  }

  .dataTables_wrapper .card-header .dataTables_filter label {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  @media (max-width: 767.98px) {
    .user-profile-header-banner img {
      height: 150px;
    }
    .user-profile-header .user-profile-img {
      width: 100px;
    }
  }
  .timeline .timeline-point-info.unscheduled{
    background-color: #ff9f43 !important;
    box-shadow: 0 0 0 0.1875rem rgba(255, 159, 67, 0.16);
  }

  .timeline .timeline-point-info.scheduled{
    background-color: #00cfe8 !important;
    box-shadow: 0 0 0 0.1875rem rgba(0, 207, 232, 0.16);
  }

  .timeline .timeline-point-info.completed{
    background-color: #28c76f !important;
    box-shadow: 0 0 0 0.1875rem rgba(40, 199, 111, 0.16);
  }

  .timeline .timeline-point-info.cancelled{
    background-color: #ea5455 !important;
    box-shadow: 0 0 0 0.1875rem rgba(234, 84, 85, 0.16);
  }

  .avatar-xxxl{
    width: 8.5rem !important;
    height: 8rem !important;
  }
  .avatar-xxxl .avatar-initial {
    font-size: 3rem;
}
.tinymce-h-200 .tox-tinymce {
    height: 200px !important; /* Atur tinggi editor */
}
.tinyMCEBasic:disabled + .tox-tinymce{
    background-color: #efefef;
    opacity: 1;
    cursor: default;
    pointer-events: none;
}
a.btn.disabled{
    pointer-events: none;
}
.nav-people-development .nav-link.disabled{
    color: #5e5873;
}
.nav-people-development .nav-link.active.disabled{
    color: #fff;
}