/* =====================================================================
   One Click Accessibility (Pojo) — font-resize + contrast fixes
   Theme: 20c (template-home / template-privacy)
   Every font rule is gated behind body[class*="pojo-a11y-resize-font-"];
   every contrast rule is gated behind its pojo-a11y-* mode class.
   ===================================================================== */

/* ---------------------------------------------------------------------
   Section 1: scale curves. Forms/banner start smallest and need a bigger
   first jump. The toolbar curve is deliberately gentler so the
   accessibility menu stays a bit smaller than page text.
   --------------------------------------------------------------------- */
:root { --a11y-scale: 1; --a11y-scale-form: 1; --a11y-scale-toolbar: 1; }
body.pojo-a11y-resize-font-130 { --a11y-scale:1.15; --a11y-scale-form:1.30; --a11y-scale-toolbar:1.08; }
body.pojo-a11y-resize-font-140 { --a11y-scale:1.22; --a11y-scale-form:1.40; --a11y-scale-toolbar:1.12; }
body.pojo-a11y-resize-font-150 { --a11y-scale:1.28; --a11y-scale-form:1.48; --a11y-scale-toolbar:1.16; }
body.pojo-a11y-resize-font-160 { --a11y-scale:1.35; --a11y-scale-form:1.55; --a11y-scale-toolbar:1.20; }
body.pojo-a11y-resize-font-170 { --a11y-scale:1.42; --a11y-scale-form:1.62; --a11y-scale-toolbar:1.24; }
body.pojo-a11y-resize-font-180 { --a11y-scale:1.48; --a11y-scale-form:1.68; --a11y-scale-toolbar:1.28; }
body.pojo-a11y-resize-font-190 { --a11y-scale:1.54; --a11y-scale-form:1.72; --a11y-scale-toolbar:1.32; }
body.pojo-a11y-resize-font-200 { --a11y-scale:1.60; --a11y-scale-form:1.75; --a11y-scale-toolbar:1.36; }

/* ---------------------------------------------------------------------
   Section 2: base pin on <body> (measured: 20/30 base, 22 at <=991,
   20/25 at <=767). Unscoped so the toolbar keeps behaving.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
@media (max-width: 991px) {
	html body[class*="pojo-a11y-resize-font-"] { font-size: calc(22px * var(--a11y-scale)) !important; }
}
@media (max-width: 767px) {
	html body[class*="pojo-a11y-resize-font-"] { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(25px * var(--a11y-scale)) !important; }
}

/* ---------------------------------------------------------------------
   Section 3: kill % compounding inside every content root.
   :where() keeps this at (0,2,2) so every pin below wins by source order.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] :is(.logo-wrapper, .hero-sec, .icon-sec, .footer-sec, .sticky-button-group, .whatsapp-btn, .privacy-content, .description-section, .gold-card-banner, .breadcrums) :where(p, li, span, label, blockquote, legend, code, pre, dd, dt) {
	font-size: inherit !important;
}

/* ---------------------------------------------------------------------
   Section 4: form controls + messages on --a11y-scale-form.
   Inputs and submit share one explicit height per breakpoint so they
   stay equal on every device; unitless line-height everywhere.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .form-wrap :is(input[type="text"], input[type="tel"], input[type="email"], input[type="submit"]) {
	height: calc(46px * var(--a11y-scale-form)) !important;
	line-height: 1.2 !important;
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}
html body[class*="pojo-a11y-resize-font-"] .form-wrap :is(input[type="text"], input[type="tel"], input[type="email"]) {
	font-size: calc(18px * var(--a11y-scale-form)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .form-wrap input::placeholder {
	font-size: calc(15px * var(--a11y-scale-form)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .form-wrap input[type="submit"] {
	font-size: calc(26px * var(--a11y-scale-form)) !important;
}
html body[class*="pojo-a11y-resize-font-"] .wpcf7-checkbox .wpcf7-list-item-label {
	font-size: calc(16px * var(--a11y-scale-form)) !important;
	line-height: 1.375 !important;
}
/* validation tip: one line, in flow (theme never positions it) */
html body[class*="pojo-a11y-resize-font-"] .wpcf7 .wpcf7-not-valid-tip {
	font-size: calc(16px * var(--a11y-scale-form)) !important;
	line-height: 1.4 !important;
	white-space: nowrap !important;
}
html body[class*="pojo-a11y-resize-font-"] .wpcf7 form .wpcf7-response-output {
	font-size: calc(max(14px, 20px) * var(--a11y-scale-form)) !important;
	line-height: 1.5 !important;
}
@media (min-width: 768px) and (max-width: 991px) {
	/* 4 columns of ~166px: cap the tip so it still fits on one line */
	html body[class*="pojo-a11y-resize-font-"] .wpcf7 .wpcf7-not-valid-tip {
		font-size: max(14px, min(calc(16px * var(--a11y-scale-form)), 3.2vw)) !important;
	}
}
@media (max-width: 767px) {
	html body[class*="pojo-a11y-resize-font-"] .form-wrap :is(input[type="text"], input[type="tel"], input[type="email"], input[type="submit"]) {
		height: calc(43px * var(--a11y-scale-form)) !important;
	}
}

/* ---------------------------------------------------------------------
   Section 4b: accessibility toolbar items — gentler curve so the menu
   stays a little smaller than page text. Title and toggle untouched.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a {
	font-size: calc(12.8px * var(--a11y-scale-toolbar)) !important;
}
html body[class*="pojo-a11y-resize-font-"] #pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a span {
	font-size: inherit !important;
}

/* ---------------------------------------------------------------------
   Section 4c: cookie banner (#cc-banner-root / .cc-modal-wrap live outside
   the content roots). Generic inherit first, then calc() pins.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] :is(.cc-root, .cc-modal-wrap) :is(p, li, span, label, a) { font-size: inherit !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-root,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap { font-size: calc(14px * var(--a11y-scale)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-title,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-title { font-size: calc(18px * var(--a11y-scale-form)) !important; line-height: 1.3 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-body,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-body { font-size: calc(14px * var(--a11y-scale-form)) !important; line-height: 1.5 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-btn,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-btn { font-size: calc(15px * var(--a11y-scale-form)) !important; line-height: 1.4 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-lang-toggle,
html body[class*="pojo-a11y-resize-font-"] .cc-root .cc-lang-toggle { font-size: calc(12px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-modal-head h2,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-modal-head h2 { font-size: calc(18px * var(--a11y-scale)) !important; line-height: 1.3 !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-modal-close,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-modal-close { font-size: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-cat-desc,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-cat-desc { font-size: calc(13px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-required-badge,
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-required-badge { font-size: calc(11px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list,
html body[class*="pojo-a11y-resize-font-"] .cc-cookies-list :is(th, td),
html body[class*="pojo-a11y-resize-font-"] .cc-modal-wrap .cc-cookies-list :is(th, td) { font-size: calc(12px * var(--a11y-scale)) !important; }

/* ---------------------------------------------------------------------
   Section 5: theme font rules (style.css then responsive.css, same
   order and media blocks), gated and x var(--a11y-scale).
   Buttons use --a11y-scale-form.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .global-btn,
html body[class*="pojo-a11y-resize-font-"] .submit-btn { font-size: calc(24px * var(--a11y-scale-form)) !important; line-height: calc(30px * var(--a11y-scale-form)) !important; }
html body[class*="pojo-a11y-resize-font-"] .title-area .title { font-size: calc(38px * var(--a11y-scale)) !important; line-height: calc(46px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .hero-content h1.hero-title { font-size: calc(65px * var(--a11y-scale)) !important; line-height: calc(45px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .hero-content .subtitle { font-size: calc(40px * var(--a11y-scale)) !important; line-height: calc(45px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .hero-content .hero-desc { font-size: calc(32px * var(--a11y-scale)) !important; line-height: calc(34px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .hero-content .hero-desc .eng { font-size: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .price-wrapper .price-detail { font-size: calc(26px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .price-wrapper .price-detail .price { font-size: calc(62px * var(--a11y-scale)) !important; line-height: calc(45px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .icon-row .icon-col .text { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .footer-sec .title-area .title { font-size: calc(34px * var(--a11y-scale)) !important; line-height: calc(42px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .footer-sec .title-area .subtitle { font-size: calc(28px * var(--a11y-scale)) !important; line-height: calc(36px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .form-desc { font-size: calc(16px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .footer-desc { font-size: calc(46px * var(--a11y-scale)) !important; line-height: calc(50px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .footer-desc > .first { font-size: calc(30px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-text,
html body[class*="pojo-a11y-resize-font-"] .privacy-link { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .sticky-button-group > .global-btn { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .page-content h2 { font-size: calc(32px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .page-content h3 { font-size: calc(28px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .page-content h4 { font-size: calc(24px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .page-content p { line-height: calc(28px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .privacy-banner h1 { font-size: calc(50px * var(--a11y-scale)) !important; line-height: calc(56px * var(--a11y-scale)) !important; }
html body[class*="pojo-a11y-resize-font-"] .breadcrumbs li { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }

@media (max-width: 991px) {
	html body[class*="pojo-a11y-resize-font-"] .title-area h2.title { font-size: calc(36px * var(--a11y-scale)) !important; line-height: calc(46px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .hero-content h1.hero-title { font-size: calc(56px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .hero-content .subtitle { font-size: calc(34px * var(--a11y-scale)) !important; line-height: calc(40px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .hero-content .hero-desc { font-size: calc(28px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .price-wrapper .price-detail .price { font-size: calc(52px * var(--a11y-scale)) !important; line-height: calc(38px * var(--a11y-scale)) !important; }
}

@media (max-width: 767px) {
	html body[class*="pojo-a11y-resize-font-"] .hero-content .hero-desc { font-size: calc(24px * var(--a11y-scale)) !important; line-height: calc(30px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .hero-content .hero-desc .eng { font-size: calc(22px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .price-wrapper .price-detail { font-size: calc(20px * var(--a11y-scale)) !important; line-height: calc(24px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .price-wrapper .price-detail .price { font-size: calc(34px * var(--a11y-scale)) !important; line-height: calc(36px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .title-area h2.title { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(38px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .footer-sec .title-area .title { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(32px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .footer-sec .title-area .subtitle { font-size: calc(18px * var(--a11y-scale)) !important; line-height: calc(26px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .footer-desc { font-size: calc(30px * var(--a11y-scale)) !important; line-height: calc(34px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .page-content h2 { font-size: calc(30px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .page-content h3 { font-size: calc(26px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .page-content h4 { font-size: calc(22px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .privacy-banner h1 { font-size: calc(42px * var(--a11y-scale)) !important; line-height: calc(48px * var(--a11y-scale)) !important; }
	html body[class*="pojo-a11y-resize-font-"] .breadcrumbs li { font-size: calc(22px * var(--a11y-scale)) !important; line-height: calc(22px * var(--a11y-scale)) !important; }
}

/* ---------------------------------------------------------------------
   Section 5b: layout room for the bigger text (gated). The icon section
   is pulled up over the hero (-400px desktop/tablet, -35% mobile); keep
   the hero content clear of it, and keep the footer / WhatsApp button
   clear of the taller mobile sticky bar. No effect at default size:
   the hero's min-height still wins until the content outgrows it.
   --------------------------------------------------------------------- */
html body[class*="pojo-a11y-resize-font-"] .hero-sec { padding-bottom: 80px !important; }
/* WhatsApp icon: keep the default (unscaled) line box so the icon never shifts inside its box */
html body[class*="pojo-a11y-resize-font-"] .whatsapp-btn { font-size: 20px !important; line-height: 30px !important; }
@media (max-width: 991px) {
	html body[class*="pojo-a11y-resize-font-"] .whatsapp-btn { font-size: 22px !important; }
}
@media (max-width: 767px) {
	html body[class*="pojo-a11y-resize-font-"] .whatsapp-btn { font-size: 20px !important; line-height: 25px !important; }
}
@media (max-width: 991px) {
	html body[class*="pojo-a11y-resize-font-"] .hero-sec { padding-bottom: 140px !important; }
}
@media (max-width: 767px) {
	html body[class*="pojo-a11y-resize-font-"] .hero-sec { padding-bottom: calc(40px + 36vw) !important; }
	html body[class*="pojo-a11y-resize-font-"] .footer-sec { padding-bottom: calc(110px * var(--a11y-scale) + 10px) !important; }
	/* sticky bar (bottom 10 + padding 20 + up to 2 lines of 24px text + 26px) + 10px gap */
	html body[class*="pojo-a11y-resize-font-"] .whatsapp-btn { bottom: max(14%, calc(48px * var(--a11y-scale) + 66px)) !important; }
}

/* =====================================================================
   CONTRAST MODES
   Prefixes carry an ID + class so they out-specify the plugin's
   `*:not(#pojo-a11y-toolbar)` rules:
     ANY  = html body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast,.pojo-a11y-light-background):not(#a11y-x):not(.a11y-x)
     DARK = html body:is(.pojo-a11y-high-contrast,.pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x)
     LB   = html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x)
   Background-image URLs come from ACF and are printed inline by
   functions.php (enqueue_accessibility_bg_images).
   ===================================================================== */

/* High contrast: page itself is black */
html:has(body.pojo-a11y-high-contrast),
body.pojo-a11y-high-contrast { background: #000 !important; background-color: #000 !important; color: #fff !important; }

/* --- background-image sections: containers stay transparent so the image shows --- */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) :is(.hero-sec, .hero-sec .container, .hero-content, .price-wrapper, .icon-sec, .icon-sec .title-area, .icon-row, .icon-row .icon-col, .privacy-banner, .privacy-banner-content, .breadcrumbs, .landing-logo) {
	background-color: transparent !important;
}
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .hero-sec { background-size: cover !important; background-position: top center !important; background-repeat: repeat !important; }
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .privacy-banner { background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important; }
@media (min-width: 768px) {
	html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .icon-sec > .container { background-color: transparent !important; }
	html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .icon-sec { background-size: cover !important; background-position: top center !important; background-repeat: repeat !important; }
}

/* --- text on top of images: background behind the text only --- */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) :is(.hero-content .hero-title, .hero-content .subtitle, .hero-content .hero-desc, .price-wrapper .price-detail, .icon-sec .title-area .title, .icon-row .icon-col .text, .privacy-banner h1) {
	width: fit-content !important;
	max-width: 100% !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) :is(.hero-content .hero-title, .hero-content .subtitle, .hero-content .hero-desc, .price-wrapper .price-detail, .icon-sec .title-area .title, .icon-row .icon-col .text, .privacy-banner h1, .breadcrumbs li) {
	background-color: #000 !important;
	box-shadow: 0 0 0 6px #000 !important;
}
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) :is(.hero-content .hero-title, .hero-content .subtitle, .hero-content .hero-desc, .price-wrapper .price-detail, .icon-sec .title-area .title, .icon-row .icon-col .text, .privacy-banner h1, .breadcrumbs li) {
	background-color: #fff !important;
	box-shadow: 0 0 0 6px #fff !important;
}
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) .price-wrapper { border-color: #fff !important; }

/* --- icons / images --- */
/* icon tiles keep their white backing so the black SVG icons stay visible */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .icon-row .icon-wrapper { background: #fff !important; background-color: #fff !important; }
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) :is(.icon-row .icon-wrapper img, .landing-logo img, .icon-sec > img) { background: transparent !important; background-color: transparent !important; }
/* logo (black lettering) sits on the dark mobile header strip in dark modes */
@media (max-width: 767px) {
	html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) .logo-wrapper .landing-logo img { background: #fff !important; background-color: #fff !important; }
}
/* button icons in dark modes: the yellow/white icons (hero chevron, phone, whatsapp) show as-is;
   the submit chevron is BLACK, so it is inverted to white */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) :is(.global-btn img, .submit-btn-wrap img, .whatsapp-btn img) { background: transparent !important; background-color: transparent !important; }
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) .submit-btn-wrap p > img { z-index: 1 !important; filter: invert(1) !important; }
/* light-background mode: yellow/white icons get a dark backing; the black submit chevron needs none */
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .global-btn img { background: #000 !important; background-color: #000 !important; border-radius: 4px; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .submit-btn-wrap p > img { background: transparent !important; background-color: transparent !important; z-index: 1 !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .whatsapp-btn { background: #000 !important; background-color: #000 !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .whatsapp-btn img { background: transparent !important; background-color: transparent !important; }

/* validation tip overlaps the input by 4px (theme margin-top:-4px); keep it see-through
   so the input's bottom border stays visible */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background):not(#a11y-x):not(.a11y-x) .wpcf7-not-valid-tip { background: transparent !important; background-color: transparent !important; }

/* --- placeholders --- */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) :is(input, textarea)::placeholder { color: #fff !important; opacity: 1 !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) :is(input, textarea)::placeholder { color: #000 !important; opacity: 1 !important; }

/* --- checkbox tick stays visible inside the box --- */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) .wpcf7-checkbox input[type="checkbox"] { border: 1px solid #fff !important; }
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) .wpcf7-checkbox input[type="checkbox"]:checked::before { background: #fff !important; background-color: #fff !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .wpcf7-checkbox input[type="checkbox"] { border: 1px solid #000 !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) .wpcf7-checkbox input[type="checkbox"]:checked::before { background: #000 !important; background-color: #000 !important; }
body.pojo-a11y-grayscale .wpcf7-checkbox input[type="checkbox"]:checked::before { background-color: #fff !important; }

/* --- every button gets a border in every contrast mode --- */
html body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast):not(#a11y-x):not(.a11y-x) :is(.global-btn, .submit-btn, .sticky-btn, .wpcf7-submit, .whatsapp-btn, .cc-btn, .cc-lang-toggle, .cc-modal-foot button) { border: 1px solid #fff !important; }
html body.pojo-a11y-light-background:not(#a11y-x):not(.a11y-x) :is(.global-btn, .submit-btn, .sticky-btn, .wpcf7-submit, .whatsapp-btn, .cc-btn, .cc-lang-toggle, .cc-modal-foot button) { border: 1px solid #000 !important; }
body.pojo-a11y-grayscale :is(.wpcf7-submit, .whatsapp-btn, .cc-btn, .cc-modal-foot button) { border: 1px solid #fff !important; }
/* WhatsApp icon centred inside its (now bordered) box in every contrast mode */
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale) .whatsapp-btn { display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; }
body:is(.pojo-a11y-high-contrast, .pojo-a11y-negative-contrast, .pojo-a11y-light-background, .pojo-a11y-grayscale) .whatsapp-btn img { width: 32px !important; height: 32px !important; max-width: none !important; margin: 0 !important; }

/* =====================================================================
   Site-specific additions (as supplied)
   ===================================================================== */
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) textarea,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) select {
	border: 1px solid #000 !important;
}
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) input::placeholder,
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) textarea::placeholder {
	color: #000;
}

/* Remove the problematic body filter only during grayscale mode */
body.pojo-a11y-grayscale {
	-webkit-filter: none !important;
	filter: none !important;
	overflow-x: hidden !important;
}
/* Reapply grayscale to the document root */
html:has(body.pojo-a11y-grayscale) {
	-webkit-filter: grayscale(100%) !important;
	filter: grayscale(100%) !important;
}
/* Change toolbar positioning only during grayscale mode */
body.pojo-a11y-grayscale #pojo-a11y-toolbar {
	position: fixed !important;
	z-index: 99999 !important;
}

.cc-slider, body.pojo-a11y-high-contrast .cc-slider, body.pojo-a11y-grayscale .cc-slider,
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .cc-slider,
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-slider {
	background: #ababff !important;
}
body.pojo-a11y-grayscale .wpcf7-not-valid-tip {
	color: #fff;
}
body.pojo-a11y-light-background *:not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-btn {
	border: 1px solid #000 !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .cc-slider {
	background: gray !important;
}
body.pojo-a11y-high-contrast .cc-slider {
	background: gray !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .cc-slider {
	background: gray !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .black-bg img {
	background: #000 !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .transparent-bg {
	background: transparent !important;
}
body.pojo-a11y-high-contrast .transparent-bg {
	background: transparent !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .transparent-bg {
	background: transparent !important;
}
body.pojo-a11y-light-background :not(#pojo-a11y-toolbar):not(.pojo-a11y-toolbar-link) .transparent-bg img {
	background: transparent !important;
}
body.pojo-a11y-high-contrast .transparent-bg img {
	background: transparent !important;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .transparent-bg img {
	background: transparent !important;
}
body.pojo-a11y-high-contrast .wpcf7-checkbox input[type="checkbox"]:checked::before {
	color: #fff;
}
body.pojo-a11y-negative-contrast :not(#pojo-a11y-toolbar) .wpcf7-checkbox input[type="checkbox"]:checked::before {
	color: #fff;
}

body #cc-floater {
	bottom: unset !important;
	top: 12.5vw !important;
	/* same side as the accessibility toggle, centred under it */
	left: unset !important;
	right: 0.1vw !important;
	width: 2.5vw !important;
	height: 2.5vw !important;
	line-height: 2.5vw;
	text-align: center !important;
	z-index: 999 !important;
}
body #cc-floater svg {
	width: 1.5vw !important;
	height: 1.5vw !important;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
body #pojo-a11y-toolbar {
	z-index: 9999 !important;
	top: 9vw !important;
}
body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
	font-size: 1.5vw !important;
	padding: 0.6vw !important;
}
body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
	width: 1.5vw !important;
}
@media (max-width: 767px) {
	body #cc-floater {
		bottom: unset !important;
		top: 60vw !important;
		left: unset !important;
		right: 0.4vw !important;
		width: 7.5vw !important;
		height: 7.5vw !important;
		line-height: 7.5vw;
		padding: 4.5vw !important;
	}
	body #cc-floater svg {
		width: 5vw !important;
		height: 5vw !important;
	}
	body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle a {
		font-size: 5.5vw !important;
		padding: 2vw !important;
	}
	body #pojo-a11y-toolbar .pojo-a11y-toolbar-toggle svg {
		width: 5.8vw !important;
	}
	body #pojo-a11y-toolbar {
		top: 48vw !important;
	}
	/* cookie banner centred on mobile */
	.cc-banner {
		padding: 16px !important;
	}
	.cc-pos-right {
		left: 50% !important;
		right: unset !important;
		bottom: 10px !important;
		width: 95%;
		transform: translateX(-50%);
	}
	.cc-btn {
		padding: 7px 9px !important;
	}
}

/* Consent checkbox vertically centred on its label text (1 or more lines) */
.wpcf7-checkbox > .wpcf7-list-item > label {
	align-items: center;
}

/* Mobile sticky buttons: text + icon always on one line (wrapped below ~375px),
   same 51px height as before; "לפרטים נוספים" gets a double-arrow icon that
   follows the text colour in every contrast mode */
@media (max-width: 767px) {
	.sticky-button-group > .global-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		white-space: nowrap;
		padding-left: 6px;
		padding-right: 6px;
		min-height: 51px;
		font-size: min(18px, 5vw);
	}
	.sticky-button-group > .global-btn > img {
		margin-right: 6px;
		flex-shrink: 0;
	}
	.sticky-button-group > .sticky-btn[href="#contactUs"]::after {
		content: "";
		flex: 0 0 auto;
		width: 22px;
		height: 22px;
		margin-right: 6px;
		background-color: currentColor;
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5l-7 7 7 7M19 5l-7 7 7 7'/%3E%3C/svg%3E") center / contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5l-7 7 7 7M19 5l-7 7 7 7'/%3E%3C/svg%3E") center / contain no-repeat;
	}
	/* bigger accessibility text may wrap; the icon stays beside it */
	html body[class*="pojo-a11y-resize-font-"] .sticky-button-group > .global-btn { white-space: normal !important; }
}

/* Toolbar item icons (RTL): no gap on the right, 6px gap on the left */
#pojo-a11y-toolbar .pojo-a11y-toolbar-overlay ul.pojo-a11y-toolbar-items li.pojo-a11y-toolbar-item a svg {
	padding-right: 0 !important;
	padding-left: 6px !important;
}
