/* SemaVýhody — jen rozvržení.
   Barvy, písmo a rámečky si sedí šablona webu; modul nic nebarví, aby se
   dal použít na světlém i na tmavém podkladu. */

.mod-semavyhody {
  display: grid;
  /* ⚠️ `auto-fit` potřebuje konkrétní minimum, s `minmax(0, 1fr)` by spadlo
     na jediný sloupec. Práh jde přebít proměnnou `--semavyhody-min`. */
  grid-template-columns: repeat(auto-fit, minmax(var(--semavyhody-min, 200px), 1fr));
  gap: var(--semavyhody-mezera, 10px 16px);
}

/* Pevný počet sloupců — šablona přidá třídu, když je parametr nastavený */
.mod-semavyhody.semavyhody-sl-1 { grid-template-columns: minmax(0, 1fr); }
.mod-semavyhody.semavyhody-sl-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.mod-semavyhody.semavyhody-sl-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mod-semavyhody.semavyhody-sl-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Na telefonu se pevný počet sloupců neudrží — dlaždice mají text */
@media (max-width: 480px) {
  .mod-semavyhody,
  .mod-semavyhody[class*="semavyhody-sl-"] { grid-template-columns: minmax(0, 1fr); }
}

.semavyhody-polozka { min-width: 0; }

/* Dlaždice s ikonou — ikona vlevo přes obě řádky, nadpis a text vpravo.
   Třídu přidává šablona jen tomu, kdo ikonu opravdu má, takže dlaždice
   bez ikony zůstává přesně taková, jaká byla ve verzi 1.0.0. */
.semavyhody-polozka.semavyhody-s-ikonou {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: var(--semavyhody-ikona-mezera, 11px);
  align-items: start;
}
.semavyhody-polozka.semavyhody-s-ikonou .semavyhody-ikona {
  grid-row: 1 / span 2;
  line-height: 0;
  margin-top: 1px;
}
/* Dlaždice, ve které je jen nadpis: ikona nemá druhý řádek, kam sáhnout */
.semavyhody-polozka.semavyhody-s-ikonou > .semavyhody-titul:only-of-type { align-self: center; }