/* AVSP visual modernization pass. Applies in both light and dark mode;
   dark-mode.css overrides specific colors on top when html.theme-dark is set. */

:root {
    --brand: #c8102e;
    --brand-dark: #8f0a20;
}

/* Keep primary nav reachable on the long, table-heavy pages this app is full of. */
.navbar {
    position: sticky;
    top: 0;
    z-index: 1030;
}

.avsp-page-body {
    padding-top: 16px;
}

/* AVSP pages wrap their main content in a div like
   style="max-width:900px; margin:auto;" (25 of 32 pages). Give that a real
   card surface instead of the flat, borderless page background. */
.avsp-page-body > div[style*="max-width:900"] {
    padding: 12px;
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.15);
}

/* Brand color for primary actions and in-content links (not the navbar,
   which keeps its own light-on-dark styling). */
.avsp-page-body a {
    color: var(--brand);
}

.avsp-page-body a:hover,
.avsp-page-body a:focus {
    color: var(--brand-dark);
}

.btn-primary {
    background-color: var(--brand);
    border-color: var(--brand);
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
    background-color: var(--brand-dark);
    border-color: var(--brand-dark);
}

/* Most of the app's action buttons are plain <input type="submit/button">
   or unstyled <button> elements with no Bootstrap .btn class at all, so they
   render as bare OS-default buttons. Style them centrally rather than
   touching ~20 files: submit = primary action, button/reset = secondary. */
input[type="submit"],
input[type="button"],
input[type="reset"],
button:not(.btn):not(.theme-toggle):not(.navbar-toggle):not(:has(> i:only-child)) {
    display: inline-block;
    padding: 6px 14px;
    font-size: 14px;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}

input[type="submit"] {
    color: #fff;
    background-color: var(--brand);
    border-color: var(--brand);
}

input[type="submit"]:hover,
input[type="submit"]:focus {
    background-color: var(--brand-dark);
    border-color: var(--brand-dark);
    color: #fff;
}

input[type="button"],
input[type="reset"],
button:not(.btn):not(.theme-toggle):not(.navbar-toggle):not(:has(> i:only-child)) {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
button:not(.btn):not(.theme-toggle):not(.navbar-toggle):not(:has(> i:only-child)):hover {
    background-color: #e6e6e6;
    border-color: #adadad;
}

/* Icon-only plain <button>s (PDF viewer prev/next, etc.) get a minimal,
   link-style treatment instead of a boxy pill around a lone glyph. */
button:not(.btn):has(> i:only-child) {
    background: transparent;
    border: 0;
    padding: 6px 8px;
    color: var(--brand);
    cursor: pointer;
}

button:not(.btn):has(> i:only-child):hover {
    color: var(--brand-dark);
}

/* Every page here is a data table with no striping/hover today. */
.table > tbody > tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, 0.03);
}

.table > tbody > tr:hover {
    background-color: rgba(200, 16, 46, 0.06);
}