/* Bootstrap's #0d6efd link clears 4.5:1 only on pure white -- 4.03:1 on the
   dashboard's #f1f2f7 cells, 4.06:1 inside an .alert. Bootstrap composes
   link colour from the -rgb token, so overriding the hex alone does nothing. */
:root {
    --bs-link-color: #0a58ca;
    --bs-link-color-rgb: 10, 88, 202;
    --bs-link-hover-color: #084298;
    --bs-link-hover-color-rgb: 8, 66, 152;
}

/* One focus indicator for the whole app: no control had a conforming one,
   and no hue fixes a 20% tint, so it takes an opaque outline.

   `:root ` is not decoration. Bootstrap zeroes the outline at class
   specificity (`.nav-link:focus-visible{outline:0}` and friends), which a
   bare `:focus-visible` loses to whatever the source order; the descendant
   `:root` matches everything and brings this to the same 0-2-0, where
   loading after Bootstrap decides it.

   Tom Select needs its own two selectors: it hides the real input inside
   `.ts-control` and zeroes that input's outline with `!important`, so the
   ring has to sit on the wrapper, which never matches `:focus-visible`
   itself. */
:root :focus-visible,
.ts-wrapper.focus .ts-control,
.ts-wrapper .ts-control:focus-within {
    outline: 2px solid #212529;
    outline-offset: 2px;
}

/* Bootstrap's default control border is #dee2e6 -- 1.30:1, so every input
   outside .crud-form failed 1.4.11 on its resting state too. Tom Select
   draws its own, from a vendor sheet that loads after this file. */
.form-control,
.form-select,
.form-check-input {
    border-color: #949494;
}

/* A file input sizes itself to the filename control the browser draws, which is
   wider than a 320px viewport and carries no Bootstrap sizing of its own. */
input[type="file"] {
    max-width: 100%;
}

.ts-wrapper .ts-control {
    border-color: #949494;
}

/* The caret is a background image on the control, so the item states its own surface rather than inheriting one. */
.ts-wrapper.single .ts-control .item {
    color: #343a40;
    background: #ffffff;
}

/* Bootstrap's scroll wrapper only clips what it is the containing block for,
   and .visually-hidden is absolutely positioned -- so without this the
   off-screen names inside a wide table resolve against an ancestor outside the
   wrapper and carry the table's full width onto the document. Same defect
   list.css pins on the DataTables cells. */
.table-responsive {
    position: relative;
}

/* DataTables 2 makes its cells border-box, but the app's fixed column widths
   are text room: under border-box the cell padding comes out of them and short
   labels are cut off. `.table` only lifts this over the library's equal-weight
   rule, which loads after this file. column-resize.js sets border-box inline
   on the columns it pins. */
table.table.dataTable th,
table.table.dataTable td {
    box-sizing: content-box;
}

.hidden-elem {
    display: none;
}

.navbar-brand-container {
    display: flex;
    align-items: center;
}

/* Bootstrap keeps the brand on one line, and "ePortal <version> [unit]" is
   wider than a 320px viewport, so below the collapse breakpoint it widened the
   whole document (SC 1.4.10). A zero basis keeps it on the toggler's row; it
   then takes what the row leaves and wraps inside it. Above the breakpoint the
   brand is untouched. */
@media (max-width: 767.98px) {
    .navbar-brand {
        flex: 1 1 0;
        min-width: 0;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .navbar-brand-container {
        flex-wrap: wrap;
    }
}

/* Above the breakpoint Bootstrap lays the menus out as rows that never wrap,
   so menus wider than the viewport -- a long version in the brand, or text
   spacing forced (SC 1.4.12) -- widen the whole document. Wrapping changes
   nothing while they fit; a wrapped account list stays at the right edge,
   where it sits when they do. */
@media (min-width: 768px) {
    .navbar-expand-md .navbar-collapse,
    .navbar-expand-md .navbar-nav {
        flex-wrap: wrap;
    }

    .navbar-expand-md .navbar-nav.me-auto ~ .navbar-nav {
        margin-left: auto;
    }
}

.navbar-logo {
    display: inline-block;
    margin-top: -5px;
    width: 24px;
}

.dialog-styling {
    width:70em;
    overflow-y:initial;
}

.modal-body-styling {
    max-height:80vh;
    overflow:auto;
}

.dashboard-feed-styling {
    width: 10em;
    text-align: center;
}

/* The LDAP examples are single unbreakable tokens (DNs, filters, URLs) wider
   than a narrow viewport; Bootstrap's reboot already breaks them inside <code>,
   this extends that to the prose around them. */
.ldap-settings-font {
    font-size:120%;
    overflow-wrap: break-word;
}

/* A max, not a width: at 40em the card could not shrink below 640px. */
.login-styling {
    max-width: 40em;
    width: 100%;
    margin:10em auto 0 auto;
}
.login-span-styling {
    display:inline-block;
    padding:0;
    float:none;
    height:auto;
    margin-bottom:15px;
}

/* `.form-select`'s own arrow (a background-image on the select) is what
   axe's color-contrast check cannot flatten against the select's
   background-color. The CSP (`img-src 'self'`, no `data:`) already blocks
   that arrow from painting, so dropping it gives the select a single flat
   background to measure without changing anything the user sees. */
.unit-login-selector {
    background-image: none;
}

.manage-patches-th-styling {
    width:10em;
}

.manage-patches-tr-styling-1 {
    background-color: #f2dede;
}

.manage-patches-tr-styling-2 {
    background-color:#e5ffcc;
}

.distro-styling {
    width: 15em;
    float: left;
}

.distro-checkbox-styling {
    margin-top: 0.2em;
    margin-bottom: 0.2em;
}

.doctor-report-row {
    margin-top: 10px;
}

/* The navbar timezone indicator (tz_indicator). A statement about the page,
   not somewhere to click -- hence the cursor, and no hover or focus styling.

   Subordinate by what it is, not by being faded: Bootstrap's own navbar text
   colour (rgba(0,0,0,.65) on bg-light) measures 6.84:1, and the dimming this
   carried put it at 3.77:1, under SC 1.4.3. Nothing below opacity 0.83 clears
   4.5:1 here, which leaves no room to dim by an amount a reader would notice. */
.tz-indicator {
    cursor: default;
}