/* ═══════════════════════════════════════════════════════════════════════
   EVA Dependency Tracker — stylesheet
   Colours are kept neutral so the UI adapts to Redmine theme changes.
   Only semantic colours (red = blocked/blocker) are hardcoded.
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Stats row ──────────────────────────────────────────────────────── */
.dep-stats-row {
  display: flex;
  gap: 12px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.dep-stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: #f8f8f8;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 20px;
  min-width: 90px;
}

.dep-stat__count {
  font-size: 26px;
  font-weight: bold;
  line-height: 1;
}

.dep-stat__label {
  font-size: 11px;
  color: #777;
  margin-top: 4px;
  text-align: center;
}

.dep-stat--blocked .dep-stat__count { color: #a94442; }

/* ── Sprint chip filter bar ─────────────────────────────────────────── */
.dep-filter-bar {
  background: #f8f8f8;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 8px 12px;
  margin-bottom: 16px;
  position: relative;
}

.dep-filter-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.dep-filter-label {
  font-size: 12px;
  font-weight: bold;
  color: #333;
  white-space: nowrap;
}

.dep-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
  flex: 1;
}

.dep-filter-all {
  font-size: 12px;
  color: #999;
  font-style: italic;
}

.dep-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #e8f0fe;
  color: #1a56db;
  border: 1px solid #c3d3f7;
  border-radius: 20px;
  font-size: 11px;
  font-weight: bold;
  padding: 2px 8px 2px 10px;
  white-space: nowrap;
}

.dep-chip__remove {
  background: none;
  border: none;
  color: #555;
  font-size: 14px;
  font-weight: bold;
  line-height: 1;
  cursor: pointer;
  padding: 0 1px;
  border-radius: 50%;
}
.dep-chip__remove:hover { color: #a94442; }

.dep-add-btn {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #628db6;
  color: #fff;
  border: none;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
}
.dep-add-btn:hover { background: #4a7a9b; }

.dep-filter-showall { margin-top: 6px; }
.dep-filter-link { font-size: 11px; color: #777; text-decoration: underline; cursor: pointer; }
.dep-filter-link:hover { color: #333; }

/* Checkbox dropdown */
.dep-sprint-dropdown {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 200;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
  min-width: 260px;
  max-width: 340px;
}

.dep-sprint-dropdown__list {
  max-height: 240px;
  overflow-y: auto;
  padding: 6px 0;
}

.dep-sprint-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  cursor: pointer;
  font-size: 12px;
  color: #333;
}
.dep-sprint-option:hover { background: #f4f4f4; }

.dep-sprint-option input[type=checkbox] {
  flex-shrink: 0;
  width: 14px;
  height: 14px;
  cursor: pointer;
}

.dep-sprint-option__name { flex: 1; font-weight: bold; }
.dep-sprint-option__note { font-size: 10px; color: #999; font-style: italic; }

.dep-sprint-option--backlog {
  border-top: 1px solid #eee;
  margin-top: 4px;
  padding-top: 8px;
}

.dep-sprint-dropdown__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px 9px;
  border-top: 1px solid #eee;
}

.dep-filter-btn {
  font-size: 11px;
  font-weight: bold;
  padding: 4px 14px;
  border-radius: 3px;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  display: inline-block;
  font-family: Verdana, sans-serif;
}
.dep-filter-btn--apply { background: #628db6 !important; color: #fff !important; border: none !important; }
.dep-filter-btn--apply:hover { background: #4a7a9b !important; }
.dep-filter-btn--clear { background: #f4f4f4; color: #555; border: 1px solid #ccc; }
.dep-filter-btn--clear:hover { background: #e8e8e8; }

/* ── Sprint section headers ──────────────────────────────────────────── */
.dep-sprint-section { margin-bottom: 20px; }

.dep-sprint-header {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  background: #e8e8e8;
  border: 1px solid #c8c8c8;
  border-bottom: 2px solid #aaa;
}

.dep-sprint-name { font-size: 13px; font-weight: bold; color: #333; }
.dep-sprint-dates { font-size: 11px; color: #777; }

.dep-sprint-status {
  font-size: 10px;
  font-weight: bold;
  padding: 1px 7px;
  border-radius: 3px;
}

.dep-sprint-status--open   { background: #dff0d8; color: #3c763d; border: 1px solid #c3e6cb; }
.dep-sprint-status--active { background: #d9edf7; color: #31708f; border: 1px solid #bce8f1; }
.dep-sprint-status--closed { background: #f4f4f4; color: #777; border: 1px solid #ddd; }

.dep-sprint-count { margin-left: auto; font-size: 11px; color: #777; }

/* ── Empty sprint state ── */
.dep-sprint-empty {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 14px;
  background: #dff0d8;
  border: 1px solid #c3e6cb;
  border-top: none;
  font-size: 12px;
  color: #3c763d;
}

.dep-sprint-empty__icon { font-size: 14px; flex-shrink: 0; }

/* ── Issue list (new design) ─────────────────────────────────────────── */
.dep-issue-list {
  border: 1px solid #ccc;
  border-top: none;
  background: #fff;
}

.dep-issue-row {
  padding: 10px 14px;
  border-bottom: 1px solid #ddd;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.dep-issue-row:last-child { border-bottom: none; }
.dep-issue-row:nth-child(even) { background: #f9f9f9; }
.dep-issue-row:nth-child(odd)  { background: #fff; }

/* Top line */
.dep-issue-row__top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.dep-issue-link {
  font-weight: bold;
  font-size: 13px;
  flex: 1;
}

.dep-blocked-badge {
  display: inline-block;
  background: #f2dede;
  color: #a94442;
  font-size: 11px;
  font-weight: bold;
  padding: 2px 8px;
  border-radius: 3px;
  border: 1px solid #ebccd1;
  white-space: nowrap;
  flex-shrink: 0;
}

/* Meta line */
.dep-issue-row__meta {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  flex-wrap: wrap;
}

.dep-meta-label {
  color: #888;
  font-weight: bold;
  white-space: nowrap;
}

.dep-root-ref {
  color: #a94442;
  font-weight: bold;
}

.dep-meta-sep { color: #ccc; }

/* Chain text */
.dep-chain-id { font-weight: bold; text-decoration: none; }
.dep-chain-id--root  { color: #a94442 !important; }
.dep-chain-id--focal { text-decoration: underline; font-weight: bold; }
.dep-chain-sep { color: #aaa; }

/* View / Hide toggle button — matches Redmine's contextual link style */
.dep-view-btn {
  margin-left: auto;
  background: none;
  border: 1px solid #ccc;
  color: #555;
  font-size: 11px;
  font-family: Verdana, sans-serif;
  padding: 2px 8px;
  border-radius: 2px;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}

.dep-view-btn:hover {
  background: #f4f4f4;
  border-color: #999;
  color: #333;
}

/* Expand/collapse panel */
.dep-hidden { display: none !important; }

.dep-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 6px;
}

.dep-expand-table {
  width: 100%;
  min-width: 480px;
  font-size: 12px;
  table-layout: fixed;
  border-collapse: collapse;
  border: 1px solid #ddd;
}

.dep-expand-table th {
  background: #f0f0f0;
  border-bottom: 2px solid #d0d0d0;
  border-right: 1px solid #e0e0e0;
  padding: 6px 10px;
  font-weight: bold;
  color: #444;
  text-align: left;
  white-space: nowrap;
  vertical-align: middle !important;
}
.dep-expand-table th:last-child { border-right: none; }

.dep-expand-table td {
  border-bottom: 1px solid #ebebeb;
  border-right: 1px solid #ebebeb;
  padding: 6px 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle !important;
  text-align: left !important;
}
.dep-expand-table td:last-child { border-right: none; }
.dep-expand-table tr:last-child td { border-bottom: none; }

.dep-expand-table tbody tr:hover { background: #f5f8ff !important; }

.dep-expand-table th:nth-child(1),
.dep-expand-table td:nth-child(1) { width: 75px; }

.dep-expand-table th:nth-child(2),
.dep-expand-table td:nth-child(2) { width: 110px; }

.dep-expand-table th:nth-child(4),
.dep-expand-table td:nth-child(4) { width: 160px; }

.dep-td-subject {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 0;
}

/* Root blocker row — red left accent */
.dep-expand-table tbody tr.dep-row-root td:first-child {
  border-left: 3px solid #a94442;
  padding-left: 7px;
}

/* Focal (blocked) row — blue left accent */
.dep-expand-table tbody tr.dep-row-focal td:first-child {
  border-left: 3px solid #628db6;
  padding-left: 7px;
}

/* ── Issue detail badge (used on issue show page) ────────────────────── */
.dep-badge {
  display: inline-block;
  font-size: 10px;
  font-weight: bold;
  padding: 2px 6px;
  border-radius: 3px;
  color: #fff;
  white-space: nowrap;
}

.dep-badge--blocked  { background: #a94442; }
.dep-badge--blocking { background: #8a6d3b; }
.dep-badge--related  { background: #31708f; }
.dep-badge--none     { background: #777; }

/* ── Agile board fix ─────────────────────────────────────────────────── */
div.agile-board.autoscroll {
  overflow-x: auto !important;
  overflow-y: visible !important;
}

table.list.issues-board { table-layout: fixed !important; }

table.list.issues-board th,
table.list.issues-board td {
  width: 200px !important;
  min-width: 200px !important;
  max-width: 200px !important;
}

/* ── Mobile responsive ──────────────────────────────────────────────── */
@media (max-width: 768px) {
  .dep-stats-row { gap: 8px; }
  .dep-stat { padding: 8px 14px; }
  .dep-stat__count { font-size: 20px; }

  .dep-filter-row { flex-wrap: wrap; gap: 6px; }
  .dep-sprint-dropdown { min-width: 200px; max-width: calc(100vw - 40px); }

  .dep-sprint-header { flex-wrap: wrap; gap: 6px; padding: 6px 10px; }
  .dep-sprint-dates { display: none; }

  .dep-issue-row { padding: 8px 10px; }
  .dep-issue-link { font-size: 12px; }
  .dep-issue-row__meta { font-size: 10px; }

  .dep-expand-table { font-size: 11px; }
  .dep-expand-table th:nth-child(4),
  .dep-expand-table td:nth-child(4) { width: 130px; }
}