.navbar{
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.navbar .nav-link {
  color: #E62727 !important;
  font-weight: 600;
}

.container{
  margin-top: 20px;
}

.btn-login {
  background: #2a7b9b;
  background: linear-gradient(
    90deg,
    rgba(42, 123, 155, 1) 0%,
    rgba(199, 87, 87, 1) 100%,
    rgba(237, 83, 83, 1) 100%
  );
  border-radius: 20px;
  color: #ffffff;
  font-weight: 700;
}
.akses-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 70px;
    border-radius: 10px;
    cursor: pointer;
    border: 2px solid transparent;
    transition: 0.3s ease;
}
.akses-box img {
    width: 100px;
    height: 50px;
}

.akses-box:hover {
    transform: scale(1.05);
}

input[type="radio"]:checked + .akses-box {
    border: 2px solid #2a7b9b;
    box-shadow: 0 0 8px rgba(42,123,155,.6);
}

.btn-logout{
  padding: 10px;
  color: #ffffff;
  font-weight: 600;
  background-color: #E62727;
  text-decoration: none;
  border: 1px solid;
  border-radius: 10px;
  /* color: #E62727; */
}

.btn-logout:hover{
  color: #E62727;
  /* padding: 10px; */
  background-color: #ffffff;
  border: 2px solid;
  border-color: #E62727;
}

.tmbdata{
  padding: 10px;
  background-color: #1E93AB;
  color: #ffffff;
  border-radius: 10px;
  font-weight: 600;
  text-decoration: none;
}

.tmbdata:hover{
  color: #ffffff;
}

.tmbdatap{
  padding: 10px;
  background-color: #1E93AB;
  color: #ffffff;
  border-radius: 10px;
  font-weight: 600;
  text-decoration: none;
  border-color: #1E93AB;
}

.tmbdatap:hover{
  color: #ffffff;
  border-color: #E62727;
  background-color: #E62727;
}

.btnfunc{
  padding: 10px;
  background-color: #1E93AB;
  color: #ffffff;
  font-weight: 600;
  width: 100%;
}
.btnfunct{
  padding: 10px;
  background-color: #424546;
  color: #ffffff;
  font-weight: 600;
  width: 100%;
}

.btn-print{
  background-color: #E62727;
  color: #ffffff;
}

.row-inpo .label{
  font-weight: 700;
  max-width: 40px;
  align-items: left !important;
}

.chart-container {
    position: relative;
    width: 100%;
    height: 200px;
}

@media (max-width: 768px) {
    .chart-container {
        height: 250px;
    }
}

.scroll-chart {
    overflow-x: auto;
}

.scroll-chart canvas {
    min-width: 900px; /* atur sesuai kebutuhan */
    height: 350px !important;
}