/* =============================
   General Page Setup
   ============================= */
html, body {
    font-family: "Segoe UI", "Arial", sans-serif; /* Highly readable fonts */
    font-size: 18px; /* Larger default font size */
    line-height: 1.6; /* Better readability */
    background-color: #000; /* Dark background for high contrast */
    color: #FFFF00; /* White text for contrast */
    margin: 0;
    padding: 5px;
}

/* =============================
   Links
   ============================= */
a {
    color: #00ffff; /* Cyan for high contrast */
    text-decoration: underline;
    outline: none;
}

    a:focus, a:hover {
        background-color: #ffff00; /* Yellow highlight for focus */
        color: #000; /* Text contrast on highlight */
    }

/* =============================
   Headings
   ============================= */
h1, h2, h3, h4, h5, h6 {
    font-weight: bold;
    margin-top: 1.2em;
    margin-bottom: 0.6em;
}

/* =============================
   Buttons and Interactive Elements
   ============================= */
button, input[type="submit"], input[type="button"] {
    font-size: 1.2em;
    padding: 0.6em 1.2em;
    border: 2px solid #fff;
    background-color: #000;
    color: #fff;
    cursor: pointer;
}

    button:focus, input[type="submit"]:focus {
        outline: 4px solid #ffff00; /* Strong focus indicator */
    }

/* =============================
   Forms
   ============================= */
input, textarea, select {
    font-size: 1.2em;
    padding: 0.5em;
    border: 2px solid #fff;
    background-color: #000;
    color: #fff;
}

    input:focus, textarea:focus, select:focus {
        outline: 4px solid #ffff00;
    }

/* =============================
   High Contrast Tables
   ============================= */
table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.5em;
}

th, td {
    border: 2px solid #fff;
    padding: 0.6em;
}

th {
    background-color: #222;
}

/* =============================
   Lists
   ============================= */
ul, ol {
    margin-left: 2em;
    margin-bottom: 1em;
}

/* =============================
   Skip to Content Link
   ============================= */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #ffff00;
    color: #000;
    padding: 8px;
    z-index: 100;
}

    .skip-link:focus {
        top: 0;
    }

/* =============================
   Images
   ============================= */
img {
    max-width: 100%;
    height: auto;
    border: none;
}

/* =============================
   General Accessibility Helpers
   ============================= */
body.high-contrast {
    background-color: #000;
    color: #fff;
}

.visually-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px, 1px, 1px, 1px);
    white-space: nowrap;
}