/* Basic resets and global typography */
* {
    box-sizing: border-box;
}
body {
    font-family: var(--font-base);
    color: var(--color-text);
    background-color: var(--color-background);
    margin: 0;
}


/* Link bez wlasnego koloru dziedziczy kolor kontekstu.

   Konieczne po usunieciu `a{color:#c36}` z reset.css: bez zadnej reguly autorskiej link
   dostaje domyslny styl przegladarki (#0000EE), ktory na ciemnym tle wyglada jeszcze gorzej
   niz crimson. `color: inherit` ma specyficznosc 0,0,1, wiec kazda regula komponentu (.klasa)
   nadal wygrywa. */
a {
    color: inherit;
}

/* Linki tekstowe w tresci.

   reset.css nie narzuca juz koloru linkom (usuniete `a{color:#c36}` i `a:active,a:hover{color:#336}`),
   wiec kazdy link dziedziczy kolor kontekstu — to wlasciwe zachowanie dla linkow-kafelkow i
   linkow-przyciskow, ktore maja wlasne style. Ale link w zdaniu musi byc odrozniealny od tekstu,
   a te miejsca renderuja goly <a> bez klasy:
     .page-content   — tresc wpisu/strony z szablonow ogolnych (single/archive/search),
     .user-details   — dane konta na /my-account/ (m.in. "Strona WWW" uzytkownika),
     .unsubscribe__back — powrot do /gdpr/ na /unsubscribe/.
   Wszystkie stany jawnie, bo pojedyncza klasa przegrywa specyficznoscia z regulami stanowymi. */
.page-content a,
.user-details a,
.unsubscribe__back a {
    color: var(--theme-link);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.page-content a:hover,
.page-content a:focus,
.page-content a:focus-visible,
.page-content a:active,
.user-details a:hover,
.user-details a:focus,
.user-details a:focus-visible,
.user-details a:active,
.unsubscribe__back a:hover,
.unsubscribe__back a:focus,
.unsubscribe__back a:focus-visible,
.unsubscribe__back a:active {
    color: var(--theme-link-hover);
}