@media (min-width: 1024.1px) {
  [data-layout="horizontal"] .container-fluid,
  [data-layout="horizontal"] .layout-width {
    max-width: 100%!important;
    margin: 0 auto!important;
  }
}

.navbar-header {
  padding: 0!important;
}

#map {
  height: 1000px;
  width: 100%;
  margin: 0!important;
  padding: 0!important;
  border-radius: 0!important;
  z-index: 0!important;
}

.newcardcss {
  width: 20%!important;
  box-sizing: border-box!important;
}

@media (max-width: 767px) {
  .newcardcss {
    width: 50%!important;
  }

  .financestatuscss {
    margin-left: 0px !important;
  }
}

.newmb-5-css {
  margin-bottom: 44px !important;
}

.financestatuscss {
  margin-left: 80px!important;
}

@media (max-width: 767px) {
  #map {
    height: 50vh !important;
    /* 50% of viewport height */
    min-height: 300px!important;
  }

  .card.card-height-100 {
    height: auto !important;
  }
}

.data-box {
  background: #ffffff!important;
  border-radius: 10px!important;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08)!important;
  margin-bottom: 15px!important;
}

.progress {
  height: 4px!important;
  border-radius: 10px!important;
  background-color: #e9ecef!important;
}

.progress-bar {
  border-radius: 10px!important;
}

h5.card-title {
  color: #333!important;
  font-weight: 600!important;
}

.avatar-title {
  width: 30px!important;
  height: 30px!important;
  display: flex!important;
  align-items: center!important;
  justify-content: center!important;
}
.navbar-nav {
        display: flex;
        flex-direction: row;
        width: 100%;
        gap: 20px;
    }
      #mapid {
        height: 78vh;
        width: 100%;
        margin: 0;
        padding: 0;
        border-radius: 0;
        z-index: 0;
    }
  .left-tabs {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .left-tabs .nav-link {
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
    text-align: left;
    padding: 10px 15px;
    font-weight: 500;
    color: #333;
    height: 45px; /* Height of each tab box */
  }

  .left-tabs .nav-link.active {
    background-color: #d9ead3;
    border-color: #5b8c5a;
    color: #000!important;
  }

  .tab-content {
    min-height: 400px; /* Main content height */
    background: #fff;
    border: 1px solid #ccc;
    padding: 20px;
    margin-left: 20px;
  }

  .tab-pane {
    height: 100%;
  }
  input[readonly],
textarea[readonly],
select[readonly]{
    background-color: #e0e0e0; /* Light gray */
    cursor: not-allowed;
}
.card-animate {
    height: -webkit-fill-available;
}

.card-animate {
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            border: 1px solid #e9ecef;
            margin-bottom: 1rem;
        }
        .card-animate:hover {
            transform: translateY(-5px);
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
        }
        .avatar-xs {
            width: 2rem;
            height: 2rem;
        }
        .avatar-title {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 100%;
            height: 100%;
        }
        .bg-primary-subtle { background-color: rgba(13, 110, 253, 0.1); }
        .bg-danger-subtle { background-color: rgba(220, 53, 69, 0.1); }
        .bg-info-subtle { background-color: rgba(13, 202, 240, 0.1); }
        .bg-dark-subtle { background-color: rgba(33, 37, 41, 0.1); }
        .bg-warning-subtle { background-color: rgba(255, 193, 7, 0.1); }
        .modal-body ul {
            padding-left: 1.5rem;
        }
        .modal-body ul li {
            margin-bottom: 0.5rem;
        }
        .row.g-3 {
            margin: 0 -0.5rem;
        }
        .row.g-3 > [class*='col-'] {
            padding: 0 0.5rem;
        }