/* +=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+= */
/* DE CADEAUBON ZELF                                                          */
/* +=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+= */
/*                                                                            */
/* Alleen de bon: 180 bij 127 mm, de foto's, de namen, de voet. Niets over het */
/* blad eromheen, niets over printen, niets over de schermen waar hij op komt. */
/*                                                                            */
/* Dit stond tot 13 augustus 2026 in cadeaubon-pdf.css, samen met het A4 en    */
/* het werkblad van de admin. Dat kon niet blijven: het scherm na het betalen  */
/* toont de echte bon nu ook, en daar mag geen @page-regel en geen html/body   */
/* van een printblad binnenkomen.                                             */
/*                                                                            */
/* Drie plaatsen laden dit:                                                   */
/*   /bon/<code>                            de bon op zijn eigen adres        */
/*   /admin/cadeaubon/pdf/                  het printblad en de lege stand    */
/*   /familiefotografie/cadeaubon-besteld   het scherm na het betalen         */
/*                                                                            */
/* Alles in millimeter, want dit moet uit een printer kunnen komen. Wie hem    */
/* kleiner wil tonen, schaalt hem; zie .bd--bonblad in style.css.             */
/*                                                                            */
/* De markup staat in core/components/bon-blad.php, op alle drie dezelfde.    */

/* box-sizing hoort hier en niet bij .pdf--blad: de bon staat niet altijd meer
   op een blad, en zonder deze regel valt hij op zo'n plaats uit elkaar. */
.pdf--bon, .pdf--bon * { box-sizing: border-box; }

.pdf--bon {
    width: 180mm;
    height: 127mm;
    display: flex;
    background-color: #FBF9F5;
}

/* +=+=+=+=+=+=+=+=+=+=+ */
/* DE FOTO'S             */
/* +=+=+=+=+=+=+=+=+=+=+ */
/* Tien tegels in twee kolommen van vijf. Eerst stonden er negen in drie bij
   drie, en dat was fout: in een vak van 66 bij 115 mm worden die tegels hoger
   dan breed, en dan snijdt cover een liggende foto staand bij. Joricks kaders
   zijn op twee derde gemaakt; staand bijsnijden kost een derde van elk beeld en
   zet de compositie op zijn kop.
   Twee kolommen geeft tegels van 32,2 bij 21,5 mm, precies 3:2, en vijf rijen
   vullen de hoogte tot op een millimeter na. Vandaar tien foto's en geen negen:
   het getal volgt uit het kader, niet omgekeerd. */
.pdf--fotos {
    width: 78mm;
    padding: 6mm;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(5, 1fr);
    gap: 1.6mm;
}
.pdf--tegel {
    background-size: cover;
    background-color: #F2EDE3;
    width: 100%;
    height: 100%;
}

/* +=+=+=+=+=+=+=+=+=+=+ */
/* DE WOORDEN            */
/* +=+=+=+=+=+=+=+=+=+=+ */
.pdf--woord {
    flex: 1;
    padding: 6mm 7mm;
    display: flex;
    flex-direction: column;
}
.pdf--soort {
    font-size: 2.6mm;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #A3552F;
}
.pdf--namen { margin-top: 7mm; }
.pdf--label {
    font-size: 2.4mm;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #A3552F;
}
.pdf--label-later { margin-top: 4.5mm; }
/* Gezet in Fraunces en niet in het handschrift. Zie de opmerking bovenaan
   admin/cadeaubon/pdf/index.php: een nagedaan handschrift verraadt zichzelf op
   papier, en dan werkt het tegen zichzelf. */
.pdf--naam {
    margin-top: 1.4mm;
    font-family: 'Fraunces', Georgia, serif;
    font-size: 6.4mm;
    line-height: 1.15;
    color: #1C1A17;
}
.pdf--naam-klein { font-size: 4.6mm; }

.pdf--belofte {
    margin: 8mm 0 0;
    font-family: 'Fraunces', Georgia, serif;
    font-size: 4.2mm;
    line-height: 1.35;
    color: #1C1A17;
}
/* De handtekening duwt zichzelf naar onder in plaats van vlak onder de belofte
   te blijven plakken. Zonder dat stond alle inkt in de bovenste helft van de
   kolom en gaapte er een gat van vier centimeter boven de voet. Nu staan er twee
   rustpunten: de namen met de belofte bovenaan, de handtekening met de datum
   onderaan. */
.pdf--handtekening {
    width: 22mm;
    height: auto;
    display: block;
    margin-top: auto;
    opacity: 0.9;
}

.pdf--voet {
    margin-top: 5mm;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 4mm;
}
.pdf--datum {
    font-family: 'Fraunces', Georgia, serif;
    font-size: 3.6mm;
    color: #1C1A17;
}

/* De lege stand (?leeg=ja): een dunne lijn waar de naam komt. Alleen om een
   beeld van te maken voor de bestelpagina; op een echte bon staan de namen
   gezet. Zie de opmerking bovenaan admin/cadeaubon/pdf/index.php. */
.pdf--lijn {
    border-bottom: 0.25mm solid #E6E0D5;
    min-height: 7mm;
}
/* Hetzelfde voor de code onderaan, maar die staat op één regel naast zijn label
   en niet eronder. Vandaar inline-block met een vaste breedte: acht tekens en
   een streepje, op de maat van de letters ernaast. */
.pdf--lijn-kort {
    display: inline-block;
    width: 26mm;
    border-bottom: 0.25mm solid #E6E0D5;
}