/**
 * Prachay Accessibility Pro - stylesheet.
 *
 * Nothing in this file restyles existing site content. It defines only:
 *   - the skip link, which is off-screen until focused;
 *   - the keyboard focus ring Divi suppresses;
 *   - the plugin's own pause / carousel controls;
 *   - form labels, which render only while the visible-labels module is on;
 *   - neutralisers that stop promoted <th> cells inheriting browser defaults.
 *
 * Colours used for the plugin's own furniture are checked against their
 * backgrounds: #0b4f80 on #ffffff is 8.59:1, #ffffff on #0b4f80 is 8.59:1.
 */

:root {
	--pap-focus: #0b4f80;
	--pap-control-bg: rgba(255, 255, 255, 0.92);
	--pap-control-fg: #0b4f80;
}

/* ==========================================================================
   SC 2.4.1 Bypass Blocks - the skip link

   Parked off-screen until it is focused, so sighted mouse users never see it.
   When it does appear it has to be unmissable, so it is a large white panel
   with a heavy brand-blue border, a drop shadow and a focus ring.

   position: fixed rather than absolute for two reasons: Divi's header is
   fixed and would otherwise paint over it, and a container with overflow
   hidden further up the tree can clip an absolutely positioned link away.
   ========================================================================== */

.pap-skip-link {
	position: fixed;
	top: 12px;
	left: -9999px;
	z-index: 2147483647;
	display: inline-block;
	max-width: calc(100vw - 32px);
	padding: 14px 24px;
	background: #ffffff;
	color: #10263a; /* 14.4:1 on white */
	font-family: inherit;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
	text-align: left;
	text-decoration: underline;
	text-underline-offset: 3px;
	border: 3px solid var(--pap-focus);
	border-radius: 6px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
}

/* :focus, not :focus-visible - it must appear for every Tab press. */
.pap-skip-link:focus {
	left: 16px;
	outline: 3px solid #10263a;
	outline-offset: 3px;
}

/* The skip target is a zero-height anchor; it must never affect layout.
   scroll-margin-top keeps the fixed header from covering the content the
   moment the browser jumps to it. */
#pap-main {
	display: block;
	width: 0;
	height: 0;
	overflow: hidden;
	scroll-margin-top: 140px;
}

#pap-main:focus {
	outline: none;
}

/* ==========================================================================
   Footer palette - white on the #035c98 panel

   The footer is white text on a blue panel and must stay that way. Divi
   declares that blue in its *deferred* stylesheet, so anything measuring
   colours before every sheet has applied sees no background, treats the
   canvas as white, and darkens the white text to an unreadable grey. The
   contrast module now refuses to act on an unresolved background and skips
   site chrome outright; this block is the belt to that pair of braces, and it
   also clears any inline colour a previous version left behind.

   Social icons are excluded: they are brand-blue glyphs on white circles, and
   that pairing is already correct.
   ========================================================================== */

.et-l--footer .ps-footerSection,
.et-l--footer .ps-footerSection p,
.et-l--footer .ps-footerSection li,
.et-l--footer .ps-footerSection span,
.et-l--footer .ps-footerSection strong,
.et-l--footer .ps-footerSection em,
.et-l--footer .ps-footerSection h1,
.et-l--footer .ps-footerSection h2,
.et-l--footer .ps-footerSection h3,
.et-l--footer .ps-footerSection h4,
.et-l--footer .ps-footerSection h5,
.et-l--footer .ps-footerSection h6,
.et-l--footer .ps-footerSection a,
.et-l--footer .ps-footerSection a:hover,
.et-l--footer .ps-footerSection a:focus,
.et-l--footer .ps-footerSection [class*="_tb_footer"] .et_pb_text_inner,
.et-l--footer .ps-footerSection [class*="_tb_footer"] .et_pb_text_inner * {
	color: #ffffff !important; /* 7.03:1 on #035c98 */
}

.et-l--footer .ps-footerSection .et_pb_social_media_follow a.icon,
.et-l--footer .ps-footerSection .et_pb_social_media_follow a.icon::before {
	color: #035c98 !important; /* brand glyph on its white circle */
}

/* Pinning the links white removes the colour shift they used as their hover
   cue, so an underline takes its place. A non-colour cue is what SC 1.4.1 asks
   for anyway, and it appears only on hover and focus - the resting footer is
   exactly as designed. */
.et-l--footer .ps-footerSection a:hover,
.et-l--footer .ps-footerSection a:focus {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.et-l--footer .ps-footerSection .et_pb_social_media_follow a:hover,
.et-l--footer .ps-footerSection .et_pb_social_media_follow a:focus {
	text-decoration: none;
}

/* ==========================================================================
   SC 2.4.7 Focus Visible
   Painted only while an element is keyboard-focused, so the resting design is
   untouched. :focus-visible keeps the ring away from mouse users.
   ========================================================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
.et_pb_button:focus-visible {
	outline: 3px solid var(--pap-focus);
	outline-offset: 2px;
}

/* Where the site paints a dark panel, flip the ring so it stays visible. */
.et_pb_bg_layout_dark a:focus-visible,
.et_pb_bg_layout_dark button:focus-visible,
.et_pb_bg_layout_dark [tabindex]:focus-visible,
footer a:focus-visible,
footer button:focus-visible {
	outline-color: #ffffff;
}

/* ==========================================================================
   Screen-reader-only text
   ========================================================================== */

.pap-sr-only {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ==========================================================================
   SC 3.3.2 Labels or Instructions

   The one module that renders visible text. The label inherits the form's own
   font and colour rather than declaring its own, so it reads as part of the
   existing design. Turning the module off swaps in .pap-label--sr, which keeps
   the programmatic association and hides the text.
   ========================================================================== */

.pap-label {
	display: block;
	margin: 0 0 4px;
	font-size: 0.875em;
	font-weight: 500;
	line-height: 1.4;
	color: inherit;
	text-align: left;
}

.pap-label--sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* The asterisk is decorative; "(required)" is announced from .pap-sr-only. */
.pap-req {
	color: #b3261e; /* 5.9:1 on white */
}

/* ==========================================================================
   SC 1.4.11 Non-text Contrast - form control boundaries
   A 1px #595959 border is 7:1 on white, comfortably past the 3:1 requirement
   for control boundaries, and matches the site's existing field weight.
   ========================================================================== */

input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="search"],
input[type="date"],
select,
textarea,
.wpcf7-text,
.wpcf7-email,
.wpcf7-tel,
.wpcf7-textarea,
.et_pb_contact_field .input {
	border: 1px solid #595959;
	color: #1a1a1a;
}

/* Browsers dim placeholder text below 4.5:1 by default. */
::placeholder {
	color: #595959;
	opacity: 1;
}

/* ==========================================================================
   SC 1.4.1 Use of Colour
   Added by the link module only to links that sit inside a run of prose and
   currently carry no cue other than colour.

   Divi sets `a { text-decoration: none }` from its own stylesheet and the two
   flagged links on /prachay-fund/ additionally carry an inline colour with
   !important, so the underline has to be declared the same way to land. Only
   elements this plugin has classed are affected.
   ========================================================================== */

a.pap-underline,
a.pap-underline:hover,
a.pap-underline:focus {
	text-decoration: underline !important;
}

/* ==========================================================================
   Plugin controls - pause buttons and injected carousel arrows

   These are the only elements this plugin adds to the page. They are small,
   corner-anchored and semi-transparent so they sit on top of the component
   they control without displacing any existing content.
   ========================================================================== */

.pap-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	margin: 0;
	font-size: 18px;
	line-height: 1;
	color: var(--pap-control-fg);
	background: var(--pap-control-bg);
	border: 2px solid var(--pap-control-fg);
	border-radius: 50%;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.pap-btn:hover,
.pap-btn:focus {
	color: #ffffff;
	background: var(--pap-control-fg);
}

/* Pause control: bottom-right of whatever is moving. */
.pap-pause {
	position: absolute;
	right: 12px;
	bottom: 12px;
	z-index: 60;
}

/* Injected carousel arrows: vertically centred on each edge. */
.pap-carousel-nav {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 60;
}

.pap-carousel-nav .pap-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: auto;
}

.pap-btn--prev {
	left: 12px;
}

.pap-btn--next {
	right: 12px;
}

/* On narrow screens the arrows move below the slider so they never cover it. */
@media (max-width: 640px) {
	.pap-carousel-nav {
		position: static;
		display: flex;
		gap: 12px;
		justify-content: center;
		padding: 8px 0;
	}

	.pap-carousel-nav .pap-btn {
		position: static;
		transform: none;
	}
}

/* ==========================================================================
   Promoted table headers

   PAP_Content converts a table's first row from <td> to <th> so its data cells
   have headers. Browsers render <th> bold and centred by default, which would
   change how those two tables look, so the defaults are reset.
   ========================================================================== */

th.pap-th {
	font-weight: inherit;
	text-align: inherit;
	vertical-align: inherit;
}

/* ==========================================================================
   Transcript links added beside a video (SC 1.2.3)
   ========================================================================== */

.pap-transcript-link {
	margin: 8px 0 0;
	font-size: 0.9375em;
}

.pap-transcript-link a {
	text-decoration: underline;
}

/* ==========================================================================
   SC 2.1.1 - keyboard access to navigation dropdowns

   Divi reveals submenus on hover only, leaving them visibility:hidden and out
   of the tab order. Mirroring the reveal on :focus-within makes every dropdown
   link reachable by Tab without altering the hover behaviour.
   ========================================================================== */

.nav li.menu-item-has-children:focus-within > ul,
.nav li.menu-item-has-children:focus-within > ul.sub-menu,
.et_pb_menu li.menu-item-has-children:focus-within > ul,
.et-menu li.menu-item-has-children:focus-within > ul {
	visibility: visible;
	opacity: 1;
	display: block;
}

/* ==========================================================================
   Respect the operating system's reduced-motion preference.
   The motion module also presses pause programmatically; this covers pure CSS
   animations that mount before the script runs.
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	.slidingVertical span,
	.slidingHorizontal span,
	.pnc-marquee-track {
		animation-play-state: paused;
	}
}