:root {
  --kanban-column-width: 19rem;
  --kanban-gap: 1rem;
}

html,
body {
  min-height: 100%;
}

.app-layout {
  display: flex;
  min-height: calc(100dvh - 57px);
}

.sidebar {
  background: #edf3fb;
  border-right: 0;
  flex: 0 0 14.5rem;
  height: calc(100dvh - 57px);
  position: sticky;
  top: 57px;
}

.workspace-content {
  flex: 1 1 auto;
  min-width: 0;
}

.sidebar-content {
  min-width: 0;
  width: 100%;
}

.sidebar-nav .list-group-item {
  align-items: center;
  border: 0;
  display: flex;
  font-size: .875rem;
  justify-content: space-between;
  padding: .5rem .625rem;
}

.sidebar-nav .list-group-item.active {
  background: #cfe1ff;
  color: var(--bs-primary-text-emphasis);
  font-weight: 600;
}

.sidebar-tag {
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sidebar-priority.active {
  background: #dce9fb;
  border-color: transparent;
  box-shadow: none;
  font-weight: 600;
}

.sidebar-priority {
  border-color: transparent;
  width: 100%;
}

.priority-filter-high {
  color: var(--bs-danger-text-emphasis);
}

.priority-filter-normal {
  color: var(--bs-primary-text-emphasis);
}

.priority-filter-low {
  color: var(--bs-success-text-emphasis);
}

.board-switch {
  color: var(--bs-body-color);
  overflow: hidden;
  padding: .4rem .55rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.board-switch:hover,
.board-switch.active {
  background: #cfe1ff;
  color: var(--bs-primary-text-emphasis);
}

.board-switch.active {
  font-weight: 600;
}

.board-manager-row + .board-manager-row {
  margin-top: .35rem;
}

body {
  background-color: #f4f7fb;
  overflow-x: hidden;
}

/* Use color blocks rather than structural border lines. */
.navbar,
.filter-bar {
  border: 0 !important;
}

.navbar {
  background: #fff !important;
}

.filter-bar {
  background: #f4f7fb !important;
}

.form-control,
.form-select {
  background-color: #fff;
  border-color: transparent;
  box-shadow: none;
}

.form-control:focus,
.form-select:focus {
  border-color: transparent;
  box-shadow: 0 0 0 .2rem rgb(var(--bs-primary-rgb) / .16);
}

.btn-outline-secondary {
  background: var(--bs-tertiary-bg);
  border-color: transparent;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:focus-visible {
  background: var(--bs-secondary-bg);
  border-color: transparent;
  color: var(--bs-body-color);
}

.modal-content,
.offcanvas,
.offcanvas-header,
.sidebar-content .border-top {
  border: 0 !important;
}

.offcanvas-header,
.sidebar-content .border-top {
  background: rgb(255 255 255 / .38);
}

.min-width-0 {
  min-width: 0;
}

.brand-mark {
  align-items: center;
  background: var(--bs-primary);
  border-radius: var(--bs-border-radius);
  color: #fff;
  display: inline-flex;
  flex: 0 0 auto;
  font-size: .8rem;
  font-weight: 700;
  height: 1.75rem;
  justify-content: center;
  width: 1.75rem;
}

.board-shell {
  min-height: calc(100dvh - 105px);
  overflow-x: auto;
  padding: 1rem;
}

#boardColumns,
#loadingState {
  align-items: flex-start;
  display: flex;
  gap: var(--kanban-gap);
  min-width: min-content;
}

.kanban-column,
.add-column-tile {
  flex: 0 0 var(--kanban-column-width);
  width: var(--kanban-column-width);
}

.column-panel {
  border: 0;
  border-radius: var(--bs-border-radius-lg);
  min-height: 12rem;
}

.column-tone-0 .column-panel {
  background: #dff5fd;
}

.column-tone-1 .column-panel {
  background: #fff3cf;
}

.column-tone-2 .column-panel {
  background: #e1f5e8;
}

.column-tone-0 .column-header {
  background: #c9edf9;
}

.column-tone-1 .column-header {
  background: #ffe8a2;
}

.column-tone-2 .column-header {
  background: #ccebd8;
}

.column-header {
  border-radius: calc(var(--bs-border-radius-lg) - 1px) calc(var(--bs-border-radius-lg) - 1px) 0 0;
  padding: .8rem .85rem .5rem;
}

.column-title {
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.25;
}

.column-drag-handle,
.card-drag-handle {
  cursor: grab;
  touch-action: none;
}

.column-drag-handle:active,
.card-drag-handle:active {
  cursor: grabbing;
}

.card-list {
  min-height: 3.75rem;
  padding: .35rem .6rem .6rem;
}

.task-card {
  border: 0;
  cursor: pointer;
  margin-bottom: .55rem;
  transition: box-shadow .15s ease, transform .15s ease;
}

.task-card.priority-high {
  background: #fff0f2;
}

.task-card.priority-normal {
  background: #eef5ff;
}

.task-card.priority-low {
  background: #edf9f1;
}

.task-card:hover {
  box-shadow: 0 .3rem .9rem rgb(34 59 91 / .12);
}

.task-card:active {
  transform: translateY(1px);
}

.task-card .card-body {
  padding: .75rem;
}

.task-title {
  font-size: .9rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.task-description {
  display: -webkit-box;
  font-size: .8rem;
  line-height: 1.45;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.task-tag {
  font-size: .7rem;
}

/* Muted tag fills, shared between navigation and cards. Priority colors stay separate. */
[data-tag-tone="0"] { --tag-bg: #d0e2ff; --tag-ink: #0043ce; --tag-hover: #b8d3ff; }
[data-tag-tone="1"] { --tag-bg: #9ef0f0; --tag-ink: #005d5d; --tag-hover: #75e3e3; }
[data-tag-tone="2"] { --tag-bg: #a7f0ba; --tag-ink: #0e6027; --tag-hover: #82e5a0; }
[data-tag-tone="3"] { --tag-bg: #e8daff; --tag-ink: #6929c4; --tag-hover: #d8c2ff; }
[data-tag-tone="4"] { --tag-bg: #ffd9e8; --tag-ink: #9f1853; --tag-hover: #ffc2da; }
[data-tag-tone="5"] { --tag-bg: #ffdfbd; --tag-ink: #8a3800; --tag-hover: #ffca94; }
[data-tag-tone="6"] { --tag-bg: #fff1b8; --tag-ink: #684e00; --tag-hover: #ffe68a; }
[data-tag-tone="7"] { --tag-bg: #bae6ff; --tag-ink: #00539a; --tag-hover: #94d7ff; }

.sidebar-tag[data-tag-tone],
.task-meta .task-tag[data-tag-tone] {
  background-color: var(--tag-bg);
  color: var(--tag-ink);
}

.sidebar-tag[data-tag-tone]:hover {
  background-color: var(--tag-hover);
  color: var(--tag-ink);
}

.sidebar-tag[data-tag-tone].active,
.sidebar-tag[data-tag-tone]:active {
  background-color: var(--tag-ink);
  color: #fff;
  font-weight: 700;
}

.sidebar-tag[data-tag-tone]:focus-visible {
  outline: 2px solid var(--tag-ink);
  outline-offset: -2px;
  box-shadow: inset 0 0 0 4px #fff;
}

.filter-empty {
  color: var(--bs-secondary-color);
  font-size: .8rem;
  padding: 1rem .5rem;
  text-align: center;
}

.archive-card + .archive-card {
  margin-top: .45rem;
}

.card-drag-handle {
  color: var(--bs-secondary-color);
  font-size: .75rem;
  letter-spacing: -.14rem;
  padding: .1rem .25rem .1rem .1rem;
  user-select: none;
}

.column-footer {
  padding: 0 .6rem .65rem;
}

.column-footer .btn {
  background: rgb(255 255 255 / .58);
  border: 0 !important;
}

.column-footer .btn:hover {
  background: rgb(255 255 255 / .9);
}

.add-column-tile {
  background: #e8eef7;
  border: 0;
  min-height: 4rem;
}

.empty-column {
  background: rgb(255 255 255 / .5);
  border: 0;
  border-radius: var(--bs-border-radius);
  color: var(--bs-secondary-color);
  font-size: .8rem;
  padding: 1rem .5rem;
  text-align: center;
}

.sortable-ghost {
  opacity: .35;
}

.sortable-chosen .column-panel,
.sortable-chosen.task-card {
  box-shadow: var(--bs-box-shadow);
}

.sortable-drag {
  opacity: .95;
  transform: rotate(.5deg);
}

/* A bolder workspace palette: dark navigation, coloured workflow lanes. */
:root {
  --kanban-column-width: 20rem;
}

body {
  background: #eef2f7;
}

.sidebar {
  background: #10284a;
  color: #dce8fb;
}

.sidebar .text-body-secondary,
.sidebar .small.text-body-secondary {
  color: #94aacb !important;
}

.sidebar .btn-link {
  color: #8fc3ff;
}

.sidebar .btn-outline-secondary,
.sidebar .btn-light {
  background: rgb(255 255 255 / .08);
  border-color: transparent;
  color: #dce8fb;
}

.sidebar .btn-outline-secondary:hover,
.sidebar .btn-light:hover {
  background: rgb(255 255 255 / .16);
  color: #fff;
}

.sidebar .board-switch {
  color: #dce8fb;
}

.sidebar .board-switch:hover,
.sidebar .board-switch.active {
  background: #2d68b7;
  color: #fff;
}

.sidebar-nav .list-group-item {
  background: transparent;
  color: #dce8fb;
}

.sidebar-nav .list-group-item:hover {
  background: rgb(255 255 255 / .08);
  color: #fff;
}

.sidebar-nav .list-group-item.active {
  background: #2d68b7;
  color: #fff;
}

.sidebar .badge.text-bg-secondary {
  background: rgb(255 255 255 / .18) !important;
  color: #fff;
}

.sidebar-priority {
  color: #dce8fb;
}

.sidebar-priority.active {
  background: #224f91;
  color: #fff;
}

.sidebar .priority-filter-high { color: #ffb6be; }
.sidebar .priority-filter-normal { color: #abd0ff; }
.sidebar .priority-filter-low { color: #9fe4bf; }

.sidebar-content .border-top {
  background: rgb(0 0 0 / .12);
}

.navbar {
  box-shadow: 0 .35rem 1.2rem rgb(36 58 91 / .06);
}

.brand-mark {
  background: #2d68b7;
  border-radius: .6rem;
}

.filter-bar {
  background: #f7f9fc !important;
}

.form-control,
.form-select {
  background: #fff;
  box-shadow: 0 .15rem .5rem rgb(37 57 87 / .05);
}

.board-shell {
  padding: 1.25rem;
}

#boardColumns,
#loadingState {
  gap: 1.25rem;
}

.column-panel {
  border-radius: 1rem;
  box-shadow: 0 .55rem 1.35rem rgb(37 57 87 / .08);
}

.column-tone-0 .column-panel { background: #d9effa; }
.column-tone-1 .column-panel { background: #fff0cb; }
.column-tone-2 .column-panel { background: #d9f1e4; }

.column-tone-0 .column-header { background: #3583c7; color: #fff; }
.column-tone-1 .column-header { background: #de9637; color: #fff; }
.column-tone-2 .column-header { background: #299668; color: #fff; }

.column-header {
  border-radius: 1rem 1rem 0 0;
  padding: .9rem .9rem .6rem;
}

.column-header .text-secondary,
.column-header .card-drag-handle {
  color: rgb(255 255 255 / .78) !important;
}

.column-header .badge.text-bg-secondary {
  background: rgb(0 0 0 / .28) !important;
  color: #fff;
}

.card-list {
  padding: .55rem .7rem .7rem;
}

.task-card {
  border-radius: .8rem;
  box-shadow: 0 .25rem .65rem rgb(27 52 88 / .08);
  margin-bottom: .7rem;
}

.task-card.priority-high { background: #ffe7ea; }
.task-card.priority-normal { background: #e9f2ff; }
.task-card.priority-low { background: #e4f7eb; }

.task-card .card-body {
  padding: .9rem;
}

.task-title {
  font-weight: 700;
}

.column-footer {
  padding: 0 .7rem .75rem;
}

.column-footer .btn {
  background: rgb(255 255 255 / .7);
  border-radius: .65rem;
}

.add-column-tile {
  background: #e3e9f4;
  border-radius: 1rem;
  box-shadow: 0 .4rem 1.1rem rgb(37 57 87 / .06);
  color: #41536d;
}

.empty-column {
  background: rgb(255 255 255 / .58);
  border-radius: .75rem;
}

.modal-content {
  box-shadow: 0 1rem 3rem rgb(20 36 61 / .2);
}

#mobileSidebar {
  background: #10284a;
  color: #fff;
}

#mobileSidebar .btn-close {
  filter: invert(1);
}

/* Professional enterprise workspace: restrained colour, denser information hierarchy. */
:root {
  --kanban-column-width: 19.25rem;
}

body {
  background: #f4f6f9;
  color: #263548;
}

.sidebar {
  background: #eef2f6;
  color: #334155;
}

.sidebar .text-body-secondary,
.sidebar .small.text-body-secondary {
  color: #718096 !important;
}

.sidebar .btn-link {
  color: #24578e;
}

.sidebar .btn-outline-secondary,
.sidebar .btn-light {
  background: rgb(255 255 255 / .68);
  color: #506176;
}

.sidebar .btn-outline-secondary:hover,
.sidebar .btn-light:hover {
  background: #fff;
  color: #22344b;
}

.sidebar .board-switch {
  color: #405168;
}

.sidebar .board-switch:hover,
.sidebar .board-switch.active {
  background: #dbe8f7;
  color: #1f4f82;
}

.sidebar-nav .list-group-item {
  background: transparent;
  color: #4f6075;
}

.sidebar-nav .list-group-item:hover {
  background: #e3eaf2;
  color: #263f5c;
}

.sidebar-nav .list-group-item.active {
  background: #dbe8f7;
  color: #1f4f82;
}

.sidebar .badge.text-bg-secondary {
  background: #cbd5e1 !important;
  color: #46576d;
}

.sidebar-priority {
  background: transparent;
  color: #506176;
}

.sidebar-priority.active {
  background: #dbe8f7 !important;
  color: #1f4f82 !important;
}

.sidebar .priority-filter-high { color: #a9434d; }
.sidebar .priority-filter-normal { color: #316d9e; }
.sidebar .priority-filter-low { color: #397759; }

.sidebar-content .border-top {
  background: rgb(255 255 255 / .35);
}

.navbar {
  background: #fff !important;
  box-shadow: 0 .15rem .55rem rgb(34 54 82 / .05);
}

.brand-mark {
  background: #1f4f82;
  border-radius: .38rem;
}

.filter-bar {
  background: #fff !important;
}

.form-control,
.form-select {
  background: #f5f7fa;
  box-shadow: none;
}

.form-control:focus,
.form-select:focus {
  background: #fff;
  box-shadow: 0 0 0 .18rem rgb(31 79 130 / .13);
}

.btn-primary {
  --bs-btn-bg: #1f4f82;
  --bs-btn-border-color: #1f4f82;
  --bs-btn-hover-bg: #183f69;
  --bs-btn-hover-border-color: #183f69;
  --bs-btn-active-bg: #183f69;
  --bs-btn-active-border-color: #183f69;
}

.board-shell {
  padding: 1.15rem;
}

#boardColumns,
#loadingState {
  gap: 1rem;
}

.column-panel {
  border-radius: .7rem;
  box-shadow: 0 .2rem .65rem rgb(34 54 82 / .07);
}

.column-tone-0 .column-panel { background: #eaf0f6; }
.column-tone-1 .column-panel { background: #f3f1ed; }
.column-tone-2 .column-panel { background: #ebf2ee; }

.column-tone-0 .column-header { background: #dce7f1; }
.column-tone-1 .column-header { background: #eae5dc; }
.column-tone-2 .column-header { background: #dfece4; }

.column-tone-0 .column-header,
.column-tone-1 .column-header,
.column-tone-2 .column-header {
  color: #2b3b4f;
}

.column-header {
  border-radius: .7rem .7rem 0 0;
  padding: .75rem .8rem .5rem;
}

.column-header .text-secondary,
.column-header .card-drag-handle {
  color: #708096 !important;
}

.column-header .badge.text-bg-secondary {
  background: #7c8ba0 !important;
  color: #fff;
}

.card-list {
  padding: .5rem .55rem .6rem;
}

.task-card {
  background: #fff !important;
  border-radius: .55rem;
  box-shadow: 0 .1rem .3rem rgb(34 54 82 / .08);
  margin-bottom: .55rem;
}

.task-card.priority-high { background: #fffafa !important; }
.task-card.priority-normal { background: #fff !important; }
.task-card.priority-low { background: #fbfefc !important; }

.task-card:hover {
  box-shadow: 0 .3rem .8rem rgb(34 54 82 / .12);
}

.task-card .card-body {
  padding: .75rem;
}

.task-title {
  font-weight: 600;
}

.column-footer {
  padding: 0 .55rem .6rem;
}

.column-footer .btn {
  background: rgb(255 255 255 / .78);
  border-radius: .4rem;
  color: #3d4d61;
}

.column-footer .btn:hover {
  background: #fff;
}

.add-column-tile {
  background: #e8edf3;
  border-radius: .7rem;
  box-shadow: none;
  color: #4e6075;
}

.empty-column {
  background: rgb(255 255 255 / .62);
  border-radius: .45rem;
}

.modal-content {
  box-shadow: 0 1rem 2.5rem rgb(34 54 82 / .18);
}

#mobileSidebar {
  background: #eef2f6;
  color: #334155;
}

#mobileSidebar .btn-close {
  filter: none;
}

/* Workbench layout: contextual header and task lanes rather than floating colour panels. */
.workspace-header .container-fluid {
  min-height: 4.25rem;
}

.workspace-kicker,
.board-overview-kicker,
.lane-step {
  color: #74849a;
  font-size: .64rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.workspace-kicker {
  line-height: 1;
  margin-bottom: .22rem;
}

.filter-bar {
  background: transparent !important;
}

.filter-controls > .row {
  background: #fff;
  border-radius: .7rem;
  box-shadow: 0 .15rem .5rem rgb(34 54 82 / .04);
  padding: .55rem;
}

.filter-controls .form-control,
.filter-controls .form-select {
  background: #f3f5f8;
}

.board-overview {
  align-items: center;
  background: #1e2d42;
  border-radius: .8rem;
  color: #fff;
  display: flex;
  justify-content: space-between;
  margin: .25rem 1.15rem 0;
  padding: 1.15rem 1.3rem;
}

.board-overview-kicker {
  color: #9eb3ce;
}

.board-overview-title {
  font-size: 1.15rem;
  font-weight: 600;
}

.board-overview-copy {
  color: #b9c6d7;
  font-size: .82rem;
}

.board-overview-tip {
  align-items: center;
  background: rgb(255 255 255 / .09);
  border-radius: .5rem;
  color: #d3deeb;
  font-size: .78rem;
  gap: .55rem;
  padding: .55rem .7rem;
}

.board-overview-tip-mark {
  align-items: center;
  background: rgb(255 255 255 / .12);
  border-radius: .32rem;
  display: inline-flex;
  font-size: 1rem;
  height: 1.45rem;
  justify-content: center;
  width: 1.45rem;
}

.board-shell {
  min-height: calc(100dvh - 225px);
  padding: 1rem 1.15rem 1.5rem;
}

#boardColumns,
#loadingState {
  align-items: stretch;
  gap: 1rem;
}

.kanban-column {
  align-self: flex-start;
}

.column-panel {
  background: transparent !important;
  border-radius: 0;
  box-shadow: none;
  min-height: 0;
}

.column-header {
  border-radius: .65rem .65rem 0 0;
  min-height: 4.2rem;
  padding: .65rem .8rem;
}

.column-tone-0 .column-header { background: #e0e8f2; }
.column-tone-1 .column-header { background: #ece8e0; }
.column-tone-2 .column-header { background: #e1ebe4; }

.lane-title-block {
  overflow: hidden;
}

.lane-step {
  color: #708097;
  line-height: 1.1;
  margin-bottom: .26rem;
}

.column-title {
  color: #2b3a4c;
  font-size: .95rem;
  font-weight: 650;
}

.card-list {
  background: #edf1f5;
  min-height: 5rem;
  padding: .55rem;
}

.column-tone-1 .card-list { background: #f1f0ed; }
.column-tone-2 .card-list { background: #edf3ef; }

.column-footer {
  background: #edf1f5;
  border-radius: 0 0 .65rem .65rem;
  padding: 0 .55rem .65rem;
}

.column-tone-1 .column-footer { background: #f1f0ed; }
.column-tone-2 .column-footer { background: #edf3ef; }

.column-footer .btn {
  background: #fff;
  color: #5d6c7e;
  font-weight: 500;
  padding: .48rem .65rem;
}

.task-card {
  background: #fff !important;
  border-radius: .5rem;
  box-shadow: 0 .12rem .38rem rgb(29 47 72 / .07);
  margin-bottom: .55rem;
}

.task-card.priority-high { background: #fff !important; }
.task-card.priority-normal { background: #fff !important; }
.task-card.priority-low { background: #fff !important; }

.task-card .card-body {
  padding: .75rem .8rem;
}

.task-title {
  color: #263548;
  font-size: .88rem;
  font-weight: 600;
}

.task-description {
  color: #708096 !important;
  font-size: .77rem;
}

.task-meta {
  margin-top: .7rem !important;
}

.task-meta .badge {
  border-radius: .28rem;
  font-size: .66rem;
  font-weight: 500 !important;
  letter-spacing: .01em;
}

.add-column-tile {
  align-self: flex-start;
  background: #e9eef4;
  border-radius: .65rem;
  box-shadow: none;
  min-height: 4.2rem;
  padding: .8rem;
}

.empty-column,
.filter-empty {
  background: rgb(255 255 255 / .5);
  border-radius: .4rem;
  padding: 1.2rem .6rem;
}

/* Urgent work stays visible without adding a permanent border treatment. */
.task-card.priority-high {
  animation: high-priority-breathe 2.6s ease-in-out infinite;
}

@keyframes high-priority-breathe {
  0%,
  100% {
    box-shadow: 0 .12rem .38rem rgb(29 47 72 / .07);
  }

  50% {
    box-shadow: 0 0 0 .24rem rgb(194 65 78 / .13), 0 .5rem 1rem rgb(194 65 78 / .2);
  }
}

/* Compact control-console components: crisp blocks, restrained radius, no floating-card treatment. */
:root {
  --bs-border-radius: .28rem;
  --bs-border-radius-sm: .22rem;
  --bs-border-radius-lg: .42rem;
}

.btn,
.form-control,
.form-select,
.badge,
.dropdown-menu,
.modal-content,
.offcanvas,
.sidebar-nav .list-group-item,
.sidebar-priority,
.board-switch,
.filter-controls > .row,
.board-overview,
.board-overview-tip,
.board-overview-tip-mark,
.column-header,
.column-footer,
.column-footer .btn,
.task-card,
.add-column-tile,
.empty-column,
.filter-empty {
  border-radius: .28rem !important;
}

.workspace-header .container-fluid {
  min-height: 3.75rem;
}

.brand-mark {
  border-radius: .22rem;
  height: 1.65rem;
  width: 1.65rem;
}

.btn {
  font-weight: 550;
}

.btn-outline-secondary {
  background: #e9eef4;
  color: #415269;
}

.btn-outline-secondary:hover {
  background: #dfe7f0;
  color: #283b52;
}

.filter-controls > .row {
  box-shadow: none;
  padding: .45rem;
}

.filter-controls .form-control,
.filter-controls .form-select {
  background: #edf1f5;
  font-size: .8rem;
}

.board-overview {
  border-radius: .4rem !important;
  margin-top: .4rem;
  padding: .95rem 1.1rem;
}

.board-overview-tip {
  border-radius: .25rem !important;
}

.sidebar .board-switch,
.sidebar .sidebar-priority,
.sidebar-nav .list-group-item {
  border-radius: .22rem !important;
}

.sidebar .btn-outline-secondary,
.sidebar .btn-light {
  border-radius: .22rem !important;
}

.column-header {
  border-radius: .35rem .35rem 0 0 !important;
  min-height: 3.85rem;
}

.card-list {
  padding: .45rem;
}

.column-footer {
  border-radius: 0 0 .35rem .35rem !important;
  padding: 0 .45rem .5rem;
}

.column-footer .btn {
  background: #e1e8f0;
  border-radius: .22rem !important;
  font-size: .78rem;
}

.task-card {
  box-shadow: none;
  margin-bottom: .42rem;
}

.task-card:hover {
  background: #f8fafc !important;
  box-shadow: none;
  transform: none;
}

.task-card .card-body {
  padding: .68rem .72rem;
}

.task-title {
  font-size: .84rem;
  font-weight: 650;
}

.task-meta {
  margin-top: .62rem !important;
}

.task-meta .badge,
.badge.rounded-pill {
  border-radius: .18rem !important;
  font-size: .64rem;
}

.add-column-tile {
  background: #dfe7f0;
  border-radius: .35rem !important;
  min-height: 3.85rem;
}

/* Carbon-inspired White theme: neutral layers with IBM Blue for primary action. */
:root {
  --bs-primary: #0f62fe;
  --bs-primary-rgb: 15, 98, 254;
  --carbon-blue-60: #0f62fe;
  --carbon-blue-70: #0043ce;
  --carbon-gray-10: #f4f4f4;
  --carbon-gray-20: #e0e0e0;
  --carbon-gray-80: #393939;
  --carbon-gray-100: #161616;
}

body {
  background: var(--carbon-gray-10);
  color: var(--carbon-gray-100);
}

.sidebar {
  background: #fff;
  color: var(--carbon-gray-100);
}

.sidebar .text-body-secondary,
.sidebar .small.text-body-secondary {
  color: #525252 !important;
}

.sidebar .btn-link {
  color: var(--carbon-blue-60);
}

.sidebar .btn-outline-secondary,
.sidebar .btn-light {
  background: var(--carbon-gray-10);
  color: #393939;
}

.sidebar .btn-outline-secondary:hover,
.sidebar .btn-light:hover {
  background: var(--carbon-gray-20);
  color: var(--carbon-gray-100);
}

.sidebar .board-switch {
  color: #393939;
}

.sidebar .board-switch:hover {
  background: #e8e8e8;
  color: var(--carbon-gray-100);
}

.sidebar .board-switch.active,
.sidebar-nav .list-group-item.active,
.sidebar-priority.active {
  background: var(--carbon-blue-60) !important;
  color: #fff !important;
}

.sidebar-nav .list-group-item {
  color: #393939;
}

.sidebar-nav .list-group-item:hover {
  background: #e8e8e8;
  color: var(--carbon-gray-100);
}

.sidebar .badge.text-bg-secondary,
.column-header .badge.text-bg-secondary {
  background: #6f6f6f !important;
  color: #fff;
}

.sidebar .priority-filter-high { color: #a2191f; }
.sidebar .priority-filter-normal { color: var(--carbon-blue-70); }
.sidebar .priority-filter-low { color: #198038; }

.sidebar .sidebar-content {
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #a8a8a8 transparent;
  scrollbar-width: thin;
}

.sidebar-content [data-board-list],
.sidebar-content [data-sidebar-tags] {
  max-height: 12rem;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: .15rem;
  scrollbar-color: #a8a8a8 transparent;
  scrollbar-width: thin;
}

.sidebar-content [data-sidebar-tags] {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.sidebar-content [data-sidebar-tags] .sidebar-tag {
  min-width: 0;
  padding: .4rem .5rem;
}

.sidebar .sidebar-content::-webkit-scrollbar,
.sidebar-content [data-board-list]::-webkit-scrollbar,
.sidebar-content [data-sidebar-tags]::-webkit-scrollbar {
  width: .28rem;
}

.sidebar .sidebar-content::-webkit-scrollbar-thumb,
.sidebar-content [data-board-list]::-webkit-scrollbar-thumb,
.sidebar-content [data-sidebar-tags]::-webkit-scrollbar-thumb {
  background: #a8a8a8;
}

.sidebar-content .border-top {
  background: var(--carbon-gray-10);
}

.auth-page {
  background: #e8e8e8;
  display: grid;
  min-height: 100dvh;
  place-items: center;
  padding: 1.5rem;
}

.auth-shell {
  max-width: 26rem;
  width: 100%;
}

.auth-panel,
.admin-panel,
.admin-stat {
  background: #fff;
}

.auth-panel {
  box-shadow: 0 1rem 2.5rem rgb(22 22 22 / .1);
  padding: 2rem;
}

.admin-shell {
  margin-inline: auto;
  max-width: 88rem;
}

.admin-status {
  background: #d0e2ff;
  color: #0043ce;
  font-size: .78rem;
  font-weight: 600;
  padding: .45rem .65rem;
}

.admin-stat {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  min-height: 7rem;
  padding: 1rem;
}

.admin-stat span {
  color: #525252;
  font-size: .8rem;
}

.admin-stat strong {
  color: #161616;
  font-size: 2rem;
  font-weight: 600;
  line-height: 1;
}

.admin-panel {
  max-width: 56rem;
  padding: 1.25rem;
}

.admin-panel-heading {
  align-items: flex-start;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin-bottom: 1.25rem;
}

.navbar {
  background: #fff !important;
  box-shadow: none;
}

.brand-mark,
.btn-primary {
  background: var(--carbon-blue-60);
}

.brand-mark {
  border-radius: 0;
}

.btn-primary {
  --bs-btn-bg: #0f62fe;
  --bs-btn-border-color: #0f62fe;
  --bs-btn-hover-bg: #0353e9;
  --bs-btn-hover-border-color: #0353e9;
  --bs-btn-active-bg: #0043ce;
  --bs-btn-active-border-color: #0043ce;
}

.filter-controls > .row {
  background: #fff;
}

.filter-controls .form-control,
.filter-controls .form-select,
.form-control,
.form-select {
  background: var(--carbon-gray-10);
  color: var(--carbon-gray-100);
}

.form-control:focus,
.form-select:focus {
  box-shadow: 0 0 0 .15rem rgb(15 98 254 / .3);
}

.board-overview {
  background: var(--carbon-gray-80);
}

.board-overview-kicker { color: #a6c8ff; }
.board-overview-copy { color: #c6c6c6; }
.board-overview-tip { background: #4c4c4c; color: #f4f4f4; }
.board-overview-tip-mark { background: #6f6f6f; }

.column-tone-0 .column-header { background: #d0e2ff; }
.column-tone-1 .column-header { background: #f4f4f4; }
.column-tone-2 .column-header { background: #d9f3e4; }

.column-title { color: var(--carbon-gray-100); }
.lane-step,
.column-header .text-secondary,
.column-header .card-drag-handle { color: #525252 !important; }

.card-list,
.column-footer { background: var(--carbon-gray-20); }
.column-tone-1 .card-list,
.column-tone-1 .column-footer { background: #e8e8e8; }
.column-tone-2 .card-list,
.column-tone-2 .column-footer { background: #e0eee5; }

.column-footer .btn {
  background: #fff;
  color: #393939;
}

.column-footer .btn:hover { background: #f4f4f4; }

.task-card,
.task-card.priority-high,
.task-card.priority-normal,
.task-card.priority-low {
  background: #fff !important;
}

.task-card:hover {
  background: #f4f4f4 !important;
}

.task-title { color: var(--carbon-gray-100); }
.task-description { color: #525252 !important; }

.task-meta .bg-danger-subtle { background: #fff1f1 !important; color: #a2191f !important; }
.task-meta .bg-primary-subtle { background: #d0e2ff !important; color: #0043ce !important; }
.task-meta .bg-success-subtle { background: #d9f3e4 !important; color: #198038 !important; }
.task-meta .bg-warning-subtle { background: #f1c21b !important; color: #161616 !important; }

.add-column-tile {
  background: #e0e0e0;
  color: #393939;
}

.empty-column,
.filter-empty { background: #fff; }

@keyframes high-priority-breathe {
  0%,
  100% { box-shadow: none; }

  50% { box-shadow: 0 0 0 .2rem rgb(218 30 40 / .2), 0 .35rem .85rem rgb(218 30 40 / .18); }
}

.ai-plan-summary {
  background: #d0e2ff;
  color: #0043ce;
  font-size: .86rem;
  margin-bottom: 1rem;
  padding: .7rem .8rem;
}

.ai-plan-board {
  background: #f4f4f4;
  padding: .85rem;
}

.ai-plan-column {
  background: #e0e0e0;
  padding: .65rem;
}

.ai-plan-column > h4 {
  color: #393939;
  letter-spacing: .07em;
}

.ai-plan-card {
  background: #fff;
  color: #161616;
  padding: .55rem;
}

.ai-option {
  align-items: flex-start;
  background: #f4f4f4;
  cursor: pointer;
  display: flex;
  gap: .75rem;
  padding: .8rem;
}

.ai-option:hover,
.ai-option.selected {
  background: #d0e2ff;
}

.ai-option-content {
  display: grid;
  gap: .22rem;
}

.ai-option-index {
  color: #0043ce;
  font-size: .66rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* One modal language for board management and AI planning. */
.modal-content {
  background: #f4f4f4;
  border-radius: .35rem !important;
  overflow: hidden;
}

.modal-header,
.modal-footer {
  border: 0 !important;
  padding: .85rem 1rem;
}

.modal-header {
  align-items: flex-start;
  background: #393939;
  color: #fff;
}

.modal-header .text-body-secondary,
.modal-header .small.text-body-secondary {
  color: #c6c6c6 !important;
}

.modal-header .btn-close {
  filter: invert(1);
  margin: .1rem 0 0 auto;
}

.modal-header .modal-title {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.3;
}

.modal-body {
  background: #f4f4f4;
  padding: 1rem;
}

.modal-footer {
  background: #fff;
}

.modal .alert {
  background: #e0e0e0;
  border: 0;
  border-radius: .22rem;
  color: #393939;
  font-size: .78rem;
  line-height: 1.45;
  margin-bottom: 1rem;
}

.modal .form-label {
  color: #393939;
  font-size: .78rem;
  font-weight: 600;
  margin-bottom: .4rem;
}

.modal .form-control,
.modal .form-select {
  background: #fff;
  border-radius: .22rem !important;
  box-shadow: none;
  font-size: .88rem;
}

.modal .form-control:focus,
.modal .form-select:focus {
  box-shadow: 0 0 0 .15rem rgb(15 98 254 / .3);
}

.modal .form-text {
  color: #525252;
  font-size: .72rem;
  line-height: 1.4;
}

#aiPlanModal textarea,
#aiPlanModal input {
  background: #fff;
}

#aiPlanModal textarea {
  min-height: 6.25rem;
}

#aiPlanModal #aiConstraints {
  min-height: 4.5rem;
}

.ai-plan-summary {
  border-radius: .22rem;
  font-size: .8rem;
}

.ai-plan-board,
.ai-plan-column,
.ai-plan-card,
.ai-option {
  border-radius: .22rem;
}

@media (max-width: 575.98px) {
  :root {
    --kanban-column-width: min(18rem, calc(100vw - 2rem));
  }

  .board-shell {
    padding: .75rem 1rem 1rem;
  }

  .board-overview {
    margin: .25rem 1rem 0;
    padding: 1rem;
  }

  .board-overview-title {
    font-size: 1rem;
  }
}

@media (max-width: 991.98px) {
  .app-layout {
    display: block;
  }
}

@media (prefers-reduced-motion: reduce) {
  .task-card,
  .task-card.priority-high {
    transition: none;
    animation: none;
  }
}
