/* Smart Agile board styles. Scoped under .smart-agile-board so they never
 * collide with the host theme or another agile plugin.
 * Copyright (C) 2026 Smart IT Soft / Nguyen Thien An. MIT License. */

/* ---- Board layout ---- */
.smart-agile-board { position: relative; overflow-x: auto; }
.smart-agile-board table.issues-board {
  table-layout: fixed; width: 100%; border-collapse: collapse;
  border: 1px solid #d0d7de; background: #fff;
}
.smart-agile-board table.issues-board thead th {
  background: #f6f8fa; border: 1px solid #d0d7de; padding: 6px 8px;
  font-weight: bold; text-align: left; vertical-align: middle; white-space: normal;
}
.smart-agile-board table.issues-board thead th span.count { color: #888; font-weight: normal; }
.smart-agile-board table.issues-board thead th span.hours { float: right; color: #888; font-size: 90%; font-weight: normal; }

.smart-agile-board td.issue-status-col {
  vertical-align: top; border: 1px solid #d0d7de; padding: 4px;
  background: #fbfcfd; min-height: 60px;
}
.smart-agile-board td.issue-status-col.closed { background: #f4f4f4; }
.smart-agile-board td.issue-status-col.empty { padding-bottom: 30px; }
.smart-agile-board td.issue-status-col.ui-sortable-over,
.smart-agile-board td.issue-status-col.droppable-hover {
  background: #eaf6ff; border-style: dashed;
}

/* ---- Cards ---- */
.smart-agile-board .issue-card {
  position: relative; margin: 5px 3px; padding: 6px 8px;
  border: 1px solid #d5d5d5; border-left: 5px solid #c0c4c8;
  border-radius: 3px; background: #fffff3; cursor: grab;
  box-shadow: 0 1px 1px rgba(0,0,0,.06); word-wrap: break-word;
}
.smart-agile-board .issue-card:hover { box-shadow: 0 2px 5px rgba(0,0,0,.12); }
.smart-agile-board .issue-card.ui-sortable-helper { transform: rotate(2deg); box-shadow: 0 6px 14px rgba(0,0,0,.2); cursor: grabbing; }
.smart-agile-board .issue-card-placeholder { border: 1px dashed #9fb6cd; background: #eaf2fb; margin: 5px 3px; height: 48px; border-radius: 3px; }
.smart-agile-board .issue-card.filtered { opacity: .2; }
.smart-agile-board .issue-card.closed-issue { display: inline-block; white-space: nowrap; }

.smart-agile-board .issue-card p { margin: 2px 0; }
.smart-agile-board .issue-card p.project { text-align: center; background: #fff; border: 1px solid #eee; border-radius: 2px; font-size: 85%; }
.smart-agile-board .issue-card p.issue-id { color: #555; }
.smart-agile-board .issue-card p.issue-id.without-tracker { float: right; }
.smart-agile-board .issue-card p.name { font-weight: bold; }
.smart-agile-board .issue-card p.name a { text-decoration: none; }
.smart-agile-board .issue-card p.attributes { color: #888; font-size: 90%; }
.smart-agile-board .issue-card span.hours { float: right; color: #888; font-size: 90%; }
.smart-agile-board .issue-card .info {
  border-top: 1px solid #eee; margin-top: 5px; padding-top: 5px; font-size: 90%; display: block;
}
.smart-agile-board .issue-card .info.assigned-user img.gravatar { vertical-align: middle; }
.smart-agile-board .issue-card .last_comment { color: #777; font-style: italic; }
.smart-agile-board .issue-card .sub-issues, .smart-agile-board .issue-card .checklist {
  border-top: 1px solid #eee; margin-top: 5px; padding-top: 5px; font-size: 90%;
}
.smart-agile-board .issue-card .checklist li.checked { text-decoration: line-through; color: #999; }
.smart-agile-board .issue-card .thumbnail { height: 120px; background-size: cover; background-position: center; background-repeat: no-repeat; margin-top: 5px; }
.smart-agile-board .issue-card .quick-edit-card { position: absolute; right: 4px; top: 4px; display: none; }
.smart-agile-board .issue-card:hover .quick-edit-card { display: block; }
.smart-agile-board .issue-card .quick-comment { display: none; margin-top: 6px; }
.smart-agile-board .issue-card .quick-comment textarea { width: 100%; box-sizing: border-box; }
.smart-agile-board .issue-card table.progress { margin-top: 5px; width: 100%; }

/* ---- Card color bases ---- */
.smart-agile-board .issue-card.br-red        { border-left-color: #e5534b; }
.smart-agile-board .issue-card.br-green      { border-left-color: #2da44e; }
.smart-agile-board .issue-card.br-blue       { border-left-color: #4a7aaa; }
.smart-agile-board .issue-card.br-turquoise  { border-left-color: #1abc9c; }
.smart-agile-board .issue-card.br-lightgreen { border-left-color: #8bc34a; }
.smart-agile-board .issue-card.br-yellow     { border-left-color: #e3b341; }
.smart-agile-board .issue-card.br-orange     { border-left-color: #e8853a; }
.smart-agile-board .issue-card.br-purple     { border-left-color: #8957e5; }
.smart-agile-board .issue-card.br-gray       { border-left-color: #9aa0a6; }

/* ---- Add issue ---- */
.smart-agile-board .add-issue {
  margin: 5px 3px; padding: 4px; border: 1px dashed #c8c8c8; border-radius: 3px;
  background: transparent; cursor: text;
}
.smart-agile-board .add-issue .new-card__input { width: 100%; border: 0; background: transparent; outline: none; resize: vertical; font-family: inherit; font-size: inherit; box-sizing: border-box; min-height: 20px; }
.smart-agile-board .add-issue .new-card__more { font-size: 85%; color: #5a7a99; text-decoration: none; }
.smart-agile-board .add-issue .new-card__fields { margin-top: 4px; display: flex; flex-wrap: wrap; gap: 3px; }
.smart-agile-board .add-issue .new-card__fields select,
.smart-agile-board .add-issue .new-card__fields input { font-size: 85%; max-width: 100%; }
.smart-agile-board .add-issue .nc-sp { width: 54px; }

/* ---- Loading lock ---- */
.smart-agile-board .lock {
  display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
  background: rgba(255,255,255,.6); z-index: 50;
}

/* ---- Errors ---- */
#smart-agile-board-errors { margin-bottom: 8px; }

/* ---- Sidebar members ---- */
.smart-agile-members .assignable-user { display: inline-block; margin: 2px 4px; padding: 2px 4px; cursor: grab; border-radius: 3px; }
.smart-agile-members .assignable-user.draggable-active { background: #fffff3; border: 1px solid #d5d5d5; }

/* ---- Live updates avatar flash ---- */
.ws-actors-wrapper { position: fixed; right: 16px; bottom: 16px; z-index: 1000; }
.ws-actors-wrapper.hidden { display: none; }

/* ---- Options form ---- */
.smart-agile-options fieldset.card-fields { padding: 6px; }
.smart-agile-options label.floating { display: inline-block; margin-right: 12px; white-space: nowrap; }

/* ---- Charts ---- */
.smart-agile-chart-wrapper { max-width: 900px; }
.smart-agile-save-chart { margin: 8px 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.smart-agile-save-chart .info { color: #888; }
.sa-saved-charts-group { margin: 6px 0 2px; }
.sa-del-chart { color: #c44; text-decoration: none; margin-left: 4px; }
#smart-agile-chart { width: 100%; }
.smart-agile-chart-options p { margin: 6px 0; }

/* ---- Time in status report ---- */
table.smart-agile-status-history td { padding: 3px 8px; }

/* ---- F029: saved-view switcher bar ---- */
.smart-agile-view-bar { margin: 6px 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.smart-agile-view-bar label { color: #555; }
.smart-agile-view-bar #smart-agile-view-switcher { max-width: 280px; }

/* ---- F030: global board ---- */
.smart-agile-preset-tabs { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 8px 0 12px; }
.smart-agile-preset-tabs > a { padding: 3px 10px; border: 1px solid #d0d7de; border-radius: 14px; text-decoration: none; }
.smart-agile-preset-tabs > a.selected { background: #4a7aaa; color: #fff; border-color: #4a7aaa; }
.smart-agile-preset-tabs .sa-preset-form { display: inline-flex; align-items: center; gap: 4px; }
.smart-agile-preset-tabs .sa-preset-label { color: #777; font-size: 90%; }
.smart-agile-global-board table.issues-board th.sa-lane-head { background: #eef1f4; text-align: left; min-width: 130px; position: sticky; left: 0; }
.smart-agile-global-board .issue-card { cursor: default; }
.sa-status-checks label.floating { display: inline-block; margin: 2px 12px 2px 0; white-space: nowrap; }

/* ---- F020: sprint cards & banner ---- */
.smart-agile-sprint-list { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.smart-agile-sprint-card {
  flex: 1 1 280px; max-width: 380px; border: 1px solid #d0d7de; border-radius: 5px;
  padding: 10px 12px; background: #fff; border-left: 4px solid #9aa0a6;
}
.smart-agile-sprint-card.state-active { border-left-color: #2da44e; background: #f6fff8; }
.smart-agile-sprint-card.state-closed { border-left-color: #9aa0a6; opacity: .8; }
.smart-agile-sprint-card.over-capacity { border-left-color: #e5534b; }
.smart-agile-sprint-card .sa-sprint-head { display: flex; justify-content: space-between; align-items: center; }
.smart-agile-sprint-card .sa-sprint-dates { color: #666; font-size: 90%; margin: 3px 0; }
.smart-agile-sprint-card .sa-sprint-goal { font-size: 90%; margin: 4px 0; }
.smart-agile-sprint-card .sa-sprint-stats { font-size: 90%; color: #555; margin: 4px 0; }
.smart-agile-sprint-card .sa-sprint-stats .over { color: #b91c1c; font-weight: bold; }
.smart-agile-sprint-card .sa-sprint-actions { margin-top: 6px; }
.sa-sprint-state, .badge-open, .badge-active, .badge-closed {
  font-size: 78%; padding: 1px 7px; border-radius: 10px; color: #fff; white-space: nowrap;
}
.badge-open { background: #6b7280; } .badge-active { background: #2da44e; } .badge-closed { background: #9aa0a6; }
.sa-close-modal { margin-top: 8px; padding: 8px; border: 1px solid #e5534b; border-radius: 4px; background: #fff7f7; }
.sa-close-modal .sa-close-q { font-weight: bold; margin: 0 0 4px; }

.smart-agile-sprint-banner {
  margin: 8px 0; padding: 6px 12px; border-radius: 4px; background: #eef6ff;
  border: 1px solid #bcd; font-size: 95%;
}
.smart-agile-sprint-banner.over-capacity { background: #fff2f0; border-color: #e5534b; }
.smart-agile-sprint-banner .over { color: #b91c1c; font-weight: bold; }
.smart-agile-sprint-banner .sa-clear-sprint { margin-left: 10px; font-size: 90%; }

/* ---- F021: backlog planner ---- */
.smart-agile-backlog { display: flex; gap: 14px; align-items: flex-start; }
.smart-agile-backlog .sa-backlog-left { flex: 1 1 68%; min-width: 0; }
.smart-agile-backlog .sa-backlog-right { flex: 0 0 30%; min-width: 220px; }
.sa-backlog-list { list-style: none; margin: 0; padding: 0; border: 1px solid #e0e0e0; border-radius: 4px; min-height: 60px; }
.sa-backlog-row {
  display: flex; align-items: center; gap: 8px; padding: 5px 8px; border-bottom: 1px solid #f0f0f0;
  background: #fff; cursor: grab;
}
.sa-backlog-row:last-child { border-bottom: 0; }
.sa-backlog-row:hover { background: #fafcff; }
.sa-backlog-row .sa-drag-handle { color: #bbb; cursor: grab; }
.sa-backlog-row .sa-bl-tracker { color: #777; font-size: 85%; }
.sa-backlog-row .sa-bl-subject { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sa-backlog-row .sa-bl-assignee { color: #567; font-size: 85%; }
.sa-backlog-row .sa-bl-sp { font-weight: bold; color: #444; min-width: 38px; text-align: right; }
.sa-backlog-placeholder { border: 1px dashed #9fb6cd; background: #eaf2fb; height: 28px; }
.sa-sprint-target {
  border: 1px solid #d0d7de; border-radius: 5px; padding: 8px 10px; margin-bottom: 10px; background: #fff;
  border-top: 3px solid #6b7280;
}
.sa-sprint-target.state-active { border-top-color: #2da44e; }
.sa-sprint-target.over-capacity { border-top-color: #e5534b; }
.sa-sprint-target .sa-sprint-target-head { display: flex; justify-content: space-between; align-items: center; }
.sa-sprint-target .sa-sprint-target-meta { font-size: 85%; color: #666; margin: 3px 0; }
.sa-sprint-target .sa-sprint-target-meta .over { color: #b91c1c; font-weight: bold; }
.sa-sprint-droplist { list-style: none; margin: 4px 0 0; padding: 0; min-height: 36px; border: 1px dashed #cfd6dd; border-radius: 3px; }
.sa-sprint-droplist:empty::after { content: attr(data-empty); display: block; color: #aaa; text-align: center; padding: 8px; font-size: 85%; }

/* ---- F024: WIP limits ---- */
.smart-agile-board table.issues-board thead th.smart-agile-wip-over { background: rgba(220,38,38,.10); color: #b91c1c; }
.smart-agile-board table.issues-board thead th.smart-agile-wip-over span.count { color: #b91c1c; }
.smart-agile-wip-counter { font-weight: normal; }
.smart-agile-wip-warning { color: #dc2626; }
.smart-agile-wip-settings .smart-agile-wip-table { border-collapse: collapse; margin-top: 4px; }
.smart-agile-wip-settings .smart-agile-wip-table td { padding: 1px 8px 1px 0; }
.smart-agile-wip-settings .smart-agile-wip-table td.name { color: #555; }
.smart-agile-wip-settings .smart-agile-wip-input { width: 64px; }
.smart-agile-wip-suggest { margin-left: 10px; }

/* ---- F025: manual card colour picker ---- */
.smart-agile-board .issue-card .set-color { margin-left: 4px; text-decoration: none; }
.smart-agile-color-pop { background: #fff; border: 1px solid #ccc; border-radius: 4px; padding: 4px; box-shadow: 0 2px 8px rgba(0,0,0,.2); display: flex; gap: 3px; }
.smart-agile-color-pop .sa-swatch { width: 18px; height: 18px; border-radius: 3px; cursor: pointer; border: 1px solid rgba(0,0,0,.15); display: inline-block; }
.smart-agile-color-pop .sa-swatch-clear { background: #fff; color: #666; text-align: center; line-height: 18px; font-size: 12px; }

/* ---- F022: board subcolumns ---- */
.smart-agile-board td.has-subcolumns { padding: 2px; }
.smart-agile-board .smart-agile-subcolumns { display: flex; gap: 3px; align-items: stretch; }
.smart-agile-board .smart-agile-subcolumn { flex: 1 1 0; min-width: 0; border-left: 1px dashed #cfd6dd; padding: 2px; min-height: 40px; }
.smart-agile-board .smart-agile-subcolumn:first-child { border-left: 0; }
.smart-agile-board .smart-agile-subcolumn .sub-label { font-size: 78%; color: #8a8f96; text-transform: uppercase; letter-spacing: .03em; padding: 1px 2px 3px; }
.smart-agile-subcol-settings .smart-agile-subcol-table td { padding: 1px 8px 1px 0; }
.smart-agile-subcol-settings .smart-agile-subcol-table td.name { color: #555; }

/* ---- F023: horizontal swimlanes ---- */
.smart-agile-board tr.smart-agile-swimlane-header td {
  background: #eef1f4; font-weight: bold; padding: 5px 8px; border: 1px solid #d0d7de;
}
.smart-agile-board tr.smart-agile-swimlane-header .lane-toggle { cursor: pointer; margin-right: 4px; user-select: none; }
.smart-agile-board tr.smart-agile-swimlane-header .count { color: #888; font-weight: normal; }

/* ---- F028: issue detail drawer ---- */
.smart-agile-detail {
  position: fixed; top: 0; right: 0; width: 420px; max-width: 92vw; height: 100%;
  background: #fff; border-left: 1px solid #c8c8c8; box-shadow: -3px 0 12px rgba(0,0,0,.18);
  z-index: 2147483646; transform: translateX(100%); transition: transform .18s ease;
  overflow-y: auto; padding: 14px 16px; box-sizing: border-box;
}
.smart-agile-detail.open { transform: translateX(0); }
.smart-agile-detail .sa-detail-head { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #eee; padding-bottom: 6px; }
.smart-agile-detail .sa-detail-close { font-size: 20px; text-decoration: none; color: #888; }
.smart-agile-detail .sa-detail-subject { margin: 10px 0; font-size: 16px; }
.smart-agile-detail table.sa-detail-meta { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.smart-agile-detail table.sa-detail-meta th { text-align: left; color: #666; width: 36%; padding: 3px 6px 3px 0; vertical-align: top; font-weight: normal; }
.smart-agile-detail table.sa-detail-meta td { padding: 3px 0; }
.smart-agile-detail .sa-detail-desc { border: 1px solid #eee; background: #fafafa; padding: 8px; border-radius: 3px; margin-bottom: 12px; font-size: 90%; }
.smart-agile-detail .sa-journal { border-top: 1px solid #f0f0f0; padding: 6px 0; }
.smart-agile-detail .sa-journal-meta { color: #888; font-size: 85%; }
.smart-agile-detail .sa-journal-notes { font-size: 90%; margin-top: 3px; }
.smart-agile-detail .sa-detail-empty { color: #999; font-style: italic; }
.smart-agile-detail .sa-detail-addnote { margin-top: 12px; border-top: 1px solid #eee; padding-top: 10px; }
.smart-agile-detail .sa-note-input { width: 100%; box-sizing: border-box; }
.smart-agile-detail .sa-detail-logtime { margin-left: 10px; font-size: 90%; }

/* ---- F026: compact card layout ---- */
.smart-agile-compact .issue-card { padding: 3px 6px; margin: 3px 3px; }
.smart-agile-compact .issue-card p { margin: 1px 0; }
.smart-agile-compact .issue-card p.attributes,
.smart-agile-compact .issue-card .info.description,
.smart-agile-compact .issue-card .last_comment,
.smart-agile-compact .issue-card table.progress { display: none; }
.smart-agile-compact .issue-card .info.assigned-user { border-top: 0; margin-top: 2px; padding-top: 0; }

/* ---- F025: colour-blind safe palette (Wong) ---- */
.smart-agile-colorblind .issue-card.br-red        { border-left-color: #d55e00; }
.smart-agile-colorblind .issue-card.br-green      { border-left-color: #009e73; }
.smart-agile-colorblind .issue-card.br-blue       { border-left-color: #0072b2; }
.smart-agile-colorblind .issue-card.br-turquoise  { border-left-color: #56b4e9; }
.smart-agile-colorblind .issue-card.br-lightgreen { border-left-color: #f0e442; }
.smart-agile-colorblind .issue-card.br-yellow     { border-left-color: #e69f00; }
.smart-agile-colorblind .issue-card.br-orange     { border-left-color: #cc79a7; }
.smart-agile-colorblind .issue-card.br-purple     { border-left-color: #000000; }
.smart-agile-colorblind .issue-card.br-gray       { border-left-color: #999999; }
