/* Filter Sidebar Styles */
.aside-filter-card {
  position: sticky !important;
  top: 60px;
  transition: 0.5s;
  background-color: #f8f9fa;
  border: 1px solid #ddd;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  z-index: 100;
}

.aside-filter-card .table-bordered {
  border: 1px solid #dee2e6;
}

.aside-filter-card .table {
  width: 100%;
  margin-bottom: 1rem;
  color: #212529;
}

.aside-filter-card td {
  padding: 0.75rem;
  vertical-align: top;
}

.aside-filter-card input {
  border: 1px solid #bdb9b9;
  padding: 10px;
  font-size: 16px;
}

.aside-filter-card input[type="submit"] {
  background-color: DodgerBlue;
  color: #fff;
  cursor: pointer;
}

.aside-filter-card input::placeholder {
  color: black;
}

.aside-filter-card input[type="date"]:not(:focus):invalid {
  color: #888;
}

.aside-filter-close-btn {
  margin-left: 10px !important;
}

.desk {
  display: block !important;
}

.mob {
  display: none !important;
}

.mob .card-header {
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.mob .filter-title {
  margin: 0;
  font-size: 1.2rem;
  font-weight: bold;
}

.mob .filter-container {
  display: none;
}

.mob.opened .filter-container {
  display: block;
}

.mob .filter-code {
  display: block;
}

@media (max-width: 992px) {
  .desk {
    display: none !important;
  }

  .mob {
    display: block !important;
    margin-bottom: 0;
    border-radius: 0 0 5px 5px;
  }

  .aside-filter-card.mob {
    top: 55px;
  }
}