/*
 * Gaestesiden paa papir. Indlaest med media="print" fra layouts/guest.blade.php,
 * saa intet herinde kan paavirke skaermen.
 *
 * Ligger i public/ ved siden af invitation.css og ikke i resources/ med Vite:
 * gaestesiden linker sine stylesheets direkte med asset() og har intet
 * npm-build bag sig - hverken i testsuiten eller i CI. Et print.css under
 * resources/ ville ikke blive serveret.
 *
 * Det er sin EGEN fil og ikke et @media print-afsnit nede i invitation.css.
 * Naar designet bygges om, er det her den nye side skal gennemgaas, og saa
 * skal reglerne kunne findes uden at laese hele skaermstylingen igennem.
 *
 * To ting skal vaere rigtige, og den sidste er den der ikke er til at
 * gaette: knapperne og det lukkede kort.
 *
 * Det gamle design havde en tredje: guldteksten var malet med en gradient
 * og color:transparent, og print dropper baggrunde, saa overskrifterne stod
 * som blanke huller. Canva-designet har ingen gradient-tekst.
 * PrintAndPrivacyTest slaar ned paa det hvis teknikken kommer tilbage uden
 * en printregel.
 */

@page {
  size: A4;
  /* Browserens egen standardmargen tager sidehoved og -fod med. Her er der
     ingen - siden skal ligne invitationen og ikke en udskrift af en
     hjemmeside; sidehoved/-fod slaas fra i printdialogen. */
  margin: 15mm;
}

/* ---- knapper og navigation ----
 * Acceptkriteriet. En knap paa papir er en blindgyde: "Tryk for at aabne"
 * kan ikke trykkes, og "Indtast en anden kode" er en handling der ikke
 * findes. Ønskeseddel-linket er undtagelsen der ikke er en undtagelse -
 * selve knappen ryger, men .url-linjen under den bliver, for DEN kan
 * tastes ind. */
nav,
.btn,
.foot,
.hint,
form,
button {
  display: none !important;
}

.wishes .url {
  display: block;
  /* Uden knappen over sig staar adressen for taet paa teksten. */
  margin-top: .8em;
}

/* ---- det lukkede kort ----
 * Med javascript slaaet til er .stage det eneste synlige, og selve
 * invitationen ligger i display:none indtil gaesten har klappet kortet op.
 * Et Ctrl+P foer det klik gav et tomt ark med et kuvert-motiv paa.
 * Paa papir er der ingen animation at vente paa, saa kortet ryger og
 * invitationen foldes ud - ogsaa uden .revealed. */
.stage,
.js .stage {
  display: none !important;
}

.invite,
.js .invite {
  display: block !important;
}

/* Indflyvningen er 0.9 sekunder ingen kommer til at se paa et ark papir,
   men animationen starter paa opacity:0 - og rammer Chrome printet foer
   den er faerdig, er siden blank. */
.fade-in {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* ---- papiret ----
 * Skaermens rammefarve, skyggen og de afrundede kanter er der for at faa en
 * side til at ligne et ark. Paa et ark er de bare graa toner der bruger
 * blaek. */
body {
  background: #fff !important;
  color: #000;
  font-size: 11pt;
  line-height: 1.55;
}

.paper {
  max-width: none;
  margin: 0;
  background: #fff !important;
  box-shadow: none !important;
  overflow: visible;
}

/* Streghjerterne er dekoration i papirets hjoerner. Paa et ark ville
   sidemargenen klippe dem midt over, og de bruger blaek paa ingenting. */
.hearts {
  display: none !important;
}

/* Hjerte-krussedullerne i spalternes hjoerner er det samme: pynt der ville
   blive klippet af sidemargenen. */
.corner {
  display: none !important;
}

/* Logoet paa kodesiden og hjertet over hilsenen er billeder, og de skal med
   - men ikke fylde et halvt ark. */
.logo {
  max-width: 90mm !important;
}

.panel-main .heart {
  max-width: 45mm !important;
}

.fold .panel-programme,
.fold .panel-info {
  border-top: 0 !important;
}

/* ---- opslaget ----
 * Tre spalter er en skaermbredde. A4 i staaende format er smallere end de
 * 900px der udloeser gitteret, men printet kan vaere liggende eller skaleret,
 * og saa ville programmet, invitationen og det praktiske staa i tre smalle
 * soejler med en streg imellem. Én spalte laeses som et program. */
.fold {
  display: block;
}

.fold > * + * {
  border-left: 0 !important;
}

.fold,
.fold .panel,
.fold .panel-main {
  padding: 0 0 18pt;
}

/* Et afsnit maa gerne braekke over to sider; en overskrift maa ikke staa
   alene nederst, og et programpunkt maa ikke deles fra sit klokkeslaet. */
.panel-programme,
.panel-info .block,
.timeline li {
  break-inside: avoid;
}

h1, h2, h3, .lede, .greet {
  break-after: avoid;
}

/* Skaermens clamp() skalerer med viewporten, og en printet side har ikke en
   viewport der giver mening. Faste punktstoerrelser i stedet. */
.panel-main .greet { font-size: 26pt; }
.panel-main .lede { font-size: 22pt; }
.panel-main .body { font-size: 12pt; }
.panel h2 { font-size: 13pt; }
.timeline .when, .panel-info h3 { font-size: 12pt; }
.timeline .what, .panel-info p { font-size: 11pt; }
.panel-main .signature { font-size: 22pt; }
.icon { width: 11mm !important; }
.date { font-size: 20pt; }

/* ---- kodesiden ----
 * Den har ingen grund til at blive printet, men et Ctrl+P skal ikke give et
 * ark med et tomt inputfelt og en fejlplads paa. Formularen er allerede
 * skjult ovenfor; her fjernes luften den efterlod. */
.gate {
  padding: 0;
}

.gate .err {
  display: none;
}