@page {
  size: A4;
  margin: 18mm 15mm;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body.pdf-document {
  color: #242424;
  background: #fff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10pt;
  line-height: 1.45;
}

.pdf-header {
  display: flex;
  min-height: 20mm;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10mm;
  padding-bottom: 5mm;
  border-bottom: 1px solid #d9d9d9;
}

.pdf-logo {
  width: 42mm;
  height: auto;
}

.pdf-header-content {
  color: #666;
  text-align: right;
}

.pdf-content h1 {
  margin: 0 0 7mm;
  font-size: 20pt;
  font-weight: 500;
}

.pdf-footer {
  position: fixed;
  right: 0;
  bottom: -11mm;
  left: 0;
  display: flex;
  justify-content: space-between;
  padding-top: 3mm;
  border-top: 1px solid #d9d9d9;
  color: #777;
  font-size: 8pt;
}

.pdf-page-number::after {
  content: "Página " counter(page) " de " counter(pages);
}

.pdf-document.lineup-pdf-document .pdf-header {
  min-height: 14mm;
  margin-bottom: 4mm;
  padding-bottom: 3mm;
}

.lineup-pdf-match-heading {
  display: flex;
  flex-direction: column;
}

.lineup-pdf-match-heading > strong {
  margin-top: .5mm;
  color: #17251c;
  font-size: 15pt;
  line-height: 1.05;
}

.lineup-pdf-match-heading > strong em {
  color: #8b938e;
  font-size: 9pt;
  font-style: normal;
  font-weight: 500;
}

.lineup-pdf-match-heading > small {
  margin-top: 1mm;
  color: #59635d;
  font-size: 7.5pt;
}

.lineup-pdf-club-mark {
  display: flex;
  align-items: center;
  gap: 2.5mm;
  text-align: right;
}

.lineup-pdf-club-mark > div {
  display: flex;
  flex-direction: column;
}

.lineup-pdf-club-mark strong {
  font-size: 7.5pt;
}

.lineup-pdf-club-mark span {
  color: #6b7280;
  font-size: 6.5pt;
}

.lineup-pdf-club-mark__crest {
  width: 10mm;
  height: 10mm;
  object-fit: contain;
}

.lineup-pdf-club-mark__fallback {
  width: 18mm;
  height: auto;
}

.lineup-pdf-eyebrow,
.lineup-pdf-roster__heading small,
.lineup-pdf-group__title span {
  display: block;
  color: #6b7280;
  font-size: 7pt;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.lineup-pdf-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 3mm;
  border: 1px solid #dfe5e1;
  border-radius: 3mm;
  overflow: hidden;
}

.lineup-pdf-facts div {
  min-width: 0;
  padding: 1.6mm 2.5mm;
}

.lineup-pdf-facts div:nth-child(even) {
  border-left: 1px solid #e6ebe7;
}

.lineup-pdf-facts div:nth-child(n+3) {
  border-top: 1px solid #e6ebe7;
}

.lineup-pdf-facts small,
.lineup-pdf-facts strong {
  display: block;
}

.lineup-pdf-facts small {
  margin-bottom: .3mm;
  color: #7a827d;
  font-size: 5.8pt;
  font-weight: 700;
  text-transform: uppercase;
}

.lineup-pdf-facts strong {
  overflow: hidden;
  font-size: 7.5pt;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lineup-pdf-sheet {
  display: grid;
  grid-template-columns: 108mm minmax(0, 1fr);
  gap: 5mm;
  align-items: stretch;
}

.lineup-pdf-pitch {
  position: relative;
  height: 145mm;
  overflow: hidden;
  border: 1mm solid #fff;
  border-radius: 3mm;
  background: repeating-linear-gradient(90deg, #3f8b57 0, #3f8b57 17.5mm, #438f5b 17.5mm, #438f5b 35mm);
  box-shadow: 0 1.5mm 5mm rgb(28 67 41 / 18%);
}

.lineup-pdf-pitch::before {
  position: absolute;
  inset: 0;
  border: .35mm solid rgb(255 255 255 / 78%);
  content: "";
}

.lineup-pdf-pitch::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.5mm;
  height: 1.5mm;
  border-radius: 50%;
  background: rgb(255 255 255 / 82%);
  content: "";
  transform: translate(-50%, -50%);
}

.lineup-pdf-pitch__halfway,
.lineup-pdf-pitch__circle,
.lineup-pdf-pitch__area {
  position: absolute;
  border: .35mm solid rgb(255 255 255 / 72%);
}

.lineup-pdf-pitch__halfway {
  top: 50%;
  right: 0;
  left: 0;
  border-width: .35mm 0 0;
}

.lineup-pdf-pitch__circle {
  top: 50%;
  left: 50%;
  width: 29mm;
  height: 29mm;
  border-radius: 50%;
  transform: translate(-50%, -50%);
}

.lineup-pdf-pitch__area {
  left: 50%;
  width: 45mm;
  height: 18mm;
  transform: translateX(-50%);
}

.lineup-pdf-pitch__area--top {
  top: 0;
  border-top: 0;
}

.lineup-pdf-pitch__area--bottom {
  bottom: 0;
  border-bottom: 0;
}

.lineup-pdf-pitch__goal-area {
  position: absolute;
  left: 50%;
  width: 23mm;
  height: 7mm;
  border: .35mm solid rgb(255 255 255 / 72%);
  transform: translateX(-50%);
}

.lineup-pdf-pitch__goal-area--top {
  top: 0;
  border-top: 0;
}

.lineup-pdf-pitch__goal-area--bottom {
  bottom: 0;
  border-bottom: 0;
}

.lineup-pdf-slot {
  position: absolute;
  z-index: 2;
  width: 18.5mm;
  transform: translate(-50%, -50%);
  text-align: center;
}

.lineup-pdf-slot > span {
  display: inline-block;
  margin-bottom: -.2mm;
  padding: .4mm 1.6mm;
  border-radius: 2mm 2mm 0 0;
  color: #226b3a;
  background: #eaf6ec;
  font-size: 6pt;
  font-weight: 800;
}

.lineup-pdf-slot > strong {
  display: block;
  overflow: hidden;
  padding: 1.5mm 1mm;
  border-radius: 1.5mm;
  color: #173c24;
  background: #fff;
  box-shadow: 0 1mm 2.5mm rgb(21 65 36 / 24%);
  font-size: 6.5pt;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lineup-pdf-slot > b {
  position: absolute;
  top: -1mm;
  right: -1mm;
  display: grid;
  width: 5mm;
  height: 5mm;
  place-items: center;
  border: .5mm solid #fff;
  border-radius: 50%;
  color: #fff;
  background: #1f6f3b;
  font-size: 6pt;
}

.lineup-pdf-roster {
  min-width: 0;
}

.lineup-pdf-roster__heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2mm;
  padding: 2mm 3mm;
  border-radius: 3mm;
  background: #f3f6f4;
}

.lineup-pdf-roster__heading > div:first-child strong {
  display: block;
  color: #1d3325;
  font-size: 14pt;
}

.lineup-pdf-counts {
  display: flex;
  gap: 2mm;
}

.lineup-pdf-counts span {
  padding: 1.4mm 2.5mm;
  border: 1px solid #d9e2dc;
  border-radius: 2mm;
  color: #59635d;
  background: #fff;
  font-size: 7pt;
}

.lineup-pdf-counts b {
  color: #206c3a;
  font-size: 9pt;
}

.lineup-pdf-group {
  margin-top: 2mm;
  padding: 2.5mm;
  border: 1px solid #dfe5e1;
  border-radius: 3mm;
  break-inside: avoid;
}

.lineup-pdf-group__title {
  display: flex;
  align-items: baseline;
  gap: 2mm;
  margin-bottom: 1.8mm;
}

.lineup-pdf-group__title strong {
  font-size: 11pt;
}

.lineup-pdf-player-grid {
  display: grid;
  gap: 2mm;
}

.lineup-pdf-player-grid--starters {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lineup-pdf-player-grid--substitutes {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.lineup-pdf-player {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 2mm;
  padding: 1.8mm 2mm;
  border: 1px solid #e0e4e1;
  border-radius: 2mm;
  background: #fff;
}

.lineup-pdf-player--starter {
  border-color: #b9dbc1;
  background: #f0f8f2;
}

.lineup-pdf-player__number {
  display: grid;
  width: 7mm;
  height: 7mm;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #6f7471;
  font-size: 7pt;
  font-weight: 800;
}

.lineup-pdf-player--starter .lineup-pdf-player__number {
  background: #257443;
}

.lineup-pdf-player div {
  min-width: 0;
}

.lineup-pdf-player strong,
.lineup-pdf-player small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lineup-pdf-player strong {
  font-size: 7.5pt;
}

.lineup-pdf-player small {
  color: #6f7772;
  font-size: 6.5pt;
}

.lineup-pdf-captain {
  display: inline-grid;
  width: 4.5mm;
  height: 4.5mm;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #1f6f3b;
  font-size: 6pt;
}

.lineup-pdf-empty {
  margin: 0;
  color: #737b76;
  font-size: 8pt;
}

.pdf-document.lineup-pdf-document .pdf-footer {
  display: none;
}

.pdf-avoid-break {
  break-inside: avoid;
}

@media screen {
  body.pdf-document {
    width: 210mm;
    min-height: 297mm;
    margin: 12mm auto;
    padding: 18mm 15mm;
    box-shadow: 0 2px 18px rgb(0 0 0 / 12%);
  }

  body.pdf-document.lineup-pdf-document {
    width: 297mm;
    min-height: 210mm;
  }
}