/* GIGW audit fixes made in templates/content (BUG-003, BUG-006). */

/* BUG-021: the PDF viewer boxes in the FAQ tab panels have unique ids; style.css only styles #pdfViewer. */
.main-content .aboutSectionArea .pdf-viewer {
    width: 100%;
    height: 624px;
}
.main-content .aboutSectionArea .pdf-viewer iframe {
    width: 100%;
    height: 100%;
    border: none;
}

/* BUG-003: document links written in the CMS with an inline "color: #007bff" (3.98:1 on white) and their size labels. */
.main-content a[style*="rgb(0, 123, 255)"],
.main-content a[style*="#007bff"],
.main-content a[style*="#007BFF"],
.main-content a[style*="rgb(0,123,255)"] {
    color: #0056b3 !important;
}

/* BUG-003: Bootstrap's grey outline button (#6c757d) is 4.31:1 on the pale filter panels; #5a6268 passes AA. */
.btn-outline-secondary {
    color: #5a6268;
    border-color: #5a6268;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
    color: #fff;
    background-color: #5a6268;
    border-color: #545b62;
}

/* ---- CONTRAST / OVERFLOW audit (developer L) ---- */

/* 1. style.css paints every heading white and this Bootstrap build's .text-* utilities only set --bs-text-opacity, so
   coloured headings on white cards were white on white. AA colours on #fff (4.5:1+); headings on dark/colour
   backgrounds or with .text-white are left alone. */
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-primary { --audit-hc: #034ea2; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-success { --audit-hc: #146c43; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-info { --audit-hc: #087990; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-warning { --audit-hc: #8a5a00; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-danger { --audit-hc: #b02a37; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-secondary { --audit-hc: #5a6268; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-dark { --audit-hc: #212529; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-teal { --audit-hc: #0b7a75; }
:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6).text-indigo { --audit-hc: #4b2bb0; }

:is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6):is(.text-primary, .text-success, .text-info, .text-warning, .text-danger, .text-secondary, .text-dark, .text-teal, .text-indigo):not(.text-white, .btn *, .bg-primary *, .bg-success *, .bg-info *, .bg-warning *, .bg-danger *, .bg-secondary *, .bg-dark *, .bg-teal *, .bg-indigo *, .text-white *, .banner *, footer *) {
    color: var(--audit-hc) !important;
}

/* The .bg-teal / .bg-indigo card headers of /sitemap had no background rule at all (white text on white). */
.bg-teal { background-color: #0b7a75 !important; }
.bg-indigo { background-color: #4b2bb0 !important; }
/* ... and this Bootstrap build defines no background for .bg-success/info/warning/danger/secondary/dark either. */
/* Bootstrap's own '.bg-success { background-color: rgb(var(--bs-success-rgb) / ...) !important }' resolves to nothing here
   (the --bs-*-rgb variables are not defined), so these need !important to win. */
.card-header.bg-success { background-color: #198754 !important; }
.card-header.bg-danger { background-color: #dc3545 !important; }
.card-header.bg-secondary { background-color: #6c757d !important; }
.card-header.bg-dark { background-color: #212529 !important; }
.card-header.bg-info { background-color: #0dcaf0 !important; }
.card-header.bg-warning { background-color: #ffc107 !important; }

/* 2. Card headers on a colour background: white titles (>= 4.5:1) on primary/success/danger/secondary/dark/teal/indigo,
   dark titles on the light info/warning yellows. */
.card-header.bg-primary, .card-header.bg-success, .card-header.bg-danger, .card-header.bg-secondary,
.card-header.bg-dark, .card-header.bg-teal, .card-header.bg-indigo { color: #fff; }
.card-header:is(.bg-primary, .bg-success, .bg-danger, .bg-secondary, .bg-dark, .bg-teal, .bg-indigo) :is(.card-title, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .lead, .text-muted, p, small) {
    color: #fff !important;
}
.card-header.bg-info, .card-header.bg-warning { color: #212529 !important; }
.card-header:is(.bg-info, .bg-warning) :is(.card-title, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .lead, .text-muted, p, small, .text-white) {
    color: #212529 !important;
}

/* 3. Required-field asterisks: #e81b10 was 4.3:1 on the pale feedback form. */
.main-content .aboutSectionArea .feedbackArea .redColor,
.redColor { color: #c62828; }

/* 4. Long unbreakable strings (URLs, e-mail addresses written as text) must wrap inside the content areas instead of
   widening the page at 320px. Tables and buttons keep their own layout. */
.main-content .aboutSectionArea,
.main-content .aboutSectionArea :is(p, li, a, span, div, h1, h2, h3, h4, h5, h6, td, th, dd, dt, strong, em, blockquote) {
    overflow-wrap: anywhere;
}
.breadcumb-wrapper .breadcumb-title,
.breadcumb-wrapper .breadcumb-menu li,
.breadcumb-wrapper .breadcumb-menu a {
    overflow-wrap: anywhere;
    max-width: 100%;
}
.main-content .aboutSectionArea :is(.btn, button, input, select, textarea, code, pre) {
    overflow-wrap: normal;
}