/**
 * Wolf – Ligipääsetavuse parandused
 * Moodul: Blossom Fashion / Fashion Icon (torivallaraamatukogu.ee)
 * v0.15.0 — CSS konsolideeritud
 *
 * Varasemad versioonid kuhjasid reegleid: neli eri plokki sihtisid
 * .search-submit elementi, kõik !important-iga. Lai selektor + !important
 * tekitas kaks regressiooni (pildiallkirjade lingid, otsinguluup).
 *
 * Nüüd on tööjaotus selge:
 *   JS  → kontrast (loeb tegeliku tausta, valib musta või valge)
 *   CSS → fookus, klikialade suurus, skip-link
 *
 * CSS ei sunni enam ühtegi taustavärvi ega taustapilti.
 *
 * Värvid: Tori valla stiiliraamat (Lisa 1-1)
 *   #231F20 must (valgel 16.30:1) · #E11D41 punane (valgel 4.72:1)
 */

/* ═══════════════════════════════════════════════════════════════════════
 * WCAG 2.4.7 + 2.4.11 — FOOKUSE NÄHTAVUS
 * WCAG 2.2 nõuab nähtavat indikaatorit kontrastiga ≥3:1.
 * Brändipunane annab valgel 4.72:1 — mugav varu.
 * ═══════════════════════════════════════════════════════════════════════ */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 3px solid #E11D41;
	outline-offset: 2px;
}

/* Tumedal taustal heledam indikaator.
 *
 * v0.7.16 — päis ja menüü EEMALDATUD sellest reeglist. Selle teema päis
 * on VALGE, seega valge raam oli nähtamatu ja fookus paistis kaduvat.
 * Käsitsi test 28.07 leidis selle; skanner ei näe fookuse nähtavust.
 *
 * Jalus on tume (#3f3f3f), seal on valge raam õige. */
.site-footer a:focus-visible,
.site-footer button:focus-visible {
	outline: 3px solid #FFFFFF;
	outline-offset: 2px;
}

/* Kui teema on outline'i kuskil maha võtnud */
*:focus-visible {
	outline-style: solid;
}

/* Peidetud dubleerivad pisipildilingid ei saa fookust (JS lisab tabindex="-1") */
a[aria-hidden="true"][tabindex="-1"]:focus {
	outline: none;
}

/* ═══════════════════════════════════════════════════════════════════════
 * WCAG 2.5.8 — KLIKIALADE SUURUS (WCAG 2.2) — min 24×24 px
 * ═══════════════════════════════════════════════════════════════════════ */

#site-navigation li.menu-item-has-children > button,
.btn-close-menu,
.btn-close-form,
#toggle-button,
#btn-search {
	min-width: 24px;
	min-height: 24px;
}

/* ═══════════════════════════════════════════════════════════════════════
 * SKIP-LINK — teemal on olemas, veendume et fookuses nähtav
 * ═══════════════════════════════════════════════════════════════════════ */

.skip-link:focus,
.screen-reader-text:focus {
	background-color: #FFFFFF;
	clip: auto !important;
	clip-path: none;
	color: #231F20;
	display: block;
	font-size: 1rem;
	font-weight: 700;
	height: auto;
	left: 8px;
	line-height: normal;
	outline: 3px solid #E11D41;
	outline-offset: 2px;
	padding: 16px 24px;
	text-decoration: none;
	top: 8px;
	width: auto;
	z-index: 100000;
}

/* ═══════════════════════════════════════════════════════════════════════
 * ABIKLASS — kollase brändivärvi ohutu kasutus
 *
 * Kollane #FFCB05 ei sobi tekstiks (valgel 1.52:1). Taustana tumeda
 * tekstiga annab 10.71:1 — korras ja stiiliraamatu kasutusviisiga kooskõlas.
 * ═══════════════════════════════════════════════════════════════════════ */

.wolf-kollane-taust {
	background-color: #FFCB05;
	color: #231F20;
}

.wolf-kollane-taust a {
	color: #231F20;
	text-decoration: underline;
}

/* ═══════════════════════════════════════════════════════════════════════
 * v0.7.14 — ALAMMENÜÜ JÄÄB AVATUKS, KUI FOOKUS ON SEES
 *
 * Käsitsi test 28.07: kasutaja tabib alammenüüsse, aga menüü sulgub
 * (hover kaob) ja fookuseeritud element jääb peitu. Fookus on tehniliselt
 * olemas, aga kasutaja ei näe, kus ta on. WCAG 2.4.7, 2.4.3.
 *
 * :focus-within rakendub AINULT siis, kui fookus on tegelikult alammenüü
 * sees — hiirekasutajale ei muutu midagi. Deklaratsioone on palju, sest
 * teema peitmisviis ei selgunud diagnostikast üheselt; kataksime kõik
 * levinud tehnikad korraga.
 * ═══════════════════════════════════════════════════════════════════════ */

#site-navigation li.menu-item-has-children:focus-within > .sub-menu,
#site-navigation li:focus-within > .sub-menu {
	display: block !important;
	visibility: visible !important;
	opacity: 1 !important;
	height: auto !important;
	max-height: none !important;
	overflow: visible !important;
	clip: auto !important;
	clip-path: none !important;
	transform: none !important;
	pointer-events: auto !important;
	z-index: 9999;
}

/* Fookuseeritud link alammenüüs peab olema kindlasti nähtav */
#site-navigation .sub-menu a:focus-visible,
#site-navigation .sub-menu button:focus-visible {
	outline: 3px solid #E11D41;
	outline-offset: -1px;
	position: relative;
	z-index: 10000;
}

/* ------------------------------------------------------------------
   WCAG 1.4.3 - lingid pildiallkirjas
   ------------------------------------------------------------------
   Blossom Fashion annab figcaption-ile tumeda tausta (#231F20) ja valge
   teksti - see on tahtlik kujundus ja annab 16,3:1. Aga link selle sees
   parib uldise lingivarvi #666666, mis tumedal taustal annab 2,84:1.

   Mootdetud 10.08.2026 renderdatud lehelt. htmlcs soovitas valget teksti,
   axe markis leiu tegelikuks veaks (needsFurtherReview: false).

   Kaks leidu: /raamatukogud/sindi-raamatukogu/ ja
   /sundmused/lugemise-proovikivi-2026/. Link parib nuud figcaption-i
   valge varvi; allakriipsutus jaab eristajaks (1.4.1).

   0.7.25: varem oli siin `color: inherit`, mis toi kaks parandust
   vastuollu. Uks neist linkidest on `mark` sees ja paris seetottu
   `mark`-i uue varvi #A87A00, mis tumedal taustal annab 4,23:1 -
   napilt alla 4,5 lavendi. Nuud on valge antud otse, tahtsuse
   margendiga, et `mark` reegel seda ule ei kirjutaks. Valge tumedal
   #231F20 annab 16,3:1. */
figcaption a,
figcaption a:link,
figcaption a:visited,
figcaption a:hover,
figcaption a:focus,
figcaption mark a,
figcaption mark strong a,
figcaption strong a {
	color: #FFFFFF !important;
	text-decoration: underline;
}

/* ------------------------------------------------------------------
   WCAG 1.4.3 - mark-elemendi esiletostuvarv
   ------------------------------------------------------------------
   WordPressi plokiredaktori „luminous vivid amber" (#FCB900) valgel
   taustal annab 1,74:1. Kriteerium noaab suurele tekstile 3:1.

   htmlcs soovitas #BF8C00, mis annab 3,01:1 - liiga napp, iga
   umardusviga viib alla laveri. #A87A00 annab 3,85:1 ja jaab
   visuaalselt kollaseks.

   Tahtsuse margend on vajalik: WordPressi varviklass voidab tavalise
   reegli. Mootdetud 10.08.2026 susti-katsega renderdatud lehel - ilma
   margendita jai varv #FCB900, margendiga joustus.

   NB: see on kliendi SISUS tehtud esiletost. CSS parandab nahtava
   tulemuse, aga plokiredaktoris jaab varv endiseks - kui klient lisab
   uue esiletostu sama varviga, laheb see sama reegli alla. */
.has-luminous-vivid-amber-color,
mark.has-luminous-vivid-amber-color {
	color: #A87A00 !important;
}
