/*
 * Banner print
 * @define banner
 */

@use 'sass:map';

// Exposed variables
$theme: null !default;
$banner-print: null !default;

.ecl-banner {
  padding: map.get($theme, 'spacing-print', 'm') 0;
}

.ecl-banner__picture-container,
.ecl-banner__video-container {
  display: none;
}

.ecl-banner__title {
  color: var(--c-d);
  font: map.get($theme, 'font-print', '4xl');
  font-weight: map.get($theme, 'font-weight', 'bold');
  font-family: var(--ecl-font-family-print-alt);
  margin-bottom: 0;
}

.ecl-banner__title-link,
.ecl-banner__description-link {
  color: var(--c-d);
}

.ecl-banner__description {
  color: var(--c-d);
  font: map.get($theme, 'font-print', 'l');
  margin-bottom: 0;
  margin-top: map.get($theme, 'spacing-print', 'xs');
}

.ecl-banner__description + .ecl-link {
  margin-top: map.get($theme, 'spacing-print', 'm');
}

.ecl-banner__cta {
  background: var(--c-s);
  border-radius: map.get($banner-print, 'cta-radius');
  display: inline-block;
  padding: map.get($theme, 'spacing-print', 's');
  margin-top: map.get($theme, 'spacing-print', 'm');
}

.ecl-banner__link-cta.ecl-link {
  color: map.get($theme, 'color', 'black');
}
