/**
 * VIMAB — synlig tangentbordsfokus i Gravity Forms-formulären.
 *
 * WCAG 2.1 AA, 2.4.7 Fokus synligt.
 *
 * BAKGRUND
 * Gravity Forms 2.9+ ritar sin fokusmarkering med CSS-variabler
 * (--gf-local-outline-color / --gf-local-outline-width) i stället för en
 * vanlig outline-regel. UABB:s Gravity Form Styler skriver per-nod-CSS för
 * samma fält med högre specificitet, och de reglerna sätter bara
 * border-color — aldrig outline. Nettoresultatet blev att varken fälten
 * eller Skicka-knappen ändrade utseende vid tangentbordsfokus: en
 * genomgång av fyra formulärsidor hittade 9–10 fokuserbara element per
 * sida helt utan synlig fokusmarkering.
 *
 * Vi ritar därför en egen ring. :focus-visible används så att ringen bara
 * syns vid tangentbordsnavigering, inte vid musklick.
 *
 * SPECIFICITET
 * Gravity Forms ritar en egen blå fokusring på knappar och kryssrutor via
 * .gform-theme.gform-theme--framework.gform_wrapper .button:…:focus, som väger
 * 0,5,0. Mot den gula knappen ger den bara 2,6:1 — under de 3:1 som WCAG
 * 1.4.11 kräver. Därför tar vi med .gform-theme i vår egen selektor och landar
 * på 0,5,1, vilket vinner utan !important.
 *
 * FÄRGVAL
 * #073555 är VIMAB:s mörkblå. Mot fältbakgrunden (effektivt #EBF4F9) ger
 * den 11,4:1 och mot den gula knappen 7,2:1 — båda långt över de 3:1 som
 * WCAG 1.4.11 kräver för icke-textkontrast.
 *
 * @package CoTheme_Child
 */

/* Skicka-knappen ritas av Gravity Forms eget ramverk, vars :focus-regel väger
   tyngre än våra selektorer. I stället för att trappa upp specificiteten eller
   ta till !important byter vi ut ramverkets egen variabel — då ritar GF sin
   ring i vår färg. GF:s standardblå gav bara 2,6:1 mot den gula knappen. */
.uabb-gf-style .gform_wrapper.gform-theme {
	--gf-ctrl-outline-color-focus: #073555;
	--gf-ctrl-outline-width-focus: 3px;
}

.uabb-gf-style .gform_wrapper.gform-theme .gfield input:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gfield select:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gfield textarea:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_footer button:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_footer input[type="submit"]:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_page_footer button:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_page_footer input[type="submit"]:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_drop_area button:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform_button_select_files:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gfield_consent_label a:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform-footer button:focus-visible,
.uabb-gf-style .gform_wrapper.gform-theme .gform-footer input[type="submit"]:focus-visible {
	outline: 3px solid #073555;
	outline-offset: 2px;
	/* Fältet kan ligga i en container med overflow — offset-ringen får inte
	   klippas bort, så vi ritar även en skugga som inte kräver utrymme. */
	box-shadow: 0 0 0 3px rgba(7, 53, 85, 0.35);
}

/* Formulären ligger på ljus bakgrund. Skulle ett formulär flyttas till den
   mörkblå sektionsbakgrunden räcker inte mörkblå ring — då tar vi gult, som
   ger 7,9:1 mot #073555. */
.fl-row-bg-color[class*="vimab-morkbla"] .uabb-gf-style .gform_wrapper.gform-theme .gfield input:focus-visible,
.fl-row-bg-color[class*="vimab-morkbla"] .uabb-gf-style .gform_wrapper.gform-theme .gfield select:focus-visible,
.fl-row-bg-color[class*="vimab-morkbla"] .uabb-gf-style .gform_wrapper.gform-theme .gfield textarea:focus-visible {
	outline-color: #FDC600;
	box-shadow: 0 0 0 3px rgba(253, 198, 0, 0.35);
}
