/*
 * kCube UI enhancements — data grid look for Redmine list tables.
 * Colours come from the kcube theme variables with plain fallbacks.
 */

/* ---- toolbar ------------------------------------------------------------ */

.kc-grid-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-block: 0 10px;
  color: var(--kc-ink-soft, #495057);
  font-size: 0.875rem;
}

.kc-grid-search {
  flex: 1 1 200px;
  max-inline-size: 460px;
  display: flex;
  align-items: center;
  gap: 8px;
  min-inline-size: 0;
  block-size: 36px;
  padding-inline: 12px;
  border: 1px solid var(--kc-input-border, #c9d1da);
  border-radius: 6px;
  background: #fff;
  color: #6b7480;
}

.kc-grid-search:focus-within {
  border-color: var(--kc-blue-light, #5b9bd5);
  box-shadow: 0 0 0 2px var(--kc-blue-tint, #e6f4fb);
}

.kc-grid-search input[type="search"] {
  flex: 1 1 auto;
  min-inline-size: 0;
  border: 0;
  block-size: auto;
  padding: 0;
  background: transparent;
  font-size: 0.9375rem;
  color: var(--kc-ink, #212529);
}

.kc-grid-search input[type="search"]:focus { outline: none; box-shadow: none; }

.kc-grid-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  inline-size: 36px;
  block-size: 36px;
  border: 1px solid var(--kc-input-border, #c9d1da);
  border-radius: 6px;
  background: #fff;
  color: var(--kc-ink-soft, #495057);
  cursor: pointer;
  padding: 0;
  text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.kc-grid-btn:hover {
  border-color: var(--kc-blue, #2f6fb3);
  color: var(--kc-blue-deep, #1f4f80);
  background: var(--kc-blue-tint, #e6f4fb);
  text-decoration: none;
}

.kc-grid-btn.is-disabled { color: #b8c0cb; cursor: default; }
.kc-grid-btn.is-disabled:hover { border-color: var(--kc-input-border, #c9d1da); background: #fff; }

.kc-grid-nav { display: inline-flex; gap: 4px; }

.kc-grid-range {
  font-variant-numeric: tabular-nums;
  color: var(--kc-ink, #212529);
  white-space: nowrap;
  padding-inline: 4px;
}

.kc-grid-perpage {
  block-size: 36px;
  border-radius: 6px;
  padding-inline: 8px 26px;
  min-inline-size: 72px;
}

#content .pagination.kc-pagination-replaced { display: none !important; }
@media print { #content .pagination.kc-pagination-replaced { display: inline !important; } }

/* ---- table ------------------------------------------------------------ */

#content table.list {
  border: 1px solid var(--kc-menu-line, #dde2e8);
  border-radius: 6px;
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
}

#content table.list th,
#content .table-list-header {
  background: var(--kc-green-tint, #eef7e3);
  color: var(--kc-green-deep, #4f7a0c);
  font-weight: 500;
  font-size: 0.875rem;
  padding: 10px 8px;
  border-block-end: 1px solid #d5e8bf;
  text-align: start;
}

#content table.list th a { color: inherit; }
#content table.list th a:hover { color: var(--kc-ink, #212529); }
#content table.list th svg.icon-svg { stroke: currentColor; }

#content table.list td {
  padding: 9px 8px;
  border-block-start: 1px solid #e9edf2;
  vertical-align: middle;
  font-size: 0.875rem;
}

#content table.list td.checkbox { padding-inline: 8px 0; inline-size: 24px; }
#content table.list th.checkbox { inline-size: 24px; }

#content table.list:not(.odd-even) tbody tr:nth-child(odd),
#content table.list:not(.odd-even) tbody tr:nth-child(even),
#content table.list tbody tr.odd,
#content table.list tbody tr.even { background: #fff; }

#content table.list tbody tr:hover,
#content table.list tbody tr.odd:hover,
#content table.list tbody tr.even:hover { background: #f5f8fb; }

#content table.list tbody tr.context-menu-selection,
#content table.list tbody tr.context-menu-selection:hover { background: var(--kc-orange-tint, #fff1e6); }

#content table.list tr.group td {
  background: #f6f8fa;
  color: var(--kc-ink, #212529);
  font-weight: 600;
  padding-block: 7px;
}

/* the row-end chevron */
#content table.list td.kc-chevron,
#content table.list th.kc-chevron { inline-size: 28px; padding-inline: 4px 10px; text-align: end; }

#content table.list td.kc-chevron a {
  display: inline-flex;
  color: #98a2b3;
  border-radius: 50%;
  padding: 4px;
}

#content table.list td.kc-chevron a:hover { color: var(--kc-orange-deep, #c65a12); background: var(--kc-orange-tint, #fff1e6); }

/* initials avatar next to a user name */
.kc-user {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-align: start;
}

.kc-avatar {
  flex: 0 0 auto;
  inline-size: 32px;
  block-size: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
}

#content table.list td.user, #content table.list td.author, #content table.list td.assigned_to { text-align: start; }

@media (max-width: 899px) {
  .kc-grid-toolbar { flex-wrap: wrap; }
  .kc-grid-search { flex-basis: 100%; }
  .kc-grid-range { margin-inline-start: auto; }
}

/* totals and export links that moved up from around the table */
.kc-grid-totals {
  margin-inline-start: auto;
  white-space: nowrap;
  color: var(--kc-ink-soft, #495057);
}

.kc-grid-totals .value { font-weight: 700; color: var(--kc-ink, #212529); }
.kc-grid-totals > span + span { margin-inline-start: 10px; }

.kc-grid-formats {
  white-space: nowrap;
  font-size: 0.8125rem;
  color: #6b7480;
}

.kc-grid-formats span + span::before { content: "| "; }

/* the grid follows the Details/Report tabs directly */
#content .tabs:has(+ form .kc-grid-toolbar),
#content .tabs:has(+ .kc-grid-toolbar) { margin-block-end: 8px; }