/* Off-screen until focused, rather than display:none, which would drop it
   from the tab order and defeat the point. Absolute, so it takes no layout
   space at rest. On focus it appears below the navbar rather than over it,
   which keeps it clear of the brand -- `top: 100%` measures the navbar's
   wrapper, so it follows an expanded mobile menu down instead of landing on
   top of it. #212529 on white is 15.43:1. */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 1080;
    padding: 8px 16px;
    background: #fff;
    color: #212529;
    border: 2px solid #212529;
    text-decoration: underline;
}

.skip-link:focus {
    left: 1rem;
    top: 100%;
}

/* Bootstrap's `.visually-hidden` exempts <caption> from `position: absolute`,
   so a hidden caption stays in flow and reboot's `caption-side: bottom` leaves
   its `margin: -1px` a pixel below the table -- which `.table-responsive`
   (`overflow-x: auto`, so `overflow-y` computes to `auto`) turns into a
   full-height vertical scrollbar in Blink. Above the table that pixel is
   block-start overflow, which no engine scrolls to. */
caption.visually-hidden {
    caption-side: top;
}

body {
    padding-top: 4px;
}

.required-field {
    color: red;
}

td.col-server_tags {
    display: inline-block;
    max-width: 20ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

td.col-server_tags:hover {
    text-overflow: clip;
    white-space: normal;
    word-break: break-word;
}