# Jogi dokumentumok és Általános szerződési feltételek stílusa

> A dokumentumok saját CSS-e, a hozzájárulás visszavonó gomb stílusa, és az ÁSZF formázása.

## A dokumentumok saját CSS-e

A Complianz saját CSS-t ad a jogi dokumentumokhoz, hogy azok a webhelyen alapból jól nézzenek ki. Ha ezt ki szeretnéd egészíteni, az egyéni dokumentum-CSS-t a **Complianz → Settings** oldalon adhatod meg (lásd [Eszközök és beállítások](https://hub.hellowp.io/hu/plugins/complianz-gdpr-premium/eszkozok/)), és szinte bármit átállíthatsz vele. A címsorok, a színek és a betűméret módosításához a beállításokban már megtalálod a leggyakoribb tulajdonságokat.

Ha azt szeretnéd, hogy a dokumentumok megjelenését a téma CSS-e vezérelje, kikapcsolhatod a Complianz dokumentum-CSS-ét, és szükség esetén a témában módosítasz.

## A sütilista táblázata sötét módhoz

Gyakori kérés, hogy a sütiszabályzat illeszkedjen a „sötét módú” sablonhoz vagy témához. Ilyenkor kikapcsolhatod a dokumentum-CSS-t a beállításokban, vagy külön CSS-t adhatsz a sütilistához. Az alábbi szabályok átlátszóvá teszik a táblázat hátterét, és sötét háttéren is olvasható keretet adnak neki. Írd őket a **Megjelenés → Testreszabás → További CSS** mezőbe, vagy a **Complianz → Settings** oldal dokumentum-CSS mezőjébe:

```css
#cmplz-cookies-overview .cmplz-dropdown,
.cmplz-service-desc, .cmplz-dropdown-cookiepolicy,
.cookies-per-purpose, .function, .function-header,
.retention-header, .retention, .name,
.name-header, .purpose {
	background-color: transparent !important;
}
#cmplz-document
.function, .function-header, .retention-header,
.retention, .name, .name-header, .cookies-per-purpose {
	border: 1px solid #333 !important;
}
```

## Sötét hátterű oldal: a sütiszabályzat CSS-e

Ha az oldalad háttere sötét (a példában #1A1423), a sütiszabályzat szövege és a kategóriák fejlécei nem olvashatók. Az alábbi CSS fehér szöveget, világoskék hivatkozást és szürke kategóriafejlécet ad. Bármilyen háttérhez használhatod, csak a színeket cseréld. A szabályokat a **Complianz → Settings** oldal dokumentum-CSS mezőjébe, vagy a **Megjelenés → Testreszabás → További CSS** mezőbe írd:

```css
#cmplz-document, #cmplz-document p, #cmplz-document span, #cmplz-document li {
    color: white; /* általános betűszín */
}
#cmplz-document a {
    color: #85d5ff; /* hivatkozás */
}
#cmplz-document a:visited {
    color: #deb7ff; /* már meglátogatott hivatkozás */
}
#cmplz-cookies-overview .cmplz-dropdown, #cmplz-document .cmplz-dropdown {
    background-color: unset;
}
#cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary {
    color: #1A1423; /* a fejléc szövege a háttér színe */
}
#cmplz-cookies-overview .cmplz-dropdown .cookies-per-purpose div,
#cmplz-document .cmplz-dropdown .cookies-per-purpose div,
#cmplz-document .cmplz-dropdown.cmplz-dropdown-cookiepolicy .cookies-per-purpose {
    background-color: unset !important;
}
#cmplz-cookies-overview .cmplz-dropdown summary, #cmplz-document .cmplz-dropdown summary,
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header {
    background-color: #909090; /* kategóriacímek háttere */
    font-size: 18px;
    font-weight: 400;
    color: #1A1423;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-category-header .cmplz-always-active {
    color: #1A1423;
}
#cmplz-manage-consent-container.cmplz-manage-consent-container .cmplz-categories .cmplz-category .cmplz-description {
    padding: 10px;
    background: #1A1423;
}
.cmplz-category-title {
    color: #1A1423 !important;
    font-weight: 500;
}
```

## Kapcsolattartási adatok elrejtése a dokumentumokból

A sütiszabályzatban a Complianz a kapcsolattartási adatokat a **Wizard → General → Website information** lépésben megadott értékekből írja ki (itt bármikor módosíthatod őket). Ha egy részletet el akarsz rejteni, kétféleképpen teheted:

- kikapcsolod a „Document synchronization with Complianz” beállítást, és a dokumentum szövegét kézzel szerkeszted ([Jogi dokumentumok szerkesztése](https://hub.hellowp.io/hu/plugins/complianz-gdpr-premium/varazslo-dokumentumok-szerkesztes/));
- vagy CSS-sel rejted el, így a szinkronizálás bekapcsolva maradhat.

A Complianz minden elemre külön osztályt tesz:

| Osztály | Elem |
|---|---|
| `cmplz-contact-organisation` | szervezet |
| `cmplz-contact-address` | cím |
| `cmplz-contact-country` | ország |
| `cmplz-contact-domain` | domain |
| `cmplz-contact-email` | e-mail-cím |
| `cmplz-contact-telephone` | telefonszám |

Például a telefonszám elrejtése:

```css
.cmplz-contact-telephone { display: none }
```

Óvatosan töröld a kapcsolattartási adatokat: megjelenítésük jogilag kötelező lehet.

## Az adatkérelmi űrlapok stílusa

A prémium változat adatkérelmi űrlapjai (a **Do you want to enable Data Request Forms?** kérdéssel kapcsolhatók be a varázslóban) a CPRA-hoz tartozó ingyenes „Do Not Sell or Share My Personal Information” leiratkozó űrlap kiterjesztései, és minden régió adatkezelési tájékoztatójában megjelenhetnek. Alapból a téma CSS-e stílusozza őket. Ha mást szeretnél, egyéni CSS-sel külön formázhatod az ingyenes leiratkozó űrlapot és a prémium adatkérelmi űrlapot is: írd a szabályokat a **Complianz → Consent Banner → Custom CSS** fülre vagy a **További CSS** mezőbe, és nézd meg az űrlapot a tájékoztató oldalon. Az űrlap elemeinek szelektorait a böngésző fejlesztői eszközével olvashatod le.

## A hozzájárulás visszavonó gombja

A sütiszabályzat alatt a Complianz a hozzájárulás visszavonására szolgáló gombhoz is ad CSS-t. Ha a dokumentum-CSS ki van kapcsolva, a gomb tulajdonságai megváltoznak, és a hozzájárulás aktuális állapota is látszik (például „Current status: Accepted” vagy „Denied”).

- Az állapotszöveg elrejtéséhez egyéni CSS-t kell írnod.
- A gomb hover (föléhúzás) állapotához a tulajdonság után `:hover` kell, például: `#cmplz-document button.cmplz-revoke-custom:hover {}`.
- A gomb helyett a kategóriák is megjeleníthetők a dokumentumban: a `cmplz-manage-consent` shortcode-ot szögletes zárójelek közé írva (`[cmplz-manage-consent]`) kapsz kategóriákat a gomb helyett.

## Az Általános szerződési feltételek stílusa

Az ÁSZF megjelenését három tényező határozza meg:

- Ha a Complianz nincs telepítve, a téma beállításai.
- Ha a Complianz telepítve van, de a dokumentum-CSS nincs bekapcsolva a beállításokban, a téma beállításai.
- Ha a dokumentum-CSS be van kapcsolva a beállításokban, a Complianz.

Mindhárom esetben külön CSS-szabályokkal módosíthatod az ÁSZF stílusát anélkül, hogy a téma alapértelmezett megjelenését érintenéd. A dokumentum szelektorai: `#cmplz-document` és elemei, a dokumentumtípus szerinti osztályok pedig az [Eszközök és beállítások](https://hub.hellowp.io/hu/plugins/complianz-gdpr-premium/eszkozok/) fejezetben vannak felsorolva.