/* A kártyák halk háttérmintázata (áramköri vonalak, átlós csíkok, csillagok).

   MIÉRT KÜLÖN RÉTEG, ÉS NEM HÁTTÉRKÉP
   A kártyák háttere sötét témában ÁTMENET (app-late.css: html.dark-theme
   .card), világosban egyszerű szín. Egy `background-image` az átmenetet
   felülírná, a nagyobb súlyú témaszabály pedig a mi képünket írná felül -
   vagyis a két megoldás váltakozva bukna el. Ezért a mintázat önálló rétegben
   (::after) ül a kártya háttere FÖLÖTT, de a tartalom ALATT.

   Hogy a réteg biztosan a tartalom alá kerüljön:
     * a kártya `isolation: isolate`-tel saját rétegsorrendet nyit;
     * a réteg `z-index: -1`, ami ezen belül a háttér fölé, de a szöveg alá
       esik. Így soha nem takarhat el semmit, és kattintást sem fog.

   A halványságot maga az SVG hordozza (2-7% átlátszatlanság), nem itt
   állítjuk: így a mintázat sötét és világos kártyán is ugyanolyan visszafogott,
   és a szöveg kontrasztja érintetlen marad. */

body .card,
body .modal-box,
body .dashboard-block,
body .stat-box {
    position: relative;
    isolation: isolate;
}

body .card::after,
body .modal-box::after,
body .dashboard-block::after,
body .stat-box::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: inherit;
    background-image: url("../img/card-pattern.efe49c5a0716.svg");
    background-repeat: repeat;
    background-position: top right;
    pointer-events: none;
}

/* --- OLYAN KÁRTYÁK, AHOL AZ ::after MÁR FOGLALT ------------------------- */

/* A naptárkártya ::after-ját a fénycsík használja, a ::before viszont szabad. */
body .calendar-card {
    position: relative;
    isolation: isolate;
}

body .calendar-card::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: inherit;
    background-image: url("../img/card-pattern.efe49c5a0716.svg");
    background-repeat: repeat;
    background-position: top right;
    pointer-events: none;
}

/* Az árazás-sávon mindkét áleleme foglalt (fénycsík és keret), a háttere
   viszont egyszerű szín - ott a háttérkép biztonságos. */
body .price-band {
    background-image: url("../img/card-pattern.efe49c5a0716.svg");
    background-repeat: repeat;
    background-position: top right;
}

/* --- KIVÉTELEK ----------------------------------------------------------
   Nyomtatásnál nincs díszítés: a papíron csak nyelné a festéket, és rontaná
   az olvashatóságot. Nagy kontrasztot kérő felhasználónál szintén elmarad. */
@media print, (prefers-contrast: more) {
    body .card::after,
    body .modal-box::after,
    body .dashboard-block::after,
    body .stat-box::after,
    body .calendar-card::before {
        display: none;
    }

    body .price-band {
        background-image: none;
    }
}