/* SEO and Accessibility Enhancements */

/* Semantic HTML element styling */
main {
    display: block; /* Fix for older browsers */
}

article, section, aside, nav, header, footer, figure, figcaption {
    display: block;
    margin: 0;
    padding: 0;
}

/* Skip to content link - for accessibility */
.skip-to-content {
    position: absolute;
    top: -40px;
    left: 0;
    background: var(--primary-600);
    color: white;
    padding: 8px 16px;
    z-index: 100;
    transition: top 0.3s;
}

.skip-to-content:focus {
    top: 0;
}

/* Emphasize headings for better semantic structure */
h1, h2, h3, h4, h5, h6 {
    margin-top: 0;
    margin-bottom: 0.5em;
    font-weight: 700;
}

h1 {
    font-size: clamp(1.875rem, 2.5vw, 2.5rem);
}

h2 {
    font-size: clamp(1.5rem, 2vw, 2rem);
}

h3 {
    font-size: clamp(1.25rem, 1.5vw, 1.75rem);
}

/* Improve readability for better user experience */
p, li, blockquote {
    max-width: 75ch; /* Optimal reading width */
    line-height: 1.6;
}

/* Enhanced focus styles for accessibility */
a:focus, button:focus, input:focus, textarea:focus, select:focus {
    outline: 2px solid var(--primary-500);
    outline-offset: 2px;
}

/* Ensure all links have appropriate contrast */
a {
    text-decoration: underline;
    text-underline-offset: 2px;
}

a:hover {
    text-decoration: none;
}

/* Schema.org role attributes */
[itemprop="name"] {
    font-weight: bold;
}

[itemprop="description"] {
    margin-bottom: 1rem;
}

/* Fix for images - prevent layout shifts */
img {
    height: auto;
    max-width: 100%;
}

/* Proper table semantics */
table {
    border-collapse: collapse;
    width: 100%;
}

th {
    text-align: start;
}

th, td {
    padding: 0.5rem 1rem;
}

/* RTL specific fixes for semantic elements */
[dir="rtl"] blockquote {
    border-right: 4px solid var(--primary-200);
    border-left: none;
    padding-right: 1rem;
    padding-left: 0;
}

/* Structured data visual enhancement */
.structured-data-item {
    border: 1px solid var(--gray-200);
    border-radius: 0.375rem;
    padding: 1rem;
    margin-bottom: 1.5rem;
}

.structured-data-item h3 {
    margin-top: 0;
    color: var(--primary-700);
}

/* Print styles for SEO content */
@media print {
    .structured-data-item {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}
