/*
 * Cadre des cartes PAF! (inspiré des cartes imprimées, couleur selon la saison).
 * Partagé par la page de tirage (templates/paf/play.html.twig) et l'outil local
 * de validation des illustrations (tools/paf-artwork).
 */
.paf-frame {
  --frame: #e0a030;
  width: 200px;
  aspect-ratio: 215 / 300;
  display: flex;
  flex-direction: column;
  border: 6px solid var(--frame);
  border-radius: 10px;
  overflow: hidden;
  background: var(--frame);
  box-shadow: 0 4px 20px rgba(0, 0, 0, .4);
  font-family: 'Rajdhani', sans-serif;
}
.paf-frame.season-all { --frame: #e0a030; }
.paf-frame.season-hiver { --frame: #2f80d1; }
.paf-frame.season-ete { --frame: #3aa655; }

.paf-frame-header {
  display: flex;
  color: #fff;
  font-weight: 700;
  font-size: .75rem;
  line-height: 1.1;
  text-transform: uppercase;
}
.paf-frame-tag {
  background: #d62828;
  padding: .2rem .6rem .2rem .3rem;
  clip-path: polygon(0 0, 100% 0, 80% 100%, 0 100%);
}
.paf-frame-title {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .2rem .3rem;
  text-align: center;
}

/* Zone centrale : illustration, photo du joueur, ou montagnes avec un grand « ? » */
.paf-frame-art {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: linear-gradient(to bottom, #8ec5ee 0%, #d6ecfa 55%, #f4f8fb 100%);
}
.paf-frame-art::before {
  /* silhouette de montagnes */
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 55%;
  background: linear-gradient(to bottom, #fff 0%, #c9d6e3 30%, #6b7f99 100%);
  clip-path: polygon(0 100%, 0 55%, 18% 25%, 32% 50%, 52% 5%, 70% 45%, 84% 28%, 100% 60%, 100% 100%);
}
.paf-frame-art--image {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.paf-frame-art--image::before {
  display: none;
}
.paf-frame-unknown {
  position: relative;
  font-size: 4rem;
  font-weight: 700;
  color: #d62828;
  text-shadow: 2px 2px 0 #fff, -2px -2px 0 #fff, 2px -2px 0 #fff, -2px 2px 0 #fff, 0 4px 10px rgba(0, 0, 0, .35);
  transform: rotate(-8deg);
}

.paf-frame-text {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  padding: .3rem .35rem;
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.15;
  text-align: center;
}