/* Data section visual standard for search boxes and tables across app */

:root {
  --data-std-surface: var(--cde-surface, #ffffff);
  --data-std-muted-surface: var(--cde-s2, #f4f6f8);
  --data-std-border: var(--cde-border, #e1e4e8);
  --data-std-border-strong: var(--cde-border2, #cdd1d8);
  --data-std-text: var(--cde-text, #24272e);
  --data-std-text-muted: var(--cde-text2, #5b6575);
  --data-std-placeholder: var(--cde-muted2, #9aa3b2);
  --data-std-focus: var(--cde-blue, #1460b8);
}

/* Search wrappers */
:is(
  .search-wrap,
  .topics-search-wrap,
  .team-search-wrap,
  .submittal-search,
  .conflict-search-wrapper,
  .pdf-search,
  .section-search
) {
  position: relative;
  display: flex;
  align-items: center;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

:is(
  .search-wrap svg,
  .topics-search-wrap svg,
  .team-search-wrap svg,
  .submittal-search svg,
  .conflict-search-wrapper svg,
  .section-search-icon
) {
  position: absolute;
  left: 9px;
  color: var(--data-std-placeholder);
  pointer-events: none;
}

/* Search input standard */
:is(
  .search-input,
  .topics-search-inp,
  .team-search-inp,
  .submittal-search input,
  .conflict-search-input,
  .clash-tests-search input,
  .pdf-search input,
  .section-search-input,
  .panel-filters .search-input,
  .permissions-filters .search-input,
  .audit-filters .filter-input,
  .search input
) {
  min-height: 32px;
  border: 1.5px solid var(--data-std-border);
  border-radius: 6px;
  background: var(--data-std-muted-surface);
  color: var(--data-std-text);
  font-size: var(--cde-fs-sm, 12px);
  font-weight: 500;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

:is(
  .search-input,
  .topics-search-inp,
  .team-search-inp,
  .submittal-search input,
  .conflict-search-input,
  .pdf-search input,
  .section-search-input,
  .search input
) {
  padding: 8px 12px 8px 34px;
}

:is(
  .panel-filters .search-input,
  .permissions-filters .search-input,
  .audit-filters .filter-input,
  .clash-tests-search input
) {
  padding: 8px 12px;
}

:is(
  .search-input,
  .topics-search-inp,
  .team-search-inp,
  .submittal-search input,
  .conflict-search-input,
  .clash-tests-search input,
  .pdf-search input,
  .section-search-input,
  .panel-filters .search-input,
  .permissions-filters .search-input,
  .audit-filters .filter-input,
  .search input
):focus {
  outline: none;
  border-color: var(--data-std-focus);
  box-shadow: 0 0 0 3px rgba(20, 96, 184, 0.12);
  background: var(--data-std-surface);
}

:is(
  .search-input,
  .topics-search-inp,
  .team-search-inp,
  .submittal-search input,
  .conflict-search-input,
  .clash-tests-search input,
  .pdf-search input,
  .section-search-input,
  .panel-filters .search-input,
  .permissions-filters .search-input,
  .audit-filters .filter-input,
  .search input
)::placeholder {
  color: var(--data-std-placeholder);
}

/* Table standard */
:is(
  .topics-table,
  .team-table,
  .submittal-table,
  .files-table,
  .org-list table,
  .audit-table,
  .rbac-table,
  .clash-table,
  .clash-matrix-table,
  .data-table__table
) {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  background: var(--data-std-surface);
}

:is(
  .topics-list-wrap,
  .submittal-table-wrapper,
  .clash-table-wrapper,
  .data-table__wrapper
) {
  border-radius: 0 !important;
  overflow: hidden;
}

/* Team category blocks need natural vertical growth plus optional horizontal scroll. */
.team-category-block {
  overflow-y: visible;
  overflow-x: auto;
}

:is(
  .topics-table thead,
  .team-table thead,
  .submittal-table thead,
  .files-table thead,
  .org-list table thead,
  .audit-table thead,
  .rbac-table thead,
  .clash-table thead,
  .clash-matrix-table thead,
  .data-table__thead
) {
  background: var(--data-std-muted-surface);
}

:is(
  .topics-table thead tr,
  .team-table thead tr,
  .submittal-table thead tr,
  .files-table thead tr,
  .org-list table thead tr,
  .audit-table thead tr,
  .rbac-table thead tr,
  .clash-table thead tr,
  .clash-matrix-table thead tr,
  .data-table__thead .data-table__header-row
) {
  border-bottom: 2px solid var(--data-std-border-strong);
}

:is(
  .topics-table th,
  .team-table th,
  .submittal-table th,
  .files-table th,
  .org-list th,
  .audit-table th,
  .rbac-table th,
  .clash-table th,
  .clash-matrix-table th,
  .data-table__th
) {
  padding: 10px 12px;
  text-align: left;
  font-size: var(--cde-fs-sm, 12px);
  font-weight: 700;
  color: var(--data-std-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--data-std-border-strong);
  white-space: nowrap;
  user-select: none;
  position: relative;
}

:is(
  .topics-table th,
  .team-table th,
  .submittal-table th,
  .files-table th,
  .org-list th,
  .audit-table th,
  .rbac-table th,
  .clash-table th,
  .clash-matrix-table th,
  .data-table__th
):hover {
  background: var(--cde-s3, #edf1f5);
  color: var(--data-std-text-muted);
}

:is(
  .topics-table th,
  .team-table th,
  .submittal-table th,
  .files-table th,
  .org-list th,
  .audit-table th,
  .rbac-table th,
  .clash-table th,
  .clash-matrix-table th,
  .data-table__th
)::after {
  content: '↕';
  opacity: 0.35;
  font-size: 10px;
  margin-left: 6px;
}

:is(
  .topics-table th,
  .team-table th,
  .submittal-table th,
  .files-table th,
  .org-list th,
  .audit-table th,
  .rbac-table th,
  .clash-table th,
  .clash-matrix-table th,
  .data-table__th
):hover::after {
  opacity: 0.7;
}

:is(
  .topics-table th.sorted,
  .team-table th.sorted,
  .submittal-table th.sorted,
  .files-table th.sorted,
  .org-list th.sorted,
  .audit-table th.sorted,
  .rbac-table th.sorted,
  .clash-table th.sorted,
  .clash-matrix-table th.sorted,
  .data-table__th.sorted
)::after {
  opacity: 1;
  color: var(--data-std-focus);
}

:is(
  .topics-table th.sort-asc,
  .team-table th.sort-asc,
  .submittal-table th.sort-asc,
  .files-table th.sort-asc,
  .org-list th.sort-asc,
  .audit-table th.sort-asc,
  .rbac-table th.sort-asc,
  .clash-table th.sort-asc,
  .clash-matrix-table th.sort-asc,
  .data-table__th.sort-asc
)::after {
  content: '↑';
}

:is(
  .topics-table th.sort-desc,
  .team-table th.sort-desc,
  .submittal-table th.sort-desc,
  .files-table th.sort-desc,
  .org-list th.sort-desc,
  .audit-table th.sort-desc,
  .rbac-table th.sort-desc,
  .clash-table th.sort-desc,
  .clash-matrix-table th.sort-desc,
  .data-table__th.sort-desc
)::after {
  content: '↓';
}

/* Sortable th: pointer cursor; no-sort th: suppress sort arrow */
.clash-table th.sortable { cursor: pointer; }
.clash-table th.no-sort::after { content: '' !important; opacity: 0 !important; }

/* Issue table: keep View column fixed while scrolling horizontally */
#clash-issues-table th:first-child,
#clash-issues-table td:first-child {
  position: sticky;
  left: 0;
  width: 92px !important;
  min-width: 92px !important;
  max-width: 92px !important;
  background: var(--data-std-surface);
}

#clash-issues-table thead th:first-child {
  z-index: 3;
  background: var(--data-std-muted-surface);
}

#clash-issues-table tbody td:first-child {
  z-index: 2;
  box-shadow: 1px 0 0 var(--data-std-border);
}

:is(
  .topics-table td,
  .team-table td,
  .submittal-table td,
  .files-table td,
  .org-list td,
  .audit-table td,
  .rbac-table td,
  .clash-table td,
  .clash-matrix-table td,
  .data-table__td
) {
  padding: 7px 10px;
  border-bottom: 1px solid var(--data-std-border);
  vertical-align: middle;
  overflow: hidden;
}

:is(
  .topics-table tbody tr,
  .team-table tbody tr,
  .submittal-table tbody tr,
  .files-table tbody tr,
  .org-list tbody tr,
  .audit-table tbody tr,
  .rbac-table tbody tr,
  .clash-table tbody tr,
  .clash-matrix-table tbody tr,
  .data-table__row
) {
  transition: background 0.08s ease;
}

:is(
  .topics-table tbody tr:hover,
  .team-table tbody tr:hover,
  .submittal-table tbody tr:hover,
  .files-table tbody tr:hover,
  .org-list tbody tr:hover,
  .audit-table tbody tr:hover,
  .rbac-table tbody tr:hover,
  .clash-table tbody tr:hover,
  .clash-matrix-table tbody tr:hover,
  .data-table__row:hover
) {
  background: var(--data-std-muted-surface);
}

/* ============================================ */
/* Form Controls & Inputs Standard */
/* ============================================ */

/* All input types */
:is(
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  input[type="search"],
  textarea,
  select
) {
  height: auto;
  min-height: 32px;
  padding: 8px 12px;
  font-size: var(--cde-fs-sm, 12px);
  font-weight: 500;
  font-family: inherit;
  border: 1.5px solid var(--data-std-border);
  border-radius: 6px;
  background: var(--data-std-surface);
  color: var(--data-std-text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* Textarea height override */
textarea {
  min-height: auto;
  resize: vertical;
}

/* Select dropdown arrow */
select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235b6575' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 12px;
  padding-right: 36px;
}

/* Focus state for all inputs */
:is(
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  input[type="search"],
  textarea,
  select
):focus {
  outline: none;
  border-color: var(--data-std-focus);
  box-shadow: 0 0 0 3px rgba(20, 96, 184, 0.12);
  background: var(--data-std-surface);
}

/* Placeholder color */
:is(
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="number"],
  input[type="date"],
  input[type="time"],
  input[type="datetime-local"],
  input[type="search"],
  textarea
)::placeholder {
  color: var(--data-std-placeholder);
}

/* Specific form control classes */
:is(
  .form-input,
  .submittal-input,
  .submittal-select,
  .act-filter-sel,
  .act-filter-date,
  .topics-sel,
  .conflict-select,
  .perm-sel
) {
  min-height: 32px;
  padding: 8px 12px;
  font-size: var(--cde-fs-sm, 12px);
  font-weight: 500;
  font-family: inherit;
  border: 1.5px solid var(--data-std-border) !important;
  border-radius: 6px !important;
  background: var(--data-std-surface) !important;
  color: var(--data-std-text) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none !important;
}

/* Select-specific styling for form control classes */
:is(
  .submittal-select,
  .act-filter-sel,
  .topics-sel,
  .conflict-select,
  .perm-sel
) {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%235b6575' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  background-size: 12px !important;
  padding-right: 36px !important;
  cursor: pointer !important;
}

/* Focus state for form control classes */
:is(
  .form-input,
  .submittal-input,
  .submittal-select,
  .act-filter-sel,
  .act-filter-date,
  .topics-sel,
  .conflict-select,
  .perm-sel
):focus {
  outline: none !important;
  border-color: var(--data-std-focus) !important;
  box-shadow: 0 0 0 3px rgba(20, 96, 184, 0.12) !important;
  background: var(--data-std-surface) !important;
}

/* Hover state for selects */
:is(
  .submittal-select,
  .act-filter-sel,
  .topics-sel,
  .conflict-select,
  .perm-sel
):hover {
  border-color: var(--data-std-border-strong) !important;
}

/* Custom select component wrapper fix */
.cs-select {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  outline: none !important;
}

.cs-select .cs-select__trigger {
  min-height: 32px;
  padding: 8px 12px;
  font-size: var(--cde-fs-sm, 12px);
  font-weight: 500;
  border: 1.5px solid var(--data-std-border);
  border-radius: 6px;
  background: var(--data-std-surface);
  color: var(--data-std-text);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box;
}

.cs-select .cs-select__trigger:focus {
  outline: none;
  border-color: var(--data-std-focus);
  box-shadow: 0 0 0 3px rgba(20, 96, 184, 0.12);
}

/* Clash matrix is a symmetric grid; keep it isolated from generic sortable-table styles. */
.clash-matrix-table th::after {
  content: none !important;
}

.clash-matrix-table col.clash-matrix-col {
  width: calc(100% / var(--matrix-col-count, 3)) !important;
}

.clash-matrix-table th,
.clash-matrix-table td {
  text-align: center !important;
  padding: 4px 6px !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  min-width: 0 !important;
}

.clash-matrix-table .matrix-header-col,
.clash-matrix-table .matrix-header-row {
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
}
