/* Tasks > Index (Kanban) page styles extracted from templates/tasks/index.html */
/* Unassigned task visual: soft reddish grey background and subtle dashed border */
.task-card.unassigned {
  background-color: rgba(220, 53, 69, 0.06); /* bootstrap danger tint */
  border: 1px dashed rgba(220, 53, 69, 0.35);
}
[data-bs-theme="dark"] .task-card.unassigned {
  background-color: rgba(220, 53, 69, 0.12);
  border-color: rgba(220, 53, 69, 0.45);
}

/* Prevent long titles from expanding column width */
.kanban-body, .task-column, .task-card { min-width: 0; }
.task-card { width: 100%; }
/* Constrain board to viewport width to avoid horizontal overflow */
.kanban-board {
  overflow-x: hidden; /* keep page header/actions visible */
  overflow-y: visible;
  width: 100%;
  max-width: 100%;
  max-height: none !important;
  height: 100%; /* ensure columns get full board height */
}
.kanban-column { 
  min-width: 0;
  min-height: 0; /* important for inner scroll */
  height: 100%; /* will be set by board height */
}
/* Use CSS Grid to ensure all columns fit container width with no horizontal scroll */
.kanban-board .kanban-scroll > .row {
  display: grid !important;
  grid-template-columns: repeat(var(--kanban-cols, 4), minmax(0, 1fr));
  align-items: stretch;
  height: 100%; /* ensure columns get full board height */
  min-height: 0; /* allow children to shrink and enable inner scroll */
  margin-right: 0;
  margin-left: 0;
  gap: 0 0; /* no gutters to avoid overflow */
  --bs-gutter-x: 0; /* neutralize Bootstrap gutter variables */
  --bs-gutter-y: 0;
}
/* Columns become grid items and must stretch */
.kanban-board .kanban-scroll > .row > [class*="col-"],
.kanban-board .kanban-scroll > .row > .kanban-col {
  min-width: 0;
  min-height: 0; /* allow column to shrink so body can scroll */
  max-width: none;
  width: auto;
  display: flex !important;
  flex-direction: column;
  height: 100%; /* match grid row height */
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Ensure flex children can shrink so ellipsis works */
.task-header > .d-flex { min-width: 0; }
.task-title-wrap, .task-title-line { min-width: 0; overflow: hidden; flex: 1 1 auto; }
.task-title-line { width: 100%; }
.task-actions { flex: 0 0 auto; }
.task-title-line { gap: 0.3rem; }
/* Title ellipsis on one line */
.task-title.one-line {
  display: block;
  max-width: 100%;
  flex: 1 1 0px; /* allow to shrink */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.9rem;
  line-height: 1.15;
}

/* Clickable task title link */
.task-title-link {
  flex: 1 1 0px;
  min-width: 0;
  color: inherit !important;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.task-title-link:hover {
  opacity: 0.7;
}

.task-title-link:hover .task-title {
  text-decoration: underline;
}

.task-title-link .task-title {
  color: inherit;
}

/* Description should match title truncation - single line with ellipsis */
.task-card .task-description.two-lines {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
  -webkit-box-orient: unset !important;
  max-height: none !important;
}
/* Also ensure any inline pills/badges don't force growth */
.task-title-line > * { flex-shrink: 0; }
.task-title-line > .task-title { flex-shrink: 1; }
.task-title-line .priority-dot, .task-title-line .status-badge-mini { flex: 0 0 auto; }
.task-title-wrap { display: flex; flex-direction: column; }
.task-meta-line { min-width: 0; }
/* Truncate long project pills to avoid widening */
.task-meta-line .project-pill {
  display: inline-block;
  max-width: 55%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: bottom;
}
/* Defensive: prevent any long unbroken strings from expanding cards */
.task-card { overflow: hidden; }
.task-card * { -webkit-user-drag: none; user-select: none; -webkit-user-select: none; }
.task-card, .task-card * { word-break: break-word; overflow-wrap: anywhere; }
.kanban-column .task-card { width: 100%; max-width: none; padding: 0.4rem 0.5rem; }

/* Make meta and labels slightly smaller to reduce visual bulk */
.task-footer .task-meta small { font-size: 0.78rem; }
.task-labels .badge { font-size: 0.68rem; padding: 0.15rem 0.35rem; }

/* Clamp description to two lines */
.task-description.two-lines {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* Improve cross-browser consistency */
  line-clamp: 2;
  white-space: normal;
  text-overflow: ellipsis;
}

/* Drag and Drop Animations */
.task-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
  -webkit-user-drag: element;
  user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  /* Allow natural vertical scrolling on touch until drag is clearly intended */
  touch-action: pan-y;
}

/* Positioning context for due badge */
.task-card { position: relative; }

/* Small circular badge for time remaining */
.task-card .due-badge {
  position: absolute;
  top: 6px;
  right: 8px;
  background: var(--bs-secondary-bg, #f1f1f1);
  color: var(--bs-body-color, #212529);
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 999px;
  font-size: 0.70rem;
  line-height: 1;
  padding: 0.25rem 0.4rem;
  min-width: 1.5rem;
  text-align: center;
  font-weight: 600;
  z-index: 1;
}
[data-bs-theme="dark"] .task-card .due-badge {
  background: rgba(255,255,255,0.08);
  color: var(--bs-body-color, #e9ecef);
  border-color: rgba(255,255,255,0.15);
}

/* Cards with compact layout - single line text */
.kanban-board .task-card {
  display: block; /* Simple block layout */
  max-height: none !important;
  height: auto;
  padding: 0.75rem;
  margin-bottom: 0.75rem;
}

.task-card .task-header {
  margin-bottom: 0.5rem;
}

.task-card .task-content {
  margin-bottom: 0.5rem;
}

.task-card .task-footer {
  margin-top: 0.5rem;
}

/* Ensure description doesn't cause overflow - single line like title */
.task-card .task-description {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  line-height: 1.5 !important;
  padding-bottom: 0.25rem;
}

/* Natural sizing for title and labels - no restrictions */
.task-card .task-title-wrap {
  max-height: none;
  overflow: visible;
}

.task-card .task-labels {
  max-height: none;
  overflow: visible;
}

.task-card.dragging {
  opacity: 0.5;
  transform: rotate(5deg) scale(1.05);
  z-index: 1000;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
  cursor: grabbing;
  transition: none; /* Remove transition during drag for instant feedback */
  position: relative; /* Prevent affecting layout */
}

/* Prevent scroll during drag operations - only on containers */
/* During drag, allow containers to overflow but keep kanban-body scrolling so scrollbars don't disappear */
body.dragging-cards .kanban-board,
body.dragging-cards .kanban-scroll,
body.dragging-cards .kanban-column {
  overflow: visible !important;
  max-height: none !important;
}

/* While dragging, disable interactive children so they don't cancel the drag */
body.dragging-cards .task-card a,
body.dragging-cards .task-card button,
body.dragging-cards .task-card input,
body.dragging-cards .task-card textarea,
body.dragging-cards .task-card select,
body.dragging-cards .task-card [role="button"] {
  pointer-events: none !important;
}

/* SortableJS drag states */
.sortable-ghost {
  opacity: 0.5;
  background: var(--bs-primary-bg-subtle, #cfe2ff) !important;
  border: 2px dashed var(--bs-primary, #0d6efd) !important;
  transform: rotate(1deg);
  transition: all 0.2s ease;
}

.sortable-chosen {
  opacity: 0.9;
  transform: scale(1.03);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
  z-index: 1000;
  transition: all 0.2s ease;
}

.sortable-drag {
  opacity: 1;
  transform: rotate(3deg) scale(1.05);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
  z-index: 1001;
  transition: none;
}

/* Smooth column highlighting during drag */
.kanban-column.drag-over .kanban-body {
  background-color: var(--bs-primary-bg-subtle, #cfe2ff);
  border: 2px solid var(--bs-primary, #0d6efd);
  transition: all 0.2s ease;
}

/* Improve drag responsiveness */
.sortable-fallback {
  opacity: 0.8;
  transform: rotate(2deg);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}

/* Keep text truncation even during drag */
body.dragging-cards .task-title,
body.dragging-cards .task-title-link,
body.dragging-cards .task-description,
body.dragging-cards .project-pill {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Columns with equal height - NO max constraints */
.kanban-column {
  transition: background-color 0.2s ease, border 0.2s ease;
  overflow: visible !important;
  max-height: none !important;
  height: 100%; /* Fill parent to match other columns */
  display: flex !important;
  flex-direction: column !important;
  width: 100%;
}

/* Keep column header visible while body scrolls */
.kanban-header {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--bs-body-bg,#fff);
  border-bottom: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 1px 0 rgba(0,0,0,0.03);
}
[data-bs-theme="dark"] .kanban-header {
  background: var(--bs-body-bg,#0d0f12);
  border-bottom-color: rgba(255,255,255,0.08);
}

.kanban-body {
  overflow-x: hidden;
  overflow-y: auto; /* only column body scrolls */
  scrollbar-gutter: stable both-edges; /* reserve space for scrollbar */
  display: block;
  flex: 1 1 auto; /* grow to fill remaining space */
  min-height: 0; /* allow flex child to shrink */
}

/* Make column scrollbars clearly visible (WebKit/Blink) */
.kanban-body::-webkit-scrollbar { width: 10px; }
.kanban-body::-webkit-scrollbar-track { background: var(--bs-secondary-bg, #f1f1f1); border-left: 1px solid rgba(0,0,0,0.05); }
.kanban-body::-webkit-scrollbar-thumb { background-color: rgba(108,117,125,0.6); border-radius: 6px; border: 2px solid transparent; background-clip: padding-box; }
[data-bs-theme="dark"] .kanban-body::-webkit-scrollbar-track { background: #1f1f1f; border-left-color: rgba(255,255,255,0.06); }
[data-bs-theme="dark"] .kanban-body::-webkit-scrollbar-thumb { background-color: rgba(173,181,189,0.6); }

/* Firefox scrollbar */
.kanban-body { scrollbar-width: thin; scrollbar-color: rgba(108,117,125,0.7) var(--bs-secondary-bg, #f1f1f1); }
[data-bs-theme="dark"] .kanban-body { scrollbar-color: rgba(173,181,189,0.7) #1f1f1f; }

.kanban-column.drag-over {
  background-color: rgba(13, 110, 253, 0.05);
  border: 2px dashed rgba(13, 110, 253, 0.4);
}

/* Inner container for columns - no horizontal scroll (fit columns) */
.kanban-board .kanban-scroll {
  overflow-x: hidden; /* no horizontal scroll */
  overflow-y: hidden !important; /* no vertical scroll on container */
  max-width: 100%;
  width: 100%;
  height: 100%; /* inherit board height for inner layout */
}

/* Neutralize flex-nowrap on the Kanban row just in case */
.kanban-board .row.flex-nowrap { flex-wrap: wrap !important; }

.kanban-board {
  overflow-x: hidden !important; /* never allow horizontal overflow */
  overflow-y: hidden !important; /* board itself doesn't scroll vertically */
  width: 100%;
  /* Fixed height relative to viewport, adjustable via JS */
  height: var(--kanban-board-height, 70vh);
}

/* Ensure no overflow on containers, but preserve text truncation */
/* Avoid forcing page horizontal scroll */
.kanban-board,
.kanban-scroll,
.kanban-column,
.kanban-body {
  max-width: 100%;
}

/* Ensure main content does not overflow horizontally */
body .wrapper #content { overflow-x: hidden; }

/* Keep text truncation working - override wildcard */
.task-title,
.task-title-link,
.task-description,
.task-meta-line,
.project-pill {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}