.banner-slot { width: 100%; }
.banner-slot[hidden] { display: none; }
.banner-slot .banner-slot-slider { overflow: hidden; border-radius: 6px; }
.banner-slot .banner-slot-slide a, .banner-slot .banner-slot-slide picture { display: block; }
.banner-slot .banner-slot-slide img { display: block; width: 100%; height: auto; }
.banner-slot .banner-slot-controls { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .5rem; padding: .5rem; background: #f5f5f5; }
.banner-slot .banner-slot-controls button { cursor: pointer; border: 0; border-radius: 4px; padding: .5rem .75rem; min-height: 36px; background: #fff; color: #222; font: inherit; }
.banner-slot .banner-slot-controls button:focus-visible { outline: 2px solid var(--mdc-theme-primary, #01579b); outline-offset: 2px; }
.banner-slot .banner-slot-dots { display: flex; flex-wrap: wrap; justify-content: center; gap: .25rem; }
.banner-slot .banner-slot-controls .banner-slot-dot { width: 28px; height: 36px; padding: 0; background: transparent; }
.banner-slot .banner-slot-dot::after { content: ''; display: block; width: 8px; height: 8px; border-radius: 50%; margin: auto; background: #999; }
.banner-slot .banner-slot-dot.is-active::after { background: var(--mdc-theme-primary, #01579b); transform: scale(1.35); }