body {
    min-height: 100vh;
}

.navbar-brand {
    font-weight: 600;
}

.client-group-chevron {
    display: inline-block;
    transition: transform 0.2s ease;
}

.client-group-toggle[aria-expanded="false"] .client-group-chevron {
    transform: rotate(-90deg);
}

/*
 * Projects are split into one <table> per client, each sized independently by
 * the browser — without fixed widths, e.g. a longer project name in one
 * client's table pushes its Status/PO/Budget/Tasks columns out of line with
 * every other client's table. table-layout: fixed plus explicit widths on
 * those columns keeps them at the same x-position in every table; the Name
 * column (no width set) absorbs whatever space is left, which is the same
 * amount in every table since they all span the same container width.
 */
.project-table {
    table-layout: fixed;
}

.project-table .col-status {
    width: 8rem;
}

.project-table .col-po-number {
    width: 10rem;
}

.project-table .col-budget {
    width: 8rem;
}

.project-table .col-tasks {
    width: 6rem;
}

.project-table td,
.project-table th {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Comment bodies and task descriptions are sanitised HTML (see
 * App\Service\Html\HtmlSanitizer) — drop the trailing margin on their last
 * element so they don't add extra whitespace inside their container. */
.rich-text > :last-child {
    margin-bottom: 0;
}

.rich-text span[data-mention] {
    background-color: #e7f1ff;
    color: #0d6efd;
    font-weight: 600;
    border-radius: 0.25rem;
    padding: 0 0.2rem;
}

/* Sized against the viewport, not Bootstrap's fixed breakpoints (even
 * modal-xl tops out at 1140px), so a comment attachment's full image gets as
 * much room as the screen allows. Compound selector needed to outrank
 * Bootstrap's own same-specificity `.modal-dialog { max-width: 500px }` rule,
 * which loads after this stylesheet (see app.js's import order). */
.modal-dialog.modal-dialog-attachment {
    max-width: 90vw;
}

.modal-dialog-attachment .modal-body img {
    max-height: 80vh;
}
