/* DSS EU-Label - Gewaehrleistung und Garantie
   Die Label-Regeln entsprechen JTL-Shop 5.8.0,
   templates/NOVA/themes/base/sass/_base.scss Z. 645-654. */

@font-face {
    font-family: 'Inter';
    src: url('../fonts/Inter-Regular.woff2') format('woff2'),
         url('../fonts/Inter-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter-ExtraBold';
    src: url('../fonts/Inter-ExtraBold.woff2') format('woff2'),
         url('../fonts/Inter-ExtraBold.ttf') format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

.guarantee-label {
    background: #fff;
    border: 1px solid #7E7E7E;
}

/* Auslöser in der Positionszeile: bewusst klein gehalten. Im Modal steht das Label
   dann in voller Groesse. */
.guarantee-label.guarantee-label-small {
    max-width: 120px;
}

.guarantee-label.guarantee-label-full {
    max-width: 800px;
    margin: 0 auto;
}

/* Der Auslöser ist ein echter Button. NOVAs Button-Grundregeln (Rahmen, Polster,
   Unterstreichung im Hover) wuerden das Label verfremden, deshalb neutralisiert. */
.dss-eulabel-toggle {
    display: inline-block;
    max-width: 120px;
    border: 0;
    background: none;
    line-height: 0;
}

.dss-eulabel-toggle:hover,
.dss-eulabel-toggle:focus {
    text-decoration: none;
}

.dss-eulabel-modal .modal-body {
    background: #fff;
}

/* Gewaehrleistungslabel: Anzeigebreite 480px, mittig. Die Datei ist 960px breit,
   also der doppelte Wert fuer hochaufloesende Displays. width/height stehen am
   img-Tag, damit der Platz vor dem Laden reserviert ist (kein Layoutsprung).
   Unterhalb von rund 512px Viewport gibt die Spaltenbreite das Mass vor - ein
   Ueberlauf waere schlechter lesbar als ein etwas kleineres Bild. */
.dss-eulabel-warranty-img {
    display: block;
    width: 100%;
    max-width: 480px;
    height: auto;
    margin-inline: auto;
    border: 1px solid #7E7E7E;
    background: #fff;
}