/**
 * Accessibility Enhancements
 * Fixes for WCAG 2.1 AA compliance
 */

/* Override the problematic outline:0 rule from style.css line 147 */
:active:focus,
:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
}

/* Enhanced focus styles for interactive elements */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.2) !important;
}

/* Focus styles for navigation elements */
.menu a:focus,
.top_panel_navi a:focus,
nav a:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
	background-color: rgba(0, 102, 204, 0.1) !important;
}

/* Focus styles for buttons */
.sc_button:focus,
button:focus,
input[type="submit"]:focus,
input[type="button"]:focus,
input[type="reset"]:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
	box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.3) !important;
}

/* Focus styles for form inputs */
input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 1px !important;
	border-color: #0066cc !important;
}

/* Focus styles for social icons */
.social_icons:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
	transform: scale(1.1);
}

/* Focus styles for carousel controls */
.slider_controls a:focus,
.slider_pagination a:focus,
[class*="swiper-button"]:focus {
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
	background-color: rgba(0, 102, 204, 0.2) !important;
}

/* Remove negative tabindex that prevents keyboard access */
[tabindex="-1"]:not([aria-hidden="true"]) {
	tabindex: 0 !important;
}

/* ===================================================================
	 Screen Reader Utilities
	 =================================================================== */

/* Screen reader only text (visually hidden but accessible) */
.screen-reader-text,
.sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* Allow screen reader text to be focusable when navigated to via keyboard */
.screen-reader-text:focus,
.sr-only:focus {
	position: static !important;
	width: auto !important;
	height: auto !important;
	padding: 0.5em 1em !important;
	margin: 0 !important;
	overflow: visible !important;
	clip: auto !important;
	white-space: normal !important;
	background-color: #f1f1f1 !important;
	color: #21759b !important;
	font-size: 14px !important;
	font-weight: bold !important;
	text-decoration: none !important;
	z-index: 100000 !important;
}

/* Skip to content link */
.skip-link {
	position: absolute;
	top: -40px;
	left: 0;
	background-color: #f1f1f1;
	color: #21759b;
	padding: 8px 16px;
	text-decoration: none;
	z-index: 100000;
}

.skip-link:focus {
	top: 0;
	outline: 2px solid #0066cc !important;
	outline-offset: 2px !important;
}

/* ===================================================================
	 SW-02: Heading Style Class (for decorative headings)
	 =================================================================== */

/* Visual heading appearance without semantic heading tag */
.heading-style {
	font-weight: bold;
	font-size: 1.2em;
	line-height: 1.3;
	margin-bottom: 0.5em;
	display: block;
}

.heading-style-h2 {
	font-size: 2em;
	text-transform: uppercase;
}

.heading-style-h3 {
	font-size: 1.5em;
	letter-spacing: -0.025em;
}

.heading-style-h4 {
	font-size: 1.2em;
	letter-spacing: -0.025em;
}

.heading-style-h5 {
	font-size: 1em;
	text-transform: uppercase;
}

/* ===================================================================
	 SW-06: Non-text element contrast (icons, badges, scroll-to-top)
	 =================================================================== */

.sc_icon_shape_round.sc_icon,
.sc_icon_shape_square.sc_icon,
.sc_services_style_services-1 .sc_icon,
.sc_services_style_services-2 .sc_icon,
.sc_services_style_services-5 .sc_icon {
	color: #ffffff !important;
	background-color: #0f2a44 !important;
	border-color: #0f2a44 !important;
	box-shadow: 0 0 0 2px rgba(12, 30, 52, 0.25) !important;
}

.sc_services_style_services-4 .sc_icon {
	color: #ffffff !important;
	background-color: #0f2a44 !important;
	border-color: #0f2a44 !important;
}

.sc_icon_shape_round.sc_icon:hover,
.sc_icon_shape_square.sc_icon:hover,
.sc_services_style_services-1 .sc_icon:hover,
.sc_services_style_services-1 a:hover .sc_icon,
.sc_services_style_services-2 .sc_icon:hover,
.sc_services_style_services-2 a:hover .sc_icon,
.sc_services_style_services-4 .sc_icon:hover,
.sc_services_style_services-4 a:hover .sc_icon,
.sc_services_style_services-5 .sc_icon:hover,
.sc_services_style_services-5 a:hover .sc_icon {
	color: #ffffff !important;
	background-color: #1b3f66 !important;
	border-color: #1b3f66 !important;
	box-shadow: 0 0 0 2px rgba(12, 30, 52, 0.35) !important;
}

.sc_socials.sc_socials_type_icons a,
.post_author .post_author_info .sc_socials_shape_square a,
.sc_team.sc_team_style_team-3 .sc_socials_item a,
.sc_team.sc_team_style_team-4 .sc_socials_item a {
	color: #ffffff !important;
	background-color: #0f2a44 !important;
	border-color: #0f2a44 !important;
}

.sc_socials.sc_socials_type_icons a:hover,
.post_author .post_author_info .sc_socials_shape_square a:hover,
.sc_team.sc_team_style_team-3 .sc_socials_item a:hover,
.sc_team.sc_team_style_team-4 .sc_socials_item a:hover {
	color: #ffffff !important;
	background-color: #1b3f66 !important;
	border-color: #1b3f66 !important;
}

.scroll_to_top {
	color: #ffffff !important;
	background-color: #0f2a44 !important;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.85), 0 10px 18px rgba(15, 42, 68, 0.45) !important;
}

.scroll_to_top:hover {
	background-color: #1b3f66 !important;
}

/* ===================================================================
	 SW-08: Sitemap layout helpers
	 =================================================================== */

.lsf-sitemap {
	padding-bottom: 3rem;
}

.lsf-sitemap__intro {
	margin-bottom: 2rem;
}

.lsf-sitemap__lede p:last-child {
	margin-bottom: 0;
}

.lsf-sitemap__grid {
	display: grid;
	gap: 2rem;
}

@media (min-width: 768px) {
	.lsf-sitemap__grid {
		grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	}
}

.lsf-sitemap__section h2,
.lsf-sitemap__section h3 {
	margin-bottom: 0.8em;
}

.lsf-sitemap__list {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

.lsf-sitemap__list li {
	margin-bottom: 0.35em;
}

.lsf-sitemap__collections {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
}

.lsf-sitemap__collection h3 {
	font-size: 1rem;
	text-transform: none;
}

.lsf-sitemap__menu-container .lsf-sitemap__list {
	display: block;
}

.lsf-sitemap__contact {
	font-size: 0.95rem;
}

/* ===================================================================
	 High Contrast Mode Support
	 =================================================================== */

@media (prefers-contrast: high) {
	:focus {
		outline-width: 3px !important;
		outline-offset: 3px !important;
	}
}

/* ===================================================================
	 Reduced Motion Support
	 =================================================================== */

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

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* ===================================================================
	 SW-05: Text Color Contrast Fixes (WCAG 2.1 AA 4.5:1 for body text, 3:1 for large text)
	 =================================================================== */

/* Fix orange-on-white text (common throughout site, especially on Maltese pages) */
/* Original orange (#ff6600, #ff9900, etc.) fails contrast - using darker orange */
.accent,
.sc_highlight,
a:not(.sc_button):not([class*="btn"]),
.top_panel_navi > li > a:hover,
.menu_main_nav > li > a:hover,
.post_meta_item a:hover,
.post_info a:hover,
.widget a:hover {
	/* color: #cc5200 !important; */
}

/* Fix grey-on-white text (body copy, footer, sections) */
/* Original greys (#999, #aaa, #777) often fail contrast */
body,
p,
.post_content,
.post_descr,
.post_excerpt,
.widget_text,
.post_meta,
.post_info,
.breadcrumbs,
.top_panel_top .contact_info,
.copyright-text {
	color: #595959 !important; /* WCAG AA compliant grey (7.0:1 on white) */
}

/* Large text (18pt+/14pt+ bold) can use lighter grey with 3:1 ratio */
h1, h2, h3, h4, h5, h6,
.page_title,
.post_title,
.widget_title,
.sc_title {
	color: #595959 !important; /* Same grey for consistency */
}

/* Fix beige/tan backgrounds with insufficient contrast */
.scheme_original .vc_row[style*="background"][style*="#f"],
.top_panel_top,
section[style*="background"][style*="#f4"],
.post_item[style*="background"][style*="#f"] {
	color: #333333 !important; /* Dark grey for better contrast */
}

/* ===================================================================
	 SW-05: Button Color Contrast Fixes
	 =================================================================== */

/* Primary buttons - orange theme color needs darker shade for contrast */
.sc_button,
.sc_button.sc_button_style_filled,
button,
input[type="submit"],
input[type="button"],
.more-link,
.post_readmore .post_readmore_link,
.wpcf7-submit,
[class*="btn-primary"],
.vc_general.vc_btn3 {
	background-color: #cc5200 !important; /* WCAG AA compliant orange */
	color: #ffffff !important;
	border-color: #cc5200 !important;
}

.sc_button:hover,
.sc_button.sc_button_style_filled:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.more-link:hover,
.wpcf7-submit:hover {
	background-color: #993d00 !important; /* Darker orange for hover */
	border-color: #993d00 !important;
	color: #ffffff !important;
}

/* Secondary/outline buttons */
.sc_button.sc_button_style_border,
.sc_button_simple,
[class*="btn-secondary"] {
	border-color: #cc5200 !important;
	color: #cc5200 !important;
	background-color: transparent !important;
}

.sc_button.sc_button_style_border:hover,
.sc_button_simple:hover {
	background-color: #cc5200 !important;
	color: #ffffff !important;
}

/* White buttons on colored backgrounds */
.sc_button.sc_button_style_filled.sc_button_color_white,
.scheme_dark .sc_button,
[style*="background"] .sc_button.color_white {
	background-color: #ffffff !important;
	color: #0f2a44 !important; /* Dark navy for contrast */
	border-color: #ffffff !important;
}

.sc_button.sc_button_style_filled.sc_button_color_white:hover {
	background-color: #f0f0f0 !important;
	color: #0f2a44 !important;
}

/* ===================================================================
	 SW-05: Banner and Hero Section Contrast
	 =================================================================== */

/* Hero banners with image backgrounds need better text contrast */
.top_panel_title,
.sc_parallax,
.vc_row[data-vc-full-width],
.sc_section_overlay,
[class*="hero"],
.slider_wrap {
	position: relative;
}

/* Add dark overlay for text readability on image backgrounds */
.top_panel_title::before,
.sc_parallax::before,
.slider_engine_revo .slide_overlay::before,
[class*="hero"]::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.45); /* 45% dark overlay for better text contrast */
	z-index: 0;
	pointer-events: none;
}

/* Ensure text is above overlay */
.top_panel_title > *,
.sc_parallax > *,
.slider_wrap > *,
[class*="hero"] > * {
	position: relative;
	z-index: 1;
}

/* White text on dark overlays */
.top_panel_title,
.top_panel_title .page_title,
.top_panel_title .breadcrumbs,
.top_panel_title .breadcrumbs a,
.sc_parallax,
.slider_wrap .slide_title,
.slider_wrap .slide_subtitle,
[class*="hero"] {
	color: #ffffff !important;
}

.top_panel_title .breadcrumbs a:hover {
	color: #f0f0f0 !important;
}

/* ===================================================================
	 SW-05: Footer and Widget Text Contrast
	 =================================================================== */

/* Footer text improvements */
.footer_wrap,
.footer_wrap .widget,
.footer_wrap .widget_text,
.footer_wrap p,
.copyright-wrap,
.copyright-text {
	color: #d9d9d9 !important; /* Light grey (7.1:1 on dark backgrounds) */
}

.footer_wrap a,
.footer_wrap .widget a {
	color: #ffffff !important;
}

.footer_wrap a:hover,
.footer_wrap .widget a:hover {
	color: #f0f0f0 !important;
}

/* Widget headings */
.footer_wrap .widget_title,
.footer_wrap h1,
.footer_wrap h2,
.footer_wrap h3,
.footer_wrap h4,
.footer_wrap h5,
.footer_wrap h6 {
	color: #ffffff !important;
}

/* ===================================================================
	 Maltese Pages Specific Fixes (PROGRAMMI, DLIXX, MIN, MISSJONI, DWARNA)
	 =================================================================== */

/* Ensure all Maltese page content has proper contrast */
.page[lang="mt"] .post_content,
.page[lang="mt"] p,
.page[lang="mt"] li,
[lang="mt"] .vc_column_container {
	color: #595959 !important;
}

/* Maltese page headings */
.page[lang="mt"] h1,
.page[lang="mt"] h2,
.page[lang="mt"] h3,
.page[lang="mt"] h4,
[lang="mt"] .sc_title {
	color: #333333 !important;
}

/* Maltese page links */
.page[lang="mt"] a:not(.sc_button),
[lang="mt"] a:not(.sc_button) {
	color: #cc5200 !important;
}

.page[lang="mt"] a:not(.sc_button):hover,
[lang="mt"] a:not(.sc_button):hover {
	color: #993d00 !important;
}

/* ===================================================================
	 Additional Contrast Fixes for Common Patterns
	 =================================================================== */

/* View all links, read more, etc. */
.post_readmore,
.viewmore,
.show_more,
[class*="view-all"],
[class*="read-more"] {
	color: #cc5200 !important;
}

/* Testimonial and quote text */
blockquote,
.sc_testimonial,
.sc_quote,
.testimonial_content {
	color: #333333 !important;
}

/* Form labels and instructions */
label,
.wpcf7 label,
.form_label,
.required-info,
.form-instructions {
	color: #333333 !important;
}

/* Categories, tags, meta information */
.post_categories,
.post_tags,
.post_meta,
.post_info_item {
	color: #595959 !important;
}

/* Ensure proper contrast on colored backgrounds */
[style*="background-color: rgb(255"][style*="background-color: rgb(254"],
[style*="background-color: #ff"][style*="background-color: #fe"],
.scheme_light {
	color: #333333 !important;
}

[style*="background-color: rgb(0"][style*="background-color: rgb(1"][style*="background-color: rgb(2"],
[style*="background-color: #0"][style*="background-color: #1"][style*="background-color: #2"],
.scheme_dark {
	color: #ffffff !important;
}
