/* ---------- card wrapper ------------------------------------------ */
.lcm-table-card {
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
  background: #fff;
}

/* ---------- scroll container -------------------------------------- */
.lcm-scroll {
  max-width: 100%;
  overflow-x: scroll;
}

/* ---------- base table style -------------------------------------- */
.lcm-table {
  min-width: 1200px;
  border-collapse: collapse;
  border-spacing: 0;
}
.lcm-filters {
  flex-grow: 1;
  margin: 0px 8px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px;
  max-width: 85%;
}
.lcm-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  color: #fff;
  background: #000;
  border-bottom: 2px solid #d1d5db;
  text-transform: uppercase;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  white-space: nowrap;
  text-transform: capitalize;
  font-weight: 500;
  padding: 0.25em 0.7em;
  text-align: center;
}
.lcm-table tbody tr td,
.lcm-table tbody tr th {
  white-space: nowrap;
}

/* remove borders in readonly mode */
.lcm-table td,
.lcm-table th {
  border: 1px solid #d6d6d6;
  border-collapse: collapse;
  padding: 0.35rem;
}
.lcm-table td {
  background: #f8f9fa;
}

/* zebra + hover ----------------------------------------------------- */

.lcm-table tbody tr:hover td {
  background: #eef2ff;
  cursor: pointer;
}

/* draft yellow ------------------------------------------------------ */
.lcm-table tbody tr.table-warning td {
  background: #fffbea;
}

/* ---------- editing focus ----------------------------------------- */
.lcm-table tbody tr.lcm-editing {
  transform: scale(1, 1.015);
  box-shadow: 0 0px 17px rgb(94 94 94 / 50%);
  transition: 0.5s;
  border-radius: 4px;
}

.lcm-table tbody tr.lcm-editing td {
  border: 1px solid #d1d5db00;
  background: #b8e9ff;
  padding: 6px 2px;
}

/* ---------- buttons ------------------------------------------------ */
.lcm-table .btn {
  line-height: 1;
  height: 30px;
  width: 30px;
}
.lcm-table .btn-secondary {
  background: #64748b;
  border: 0;
}
.lcm-table .btn-secondary:hover {
  background: #475569;
}
.lcm-table .btn-success {
  background: #22c55e;
  border: 0;
}
.lcm-table .btn-success:hover {
  background: #16a34a;
}
.lcm-table .btn-warning {
  background: #facc15;
  border: 0;
  color: #000;
}
.lcm-table .btn-warning:hover {
  background: #eab308;
  color: #000;
}
.lcm-table .btn-danger {
  background: #ef4444;
  border: 0;
}
.lcm-table .btn-danger:hover {
  background: #dc2626;
}
.form-select:disabled,
.form-control:disabled {
  background: transparent;
  border: 0px;
  padding: 0px 6px;
}
.lcm-table option {
  background: #fff;
}
.form-select-sm,
.form-control-sm {
  border-radius: 8px;
  background-color: #ffffff;
  border: none;
  height: 100%;
  margin: 0px;
  min-height: 30px;
}
.lcm-table thead th:nth-child(1),
.lcm-table thead th:nth-child(2),
.lcm-table thead th:nth-child(3),
#lcm-lead-table thead th:nth-child(4),
#lcm-lead-table thead th:nth-child(5),
.lcm-table thead th:nth-child(6),
#lcm-lead-table thead th:nth-child(8),
#lcm-lead-table thead th:nth-child(9),
.lcm-table thead th:nth-child(11),
.lcm-table thead th:nth-child(13) {
  min-width: 120px;
}

#lcm-campaign-table thead th:nth-child(7),
.lcm-table thead th:nth-child(12),
.lcm-table thead th:nth-child(14),
.lcm-table thead th:nth-child(22) {
  min-width: 200px;
}
.lcm-table thead th:nth-child(7),
#lcm-campaign-table thead th:nth-child(4) {
  min-width: 85px;
}
.lcm-table thead th:nth-child(10),
#lcm-campaign-table thead th:nth-child(8) {
  min-width: 70px;
}

/* hide all clear buttons by default */
.lcm-filter-group .clear-filter {
  display: none;
}

/* when active, highlight the group and show the clear button */
.lcm-filter-group.filter-active .form-select,
.lcm-filter-group.filter-active .form-control {
  border-color: #0d6efd;
  box-shadow: 0 0 0.2rem rgba(13, 110, 253, 0.25);
}
.lcm-filter-group.filter-active .clear-filter {
  display: block;
}
.justify-content-between {
  align-items: center;
}
.lcm-filter-group.filter-active {
  border: 1px solid #0d6efd; /* Bootstrap primary */
  background-color: #e7f1ff; /* very light blue */
}

/* ensure the table container is positioned relative */
#lcm-lead-table-container {
  position: relative;
} /* ensure the table wrapper is a positioning context */
.lcm-scroll {
  position: relative;
}
#lcm-preloader {
  position: absolute;
  inset: 0px;
  background: rgba(255, 255, 255, 0.8);
  align-items: center;
  justify-content: center;
  z-index: 10;
  align-content: center;
  text-align: center;
  display: none;
}
/* keep filters+table space reserved while we’re loading */
.lcm-lead-wrapper.loading .lcm-filters,
.lcm-lead-wrapper.loading .lcm-scroll {
  visibility: hidden;
}

/* ensure the wrapper is the positioning context for the spinner */
.lcm-lead-wrapper {
  position: relative;
}
#lcm-campaign-detail .table thead th {
  position: sticky;
  top: 0;
  background-color: #fff;
  z-index: 2;
}

/* Edit-mode highlight */
#lcm-campaign-detail .table tbody tr.editing {
  background-color: #fff9e6; /* light yellow */
  box-shadow: inset 0 0 0 2px #ffc107;
  transition: background-color 0.2s;
}

/* Make action buttons a little closer together */
#lcm-campaign-detail .table .btn {
  margin-right: 0.25rem;
}
.lcm-sortable {
  cursor: pointer;
}
.lcm-sort-asc::after {
  content: " ▲";
  font-size: 10px;
}
.lcm-sort-desc::after {
  content: " ▼";
  font-size: 10px;
}
th.lcm-sortable.lcm-sort-asc,
th.lcm-sortable.lcm-sort-desc {
  border: 2px solid #ec2121;
}
.lcm-preloader {
  text-align: center;
  padding: 40px;
}
.lcm-preloader img {
  width: 32px;
  height: 32px;
  animation: spin 1s linear infinite;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.lcm-clear-sort {
  font-weight: bold;
  color: #888;
  float: right;
}
.lcm-clear-sort:hover {
  color: red;
}
th.lcm-sortable .sort-clear {
  visibility: hidden;
  margin-left: 4px;
  color: #999;
  font-weight: bold;
  cursor: pointer;
}

th.lcm-sortable.lcm-sort-asc .sort-clear,
th.lcm-sortable.lcm-sort-desc .sort-clear {
  visibility: visible;
}