/* Dansprogrammet som A4-affisch. Visas som ett papper på skärmen och skrivs ut på en sida. */

@font-face {
  font-family: "Barlow Condensed";
  src: url("../fonts/barlow-condensed-normal-800.woff2") format("woff2");
  font-weight: 800;
}
@font-face {
  font-family: "Barlow Condensed";
  src: url("../fonts/barlow-condensed-normal-700.woff2") format("woff2");
  font-weight: 700;
}
@font-face {
  font-family: "Source Sans 3";
  src: url("../fonts/source-sans-3-normal-400-700.woff2") format("woff2");
  font-weight: 400 700;
}

@page {
  size: A4;
  margin: 12mm;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: #d9d0c4;
  color: #15110f;
  font: 400 12pt/1.35 "Source Sans 3", Arial, sans-serif;
  font-variant-numeric: tabular-nums;
}

.toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 1.5rem;
  max-width: 210mm;
  margin: 1.5rem auto 1rem;
  padding: 0 1rem;
  font-size: 1.125rem;
}
.toolbar a {
  color: #7a1319;
  font-weight: 700;
}
.toolbar button {
  min-height: 3.25rem;
  padding: 0 1.75rem;
  border: 0;
  border-radius: 6px;
  background: #7a1319;
  color: #fff;
  font: 700 1.125rem "Source Sans 3", sans-serif;
  cursor: pointer;
}
.toolbar p {
  margin: 0;
  flex-basis: 100%;
}

.sheet {
  width: 210mm;
  min-height: 297mm;
  max-width: 100%;
  margin: 0 auto 3rem;
  padding: 14mm;
  background: #fffdf8;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
  display: flex;
  flex-direction: column;
}

.sheet__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8mm;
  padding: 6mm 8mm;
  margin-bottom: 7mm;
  background: #15110f;
  color: #fff;
  border-bottom: 3mm solid #efbd5a;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
.sheet__head img {
  width: 70mm;
  max-width: 100%;
  height: auto;
}
.sheet__head div {
  text-align: right;
}
h1,
h2 {
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  line-height: 0.95;
  margin: 0;
}
h1 {
  font-size: 38pt;
}
.sheet__period {
  margin: 1mm 0 0;
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-weight: 700;
  font-size: 18pt;
  color: #efbd5a;
  text-transform: uppercase;
}

.sheet__cols {
  display: grid;
  gap: 8mm;
  flex: 1;
}
.sheet__cols--2,
.sheet__cols--3 {
  grid-template-columns: repeat(2, 1fr);
}
.sheet__cols--3 section:last-child {
  grid-column: 1 / -1;
}

h2 {
  font-size: 24pt;
  color: #7a1319;
  border-bottom: 1mm solid #15110f;
  padding-bottom: 1mm;
}
.sheet__meta {
  margin: 2mm 0 3mm;
  font-size: 11pt;
  color: #4a3f37;
}

table {
  width: 100%;
  border-collapse: collapse;
}
td {
  padding: 2.4mm 0;
  border-bottom: 0.3mm solid #d8cbbb;
  vertical-align: top;
}
td.d {
  width: 24mm;
  font-weight: 700;
  font-size: 13pt;
  white-space: nowrap;
}
td.b {
  font-family: "Barlow Condensed", "Arial Narrow", sans-serif;
  font-weight: 800;
  font-size: 17pt;
  line-height: 1.05;
  text-transform: uppercase;
}
td.b small {
  display: block;
  font-family: "Source Sans 3", sans-serif;
  font-weight: 400;
  font-size: 10pt;
  text-transform: none;
  color: #4a3f37;
}
tr.installd td.b {
  text-decoration: line-through;
}
tr.installd em {
  font-style: normal;
  font-size: 10pt;
  color: #7a1319;
  text-decoration: none;
  display: inline-block;
}

.sheet__foot {
  margin-top: 8mm;
  padding-top: 4mm;
  border-top: 1mm solid #15110f;
  text-align: center;
  font-size: 11pt;
}
.sheet__foot p {
  margin: 0.5mm 0;
}
.sheet__empty {
  font-size: 16pt;
}

@media print {
  body {
    background: none;
  }
  .toolbar {
    display: none;
  }
  .sheet {
    width: auto;
    min-height: 0;
    height: calc(297mm - 24mm);
    margin: 0;
    padding: 0;
    box-shadow: none;
    background: none;
  }
}

/* Bara på smal skärm – utskriften ska alltid ha två spalter. */
@media screen and (max-width: 220mm) {
  .sheet {
    padding: 6mm;
    min-height: 0;
    width: auto;
    margin-inline: 0.5rem;
  }
  h1 {
    font-size: clamp(20pt, 9vw, 30pt);
  }
  .sheet__period {
    font-size: 14pt;
  }
  .sheet__head {
    padding: 5mm;
  }
  .sheet__cols--2,
  .sheet__cols--3 {
    grid-template-columns: 1fr;
  }
  .sheet__head {
    flex-direction: column;
    align-items: flex-start;
  }
  .sheet__head div {
    text-align: left;
  }
}