/* ============================================================
   Bureaugroeigids - afdrukken
   ------------------------------------------------------------
   Vooral voor "jouw blad": de lezer vult zijn meters in en neemt
   het A4 mee naar het kernteamgesprek uit hoofdstuk 1. Een
   hoofdstuk afdrukken moet ook kunnen en hoeft niet mooi te zijn,
   wel leesbaar.

   Geen kleurvlakken op de achtergrond: die kosten inkt en de
   meeste browsers laten ze standaard toch weg. De meterkleuren
   blijven wél staan - dat is de informatie, niet de versiering -
   en ze dragen daarom ook hun woord ("Groen") en niet alleen hun
   kleur. Een afdruk in grijstinten blijft zo leesbaar, en dat is
   dezelfde reden waarom ze op het scherm een label dragen.
   ============================================================ */

@page{margin:18mm 16mm}

body.gg{background:#fff;color:#000;font-size:10.5pt;line-height:1.5}

/* Weg wat op papier niets doet. */
.gg-kop,
.gg-voortgang,
.gg-bladeren,
.gg-gate,
.gg-inhoud,
.gg-bladknoppen,
.gg-hero-knoppen,
.gg-slotoproep,
.gg-overslaan,
.gg-hoofdnav{display:none !important}

.gg-blad{max-width:none;padding:0}
.gg-romp,.gg-hoofdstukkop,.gg-jouwblad{max-width:none}

h1,h2,h3,h4{color:#000;page-break-after:avoid;break-after:avoid}
h2{margin-top:1.4em;font-size:15pt}
h3{font-size:12.5pt}
p,li{orphans:3;widows:3}

a{color:#000;text-decoration:none}
/* De URL erbij, want een link op papier gaat nergens heen. Alleen bij externe
   adressen: een verwijzing naar een ander hoofdstuk van deze gids leest als
   "hoofdstuk 4" en niet als een adres. */
.gg-romp a[href^="http"]::after{content:" (" attr(href) ")";font-size:8.5pt;color:#555;word-break:break-all}

/* Figuren: hele blokken houden, en de SVG mag krimpen. */
.gg-figuur{
  page-break-inside:avoid;break-inside:avoid;
  width:auto;border:1px solid #bbb;border-radius:0;padding:8mm 6mm;margin:6mm 0;
  background:#fff;
}
.gg-svg{min-width:0}
.gg-figuur-code{background:#000;color:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}

/* De meters houden hun kleur: dat is informatie. */
.gg-kleur{-webkit-print-color-adjust:exact;print-color-adjust:exact;border:1px solid #999}
.gg-kleurknop{-webkit-print-color-adjust:exact;print-color-adjust:exact}
.gg-kleurknop:not(.aan){display:none}

/* Invulvelden worden vakjes met de waarde erin, of lege lijntjes om met de
   hand in te vullen. Een leeg invoerveld drukt anders als niets af. */
.gg-veld{
  border:0;border-bottom:1px solid #000;border-radius:0;background:none;
  width:6em;padding:0 .2em;
}

.gg-tabelwrap{overflow:visible;border:0;border-radius:0}
.gg-tabel{font-size:9.5pt;page-break-inside:avoid;break-inside:avoid}
.gg-tabel th{background:#eee;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.gg-tabel th,.gg-tabel td{border-bottom:1px solid #ccc}

.gg-stap,.gg-actie{
  border:1px solid #ccc;border-radius:0;background:#fff;
  page-break-inside:avoid;break-inside:avoid;padding-left:1.2em;
}
.gg-stap.af{background:#f0f0f0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.gg-vinkhouder{position:static;float:left;margin-right:.6em}

.gg-bladblok{border:1px solid #ccc;border-radius:0;page-break-inside:avoid;break-inside:avoid}

.gg-voet{background:none;color:#444;margin-top:8mm;padding:4mm 0 0;border-top:1px solid #ccc}
.gg-voet-binnen{padding:0}
.gg-voet a{color:#444}
.gg-voet-merk{display:none}
