html, body {
    min-height: 100vh;
    height: 100%;
}

body {
    font-family: "Sage UI", "Helvetica Neue", Arial, sans-serif;
    font-size: 14px;
    background-color: var(--ui-page-bg);
    color: var(--text-dark);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    height: 100%;
}

main {
    flex: 1 0 auto;
    max-width: 1400px;
    margin: 0 auto;
    width: 100%;
}

main:focus {
    outline: none;
}

footer {
    background-color: var(--footer-bg);
    color: var(--footer-text);
    flex-shrink: 0;
    width: 100%;
    margin-top: auto;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    color: var(--ui-dark);
    font-size: 1.6rem;
    margin-bottom: 0.25rem !important;
}

h2 {
    font-size: 1.25rem;
    font-weight: 600;
}

h3, legend {
    font-size: 1.125rem;
    font-weight: 500;
}

.lead {
    font-size: 1rem;
    font-weight: 400;
    color: var(--text-muted);
}

/* Section Headings */
.section-title {
    text-align: center;
    margin: 3rem 0 1.5rem;
}

.section-title h2 {
    font-size: 1.5rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.section-title .underline {
    width: 3rem;
    height: 0.25rem;
    background-color: var(--table-header-bg);
    margin: 0.5rem auto;
}

/* Links */
a[disabled],
a.disabled {
    color: #9ca3af !important;
    cursor: not-allowed;
    opacity: 1;
    pointer-events: none;
    text-decoration: none;
}

/* Links */
a {
    color: #007e45; /* Standard link color */
    text-decoration: underline; /* Standard link underline */
    /* Remove default browser focus outline if applying custom focus styles */
    outline: none;
}

a:hover {
    /* Define a hover state - perhaps slightly darker or different underline */
    color: #005a31; /* Example darker green */
    text-decoration: underline;
}

a:focus-visible { /* Use focus-visible for accessibility */
    color: #007e45; /* Ensure color remains consistent on focus */
    text-decoration: none; /* Remove underline on focus for clarity with box-shadow */
    /* Using direct values */
    box-shadow: 0 2px 0 0 #333; /* Approximating --spacing050 and --colorsUtilityYin090 */
    border-bottom-left-radius: 2px; /* Approximating --borderRadius025 */
    border-bottom-right-radius: 2px; /* Approximating --borderRadius025 */
    /* Ensure focus style is distinct */
    outline: none; /* Remove default browser outline */
}

a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link) {
    font-weight: 400;
    color: var(--brand-primary);
    text-decoration: none;
    padding-left: 0;
    padding-right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s;
}

a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):hover,
a:not(.btn):not(.nav-link):not(.dropdown-item):not(.page-link):focus {
    text-decoration: underline;
    color: var(--brand-secondary);
}

a:hover,
a:focus {
    text-decoration: underline;
    color: var(--brand-secondary);
}

/* Focus States for Interactive Elements */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    outline: none;
    box-shadow: var(--link-focus-shadow);
}

/* Optional: Style for links specifically within body text if needed */
main a, .card-body a, .modal-body a {
    /* Styles specific to links within main content areas */
}

/* Style for icons within links (using Bootstrap Icons as an example) */
a .bi {
    margin-right: 0.25em; /* Space between icon and text */
    vertical-align: middle; /* Align icon vertically */
}