/* ============================================================================
   "Powered by Webfix" — staat in de onderbalk van élke footer, gedeeld door alle
   templates. Zie Views/Site/Templates/_shared/_PoweredByWebfix.cshtml.

   Sinds 10-09-2026 staat dit regeltje IN de onderbalk, op de plek van het oude
   copyright, in plaats van als losse regel eronder. Daarom heeft het hier geen
   eigen padding en geen eigen uitlijning meer: het is een gewoon inline element
   dat meedoet in de rij van de onderbalk. Waar dat een tikje bijstellen vraagt,
   staat dat onderaan dit bestand per template bij elkaar.

   Uitgangspunt: dit regeltje kent de kleur van de footer NIET. beauty1 en business2
   hebben een donkere footer, business1 heeft een lichte én een donkere modus. Daarom
   staat er nergens een vaste kleur in: de tekst erft de kleur van de footer via
   currentColor en wordt alleen gedempt met opacity. Zo leest hij overal goed en
   hoeft er per template niets bijgeregeld te worden.
   ============================================================================ */
.wf-poweredby {
  display: inline-flex;
  /*  De onderbalken van beauty1 en italianjob zijn tekstregels, geen flex-rij: daar staat dit
      blokje náást gewone tekst en zou het zonder deze regel op de tekstregel gaan hangen. */
  vertical-align: middle;
  line-height: 1;
}

.wf-poweredby-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: inherit;
  text-decoration: none;
}

/*  Alleen de tekst wordt gedempt, niet het diamantje: dat is al klein en zou bij
    dezelfde demping vaal worden op een lichte footer.

    De maat volgt de onderbalk waarin hij staat (13,5px is de maat van vier van de zes
    onderbalken), zodat hij als gelijke naast de juridische links leest in plaats van als
    voetnoot. Waar de balk een andere maat aanhoudt, zet de template hem onderaan bij. */
.wf-poweredby-text {
  font-size: var(--wf-pb-size, 13.5px);
  letter-spacing: .02em;
  opacity: var(--wf-pb-dim, .6);
  transition: opacity .35s ease;
}

.wf-poweredby-logo {
  flex: none;
  display: block;
  width: 20px;
  height: 18px;
  opacity: .9;
  transition: opacity .35s ease;
}

.wf-poweredby-link:hover .wf-poweredby-text,
.wf-poweredby-link:focus-visible .wf-poweredby-text,
.wf-poweredby-link:hover .wf-poweredby-logo,
.wf-poweredby-link:focus-visible .wf-poweredby-logo { opacity: 1; }

/*  Toetsenbordbediening: zonder eigen omlijning valt de focusring op een donkere footer weg. */
.wf-poweredby-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
  border-radius: 4px;
}

/* ----------------------------------------------------------------------------
   Maat en demping per template — hier bij elkaar, niet verspreid over zes
   CSS-bestanden.

   De standaard .6 klopt op de LICHTE footers: die geven hun gewone, volle
   tekstkleur door, dus de demping is precies wat het regeltje op dezelfde sterkte
   brengt als de juridische links ernaast.

   De DONKERE footers leveren hun tekst al gedempt aan — business2 en interieur1
   als rgba(255,255,255,.66/.68), italianjob als een grijs. Daar komt onze demping
   dus bovenop en wordt het regeltje te vaal. De waarden hieronder zetten hem
   gelijk aan de juridische links van de template zelf.
   ---------------------------------------------------------------------------- */
.b2-footer .wf-poweredby { --wf-pb-dim: 1; --wf-pb-size: 14px; }   /* business2  — balk op 14px  */
.td-footer .wf-poweredby { --wf-pb-dim: .88; }                     /* interieur1 — balk op 13,5px */

/*  business1 is de enige template met zowel een lichte als een donkere modus, en die twee vragen een
    andere demping. Licht: de footer geeft #2a2a2a door, en .6 landt vlak bij de juridische links
    (#8a8078). Donker: de footer geeft #e8e6e3 door — veel lichter — en dan wordt .6 juist váger dan
    de juridische links ernaast, die daar op #b8b4ae staan. Vandaar hier een eigen waarde. */
[data-bs-theme="dark"] .biz-footer .wf-poweredby { --wf-pb-dim: .78; }

/*  italianjob: de onderbalk is daar een Bootstrap-kolom met gewone alinea's; de juridische
    links staan op 14px (fs-14), dus die maat houden we aan.
    LET OP: `footer-dark` is een Crafto-basisklasse en geen eigen klasse van italianjob — die footer
    heeft er geen. Bouwt er ooit iemand een nieuwe Crafto-template met dezelfde klasse, dan erft die
    deze afstelling stilzwijgend mee; zet er dan een eigen klasse op de footer bij. Vandaag is
    italianjob de enige die `footer-dark` echt in zijn markup heeft staan. */
footer.footer-dark .wf-poweredby { --wf-pb-dim: 1; --wf-pb-size: 14px; }

/*  beauty1: de hele onderregel staat al op opacity .8 en op 13px (.bty-footer-legalrow).
    Opacity stapelt naar beneden, dus onze eigen demping moet hier uit — anders wordt dit
    regeltje vaal onder een rij die zelf al gedempt is. */
.bty-footer-legalrow .wf-poweredby { --wf-pb-dim: 1; --wf-pb-size: 13px; }