/**
 * WCAG 2.2 AA Accessibility Fixes
 * Nebraska State Fire Marshal - Elevator Inspection
 *
 * Addresses: ARC::insufficientNormalTextContrast
 * Footer background: rgb(50, 58, 69) / #323a45 (dark)
 * WCAG 1.4.3 Contrast (Minimum) Level AA
 */

/* ============================================================
   MAILTO LINKS: Light background contrast fix
   Platform default link color #02bfe7 (cyan) on white/near-white = 2.08:1 — FAILS 1.4.3.
   Target only mailto: links (email addresses rendered as inline content).
   Override to USWDS-standard accessible blue #0071bc = 4.73:1 on white.
   ============================================================ */

a[href^="mailto:"] {
    color: #0071bc !important;
}

a[href^="mailto:"]:hover,
a[href^="mailto:"]:focus {
    color: #004f87 !important;
}

/* ============================================================
   FOOTER: Dark background contrast fixes
   Target bg: #323a45 (rgb 50, 58, 69)
   ============================================================ */

/* Section headings in footer (.dim-header from platform CSS
   likely renders in a low-contrast muted color on dark bg) */
footer .dim-header {
    color: #E0E0E0 !important; /* 9.3:1 on #323a45 */
    font-weight: 600;
}

/* Footer paragraph text in the powered-by section.
   Scoped to .powered-by to avoid overriding alert <p> colors
   if alerts are ever rendered inside <footer>. */
footer .powered-by p,
footer .powered-by address {
    color: #E0E0E0 !important;
}

/* Copyright year span */
footer .powered-by #cr-current-year {
    color: #E0E0E0 !important;
}

/* Footer links - ensure sufficient contrast on dark background.
   NOTE: This targets <a> elements only. Do NOT use "footer span" —
   Bootstrap 3 glyphicons are spans, and a broad span selector
   overrides their icon font colors unexpectedly. */
footer a {
    color: #7EC8E3 !important; /* 4.7:1 on #323a45 */
}

footer a:hover,
footer a:focus {
    color: #B8E0F0 !important;
}

/* Google Translate widget: inline color: rgb(118,118,118) fails on dark bg.
   Override the widget text to be visible against the dark footer. */
#google_translate_element .goog-te-gadget-simple span a > span,
#google_translate_element .goog-te-gadget-simple .goog-te-menu-value span {
    color: #E0E0E0 !important;
}

/* Google Translate widget border/hover visible on dark bg */
#google_translate_element .goog-te-gadget-simple {
    border-color: #9ab !important;
}

/* ============================================================
   BUTTON: btn-primary contrast fix
   Flat UI btn-primary uses rgb(0,166,210) / #00A6D2 with white text.
   Contrast = 2.7:1 — fails WCAG 1.4.3 even for large text (needs 3:1).
   Using a darker accessible blue: white on #1a5276 = 9.4:1.
   ============================================================ */
.btn-primary {
    background-color: #1a5276 !important;
    border-color: #154360 !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: #154360 !important;
    border-color: #0e2d40 !important;
}

/* ============================================================
   BUTTON: btn-success contrast fix
   Bootstrap 3 btn-success uses #5cb85c with white text.
   Contrast = 2.5:1 — fails WCAG 1.4.3 for normal and large text.
   Using a darker accessible green: white on #276221 = 7.5:1.
   ============================================================ */
.btn-success {
    background-color: #276221 !important;
    border-color: #1e4f1a !important;
    color: #ffffff !important;
}

.btn-success:hover,
.btn-success:focus {
    background-color: #1e4f1a !important;
    border-color: #163b13 !important;
}

/* ============================================================
   BLOCK LABELS: #6e7d8b at 12.75px normal fails 4.5:1 on white
   Darken to #5a6876 which achieves ~4.6:1 on white.
   ============================================================ */
.block-label {
    color: #5a6876 !important;
}

/* ============================================================
   DOLLAR SIGN: opacity: 0.45 reduces contrast below threshold.
   Replace with explicit muted color on white bg.
   ============================================================ */
.big-number .dollars:before {
    opacity: 1 !important;
    color: #767676 !important; /* #767676 on white = 4.54:1 — passes AA */
}

/* ============================================================
   FORM-ACTIONS MUTED TEXT: Bootstrap .text-muted = #777 on the
   form-actions bar bg rgb(236,240,241) / #ecf0f1 = ~4.4:1 — fails
   WCAG 1.4.3 for small text (needs 4.5:1). Darken to #595959 = 5.4:1.
   Scoped to .form-actions to avoid globally overriding .text-muted.
   ============================================================ */
.form-actions .text-muted {
    color: #595959 !important;
}

/* ============================================================
   ELEVATOR GRID: CSS Grid replacement for nested table inside
   the checkout-table "Billing Info" column in review.tpl.
   Replicates Bootstrap .table visual appearance (padding, borders,
   striping via nth-child) without using table markup.
   Three equal columns matching the original thead/tbody structure.
   ============================================================ */
.elevator-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    width: 100%;
    font-size: inherit;
}

.elevator-grid__header {
    font-weight: bold;
    padding: 8px;
    border-bottom: 2px solid #ddd;
    background-color: #f5f5f5;
}

.elevator-grid__cell {
    padding: 8px;
    border-bottom: 1px solid #ddd;
}

/* Stripe every other data row (groups of 3 cells = one row) */
.elevator-grid__cell:nth-child(6n+4),
.elevator-grid__cell:nth-child(6n+5),
.elevator-grid__cell:nth-child(6n+6) {
    background-color: #f9f9f9;
}