/*
 * What a card lists reads as a table, and parts from what describes the card.
 * The DSFR footer carries all the rest — its place in the card, the negative
 * margins that take it edge to edge — only the rule is missing.
 */
.fr-card .card-list {
  border-top: 1px solid var(--border-default-grey);
}

/*
 * A clickable card has two halves that do not lead to the same place: its body
 * — title, description, arrow — leads where the title leads; its footer lists,
 * and each of its entries leads elsewhere.
 *
 * The reach of the link therefore stops at the body, which this
 * `position: relative` is enough to obtain: the pseudo-element `fr-enlarge-link`
 * stretches is placed on its nearest positioned ancestor, which becomes the body
 * and not the card. The hover tint lands in the same place, for the same reason.
 *
 * The specificity copies the DSFR's, `:not(.fr-card--no-icon)` included: at
 * three classes, the rule would not win.
 */
.fr-card.fr-enlarge-link:not(.fr-card--no-icon) .fr-card__content {
  position: relative;

  /* The column the arrow stands in, to the right of the text. */
  padding-right: 4rem;

  /* The DSFR reserves five rem under the content to house it: it is no longer
     there, and neither is that hole. */
  padding-bottom: 2rem;
}

.fr-card.fr-enlarge-link.card--dense:not(.fr-card--no-icon) .fr-card__content {
  padding-bottom: 0.75rem;
}

/*
 * `fr-enlarge-link` tints the whole card on hover — `.fr-enlarge-link:hover` —
 * footer included, where the footer leads elsewhere. The card therefore keeps
 * its background, and it is the body that lights up.
 */
.fr-card.fr-enlarge-link:hover {
  background-color: var(--background-default-grey);
}

.fr-card.fr-enlarge-link .fr-card__content:hover {
  background-color: var(--background-alt-grey);
}

/*
 * `fr-enlarge-link` stretches **every** link in the card, the DSFR expecting
 * only one: without this, each footer entry would cover the whole card and the
 * last one rendered would capture every click. They take back their own size,
 * and their hover with it.
 */
.fr-card.fr-enlarge-link .fr-card__footer a::before {
  content: none;
}

/* In its column, level with the body it extends. */
.fr-card.fr-enlarge-link .fr-card__title a::after {
  position: absolute;
  top: 50%;
  right: 2rem;
  bottom: auto;
  transform: translateY(-50%);
}

.fr-card .fr-card__footer {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

/*
 * Except before rows, which go edge to edge and already carry their own room:
 * the footer's would make a blank above the first and under the last.
 */
.fr-card .fr-card__footer:has(.entry-list) {
  padding-top: 0;
  padding-bottom: 0;
}

/*
 * What closes a card's footer ranges itself on the entries above it, edge to
 * edge: the footer has negative margins its children do not inherit.
 */
.fr-card .card-list__query {
  margin: 0 -2rem;
}

/*
 * The DSFR indents its accordion by one rem, where the card indents by two, and
 * shifts its panel by a quarter rem to house the focus halo. The two together
 * align the accordion on the card's title.
 */
.fr-card .card-list__query .fr-accordion__btn,
.fr-card .card-list__query .fr-collapse {
  padding-left: 2rem;
  padding-right: 2rem;
}

.fr-card .card-list__query .fr-collapse {
  padding-left: calc(2rem + 0.25rem);
}

/*
 * A DSFR table carries a bottom margin of its own that would detach it from the
 * foot of the card as from a neighbouring block. Here it extends it.
 */
.fr-card .card-list .fr-table {
  margin-bottom: 0;
}

/*
 * A card whose title opens straight onto what it lists: the two rem the DSFR
 * leaves under the content make a hole there, there being nothing to describe
 * in between. After the block above, at equal specificity.
 */
.fr-card.card--dense .fr-card__content {
  padding-top: 1.5rem;
  padding-bottom: 0.75rem;
}