/* InSpktr website – aanvullingen op Metronic (styles.css bevat alleen klassen uit de demo's). */

/* Huisstijl: navy #102032 en groen #06C380 (zelfde als de app, de beheeromgeving en de admin). */
:root {
    --primary: #102032;
    --primary-foreground: #ffffff;
    --mono: #102032;
}

.dark {
    --primary: #06C380;
    --primary-foreground: #102032;
    --mono: var(--color-zinc-300);
}

.woordmerk {
    height: 34px;
    width: auto;
}

/* Themaknop: maan in het lichte thema, zon in het donkere (ki-filled zet zelf display, dus geen hidden). */
.thema-donker, .dark .thema-licht { display: none; }
.dark .thema-donker { display: inline-flex; }

/* Privacyverklaring: inhoudsopgave links (op grote schermen meescrollend), hoofdstukken rechts. */
.privacy-indeling {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.25rem;
    padding-bottom: 1.875rem;
}

.hoofdstuk {
    scroll-margin-top: 80px;
}

@media (width >= 64rem) {
    .privacy-indeling {
        grid-template-columns: 260px minmax(0, 1fr);
        gap: 1.875rem;
        align-items: start;
    }

    .inhoud {
        position: sticky;
        top: 80px;
    }
}

/* Lopende tekst in een kaart */
.tekst {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--secondary-foreground);
}

.tekst strong {
    font-weight: 600;
    color: var(--mono);
}

.tekst ul {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    list-style: disc;
    padding-inline-start: 1.25rem;
}

.tekst .adres {
    color: var(--mono);
}

@media print {
    header, footer, .inhoud { display: none !important; }
    .privacy-indeling { display: block; }
}