/* feat-cms.css: logos, adverts and useful links that staff edit in the engine admin (feat-cms.js). */

/* A filled logo slot: a white plate, the logo contained, no dashed border. */
.logo-slot.cms-filled { border-style: solid; border-color: var(--border-dashed); background: var(--surface); overflow: hidden; }
.logo-slot.cms-filled > a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
.logo-slot.cms-filled img { max-height: 70%; max-width: 80%; object-fit: contain; }
.sponsor-headline .logo-slot.cms-filled { min-height: 160px; }

/* The advert band. */
.cms-adverts__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 16px; }
.cms-advert { border-radius: var(--radius-card); overflow: hidden; background: var(--surface); }
.cms-advert img { display: block; width: 100%; height: auto; }
.cms-advert a { display: block; }

/* Useful links on the help page. */
.cms-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 24px; }
.cms-links__list { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.cms-links__list a { display: inline-flex; align-items: center; min-height: var(--target, 44px); }
