html, body {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

a, .btn-link {
    color: #006bb7;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

.content {
    padding-top: 1.1rem;
}

h1:focus {
    outline: none;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid #e50000;
}

.validation-message {
    color: #e50000;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.darker-border-checkbox.form-check-input {
    border-color: #929292;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}
/* ---- Kanban board ---- */
.board-tile { cursor: pointer; transition: box-shadow .15s ease, transform .15s ease; }
.board-tile:hover { box-shadow: 0 .25rem .75rem rgba(0,0,0,.12); transform: translateY(-2px); }

.board-toolbar { padding-top: .5rem; }
.presence { font-size: .85rem; color: #495057; max-width: 22rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.add-member { width: 16rem; }

.board-scroll { overflow-x: auto; padding-bottom: 1rem; }
.board-columns { display: flex; gap: .75rem; align-items: flex-start; min-height: 60vh; }
.board-column { background: #f1f3f5; border-radius: .5rem; width: 17rem; min-width: 17rem; display: flex; flex-direction: column; max-height: 80vh; }
.board-column-header { display: flex; align-items: center; padding: .5rem .75rem; font-size: .95rem; }
.board-column-body { padding: 0 .5rem; overflow-y: auto; flex: 1 1 auto; min-height: 2rem; }
.board-column-add { padding: .5rem; }
.board-column-new { background: transparent; padding: .25rem; }

.kanban-card { background: #fff; border-radius: .4rem; box-shadow: 0 1px 2px rgba(0,0,0,.08); padding: .5rem .6rem; margin-bottom: .5rem; cursor: pointer; border: 1px solid #e9ecef; }
.kanban-card:hover { border-color: #adb5bd; }
.card-title-text { font-size: .9rem; font-weight: 500; }
.card-labels { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: .35rem; }
.label-chip { color: #fff; font-size: .7rem; padding: .05rem .4rem; border-radius: .75rem; line-height: 1.4; }
.assignees { display: flex; gap: .15rem; }
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 1.4rem; height: 1.4rem; border-radius: 50%; background: #1b6ec2; color: #fff; font-size: .65rem; font-weight: 600; }

/* ---- Time tracking ---- */
.blink { color: #dc3545; animation: blink 1.2s steps(1) infinite; }
@keyframes blink { 50% { opacity: .25; } }
.timer-indicator { display: inline-flex; align-items: center; background: #212529; color: #fff; border-radius: .35rem; padding: .15rem .5rem; font-size: .85rem; }
.timer-link { color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: .35rem; }
.timer-clock { font-variant-numeric: tabular-nums; font-weight: 600; }
.timer-card { max-width: 12rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .85; }
.time-entries li { padding: .15rem 0; border-bottom: 1px solid #f1f3f5; }

/* ---- Collaboration ---- */
.avatar.sm { width: 1.15rem; height: 1.15rem; font-size: .55rem; }
.comment-body { white-space: pre-wrap; margin-left: 1.4rem; }
.comment { border-bottom: 1px solid #f1f3f5; padding-bottom: .35rem; }
.activity-feed li { border-bottom: 1px solid #f6f7f8; }
.nav-tabs .nav-link { padding: .25rem .6rem; cursor: pointer; }

/* ---- Notifications ---- */
.notif-bell { position: relative; display: inline-block; margin-left: .5rem; }
.notif-dropdown { position: absolute; right: 0; top: 2rem; width: 20rem; max-height: 24rem; overflow-y: auto; background: #fff; border: 1px solid #dee2e6; border-radius: .4rem; box-shadow: 0 .5rem 1rem rgba(0,0,0,.15); z-index: 1050; }
.notif-item { display: block; padding: .4rem .6rem; border-bottom: 1px solid #f1f3f5; text-decoration: none; color: inherit; }
.notif-item:hover { background: #f8f9fa; }
.notif-item.unread { background: #eef5ff; }
.xsmall { font-size: .7rem; }

/* ---- Views ---- */
.calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: #dee2e6; border: 1px solid #dee2e6; }
.cal-dow { background: #f8f9fa; padding: .25rem; text-align: center; font-size: .75rem; font-weight: 600; }
.cal-cell { background: #fff; min-height: 6rem; padding: .2rem; vertical-align: top; }
.cal-other { background: #fafbfc; color: #adb5bd; }
.cal-today { background: #eef5ff; }
.cal-daynum { font-size: .75rem; color: #6c757d; text-align: right; }
.cal-card { background: #1b6ec2; color: #fff; font-size: .7rem; border-radius: .2rem; padding: .05rem .3rem; margin-top: .15rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }

/* ---- Dashboard ---- */
.stat-card .stat-num { font-size: 1.6rem; font-weight: 700; }
.stat-card .stat-lbl { font-size: .8rem; color: #6c757d; text-transform: uppercase; letter-spacing: .03em; }

/* ---- Dark mode tweaks (Bootstrap data-bs-theme=dark handles most) ---- */
[data-bs-theme="dark"] .board-column { background: #2b3035; }
[data-bs-theme="dark"] .kanban-card { background: #343a40; border-color: #495057; color: #e9ecef; }
[data-bs-theme="dark"] .board-tile:hover { box-shadow: 0 .25rem .75rem rgba(0,0,0,.5); }
[data-bs-theme="dark"] .notif-dropdown { background: #343a40; border-color: #495057; }
[data-bs-theme="dark"] .cal-cell { background: #2b3035; }
[data-bs-theme="dark"] .cal-other { background: #23272b; }
[data-bs-theme="dark"] .cal-today { background: #2d3f57; }

/* ---- Colour picker + board management ---- */
.color-picker .swatch { width: 1.1rem; height: 1.1rem; border-radius: 3px; border: 1px solid rgba(0,0,0,.2); cursor: pointer; padding: 0; }
.color-picker .swatch.sel { outline: 2px solid #212529; outline-offset: 1px; }
.color-picker input[type=color] { width: 1.6rem; height: 1.6rem; }
.board-color-dot { width: .9rem; height: .9rem; border-radius: 50%; display: inline-block; }
.list-menu { background: #fff; border: 1px solid #dee2e6; border-radius: .4rem; margin: 0 .5rem .5rem; }
.board-column.over-wip { box-shadow: 0 0 0 2px #dc3545 inset; }
.board-column-header { position: relative; }
[data-bs-theme="dark"] .list-menu { background: #343a40; border-color: #495057; }

/* ---- Markdown + mentions ---- */
.comment-body.markdown p { margin-bottom: .25rem; }
.comment-body.markdown code { background: rgba(0,0,0,.06); padding: 0 .2rem; border-radius: 3px; }
.comment-body.markdown ul { margin-bottom: .25rem; padding-left: 1.2rem; }
.mention-chips { display: flex; flex-wrap: wrap; gap: .25rem; align-items: center; }

/* ---- Bulk selection ---- */
.kanban-card.selected { outline: 2px solid #1b6ec2; outline-offset: 1px; }
.bulk-bar { background: #e7f1ff; border-bottom: 1px solid #b6d4fe; position: sticky; top: 0; z-index: 5; }
[data-bs-theme="dark"] .bulk-bar { background: #14324f; border-color: #1c4a72; }

/* ---- Column colour + reorder ---- */
.board-column-header { border-radius: .5rem .5rem 0 0; cursor: grab; }
.board-column-header .grip { opacity: .5; }
.board-column-header.colored .badge { background: rgba(255,255,255,.85) !important; color: #212529 !important; }
.list-edit { text-decoration: none; font-size: .78rem; }

/* ---- Swimlanes ---- */
.lane { margin-bottom: 1rem; }
.lane-header { padding: .35rem .5rem; background: #e9ecef; border-radius: .4rem; margin-bottom: .35rem; position: sticky; left: 0; }
.lane-columns .board-column { max-height: 40vh; min-height: 4rem; }
[data-bs-theme="dark"] .lane-header { background: #343a40; }

/* ---- Pomodoro ---- */
.timer-indicator .btn.active { background: #dc3545; border-color: #dc3545; }
.pomodoro-break { background: #6d4c41; }