/*
 * Roca Professionals, contests (wave 9.3b): the card of a contest (the same on the public site and in the cabinet), the page of one contest,
 * the conditions as a list, the entries of a member, the sheet "submit a project" and the flags of the contests on step 4 of the wizard.
 * Only tokens; the status dot, the buttons, the tabs, the lists and the checkbox are the common ones.
 */

/* ---- the list and the card ---- */

.rp-contest-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--rp-event-min)), 1fr));
  gap: var(--rp-sp-6);
  margin: var(--rp-sp-6) 0 0;
  padding: 0;
  list-style: none;
}

.rp-contest-list > li {
  min-width: 0;
}

.rp-contest-card {
  display: grid;
  grid-template-rows: auto 1fr;
  height: 100%;
  border: var(--rp-bw) solid var(--rp-line);
  background: var(--rp-surface);
  color: var(--rp-text);
  text-decoration: none;
}

.rp-contest-card:hover {
  border-color: var(--rp-line-strong);
}

.rp-contest-card:focus-visible {
  outline: none;
  box-shadow: var(--rp-focus);
}

.rp-contest-card__cover {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: var(--rp-stone);
}

.rp-contest-card__body {
  display: grid;
  align-content: start;
  gap: var(--rp-sp-2);
  min-width: 0;
  padding: var(--rp-sp-4);
}

.rp-contest-card__title {
  font-size: var(--rp-fs-h4);
  line-height: var(--rp-lh-snug);
  overflow-wrap: anywhere;
}

.rp-contest-card__summary {
  color: var(--rp-text-secondary);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.rp-contest-card__mine {
  color: var(--rp-text-tertiary);
  font-size: var(--rp-fs-small);
}

/* ---- the page of one contest ---- */

.rp-contest-phase {
  margin: 0;
}

.rp-contest__block {
  display: grid;
  gap: var(--rp-sp-3);
  margin-top: var(--rp-sp-4);
}

.rp-contest__block > h2 {
  margin: 0;
}

.rp-contest-rules {
  display: grid;
  gap: var(--rp-sp-2);
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--rp-text-secondary);
}

.rp-contest-rules > li {
  padding-left: var(--rp-sp-3);
  border-left: var(--rp-bw-strong) solid var(--rp-line-strong);
}

/* ---- the results on the public page (wave 9.4b): a line for each place and nomination, the place in Medium ---- */

.rp-contest-results__list {
  display: grid;
  gap: var(--rp-sp-3);
  margin: 0;
  padding: 0;
  list-style: none;
}

.rp-contest-results__row {
  overflow-wrap: anywhere;
}

.rp-contest-results__lead {
  font-weight: var(--rp-fw-medium);
}

.rp-contest-results__by {
  color: var(--rp-text-secondary);
}

/* ---- the entries of a member in the card of a contest and of a project ---- */

.rp-contest-entry {
  display: grid;
  gap: var(--rp-sp-2);
  padding-bottom: var(--rp-sp-2);
}

.rp-contest-entry .rp-btn {
  justify-self: start;
}

.rp-contest-entry__line {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rp-sp-2);
  align-items: center;
}

/* ---- the sheet "submit a project" ---- */

.rp-contest-pick {
  margin: 0;
  padding: 0;
  border: 0;
}

.rp-contest-pick__ok {
  display: flex;
  gap: var(--rp-sp-1);
  align-items: center;
  color: var(--rp-success);
  font-size: var(--rp-fs-small);
}

.rp-contest-pick__note {
  color: var(--rp-text-tertiary);
  font-size: var(--rp-fs-small);
}

.rp-contest-pick__lack {
  display: grid;
  gap: var(--rp-sp-1);
  margin: var(--rp-sp-1) 0 0;
  padding: 0;
  list-style: none;
  color: var(--rp-danger);
  font-size: var(--rp-fs-small);
}

.rp-contest-pick__lack:empty {
  display: none;
}

/* ---- step 4 of the wizard: a flag for each open contest ---- */

.rp-wiz-contests {
  display: grid;
  gap: var(--rp-sp-3);
}

.rp-wiz-contests > p {
  margin: 0;
}

.rp-contest-flags {
  display: grid;
  gap: var(--rp-sp-4);
  margin: 0;
  padding: 0;
  list-style: none;
}

.rp-contest-flag {
  display: grid;
  gap: var(--rp-sp-1);
}

.rp-contest-flag.is-problem {
  padding: var(--rp-sp-3);
  border: var(--rp-bw) solid var(--rp-danger);
  background: var(--rp-danger-soft);
}

.rp-contest-flag__title,
.rp-contest-flag__until {
  display: block;
}

.rp-contest-flag__until {
  color: var(--rp-text-tertiary);
  font-size: var(--rp-fs-small);
}
