/* Skip link for accessibility */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #000;
    color: #fff;
    padding: 8px;
    text-decoration: none;
    z-index: 100;
}

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

/* ============================================================================
   Tyler Forge Design Tokens - Color System
   WCAG 2.2 Level AA/AAA Compliant
   ============================================================================ */

:root {
    /* Primary brand colors (for links) */
    --forge-theme-primary: #0056b3;
    --forge-theme-primary-hover: #003d82;

    /* Secondary brand colors (for buttons, headings) */
    --forge-theme-secondary: #40528F;
    --forge-theme-secondary-hover: #407a8f;

    /* Navigation colors */
    --forge-theme-surface-inverse: #1a365d;
    --forge-theme-outline-high: #122845;

    /* Footer brand color (olive-green) - 4.68:1 contrast (accounts for opacity layers) */
    --forge-theme-footer-background: #6d7a35;

    /* Semantic colors */
    --forge-theme-error: #d32f2f;  /* 4.97:1 contrast on white */

    /* Text colors */
    --forge-theme-text-high-inverse: #ffffff;
    --forge-theme-text-medium-inverse: #e0e0e0;
    --forge-theme-text-medium: #767676;  /* 4.5:1 contrast on white - for small text */
    --forge-theme-text-low: #909090;     /* 2.84:1 contrast - large text only */
}

/* Bootstrap .well override - normalize spacing for consistent rendering
   Removes default margins from elements inside .well for uniform spacing */
.well {
    /* Remove default element margins to ensure consistent internal spacing */
}

.well p,
.well ul,
.well ol,
.well div {
    margin: 0;
}

/* Preserve list spacing inside wells */
.well ul,
.well ol {
    padding-left: 20px;
}

/* Error modifier for .well with red text (Forge error color) - BEM naming */
.well--error {
    color: var(--forge-theme-error);
}

/* Bootstrap small tag override - WCAG 2.2 Level AA compliant (4.5:1 contrast) */
/* Higher specificity to override Bootstrap's h1-h6 small rules */
h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small,
small {
    color: var(--forge-theme-text-medium);
}

/* Ensure links in text blocks are distinguishable (not just by color) */
/* Exclude navbar links which are distinguishable by context/placement */
.well a,
p a,
.body-content a,
.container > a {
    text-decoration: underline;
}

/* Remove underlines from navbar links */
.navbar a {
    text-decoration: none;
}

/* Link colors using Forge tokens (7.04:1 contrast on white, 6.45:1 on #f5f5f5) */
a {
    color: var(--forge-theme-primary);
}

a:hover,
a:focus {
    color: var(--forge-theme-primary-hover);
}

body {
    padding-top: 50px;
    padding-bottom: 20px;
    /*font-family: Arial, Helvetica;*/
    font-family: "Open Sans", Arial, sans-serif;
    /*font-family: Georgia, "Times New Roman", Times, serif;*/
}

h3 {
    color: var(--forge-theme-secondary);
    font-weight: bold;
}

/* Removed h4/h5 low-contrast rules - Tyler Forge best practice:
   Headings should always use high-contrast text for accessibility.
   Use semantic HTML (p, div) for non-heading content instead of h4/h5. */


/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    /*max-width: 280px;*/
}

/* ============================================================================
   Navbar - WCAG 2.2 Level AA Compliant (12.14:1 contrast)
   Using Forge design tokens with higher specificity to override Bootstrap
   ============================================================================ */

nav.navbar-inverse.navbar-custom {
    background-color: var(--forge-theme-surface-inverse);
    border-color: var(--forge-theme-outline-high);
}

nav.navbar-inverse .navbar-brand {
    color: var(--forge-theme-text-high-inverse);
}

nav.navbar-inverse .navbar-brand:hover,
nav.navbar-inverse .navbar-brand:focus {
    color: var(--forge-theme-text-medium-inverse);
    background-color: transparent;
}

nav.navbar-inverse .navbar-nav > li > a {
    color: var(--forge-theme-text-high-inverse);
}

nav.navbar-inverse .navbar-nav > li > a:hover,
nav.navbar-inverse .navbar-nav > li > a:focus {
    color: var(--forge-theme-text-medium-inverse);
    background-color: rgba(255, 255, 255, 0.1);
}

/* Footer styling with brand olive-green (applies to both <footer> and survey <div> footers) */
.navbar-fixed-bottom.navbar-inverse.navbar-custom {
    background-color: var(--forge-theme-footer-background);
    border-color: var(--forge-theme-footer-background);
}

/* Legacy navbar link styles */
.navbar .nav > li > a {
    float: none;
    color: var(--forge-theme-text-high-inverse);
}

.navbar .nav > li > a:hover {
    float: none;
    color: var(--forge-theme-text-medium-inverse);
}

.btn-primary {
    background: var(--forge-theme-secondary);
}

.btn-primary:hover {
    background: var(--forge-theme-secondary-hover);
}

.btn-primary:active,
.btn-danger:focus {
    background: var(--forge-theme-secondary);
}

/* Logout button styling to match navbar links using Forge tokens */
.navbar-btn.btn-link {
    color: var(--forge-theme-text-high-inverse);
    text-decoration: none;
    padding: 15px;
    margin: 0;
    border: none;
    background: transparent;
}

.navbar-btn.btn-link:hover,
.navbar-btn.btn-link:focus {
    color: var(--forge-theme-text-medium-inverse);
    text-decoration: none;
    background: transparent;
}