/*
Theme Name:   Ånerud og Haugs Eiendomsutvikling – Kadence Child
Theme URI:    https://aanerud-haug-eiendom.no/
Description:  Child theme for Kadence. Farger, typografi, layout, header,
              footer og knapper styres fra Kadence Customizer / Kadence Blocks.
              Denne filen inneholder KUN detaljene Kadence ikke kan gjengi
              fra originalsiden, samt to tilgjengelighetsforbedringer.
Author:       Ånerud og Haugs Eiendomsutvikling
Template:     kadence
Version:      3.0.0
Text Domain:  anerud-child
*/

/* -------------------------------------------------------------------------
   1. Navigasjon – dobbel strek (over og under) på aktiv/hover-lenke
   Hvorfor CSS: Kadence tilbyr kun understrek for menypunkter. Originalen
   bruker Elementors "double-line"-peker: 3 px strek både over og under
   lenken, som glir inn ovenfra/nedenfra ("drop-in"). Fargen følger
   palette1, så en omfarging propagerer.
   ------------------------------------------------------------------------- */

.main-navigation .primary-menu-container > ul > li.menu-item > a {
  position: relative;
}

.main-navigation .primary-menu-container > ul > li.menu-item > a::before,
.main-navigation .primary-menu-container > ul > li.menu-item > a::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  height: 3px;
  background-color: var(--global-palette1, #433347);
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.main-navigation .primary-menu-container > ul > li.menu-item > a::before {
  top: 0;
  transform: translateY(-10px);
}

.main-navigation .primary-menu-container > ul > li.menu-item > a::after {
  bottom: 0;
  transform: translateY(10px);
}

.main-navigation .primary-menu-container > ul > li.menu-item > a:hover::before,
.main-navigation .primary-menu-container > ul > li.menu-item > a:hover::after,
.main-navigation .primary-menu-container > ul > li.menu-item > a:focus-visible::before,
.main-navigation .primary-menu-container > ul > li.menu-item > a:focus-visible::after,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a::before,
.main-navigation .primary-menu-container > ul > li.current-menu-item > a::after,
.main-navigation .primary-menu-container > ul > li.current-menu-ancestor > a::before,
.main-navigation .primary-menu-container > ul > li.current-menu-ancestor > a::after {
  opacity: 1;
  transform: none;
}

/* -------------------------------------------------------------------------
   2. Kontaktlinjen i topplinjen
   Hvorfor CSS: Kadence' HTML-element (desktop + mobil) rendrer én tekstblokk. Originalen har
   ikon + tekst med 28 px mellomrom mellom punktene. Ren layout-hjelp.
   ------------------------------------------------------------------------- */

.header-html .an-hc,
.mobile-html .an-hc {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-inline-end: 28px;
  white-space: nowrap;
}

.header-html .an-hc:last-child,
.mobile-html .an-hc:last-child {
  margin-inline-end: 0;
}

.header-html .an-hc svg,
.mobile-html .an-hc svg {
  flex: 0 0 auto;
}

@media (max-width: 767px) {
  .header-html .an-hc,
.mobile-html .an-hc {
    margin-inline-end: 25px;
  }
}

/* -------------------------------------------------------------------------
   3. Synlig fokusmarkering (WCAG 2.4.7)
   Originalen mangler dette. Ren tilgjengelighetsforbedring – påvirker ikke
   utseendet for musbrukere.
   ------------------------------------------------------------------------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.kb-button:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--global-palette2, #1a6c7a);
  outline-offset: 2px;
}

/* -------------------------------------------------------------------------
   4. Respekter prefers-reduced-motion
   ------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}
