/* Unified list + report search box — standard layout */

.list-search-card,
.card.list-search-card {
  border: 0;
  box-shadow: 0 2px 6px rgba(67, 89, 113, 0.08);
}

.list-search-card .card-header,
.list-data-card .card-header {
  font-weight: 600;
  font-size: 1rem;
  color: #566a7f;
  background: #fff;
  border-bottom: 1px solid #eceef1;
  text-align: left;
}

.list-search-card .Searching-Box-padding {
  padding: 1rem 1.25rem 0.85rem !important;
}

.list-search-card .form-label {
  font-weight: 600;
  font-size: 0.8125rem;
  color: #566a7f;
  margin-bottom: 0.35rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.list-search-card .form-control,
.list-search-card .form-select {
  font-size: 0.875rem;
  border-color: #d9dee3;
  min-height: 2.375rem;
}

.list-search-card .form-control:focus,
.list-search-card .form-select:focus {
  border-color: var(--app-primary, #696cff);
  box-shadow: 0 0 0 0.15rem rgba(var(--app-primary-rgb, 105, 108, 255), 0.12);
}

/* Row 1 — stn ui: all filters in one row, left aligned, NO horizontal scroller */
.list-search-fields-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  justify-content: flex-start;
  gap: 0.65rem;
  overflow-x: hidden;
  overflow-y: hidden;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0.75rem !important;
  padding-bottom: 0;
  text-align: left;
}

.list-search-field {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
  width: auto !important;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
}

.list-search-field .form-control,
.list-search-field .form-select {
  text-align: left;
}

.list-search-field .form-label {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Date fields — same as report pages */
.list-search-card input[type="date"],
.list-search-card input[type="datetime-local"] {
  padding-right: 0.5rem;
}

.list-search-card input[type="date"]::-webkit-calendar-picker-indicator,
.list-search-card input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  cursor: pointer;
  opacity: 0.65;
}

/* Row 2 — action buttons right aligned only */
.list-search-actions-row {
  margin-top: 0.15rem;
  padding-top: 0.75rem;
  border-top: 1px solid #eceef1;
  text-align: left;
}

.list-search-actions-row .list-action-toolbar,
.list-search-actions-row > .col-12.text-end,
.list-search-actions-row > .col-md-12.text-end {
  text-align: right !important;
}

.list-action-toolbar {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: 0.4rem;
}

.list-action-toolbar .btn {
  font-size: 0.8125rem;
  font-weight: 500;
  padding: 0.45rem 0.85rem;
}

.list-data-card {
  border: 0;
  box-shadow: 0 2px 6px rgba(67, 89, 113, 0.08);
}

.list-record-count {
  font-weight: 500;
  font-size: 0.875rem;
  color: #a1acb8 !important;
}

/* Grid list header — report table header style */
.list-data-card .GVHeader {
  background-color: #f5f5f9;
  border-bottom: 1px solid #d9dee3;
  margin: 0;
  padding: 0.75rem 1.25rem;
}

.list-data-card .GVHeader p {
  font-weight: 600;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #566a7f;
  margin-bottom: 0;
}

/* Grid list rows */
.list-data-card .GVDetail {
  border-bottom: 1px solid #e7e7e8;
  padding: 0.65rem 1.25rem;
  transition: background-color 0.15s ease;
}

.list-data-card .GVDetail:hover {
  background-color: rgba(105, 108, 255, 0.04);
}

.list-data-card .GVDetail p,
.list-data-card .GVDetailforApproval p {
  font-size: 0.9375rem;
  color: #697a8d;
  margin-bottom: 0.25rem;
}

.list-data-card .GVDetail .smallAdd {
  font-weight: 600;
  font-size: 0.8125rem;
  color: #566a7f;
}

/* Table-based list partials */
.list-data-card .table thead th,
.list-search-card .table thead th,
.card .table thead th {
  font-weight: 600;
  font-size: 0.8125rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: #566a7f;
  background-color: #f5f5f9;
  border-bottom: 1px solid #d9dee3;
  white-space: nowrap;
  vertical-align: middle;
  text-align: left;
}

.list-data-card .table tbody td,
.list-search-card .table tbody td,
.card .table tbody td {
  font-size: 0.9375rem;
  color: #697a8d;
  vertical-align: middle;
  text-align: left;
}

.list-data-card .table tbody tr:hover {
  background-color: rgba(105, 108, 255, 0.04);
}

.list-data-card .list-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid rgba(105, 108, 255, 0.2);
}

.list-action-toolbar .btn i.bx {
  font-size: 1em !important;
  line-height: 1;
  vertical-align: -0.08em;
}

.list-data-card .table tbody td i.bx,
.list-data-card .GVDetail i.bx,
.list-data-card .GVDetail a i.bx,
.list-data-card .GVDetailforApproval i.bx,
.list-data-card .GVDetailforApproval a i.bx,
.table-responsive .table.table-striped tbody td i.bx {
  font-size: 1.125em !important;
  line-height: 1;
  vertical-align: middle;
}

@media (max-width: 767.98px) {
  .list-search-fields-row {
    flex-wrap: wrap;
    overflow-x: visible;
  }

  .list-search-field {
    min-width: calc(50% - 0.35rem);
    max-width: 100%;
    flex: 1 1 calc(50% - 0.35rem);
  }

  .list-search-actions-row .list-action-toolbar {
    justify-content: flex-start;
  }

  .list-search-actions-row .list-action-toolbar,
  .list-search-actions-row > .col-12.text-end,
  .list-search-actions-row > .col-md-12.text-end {
    text-align: left !important;
  }
}

a.access-disabled,
button.access-disabled,
.access-disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  pointer-events: none;
  filter: grayscale(0.35);
}

a.access-disabled i,
button.access-disabled i {
  opacity: 0.65;
}

/* Dark mode — VS-style contrast for list/search cards */
html.dark-style .list-search-card {
  background: var(--app-surface, #252526) !important;
  border: 1px solid var(--app-border, #555555) !important;
}

html.dark-style .list-search-card .card-header {
  background: var(--app-surface-elevated, #2d2d30) !important;
  border-color: var(--app-border, #555555) !important;
  color: var(--app-heading, #f3f3f3) !important;
}

html.dark-style .list-search-card .form-label {
  color: #c8c8c8 !important;
}

html.dark-style .list-search-actions-row {
  border-color: var(--app-border, #555555) !important;
}

html.dark-style .list-search-card .form-control,
html.dark-style .list-search-card .form-select {
  background: var(--app-input, #3c3c3c) !important;
  border: 1px solid var(--app-border, #555555) !important;
  color: var(--app-heading, #f3f3f3) !important;
}

html.dark-style .card .card-header {
  color: var(--app-heading, #f3f3f3) !important;
}

html.dark-style .card .smallAdd + *,
html.dark-style .card p,
html.dark-style .card .text-nowrap {
  color: var(--app-text, #cccccc);
}