/* ==========================================================================
   Fire Prevention Officers Association
   Accessibility Overrides
   Theme: Pixel v2.4.0
   CMS: Concrete CMS 8.5.2

   Purpose:
   WCAG 2.1 AA accessibility improvements.
   This stylesheet should load AFTER all Pixel theme styles.

   Last Updated:
   July 2026
   ========================================================================== */


/* ==========================================================================
   1. Typography
   ========================================================================== */

html {
    font-size: 100%;
}

body {
    font-size: 16px;
    line-height: 1.6;
    color: #222;
    -webkit-text-size-adjust: 100%;
}

p,
li,
td,
th,
blockquote {
    font-size: 1rem;
    line-height: 1.6;
}


/* ==========================================================================
   2. Heading Spacing
   ========================================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {

    line-height: 1.25;

    margin-top: 1.25em;

    margin-bottom: .5em;
}


/* ==========================================================================
   3. Lists
   ========================================================================== */

ul,
ol {

    padding-left: 1.5rem;

    margin-bottom: 1rem;
}

li {

    margin-bottom: .35rem;
}


/* ==========================================================================
   4. Links
   ========================================================================== */

a {

    text-decoration-thickness: 2px;

    text-underline-offset: .15em;

    transition: color .2s ease;
}


/* ==========================================================================
   5. Keyboard Focus
   ========================================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {

    outline: 3px solid #ffbf47;

    outline-offset: 3px;

    border-radius: 2px;
}


/* ==========================================================================
   6. Forms
   ========================================================================== */

label {

    display: block;

    font-weight: 600;

    margin-bottom: .35rem;
}

input,
select,
textarea {

    font-size: 16px;

    min-height: 44px;

    max-width: 100%;
}

input[type="checkbox"],
input[type="radio"] {

    min-height: auto;
}


/* ==========================================================================
   7. Buttons
   ========================================================================== */

button,
input[type="submit"],
input[type="button"],
input[type="reset"] {

    min-height: 44px;

    cursor: pointer;
}


/* Rounded buttons */

.button-rounded {

    border-radius: 999px;
}


/* ==========================================================================
   8. Tables
   ========================================================================== */

table {

    width: 100%;

    border-collapse: collapse;
}

th {

    font-weight: 700;

    text-align: left;
}

th,
td {

    padding: .75rem;

    vertical-align: top;
}


/* ==========================================================================
   9. Images
   ========================================================================== */

img {

    max-width: 100%;

    height: auto;
}


/* ==========================================================================
   10. Utility Classes
   ========================================================================== */

.visually-hidden {

    position: absolute;

    width: 1px;

    height: 1px;

    padding: 0;

    margin: -1px;

    overflow: hidden;

    clip: rect(0 0 0 0);

    white-space: nowrap;

    border: 0;
}

.text-center {

    text-align: center;
}


/* ==========================================================================
   11. Skip Link
   ========================================================================== */

.skip-link {

    position: absolute;

    left: -9999px;

    top: 0;

    background: #000;

    color: #fff;

    padding: .75rem 1rem;

    z-index: 99999;
}

.skip-link:focus {

    left: 1rem;

    top: 1rem;
}


/* ==========================================================================
   12. Reduced Motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        animation-duration: .01ms !important;

        animation-iteration-count: 1 !important;

        transition-duration: .01ms !important;

        scroll-behavior: auto !important;
    }
}

/* ==========================================================================
   13. Side Bar Nav
   ========================================================================== */
   .widget_links ul li a, 
   .ccm-block-page-list-title a {
    font-size: 16px;
}

.ccm-block-page-list-wrapper .ccm-block-page-list-title,
.ccm-block-page-list-wrapper .ccm-block-page-list-title a {
    font-size: 16px !important;
    line-height: 1.6;
}
   
   /* Force Calendar date text 16px */
.ccm-block-calendar-event-list-event-date-full {font-size: 16px}


/* Force all links in the section navigation */
.ccm-block-page-list-wrapper ul li a {font-size: 16px;}


.form-group {font-size: 16px;}
label {font-size: 16px;}


/* Make calendar display text 16px */
.fc-content {font-size: 16px;}


.ccm-block-page-list-wrapper .ccm-block-page-list-title a {
    font-size: 16px !important;
    line-height: 1.6 !important;
} 
   
   
/* ==========================================================================
   End Accessibility Overrides
   ========================================================================== */