.bg-full-screen-image-2 {
  background: url(../images/new/bg-dashboard-3.png) no-repeat center center fixed;
  -webkit-background-size: cover;
  background-size: cover;
}

.br-15 {
  border-radius: 15px !important;
}

.pointer {
  cursor: pointer;
}

.modal {
  z-index: 1051;
  overflow: auto !important;
}

.modal-dashboard .modal-dialog {
  position: fixed;
  right: 0;
  bottom: 0;
  margin: 0;
  width: 300px;
}

.bg-info-2 {
  background-image: -webkit-gradient(linear, left top, right top, from(#28afd0), to(#28afd0));
  background-image: -webkit-linear-gradient(left, #28afd0, #28afd0);
  background-image: -moz-linear-gradient(left, #28afd0, #28afd0);
  background-image: -o-linear-gradient(left, #28afd0, #28afd0);
  background-image: linear-gradient(to right, #28afd0, #28afd0);
  background-repeat: repeat-x;
}

.modal-dashboard .modal-content {
  background: transparent;
  box-shadow: none !important;
}

.form-control:focus {
  border-color: #3EC5BB;
}

body.vertical-layout[data-color=bg-gradient-x-purple-blue] .navbar-container,
body.vertical-layout[data-color=bg-gradient-x-purple-blue] .content-wrapper-before {
  background-image: -webkit-gradient(linear, left top, right top, from(#28afd0), to(#28afd0));
  background-image: -webkit-linear-gradient(left, #28afd0, #28afd0);
  background-image: -moz-linear-gradient(left, #28afd0, #28afd0);
  background-image: -o-linear-gradient(left, #28afd0, #28afd0);
  background-image: linear-gradient(to right, #28afd0, #28afd0);
  background-repeat: repeat-x;
}

body.horizontal-layout[data-color=bg-gradient-x-purple-blue] .navbar-horizontal,
body.horizontal-layout[data-color=bg-gradient-x-purple-blue] .content-wrapper-before {
  background-image: -webkit-gradient(linear, left top, right top, from(#28afd0), to(#28afd0));
  background-image: -webkit-linear-gradient(left, #28afd0, #28afd0);
  background-image: -moz-linear-gradient(left, #28afd0, #28afd0);
  background-image: -o-linear-gradient(left, #28afd0, #28afd0);
  background-image: linear-gradient(to right, #28afd0, #28afd0);
  background-repeat: repeat-x;
}

.btn-primary {
  background-color: #3EC5BB;
  color: #FFFFFF;
}

.btn-primary:hover {
  background-color: #3EC5BB;
  border-color: #3EC5BB;
  -webkit-box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302);
  box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302);
  color: #FFFFFF;
}

.btn-outline-primary:not(:disabled):not(.disabled):active {
  color: #fff;
  background-color: #3EC5BB;
  border-color: #3EC5BB;
}

.btn-primary:focus,
.btn-primary:active {
  background-color: #3EC5BB !important;
  border-color: #3EC5BB !important;
  -webkit-box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302) !important;
  box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302) !important;
  color: #FFFFFF;
}

.btn-primary.btn-glow {
  -webkit-box-shadow: 0px 1px 20px 1px rgba(62, 197, 187, 0.6);
  box-shadow: 0px 1px 20px 1px rgba(62, 197, 187, 0.6);
  color: #FFFFFF;
}

.btn-outline-primary {
  border-color: #3EC5BB;
  background-color: transparent;
  color: #3EC5BB;
}

.btn-outline-primary:hover {
  background-color: #3ec5bb;
  -webkit-box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302) !important;
  box-shadow: 0 1px 2px 0 rgba(62, 197, 187, 0.451), 0 1px 3px 1px rgba(62, 197, 187, 0.302) !important;
  color: #FFF !important;
  border-color: #3EC5BB;
}

.btn-outline-primary.btn-glow {
  -webkit-box-shadow: 0px 1px 20px 1px rgba(62, 197, 187, 0.6);
  box-shadow: 0px 1px 20px 1px rgba(62, 197, 187, 0.6);
}

.btn-bg-gradient-x-purple-blue-2 {
  border: none;
  color: #fff;
  background-image: -webkit-gradient(linear, left top, right top, from(#3EC5BB), color-stop(50%, #2B9E93), to(#3EC5BB));
  background-image: -webkit-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%);
  background-image: -moz-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%);
  background-image: -o-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%);
  background-image: linear-gradient(90deg, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%);
  -webkit-background-size: 200% auto;
  background-size: 200% auto;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  -moz-transition: 0.5s;
  transition: 0.5s;
}

.btn-bg-gradient-x-purple-blue-2.btn-glow-2 {
  -webkit-box-shadow: 0 0 12px 0 #3EC5BB;
  box-shadow: 0 0 12px 0 #3EC5BB;
}

.btn-bg-gradient-x-purple-blue-2.active,
.btn-bg-gradient-x-purple-blue-2:active,
.btn-bg-gradient-x-purple-blue-2:hover {
  color: #ffffff;
  background-position: right center;
  background-image: -webkit-gradient(linear, left top, right top, from(#3EC5BB), color-stop(50%, #2B9E93), to(#3EC5BB)) !important;
  background-image: -webkit-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%) !important;
  background-image: -moz-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%) !important;
  background-image: -o-linear-gradient(left, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%) !important;
  background-image: linear-gradient(90deg, #3EC5BB 0%, #2B9E93 50%, #3EC5BB 100%) !important;
}

.box-background {
  align-items: center;
  display: flex;
  height: 87vh;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  background-image: url(../images/new/banner-info3r.png);
}

.nav.nav-pills.nav-justified .nav-link.active {
  background-color: #caf5ff !important;
}

.box-background .form-control {
  border-radius: 10px;
}

.box-background .select2-container .select2-selection {
  border-radius: 10px;
}

.select2-container--default .select2-results__options .select2-results__option[aria-selected=true] {
  background-color: #0f7292 !important;
  color: #ffffff !important;
}

.btn-search-dashboard {
  background-color: #15c3ca;
  border-color: #15c3ca;
}

.btn-search-dashboard:hover,
.btn-search-dashboard:focus,
.btn-search-dashboard:active,
.btn-search-dashboard.active,
.open>.dropdown-toggle.btn-search-dashboard {
  background-color: ##15c3ca;
  border-color: ##15c3ca;
}

.btn-search-daerah {
  background-color: #3DC5BB;
  border-color: #3DC5BB;
}

.btn-search-daerah:hover,
.btn-search-daerah:focus,
.btn-search-daerah:active,
.btn-search-daerah.active,
.open>.dropdown-toggle.btn-search-daerah {
  background-color: #3DC5BB;
  border-color: #3DC5BB;
}

.btn-reset {
  background-color: #3F514F;
  border-color: #3F514F;
  color: white;
}

.btn-reset:hover,
.btn-reset:focus,
.btn-reset:active,
.btn-reset.active,
.open>.dropdown-toggle.btn-reset {
  background-color: #3F514F;
  border-color: #3F514F;
  color: white;
}

.btn-paging {
  background-color: #3E514F;
  border-color: #3E514F;
  color: white;
}

.btn-paging:hover,
.btn-paging:focus,
.btn-paging:active,
.btn-paging.active,
.open>.dropdown-toggle.btn-paging {
  background-color: #3E514F;
  border-color: #3E514F;
  color: white;
}

.pt {
  padding: 5px !important;
}

.card-wrapper {
  padding-top: 40px;
  padding-bottom: 40px;
}

/* CHART */
/* 1 */
#statistics-donut-chart-1 .ct-slice-donut-solid {
  fill: url(#donutGradient2);
}

#statistics-donut-chart-1 .ct-label {
  text-anchor: middle;
  alignment-baseline: middle;
  font-size: 30px;
  font-weight: 700;
  fill: #fd636b;
}

#statistics-donut-chart-1 .ct-chart-donut .ct-series {
  stroke: #ddd;
  stroke-width: 0px;
}

/* 2 */
#statistics-donut-chart-2 .ct-slice-donut-solid {
  fill: url(#donutGradient3);
}

#statistics-donut-chart-2 .ct-label {
  text-anchor: middle;
  alignment-baseline: middle;
  font-size: 30px;
  font-weight: 700;
  fill: #fd636b;
}

#statistics-donut-chart-2 .ct-chart-donut .ct-series {
  stroke: #ddd;
  stroke-width: 0px;
}

/* 3 */
#statistics-donut-chart-3 .ct-slice-donut-solid {
  fill: url(#donutGradient4);
}

#statistics-donut-chart-3 .ct-label {
  text-anchor: middle;
  alignment-baseline: middle;
  font-size: 30px;
  font-weight: 700;
  fill: #fd636b;
}

#statistics-donut-chart-3 .ct-chart-donut .ct-series {
  stroke: #ddd;
  stroke-width: 0px;
}

/* 4 */
#statistics-donut-chart-4 .ct-slice-donut-solid {
  fill: url(#donutGradient5);
}

#statistics-donut-chart-4 .ct-label {
  text-anchor: middle;
  alignment-baseline: middle;
  font-size: 30px;
  font-weight: 700;
  fill: #fd636b;
}

#statistics-donut-chart-4 .ct-chart-donut .ct-series {
  stroke: #ddd;
  stroke-width: 0px;
}

/* 5 */
#statistics-donut-chart-5 .ct-slice-donut-solid {
  fill: url(#donutGradient6);
}

#statistics-donut-chart-5 .ct-label {
  text-anchor: middle;
  alignment-baseline: middle;
  font-size: 30px;
  font-weight: 700;
  fill: #fd636b;
}

#statistics-donut-chart-5 .ct-chart-donut .ct-series {
  stroke: #ddd;
  stroke-width: 0px;
}

/* *MAP DIV ICON* */
.leaflet-div-icon {
  background: transparent !important;
  border: 0 !important;
}

.map-div-icon {
  border-radius: 50%;
  padding: 3px;
  width: 30px;
  height: 30px;
}

.map-div-icon-beban {
  padding: 7px 3px;
  width: 40px;
  height: 40px;
}

.bg-info-green,
.map-div-icon-green {
  background: #2B8638 !important;
}

.bg-info-blue,
.map-div-icon-blue {
  background: #5959FF !important;
}

.bg-info-yellow,
.map-div-icon-yellow {
  background: #c4c419 !important;
}

.bg-info-red,
.map-div-icon-red {
  background: #FF1E00 !important;
}

.bg-info-brown,
.map-div-icon-brown {
  background: #915E3B !important;
}

.bg-info-gray,
.map-div-icon-gray {
  background: #7B7B7B !important;
}

.bg-info-grey,
.map-div-icon-grey {
  background: #7B7B7B !important;
}

.bg-info-black,
.map-div-icon-black {
  background: #000 !important;
}

.map-div-icon-content {
  color: #fff;
  font-weight: bold;
  text-align: center;
  padding-top: 5px;
  font-size: 10px;
}

.map-div-icon-content-beban {
  padding-top: 8px;
}

.map-title {
  padding: 3px;
  color: #fff;
}

.nowrap-w-1 {
  white-space: nowrap;
  width: 1%;
}

/* BREAKING NEWS */
.news-flash {
  width: 100%;
  height: 40px;
  margin: 20px auto;
  display: flex;
  align-items: center;
  background: linear-gradient(90deg, #30c55a, #00a86b);
  color: #fff;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.1);
}

.news-flash span {
  font-weight: 600;
  flex-shrink: 0;
}

.news-flash .title {
  padding: 10px;
  background: #2db6c4;
  margin-right: 10px;
}

.news-container {
  position: relative;
  height: 40px;
  overflow: hidden;
  flex: 1;
}

.news-container ul {
  list-style: none;
  padding: 0;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  animation: slideUpAuto 12s linear infinite;
}

.news-container ul li {
  height: 40px;
  line-height: 40px;
  /* padding-left: 10px; */
  white-space: nowrap;
}

/* Efek animasi otomatis naik berdasarkan jumlah item */
@keyframes slideUpAuto {
  0% {
    transform: translateY(0);
  }

  25% {
    transform: translateY(-40px);
  }

  50% {
    transform: translateY(-80px);
  }

  75% {
    transform: translateY(-120px);
  }

  100% {
    transform: translateY(0);
  }
}

.scrollLeft {
  padding: 5px;
}

@keyframes ticker {
  0% {
    margin-top: 0
  }

  25% {
    margin-top: -30px
  }

  50% {
    margin-top: -60px
  }

  75% {
    margin-top: -90px
  }

  100% {
    margin-top: 0
  }
}

.marquee {
  height: 39px;
  width: auto;
  overflow: hidden;
  position: relative;
}

.marquee div {
  display: block;
  width: 200%;
  height: 39px;
  position: absolute;
  overflow: hidden;
  animation: marquee 10s linear infinite;
}

.marquee a {
  float: left;
  width: 50%;
}

@keyframes marquee {
  0% {
    left: 0;
  }

  100% {
    left: -100%;
  }
}

.news ul:hover {
  animation-play-state: paused
}

.news span:hover+ul {
  animation-play-state: paused
}

/* OTHER COLORS */
.blue {
  background: #2db7c6;
}

.blue .title {
  background: #0f7292;
}

.blue a {
  background: transparent;
}

/* END BREAKING NEWS */
.img-welcome {
  position: fixed;
  bottom: 0px;
  right: 35px;
  z-index: 111111;
}

.btn-img-welcome {
  top: 1px;
  position: absolute;
}

.img-berita {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
  min-height: 100px !important;
}

.container-cp {
  background: #084c56;
  margin: 0px;
  padding: 10px;
}

/* 2025   */
.title-info3r {
  font-size: 50px;
}

.box-perusahaan {
  margin-top: 25px;
  margin-bottom: 25px;
}

.stat-card {
  background: #f1f8fc;
  border-radius: 15px;
  padding: 20px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  transition: 0.3s ease;
  margin-bottom: 10px;
}

.stat-card:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  transform: translateY(-4px);
}

.stat-number {
  font-size: 2.5rem;
  font-weight: 700;
  color: #2e7d32;
  /* Hijau gelap */
}

.stat-label {
  font-size: 1.3rem;
  color: #555;
}

.glass-card {
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border-radius: 20px;
  padding: 1.5rem 2rem;
  text-align: center;
  /* min-width: 180px; */
  box-shadow: 0 8px 32px rgba(31, 38, 135, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.glass-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(31, 38, 135, 0.2);
}

.dash-menu.active {
  background: rgba(255, 255, 255, 0.4);
  border: 2px solid #30c55a;
  transform: translateY(-4px);
}

.label {
  color: #555;
  font-weight: 500;
  margin-bottom: 0.5rem;
  font-size: 1rem;
}

.value {
  color: #30c55a;
  font-weight: 700;
  font-size: 1.8rem;
}

/* Pastikan header selalu paling depan */
header,
.header-navbar,
.navbar-container,
.navbar-wrapper {
  position: relative !important;
  z-index: 9999 !important;
}

/* Pastikan dropdown muncul paling atas */
.header-navbar .dropdown-menu {
  position: absolute !important;
  z-index: 10000 !important;
}

.table-bordered thead th, .table-bordered thead td {
  border-bottom-width: 2px;
  padding: 9px;
  vertical-align: middle !important;
  text-align: center;
}

@media (min-width: 1240px) {
  .container-fluid, .container-wide {
    padding-left: 80px;
    padding-right: 80px;
  }

  .navbar-header ul.navbar-nav {
    overflow: hidden;
    width: 300px;
  }
}

@media (max-width: 767.98px) {
  .title-info3r {
    font-size: 30px;
  }

  .logo {
    height: 30px;
  }

  .logo-footer {
    height: 50px;
  }

  .dash-menu img {
    width: 50px;
  }

  .dash-menu {
    padding: 5px !important;
  }

  .dash-menu h6 {
    font-size: 10px;
  }

  .scroll-nav::-webkit-scrollbar {
    display: none;
  }

  .scroll-nav ul {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
  }

  .scroll-nav .nav-item {
    flex: 0 0 auto;
  }

  .scroll-nav ul {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 100%;
    overflow: auto;
  }
}