/* ---------------------------------------------------------------------------
   Research groups listing — how the cards relate to EACH OTHER
   ---------------------------------------------------------------------------
   The card's own insides live in its component
   (components/node/research-group/card-research-group/). What is here is
   listing behaviour: the column count and the shared edges. Same split as
   person-grid-layout.css, tender-grid-layout.css and
   teaching-modules-grid-layout.css.

   The base grid (1 column, then 2 at 992px, then 3 at 1200px, all with zero
   gaps) comes from `.phantom-grid-layout` in
   components/layout/view-layout-grid/. Only the 1200px column count is
   overridden here.

   ⚠️ Every card already carries `border: 1px solid #000` from `article.card` in
   global-sissa.css. Nothing below adds a box — it drops the edges that would
   double up between neighbours and redraws the ones on the outside of the grid.
   -------------------------------------------------------------------------- */

/* --- 1200px and up: four across, matching the design ---------------------- */
@media (min-width: 1200px) {
  .phantom-grid-layout.view-rgrp-public-blocks-db {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* --- Attached grid: shared edges ------------------------------------------ */
/* Below 992px the cards are separate blocks with their own margin, so this
   starts where the grid does. */
@media (min-width: 992px) {
  .view-rgrp-public-blocks-db article.card.card-research-group {
    margin-bottom: 0;
    /* A card's bottom line is the top border of the card underneath it, and its
       right line the left border of its neighbour. Dropped here, redrawn below
       only on the outside edges of the grid. */
    border-right: 0;
    border-bottom: 0;
  }

  /* Two columns at this breakpoint: right edge on every 2nd card, and on the
     last one so a half-filled bottom row is still closed. */
  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:nth-child(2n)
    article.card.card-research-group,
  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:last-child
    article.card.card-research-group {
    border-right: 1px solid #000;
  }

  /* Bottom edge: the last two cards — one column count. Every other card gets
     its bottom line from the border-top of the card below it; these have none
     below them, whether they are the bottom row or sit over its empty cells. */
  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:nth-last-child(-n + 2)
    article.card.card-research-group {
    border-bottom: 1px solid #000;
  }
}

/* --- From 1200px the grid is four wide, so the two-column edges above have to
       be undone and redrawn. `:nth-child(n)` matches every li and carries the
       same specificity as the rules above, which is what lets it reset them. */
@media (min-width: 1200px) {
  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:nth-child(n)
    article.card.card-research-group {
    border-right: 0;
    border-bottom: 0;
  }

  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:nth-child(4n)
    article.card.card-research-group,
  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:last-child
    article.card.card-research-group {
    border-right: 1px solid #000;
  }

  .view-rgrp-public-blocks-db
    .phantom-grid-list-region
    li:nth-last-child(-n + 4)
    article.card.card-research-group {
    border-bottom: 1px solid #000;
  }
}