/*
=========================================================
FOCUS VISIBLE CSS
=========================================================
 * Styling för tekniken "focus visible" som möjliggör 
 * särskiljande styling för fokus baserat på om det 
 * aktiveras via tangentbord eller mus.
 * 
 * Copyright (C) Limepark AB.
 * https://limepark.se/licensvillkor
=========================================================*/


/*
---------------------------------------------------------
SYNLIGT FOKUS
--------------------------------------------------------- */


/* Fix för att länkars outline inte ska hamna under andra länkar i menyerna */

.lp-topmenu a:focus,
.lp-menu a:focus,
.lp-menu button:focus {
  z-index: 2;
}

.lp-topmenu a:focus,
.lp-menu a:focus {
   position: relative;
}


/* Default fokusutseende på länkar och knappar */

:focus,
button:focus {
  outline: 3px solid #000;
  text-decoration: none !important;
}


/* Fokusutseende på länkar mot mörk bakgrund */

.lp-footer-menu-first-row a:focus,
.lp-footer-menu-first-row button:focus,
.lp-footer-menu-last-row a:focus,
.lp-footer-menu-last-row button:focus {
  outline: 3px solid #fff;
}

/* Fokusutseende på länkar i toppmenyn */

.lp-header-row-two a:focus {
   outline: 3px solid #B0B0B0;
   text-decoration: none !important;
}

/* Fokusutseende på länkar i mörk hero */

.lp-hero .pagecontent a:focus {
   outline: 3px solid #fff;
}

/*
---------------------------------------------------------
DOLD FOKUS FÖR MUS
--------------------------------------------------------- */

/* Tar bort outline för fokus via musinteraktion */
html.js-focus-visible :focus:not(.focus-visible) {
  outline: none !important;
}
/**
 * För tillfället verkar webbläsarna inte klara av att tolka den föreslagna standarden 
 * och ignorerar då stilregler som innehåller :focus-visible. På grund av det behöver 
 * man ha dubbla uppsättningar med stilregler för att separera selektorn för standarden 
 * och den för JS-implementationen.
 */
html:not(.js-focus-visible) :focus:not(:focus-visible) {
  outline: none !important;
}