fix: point the application form finisher at epteam

Forms built in the backend form editor use generated element identifiers
(text-1, multicheckbox-2, ...) that carry no meaning and cannot be renamed
without breaking the other finishers configured on the form. ApplicationApiFinisher
therefore sends two halves: a small mapped core (firstName, lastName, email, ...)
that a developer configures per form and MyEP can rely on, plus every remaining
submitted value keyed by the element label for a human to read.

Each submission also carries where it came from: the form identifier and its
editor-given name, plus the uid and canonical URL of the page it was submitted
from - the same definition is embedded on several pages, so the page is what
distinguishes them. The URL is generated through the site router in the visitor's
language, like AddReferrerFinisher does it.

Labels come from the form definition rather than TranslationService, so the keys
do not shift with the site language. Values are normalized for JSON: dates to
Y-m-d, uploads to the file name, multi-value elements to a list, empty values
dropped, unsupported objects skipped with a log warning.

Like BpnApiFinisher the request failure is only logged, so a MyEP outage never
costs the application mail.

The endpoint (POST applications) does not exist in MyEP yet; the contract handed
over to that team lives in .ddev/plans/MYEP-APPLICATION-ENDPOINT.md. Until it is
built the finisher is registered but attached to no form.

Co-Authored-By: Claude Opus 5 <[email protected]>

.ddev/config.yaml

@@ -26,8 +26,9 @@ timezone: Europe/Berlin
 composer_version: "2"
 web_environment:
     - TYPO3_CONTEXT=Development
-nodejs_version: "18"
+nodejs_version: "24"
 corepack_enable: false
+omit_containers: [ddev-ssh-agent]
 
 # Key features of DDEV's config.yaml:
 

.nvmrc

@@ -1 +1 @@
-18
+24

composer.lock

@@ -1817,21 +1817,22 @@
         },
         {
             "name": "league/oauth2-client",
-            "version": "2.9.0",
+            "version": "2.9.1",
             "source": {
                 "type": "git",
                 "url": "https://github.com/thephpleague/oauth2-client.git",
-                "reference": "26e8c5da4f3d78cede7021e09b1330a0fc093d5e"
+                "reference": "8cedfef9d01a8d1fd2ecfabb41734b17592c4b71"
             },
             "dist": {
                 "type": "zip",
-                "url": "https://api.github.com/repos/thephpleague/oauth2-client/zipball/26e8c5da4f3d78cede7021e09b1330a0fc093d5e",
+                "url": "https://api.github.com/repos/thephpleague/oauth2-client/zipball/8cedfef9d01a8d1fd2ecfabb41734b17592c4b71",
-                "reference": "26e8c5da4f3d78cede7021e09b1330a0fc093d5e",
+                "reference": "8cedfef9d01a8d1fd2ecfabb41734b17592c4b71",
                 "shasum": ""
             },
             "require": {
                 "ext-json": "*",
-                "guzzlehttp/guzzle": "^6.5.8 || ^7.4.5",
+                "guzzlehttp/guzzle": "^6.5.8 || ^7.8.2 || ^8.0",
+                "guzzlehttp/psr7": "^1.9.1 || ^2.6.3 || ^3.0",
                 "php": "^7.1 || >=8.0.0 <8.6.0"
             },
             "require-dev": {
@@ -1876,9 +1877,9 @@
             ],
             "support": {
                 "issues": "https://github.com/thephpleague/oauth2-client/issues",
-                "source": "https://github.com/thephpleague/oauth2-client/tree/2.9.0"
+                "source": "https://github.com/thephpleague/oauth2-client/tree/2.9.1"
             },
-            "time": "2025-11-25T22:17:17+00:00"
+            "time": "2026-09-16T13:14:31+00:00"
         },
         {
             "name": "league/period",

deploy.php

@@ -63,41 +63,39 @@ host('prod')
     ->setForwardAgent(true)
     ->setSshMultiplexing(true)
     ->setDeployPath('/usr/home/eptypo3/public_html/{{application}}')
-    ->set('buspronet_path', '/usr/home/eptypo3/public_html/kuschick/buspronet/buspronet')
     ->set('bin/php', '/usr/bin/php74')
     ->set('http_user', 'eptypo3')
     ->set('writable_mode', 'chmod')
-    ->set('bin/composer', '/usr/bin/composer')
-    ->set('composer_options', '--prefer-dist --no-progress --no-interaction --optimize-autoloader')
     ->set('rsync_src', __DIR__)
     ->set('rsync', $rsyncOptions)
-    ->set('cachetool_args', '--web=SymfonyHttpClient --web-path={{current_path}}/public/ --web-url=https://www.ep-reisen.de')
+    ->set('cachetool_args', '--web=SymfonyHttpClient --web-path={{current_path}}/{{typo3_webroot}}/ --web-url=https://www.ep-reisen.de')
 ;
 
 task('deploy', [
     'deploy:info',
+    // Build locally first, so a failing build aborts before the server is touched at all.
+    'deploy:assets:build',
     'deploy:setup',
     'deploy:lock',
     'deploy:release',
-    'deploy:assets:build',
     'rsync',
     'deploy:shared',
     'deploy:writable',
+    // The schema has to exist before the new code starts serving traffic.
     'typo3:database:migrate',
     'typo3:language:update',
+    // deploy:publish == deploy:symlink, deploy:unlock, deploy:cleanup, deploy:success
     'deploy:publish',
-    'cachetool:clear:opcache',
-    'typo3:cache:flush',
-    'deploy:buspronet:symlink',
 ]);
 
-task('deploy:buspronet:symlink', function () {
+// Caches belong to the release that goes live, so they are cleared after the symlink flip. Hooking
-    run('ln -s {{buspronet_path}} {{release_or_current_path}}/public/buchung');
+// into deploy:symlink rather than appending to the list above keeps them inside deploy:publish, ahead
-});
+// of deploy:unlock and deploy:success - a failing cache task must not follow a declared success.
+after('deploy:symlink', 'cachetool:clear:opcache');
+after('deploy:symlink', 'typo3:cache:flush');
 
 task ('deploy:assets:build', function () {
     runLocally('ddev exec npm ci');
-    runLocally('ddev exec npm rebuild node-sass');
     runLocally('ddev exec npm run build');
 });
 

package.json

@@ -1,25 +1,22 @@
 {
   "name": "eptheme",
-  "description": "EP Reisen TYPO3 website package",
-  "version": "3.0.0",
-  "author": "Björn Fromme, [email protected]",
-  "license": "proprietary",
   "scripts": {
     "dev": "./node_modules/.bin/encore dev --watch",
     "build": "NODE_ENV=production ./node_modules/.bin/encore production"
   },
   "engines": {
-    "node": ">=16"
+    "node": ">=20.19.0"
   },
+  "browserslist": [
+    "defaults"
+  ],
   "dependencies": {
     "@hotwired/stimulus": "^3.2.1",
     "@hotwired/stimulus-webpack-helpers": "^1.0.1",
     "@iframe-resizer/parent": "^5.3.2",
     "@splidejs/splide": "^2.4.21",
-    "axios": "^1.6.2",
     "cooltipz-css": "^1.6.8",
     "dayjs": "^1.10.6",
-    "es6-slide-up-down": "^1.0.0",
     "flatpickr": "^4.6.9",
     "glightbox": "^3.0.9",
     "htmx.org": "^1.9.12",
@@ -30,31 +27,22 @@
     "sticky-js": "^1.3.0",
     "stimulus-use": "^0.52.0",
     "vue": "^2.6.14",
-    "vue-router": "^3.5.2",
+    "vue-session": "^1.0.0"
-    "vue-session": "^1.0.0",
-    "vuex": "^3.6.2",
-    "whatwg-fetch": "^3.6.2"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-object-rest-spread": "^7.16.0",
-    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@babel/preset-env": "^7.16.0",
-    "@symfony/webpack-encore": "^2.1.0",
+    "@symfony/webpack-encore": "^4.7.0",
     "@tailwindcss/aspect-ratio": "^0.4.0",
     "@tailwindcss/forms": "^0.5.2",
     "autoprefixer": "^10.4.8",
-    "core-js": "^3.22.5",
-    "document-register-element": "^1.14.10",
     "file-loader": "^6.2.0",
     "postcss": "^8.4.16",
-    "postcss-loader": "^6.2.1",
+    "postcss-loader": "^8.2.1",
     "sass": "^1.53.0",
-    "sass-loader": "^12.6.0",
+    "sass-loader": "^14.2.1",
-    "sass-mq": "^6.0.0",
+    "sass-mq": "^7.0.1",
-    "smoothscroll-polyfill": "^0.4.4",
     "tailwindcss": "^3.1.8",
     "tailwindcss-alt": "^3.0.0",
-    "vue-custom-element": "^3.3.0",
     "vue-loader": "^15.11.1",
     "vue-template-compiler": "^2.6.14"
   }

public/typo3conf/AdditionalConfiguration.php

@@ -85,6 +85,11 @@ $GLOBALS['TYPO3_CONF_VARS']['SYS']['caching']['cacheConfigurations']['rootline']
     'groups' => ['pages'],
 ];
 
+// Assets are served through the bunny.net CDN, which gzip/brotli-compresses at the edge.
+// Pre-gzipped .gzip twins are served with Content-Encoding: gzip and cannot be processed
+// by the CDN, so stop generating them. mod_deflate still compresses direct origin hits.
+$GLOBALS['TYPO3_CONF_VARS']['FE']['compressionLevel'] = 0;
+
 // suppress php deprecation warnings flooding typo3 logs
 $GLOBALS['TYPO3_CONF_VARS']['SYS']['errorHandlerErrors'] =
     $GLOBALS['TYPO3_CONF_VARS']['SYS']['errorHandlerErrors'] & ~E_DEPRECATED & ~E_USER_DEPRECATED;

public/typo3conf/ext/ep_events/Resources/Private/Assets/js/components/OfferTeasers.vue

@@ -55,7 +55,6 @@
 </template>
 
 <script>
-    import axios from 'axios';
     import $ from 'jquery';
 
     export default {
@@ -82,13 +81,21 @@
             load() {
                 this.loading = true;
                 sessionStorage.setItem('filterSettings', JSON.stringify(this.filterSettings));
-                axios({
+                fetch(this.endpointUri, {
-                    url: this.endpointUri,
+                    method: 'POST',
-                    method: 'post',
+                    credentials: 'same-origin',
-                    data: $.param({'tx_epevents_ajax[filterSettings]': this.filterSettings})
+                    headers: {'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},
+                    body: $.param({'tx_epevents_ajax[filterSettings]': this.filterSettings})
                 }).then(response => {
-                    this.offers = response.data.offers;
+                    // fetch only rejects on network errors, so surface HTTP errors here
-                    this.filterOptions = response.data.filterOptions;
+                    // to keep the previous behaviour of falling through to .catch()
+                    if (!response.ok) {
+                        throw new Error(response.statusText);
+                    }
+                    return response.json();
+                }).then(data => {
+                    this.offers = data.offers;
+                    this.filterOptions = data.filterOptions;
                     this.loading = false;
                 }).catch(() => {
                     this.loading = false;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_badge.scss

@@ -1,7 +1,10 @@
+@use "breakpoints";
+@use "mixins";
+
 .badge {
     display: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
         position: relative;
         z-index: 10;
@@ -27,15 +30,15 @@
     font-size: 20px;
     font-weight: 700;
     line-height: 130%;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 32px;
     }
 }
 
 .badge__outline {
-    @include sectionFills(0.15);
+    @include mixins.sectionFills(0.15);
 }
 
 .badge__inner {
-    @include sectionFills();
+    @include mixins.sectionFills();
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_banner.scss

@@ -1,3 +1,5 @@
+@use "mixins";
+
 .banner {
     position: relative;
     margin-bottom: 20px;
@@ -8,7 +10,7 @@
     min-height: 300px;
     padding: 48px 0;
     color: white;
-    @include sectionBackgrounds(0.8);
+    @include mixins.sectionBackgrounds(0.8);
     display: flex;
     justify-content: space-around;
     align-items: center;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_base.scss

@@ -1,14 +1,20 @@
+@use "breakpoints";
+@use "colors";
+@use "fonts";
+@use "mixins";
+@use "variables";
+
 html,
 body {
     height: 100%;
     width: 100%;
     margin: 0;
     padding: 0;
-    font-family: $font-main, Sans-Serif;
+    font-family: fonts.$font-main, Sans-Serif;
     font-weight: 400;
     font-size: 16px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 18px;
     }
 
@@ -41,13 +47,13 @@ html {
     height: auto;
     margin-left: auto;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: none;
     }
 }
 
 .navtoggle__icon {
-    fill: $color-font-main;
+    fill: colors.$color-font-main;
     transition: all 0.25s ease-in-out;
 
     .mobilenav--open & {
@@ -62,7 +68,7 @@ html {
     right: 2%;
     width: 40px;
     height: 40px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     opacity: 0.75;
 }
 
@@ -76,12 +82,12 @@ a {
     &.anchor {
         display: block;
         height: 0;
-        padding-top: $header-height-mobile;
+        padding-top: variables.$header-height-mobile;
-        margin-top: -$header-height-mobile;
+        margin-top: -(variables.$header-height-mobile);
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
-            padding-top: $header-height-desktop;
+            padding-top: variables.$header-height-desktop;
-            margin-top: -$header-height-desktop;
+            margin-top: -(variables.$header-height-desktop);
         }
     }
 }
@@ -126,7 +132,7 @@ ul {
             left: 0;
             content: "\25CF";
             font-size: 18px;
-            @include sectionColoursFromParent();
+            @include mixins.sectionColoursFromParent();
         }
     }
 }
@@ -144,8 +150,8 @@ p {
 hr {
     max-width: 25%;
     margin: 32px auto 32px 0;
-    color: $color-ruler;
+    color: colors.$color-ruler;
-    background-color: $color-ruler;
+    background-color: colors.$color-ruler;
     height: 1px;
     border: none;
 }
@@ -161,7 +167,7 @@ h3,
 }
 
 .headline {
-    @include sectionColoursFromParent();
+    @include mixins.sectionColoursFromParent();
 
     &--icon {
         display: flex;
@@ -186,7 +192,7 @@ h1,
     text-transform: uppercase;
     padding-bottom: 18px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 32px;
         padding-bottom: 24px;
     }
@@ -200,11 +206,11 @@ h1,
         display: block;
         font-size: 16px;
         line-height: 120%;
-        color: $color-brand-primary;
+        color: colors.$color-brand-primary;
         text-transform: none;
-        @include sectionColoursFromParent();
+        @include mixins.sectionColoursFromParent();
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             font-size: 24px;
         }
 
@@ -221,7 +227,7 @@ h2,
     padding-bottom: 16px;
     font-weight: 400;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 24px;
         padding-bottom: 24px;
     }
@@ -231,7 +237,7 @@ h3 {
     font-weight: 400;
     font-size: 16px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 18px;
         padding-bottom: 8px;
     }
@@ -243,7 +249,7 @@ h3 {
     height: auto;
     padding-right: 16px;
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         width: 96px;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_box.scss

@@ -1,3 +1,6 @@
+@use "breakpoints";
+@use "colors";
+
 .box {
     width: 100%;
 }
@@ -13,7 +16,7 @@
     color: white;
     text-align: center;
     text-decoration: none;
-    background-color: $color-brand-secondary;
+    background-color: colors.$color-brand-secondary;
     border: none;
     width: 100%;
     font-size: 20px;
@@ -23,18 +26,18 @@
 
 .box__content {
     padding: 32px 16px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     color: white;
 }
 
 .box__form {
     display: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
         width: 100%;
         height: auto;
-        fill: $color-brand-primary;
+        fill: colors.$color-brand-primary;
     }
 
     &--top {
@@ -52,7 +55,7 @@
     font-size: 16px;
     line-height: 32px;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         font-size: 20px;
         line-height: 32px;
 
@@ -66,7 +69,7 @@
 .box__nav {
     margin-top: -32px;
     padding-bottom: 32px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
 }
 
 .box__nav__item {
@@ -78,7 +81,7 @@
 
     &--active,
     &:hover {
-        background-color: $color-brand-light;
+        background-color: colors.$color-brand-light;
     }
 }
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_brands.scss

@@ -1,6 +1,9 @@
+@use "breakpoints";
+@use "colors";
+
 .brands {
     padding-top: 32px;
-    border-top: 1px solid $color-divider;
+    border-top: 1px solid colors.$color-divider;
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
@@ -9,7 +12,7 @@
 .brands__item {
     width: 50%;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 25%;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_breakpoints.scss

@@ -1,7 +1,9 @@
-$mq-breakpoints: (
+@use "variables";
-    mobile: $viewport-width-mobile,
-    tablet: $viewport-width-tablet,
-    desktop: $viewport-width-desktop
-);
 
-@import "~sass-mq";
+@forward "sass-mq" with (
+    $breakpoints: (
+        mobile: variables.$viewport-width-mobile,
+        tablet: variables.$viewport-width-tablet,
+        desktop: variables.$viewport-width-desktop
+    )
+);

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_buttons.scss

@@ -1,3 +1,7 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+
 .button {
     display: inline-block;
     font-weight: 700;
@@ -5,7 +9,7 @@
 
     &--default {
       display: inline-block;
-      background-color: $color-brand-primary;
+      background-color: colors.$color-brand-primary;
       color: white;
       padding: 4px 16px;
     }
@@ -13,7 +17,7 @@
     &--page-header {
           display: block;
           min-width: 186px;
-          background-color: $color-brand-primary;
+          background-color: colors.$color-brand-primary;
           color: white;
           font-size: 18px;
           padding: 0 32px 0 24px;
@@ -26,14 +30,14 @@
         display: block;
         min-width: 220px;
         text-align: center;
-        background-color: $color-brand-primary;
+        background-color: colors.$color-brand-primary;
-        @include sectionBackgroundsFromParent();
+        @include mixins.sectionBackgroundsFromParent();
         color: white;
         line-height: 48px;
         border: none;
         outline: none;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             box-shadow: 8px 8px 8px rgba(black, 0.2);
             font-size: 24px;
         }
@@ -43,7 +47,7 @@
         width: 100%;
         display: inline-block;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             width: auto;
         }
     }
@@ -56,7 +60,7 @@
 
         &:hover {
             background: white;
-            color: $color-font-main;
+            color: colors.$color-font-main;
         }
     }
 
@@ -65,7 +69,7 @@
     }
 
     &--icon {
-        background-color: $color-brand-primary;
+        background-color: colors.$color-brand-primary;
         color: white;
         width: 16px;
         height: 16px;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_card.scss

@@ -1,5 +1,8 @@
+@use "breakpoints";
+@use "mixins";
+
 .card {
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         &:not(.card--no-form) {
             padding-bottom: 48px;
         }
@@ -20,12 +23,12 @@
     padding: 16px;
     color: white;
     text-transform: uppercase;
-    @include sectionBackgrounds(0.75);
+    @include mixins.sectionBackgrounds(0.75);
     transition: background-color 0.25s ease-in-out;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         .card:hover & {
-            @include sectionBackgrounds();
+            @include mixins.sectionBackgrounds();
         }
     }
 }
@@ -33,7 +36,7 @@
 .card__form {
     display: none;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         display: block;
         opacity: 0;
         transition: opacity 0.25s ease-in-out;
@@ -50,7 +53,7 @@
     }
 
     polygon {
-        @include sectionFills();
+        @include mixins.sectionFills();
     }
 }
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_carousel.scss

@@ -1,21 +1,25 @@
+@use "colors";
+@use "mixins";
+@use "variables";
+
 .carousel {
 
     &--background {
-        background-color: $color-background;
+        background-color: colors.$color-background;
         padding-bottom: 48px;
         margin-bottom: 8px;
     }
 
-    @include sectionBackgrounds(0.25);
+    @include mixins.sectionBackgrounds(0.25);
 }
 
 .carousel__outer {
-    @include container($viewport-width-max);
+    @include mixins.container(variables.$viewport-width-max);
     position: relative;
 }
 
 .carousel__inner {
-    @include container($content-width-max);
+    @include mixins.container(variables.$content-width-max);
 }
 
 .carousel__item {
@@ -36,7 +40,7 @@
     height: 32px;
 
     fill: white;
-    @include sectionColoursFromParent;
+    @include mixins.sectionColoursFromParent;
 
     &--prev {
         left: -5px;
@@ -59,7 +63,7 @@
     }
 
     .testimonials & {
-        fill: $color-brand-primary;
+        fill: colors.$color-brand-primary;
     }
 }
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_colors.scss

@@ -1,8 +1,10 @@
+@use "sass:color";
+
 //$color-brand-primary: #0084d4;
 $color-brand-primary: #19a0d2;
 $color-brand-secondary: #1e314b;
 $color-brand-light: #8CCFE8;
-$color-background: lighten(#dbdee2, 5%);
+$color-background: color.adjust(#dbdee2, $lightness: 5%);
 
 $color-font-main: #1e314b;
 $color-divider: rgba($color-background, 0.8);

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_configurator.scss

@@ -1,3 +1,6 @@
+@use "breakpoints";
+@use "colors";
+
 .configurator {
     background: url(../images/bg_configurator.jpg) no-repeat top left;
     background-size: cover;
@@ -39,7 +42,7 @@
     flex-wrap: wrap;
     justify-content: center;
     align-items: center;
-    background-color: rgba($color-brand-secondary, 0.85);
+    background-color: rgba(colors.$color-brand-secondary, 0.85);
     color: white;
 }
 
@@ -51,7 +54,7 @@
     display: none;
     color: white;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         display: block;
     }
 }
@@ -83,11 +86,11 @@
     text-decoration: none;
     text-transform: uppercase;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         flex-wrap: nowrap;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         align-items: center;
     }
 }
@@ -98,12 +101,12 @@
     margin-bottom: 8px;
     font-weight: 700;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 30%;
         margin-bottom: 0;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 20%;
         margin-bottom: 0;
     }
@@ -113,11 +116,11 @@
     width: 100%;
     padding-right: 40px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 70%;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 80%;
     }
 }
@@ -131,11 +134,11 @@
     font-size: 14px;
     font-weight: 700;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 16px;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         margin-bottom: 0;
     }
 }
@@ -151,13 +154,13 @@
     text-decoration: none;
     text-align: center;
     color: white;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     border-radius: 16px;
     font-family: "fontello";
 
     &.closed {
         background-color: white;
-        color: $color-brand-primary;
+        color: colors.$color-brand-primary;
 
         &:before {
             content: '\e800';
@@ -204,7 +207,7 @@
         margin-bottom: 8px;
     }
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         width: 50%;
 
         .active & {
@@ -212,7 +215,7 @@
         }
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 25%;
 
         .active & {
@@ -240,10 +243,10 @@
     }
 
     .selected &:after {
-        background-color: rgba($color-brand-secondary, 0.75);
+        background-color: rgba(colors.$color-brand-secondary, 0.75);
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         &:hover:after {
             content: "";
             width: 100%;
@@ -251,7 +254,7 @@
             position: absolute;
             top: 0;
             left: 0;
-            background-color: rgba($color-brand-primary, 0.5);
+            background-color: rgba(colors.$color-brand-primary, 0.5);
         }
     }
 
@@ -260,12 +263,12 @@
         background-position: center 32px;
         background-size: 96px;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             background-position: center 16px;
             background-size: 128px;
         }
 
-        @include mq($from: desktop) {
+        @include breakpoints.mq($from: desktop) {
             background-position: center 8px;
             background-size: 96px;
         }
@@ -382,7 +385,7 @@
     flex-wrap: wrap;
     justify-content: space-between;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         flex-wrap: nowrap;
     }
 }
@@ -391,7 +394,7 @@
     width: 100%;
     padding-bottom: 16px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 66.6666%;
         padding-right: 32px;
     }
@@ -401,7 +404,7 @@
     width: 100%;
     padding-bottom: 16px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 33.3333%;
     }
 }
@@ -456,7 +459,7 @@
     line-height: 32px;
     text-align: center;
     background-color: white;
-    color: $color-brand-primary;
+    color: colors.$color-brand-primary;
     border-radius: 16px;
     font-family: 'fontello';
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_cookiefirst.scss

@@ -1,3 +1,6 @@
+// .headline* live in _base.scss; @extend needs that module loaded explicitly.
+@use "base";
+
 .cookiefirst {
     h2 {
         @extend .headline;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_forms.scss

@@ -1,10 +1,14 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+
 .form {
   margin: 0;
   padding: 0;
   position: relative;
   max-width: 100%;
 
-  @include mq($from: desktop) {
+  @include breakpoints.mq($from: desktop) {
     &:not(&--horizontal) {
       max-width: 75%;
     }
@@ -16,7 +20,7 @@
 
   &--horizontal {
     width: 100%;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
       display: flex;
       justify-content: space-between;
       align-items: center;
@@ -42,7 +46,7 @@
     flex-wrap: wrap;
     align-items: center;
     justify-content: space-between;
-    background-color: $color-brand-light;
+    background-color: colors.$color-brand-light;
     color: white;
     border-radius: 8px;
   }
@@ -50,7 +54,7 @@
   &--mobile {
     display: block;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
       display: none;
     }
   }
@@ -58,7 +62,7 @@
   &--tablet {
     display: none;
 
-    @include mq($from: tablet, $until: desktop) {
+    @include breakpoints.mq($from: tablet, $until: desktop) {
       display: block;
     }
   }
@@ -66,7 +70,7 @@
   &--desktop {
     display: none;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
       display: block;
     }
   }
@@ -79,7 +83,7 @@
       padding-top: 20px;
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
       width: 33.3333%;
     }
   }
@@ -88,20 +92,20 @@
 .form__item__error {
   padding: 8px;
   font-size: 90%;
-  color: $color-formerror;
+  color: colors.$color-formerror;
 }
 
 .form__field {
-  @include nooutline;
+  @include mixins.nooutline;
   border: none;
   border-radius: 8px;
   width: 100%;
   padding: 8px 16px;
   color: white;
-  background-color: $color-brand-light;
+  background-color: colors.$color-brand-light;
 
   .form--box & {
-    background-color: $color-brand-light;
+    background-color: colors.$color-brand-light;
     color: white;
   }
 
@@ -114,10 +118,10 @@
     display: block;
     padding: 8px;
     width: 100%;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
       width: 50%;
     }
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
       width: 25%;
     }
   }
@@ -127,7 +131,7 @@
   }
 
   .has-errors & {
-    border: 1px solid $color-formerror;
+    border: 1px solid colors.$color-formerror;
   }
 }
 
@@ -158,7 +162,7 @@
   display: block;
   width: 100%;
   color: white;
-  background-color: $color-brand-secondary;
+  background-color: colors.$color-brand-secondary;
   border: none;
   font-weight: 700;
   text-decoration: none;
@@ -166,7 +170,7 @@
   padding: 8px 32px;
   margin-bottom: 16px;
 
-  @include mq($from: tablet) {
+  @include breakpoints.mq($from: tablet) {
     display: inline-block;
     width: auto;
     margin-bottom: 0;
@@ -189,10 +193,10 @@
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
-  background-color: rgba($color-divider, 0.75);
+  background-color: rgba(colors.$color-divider, 0.75);
 
   .form--box & {
-    background-color: rgba($color-brand-primary, 0.75);
+    background-color: rgba(colors.$color-brand-primary, 0.75);
   }
 }
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_helpernav.scss

@@ -1,7 +1,10 @@
+@use "breakpoints";
+@use "colors";
+
 .helpernav {
     display: none;
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         display: block;
         position: relative;
     }
@@ -24,7 +27,7 @@
     z-index: 10;
     min-width: 300px;
     padding: 16px 32px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
 }
 
 .helpernav__item {
@@ -32,7 +35,7 @@
   &:hover:not(.helpernav__item--disabled) {
 
     & > .helpernav__link {
-      background-color: $color-brand-primary;
+      background-color: colors.$color-brand-primary;
     }
 
     & > .helpernav__subnav {

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_herounit.scss

@@ -1,11 +1,16 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+@use "variables";
+
 .herounit {
     position: relative;
     width: 100%;
-    max-width: $viewport-width-max;
+    max-width: variables.$viewport-width-max;
     margin: 0 auto;
 
     &--indent {
-        max-width: $content-width-max - 16px;
+        max-width: variables.$content-width-max - 16px;
     }
 }
 
@@ -16,22 +21,22 @@
 
     height: 240px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         height: 384px;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         height: 420px;
     }
 
     .herounit--large & {
         height: 300px;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             height: 480px;
         }
 
-        @include mq($from: desktop) {
+        @include breakpoints.mq($from: desktop) {
             height: 700px;
         }
     }
@@ -39,7 +44,7 @@
     .herounit--indent & {
         height: 320px;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             height: 480px;
         }
     }
@@ -48,7 +53,7 @@
 .herounit__mask {
     display: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         position: absolute;
         z-index: 10;
         top: 0;
@@ -67,9 +72,9 @@
     width: 100%;
     height: 100%;
     padding: 32px;
-    background-color: rgba($color-brand-secondary, 0.2);
+    background-color: rgba(colors.$color-brand-secondary, 0.2);
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         background-color: transparent;
         padding: 64px 16px 0 96px;
         max-width: 45%;
@@ -83,7 +88,7 @@
     font-size: 32px;
     line-height: 95%;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         font-size: 48px;
     }
 
@@ -101,10 +106,10 @@
         span {
             font-weight: 700;
             text-transform: uppercase;
-            color: $color-brand-primary;
+            color: colors.$color-brand-primary;
         }
 
-        @include mq($from: desktop) {
+        @include breakpoints.mq($from: desktop) {
             font-size: 56px;
         }
     }
@@ -120,7 +125,7 @@
     color: white;
     text-transform: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 20px;
     }
 
@@ -128,12 +133,12 @@
         font-size: 22px;
         font-weight: 700;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             font-size: 24px;
             padding-bottom: 48px;
         }
 
-        @include mq($from: desktop) {
+        @include breakpoints.mq($from: desktop) {
             font-size: 32px;
             padding-bottom: 96px;
         }
@@ -146,7 +151,7 @@
     line-height: 120%;
     color: white;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
     }
 }
@@ -154,7 +159,7 @@
 .herounit__icon {
     display: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
         width: 100%;
         height: auto;
@@ -173,11 +178,11 @@
     left: 50%;
     transform: translateX(-50%);
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         top: 85%;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
@@ -190,34 +195,34 @@
     height: 48px;
     border: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
     }
 
     & > polygon {
-        fill: $color-brand-primary;
+        fill: colors.$color-brand-primary;
-        @include sectionFills();
+        @include mixins.sectionFills();
     }
 }
 
 #gradient__from {
-    stop-color: $color-brand-secondary;
+    stop-color: colors.$color-brand-secondary;
 }
 
 #gradient__to {
     .section-default & {
-        stop-color: $color-brand-primary;
+        stop-color: colors.$color-brand-primary;
     }
     .section-incentives & {
-        stop-color: $color-incentives;
+        stop-color: colors.$color-incentives;
     }
     .section-teambuilding & {
-        stop-color: $color-teambuilding;
+        stop-color: colors.$color-teambuilding;
     }
     .secolor-meeting & {
-        stop-color: $color-meetings;
+        stop-color: colors.$color-meetings;
     }
     .secolor-events & {
-        stop-color: $color-events;
+        stop-color: colors.$color-events;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_iconbar.scss

@@ -1,9 +1,12 @@
+@use "breakpoints";
+@use "colors";
+
 .iconbar {
     @apply hidden lg:block fixed z-100 top-[30vh] right-0 overflow-hidden;
 }
 .iconbar {
     display: none;
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         display: block;
     }
     position: fixed;
@@ -20,7 +23,7 @@
     display: flex;
     flex-wrap: nowrap;
     align-items: center;
-    background-color: $color-brand-light;
+    background-color: colors.$color-brand-light;
     margin-bottom: 2px;
 
     &:hover {
@@ -30,7 +33,7 @@
 
 .iconbar__icon {
     padding: 4px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
 
     svg {
         display: block;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_iconnav.scss

@@ -1,3 +1,6 @@
+@use "breakpoints";
+@use "mixins";
+
 .iconnav {
     display: flex;
     flex-wrap: wrap;
@@ -21,7 +24,7 @@
         opacity: 1;
     }
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         width: 25%;
     }
 }
@@ -36,5 +39,5 @@
 .iconnav__label {
     text-transform: uppercase;
     font-weight: 700;
-    @include sectionColours();
+    @include mixins.sectionColours();
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_layout.scss

@@ -1,7 +1,10 @@
+@use "breakpoints";
+@use "mixins";
+
 main {
     padding-top: 96px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding-top: 140px;
     }
 }
@@ -10,7 +13,7 @@ main {
     width: 100%;
     padding-top: 32px;
     padding-bottom: 32px;
-    @include clearfix();
+    @include mixins.clearfix();
 
     &.nopad {
         &--bottom {
@@ -23,18 +26,18 @@ main {
 }
 
 .content__title {
-    @include container();
+    @include mixins.container();
     text-align: center;
 }
 
 .content__inner {
-    @include container();
+    @include mixins.container();
 
     .content--has-sidebar & {
         display: flex;
         flex-wrap: wrap;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             flex-wrap: nowrap;
         }
     }
@@ -45,40 +48,40 @@ main {
     padding: 0 0 32px;
     overflow: hidden;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding: 0;
     }
 }
 
 .content__plain {
-    @include clearfix();
+    @include mixins.clearfix();
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding-right: 96px;
     }
 }
 
 .content__background {
-    @include clearfix();
+    @include mixins.clearfix();
-    @include sectionBackgrounds(0.15);
+    @include mixins.sectionBackgrounds(0.15);
     padding: 24px 48px 24px 32px;
 }
 
 .content__float {
-  @include clearfix();
+  @include mixins.clearfix();
 }
 
 .content__sidebar {
     width: 100%;
     padding: 32px 0;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         flex: 0 0 320px;
         padding: 0 0 0 32px;
     }
 }
 
 .content__form {
-    @include sectionFills(0.15);
+    @include mixins.sectionFills(0.15);
     width: 100%;
     height: auto;
     display: block;
@@ -93,7 +96,7 @@ main {
 
 .desktop-only {
     display: none;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_mixins.scss

@@ -1,4 +1,6 @@
 @use "sass:math";
+@use "variables" as *;
+@use "colors" as *;
 
 @mixin clearfix {
     &::after {

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_mobilenav.scss

@@ -1,3 +1,6 @@
+@use "breakpoints";
+@use "colors";
+
 .mobilenav {
     position: fixed;
     z-index: 50;
@@ -7,10 +10,10 @@
     height: 0;
     padding-top: 96px;
     overflow: hidden;
-    background: rgba($color-brand-secondary, 0.9);
+    background: rgba(colors.$color-brand-secondary, 0.9);
     transition: height 0.25s ease-in-out;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         display: none;
     }
 

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_news.scss

@@ -1,3 +1,5 @@
+@use "breakpoints";
+
 .news-entry {
   width: 100%;
   &:not(:last-child) {
@@ -13,7 +15,7 @@
   display: flex;
   flex-direction: column;
 
-  @include mq($from: desktop) {
+  @include breakpoints.mq($from: desktop) {
     flex-direction: row;
   }
 }
@@ -22,7 +24,7 @@
   width: 100%;
   margin-bottom: 8px;
 
-  @include mq($from: desktop) {
+  @include breakpoints.mq($from: desktop) {
     width: 50%;
   }
 }
@@ -39,7 +41,7 @@
 .news-entry__teaser {
   width: 100%;
 
-  @include mq($from: desktop) {
+  @include breakpoints.mq($from: desktop) {
     padding-left: 24px;
     width: 50%;
   }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_offerlist.scss

@@ -1,3 +1,5 @@
+@use "breakpoints";
+
 .offerlist {
   position: relative;
 }
@@ -13,7 +15,7 @@
 }
 
 .offerlist__teasers {
-  @include mq($from: tablet) {
+  @include breakpoints.mq($from: tablet) {
     display: flex;
     flex-wrap: wrap;
   }
@@ -24,13 +26,13 @@
   text-decoration: none;
   margin-bottom: 32px;
   display: block;
-  @include mq($from: mobile) {
+  @include breakpoints.mq($from: mobile) {
     display: flex;
   }
-  @include mq($from: tablet) {
+  @include breakpoints.mq($from: tablet) {
     width: 50%;
   }
-  @include mq($from: desktop) {
+  @include breakpoints.mq($from: desktop) {
     width: 33.3333%;
   }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_page-footer.scss

@@ -1,25 +1,30 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+@use "variables";
+
 .page-footer {
     width: 100%;
-    background: linear-gradient(to right, $color-brand-secondary, $color-brand-primary);
+    background: linear-gradient(to right, colors.$color-brand-secondary, colors.$color-brand-primary);
     color: white;
     padding-top: 16px;
     padding-bottom: 16px;
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         padding-top: 48px;
         padding-bottom: 48px;
     }
 }
 
 .page-footer__inner {
-    @include container($content-width-max);
+    @include mixins.container(variables.$content-width-max);
     display: flex;
     align-items: flex-start;
     flex-wrap: wrap;
     justify-content: center;
     border-bottom: 1px solid white;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding-bottom: 48px;
     }
 }
@@ -33,14 +38,14 @@
         text-align: left;
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 20%;
     }
 
     &--hide-mobile {
         display: none;
 
-        @include mq($from: tablet) {
+        @include breakpoints.mq($from: tablet) {
             display: block;
         }
     }
@@ -60,14 +65,14 @@
 }
 
 .page-footer__bottom {
-    @include container($content-width-max);
+    @include mixins.container(variables.$content-width-max);
     padding-top: 32px;
     display: flex;
     align-items: center;
     flex-wrap: wrap;
     justify-content: space-around;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         align-items: flex-start;
         justify-content: space-between;
     }
@@ -76,7 +81,7 @@
 .page-footer__bottom__column {
     width: 100%;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 33.3333%;
     }
 }
@@ -86,7 +91,7 @@
     justify-content: center;
     align-items: flex-start;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         justify-content: flex-start;
     }
 }
@@ -106,7 +111,7 @@
     font-weight: 700;
     text-align: center;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         text-align: left;
     }
 }
@@ -115,7 +120,7 @@
     text-align: center;
     padding-top: 32px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         text-align: right;
         padding-top: 0;
     }
@@ -138,7 +143,7 @@
     text-align: center;
     padding-top: 32px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         text-align: left;
         padding-top: 0;
     }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_page-header.scss

@@ -1,3 +1,7 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+
 .page-header {
     width: 100%;
     position: fixed;
@@ -5,28 +9,28 @@
     left: 0;
     z-index: 1000;
     background: white;
-    box-shadow: 0 2px 2px rgba($color-background, 0.5);
+    box-shadow: 0 2px 2px rgba(colors.$color-background, 0.5);
 }
 
 .page-header__bar {
-    background: linear-gradient(to right, $color-brand-primary 50%, $color-brand-secondary);
+    background: linear-gradient(to right, colors.$color-brand-primary 50%, colors.$color-brand-secondary);
 }
 
 .page-header__bar__main {
-    @include container();
+    @include mixins.container();
     color: white;
     display: flex;
     justify-content: center;
     align-items: center;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         justify-content: space-between;
     }
 }
 
 .page-header__bar__search {
     display: none;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
         width: 50%;
     }
@@ -37,7 +41,7 @@
     justify-content: center;
     align-items: center;
     width: 100%;
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 50%;
         justify-content: flex-end;
     }
@@ -53,14 +57,14 @@
 .page-header__bar__divider {
     display: none;
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         display: inline-block;
         padding: 12px 8px;
     }
 }
 
 .page-header__main {
-    @include container();
+    @include mixins.container();
     padding: 16px;
     display: flex;
     display: -ms-flexbox;
@@ -68,11 +72,11 @@
     align-items: center;
     -ms-flex-align: center;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding: 32px 16px 24px;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         justify-content: space-between;
         align-items: baseline;
         -ms-flex-align: end;
@@ -98,7 +102,7 @@
 .page-header__sitenav {
     display: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         display: block;
     }
 }
@@ -106,7 +110,7 @@
 .page-header__button {
     display: none;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         position: relative;
         display: block;
         min-width: 220px;
@@ -128,6 +132,6 @@
     border: none;
 
     & > polygon {
-        fill: $color-brand-primary;
+        fill: colors.$color-brand-primary;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_paginator.scss

@@ -1,3 +1,5 @@
+@use "colors";
+
 .paginator {
     list-style: none;
     margin: 0;
@@ -10,7 +12,7 @@
 
 .paginator__item {
     display: inline-block;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     color: white;
     padding: 4px;
     text-decoration: none;
@@ -19,8 +21,8 @@
     }
 
     &--current {
-        border: 1px solid $color-brand-primary;
+        border: 1px solid colors.$color-brand-primary;
         background-color: white;
-        color: $color-brand-primary;
+        color: colors.$color-brand-primary;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_search.scss

@@ -1,24 +1,27 @@
+@use "breakpoints";
+@use "mixins";
+
 .searchresult {}
 
 .searchresult__info {
-    @include container();
+    @include mixins.container();
 }
 
 .searchresult-item {
     text-decoration: none;
     margin-bottom: 32px;
     display: block;
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         display: flex;
     }
 }
 
 .searchresult-item__card {
     width: 100%;
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         width: 240px;
     }
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 33.3333%;
     }
 }
@@ -27,8 +30,8 @@
     margin: 0 8px;
     padding: 32px;
     color: white;
-    @include sectionBackgrounds();
+    @include mixins.sectionBackgrounds();
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         margin: 0;
         flex: 1;
     }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_sitenav.scss

@@ -1,5 +1,8 @@
+@use "breakpoints";
+@use "mixins";
+
 .sitenav {
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         padding-right: 64px;
     }
 }
@@ -25,7 +28,7 @@
     &--active,
     &:hover {
         border-bottom: 3px solid;
-        @include sectionColours();
+        @include mixins.sectionColours();
     }
 
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_slider.scss

@@ -1,3 +1,5 @@
+@use "breakpoints";
+
 .slider {}
 
 .slider__arrow {
@@ -38,7 +40,7 @@
         top: 30%;
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 16px;
         height: 16px;
     }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_statement.scss

@@ -1,11 +1,14 @@
+@use "breakpoints";
+@use "mixins";
+
 .statement {
-    @include container();
+    @include mixins.container();
     padding-top: 32px;
     padding-bottom: 48px;
 }
 
 .statement__inner {
-    @include sectionBackgrounds();
+    @include mixins.sectionBackgrounds();
     box-shadow: 0 5px 10px rgba(black, 0.2);
     text-align: center;
     padding-top: 48px;
@@ -18,7 +21,7 @@
     font-size: 24px;
     line-height: 105%;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 48px;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_team.scss

@@ -1,3 +1,6 @@
+@use "breakpoints";
+@use "colors";
+
 .team {
     display: flex;
     justify-content: space-between;
@@ -12,11 +15,11 @@
     max-width: 400px;
     padding: 0 16px 64px;
 
-    @include mq($until: desktop) {
+    @include breakpoints.mq($until: desktop) {
       margin: 0 auto;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 50%;
         max-width: 100%;
     }
@@ -57,10 +60,10 @@
 
 .team__position {
     display: block;
-    color: $color-brand-primary;
+    color: colors.$color-brand-primary;
 }
 
 .team__contact__link {
     text-decoration: none;
-    color: $color-brand-primary;
+    color: colors.$color-brand-primary;
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_teasers.scss

@@ -1,12 +1,15 @@
+@use "breakpoints";
+@use "mixins";
+
 .teasers {
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
-    @include sectionBackgrounds(0.15);
+    @include mixins.sectionBackgrounds(0.15);
     margin: 0 -16px 0;
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         flex-direction: row;
     }
 }
@@ -19,15 +22,15 @@
         cursor: pointer;
     }
 
-    @include mq($until: tablet) {
+    @include breakpoints.mq($until: tablet) {
         padding-bottom: 16px;
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 50%;
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 33.3333%;
     }
 }
@@ -40,12 +43,12 @@
 }
 
 .teaser__caption {
-    @include sectionBackgroundsFromParent();
+    @include mixins.sectionBackgroundsFromParent();
     padding: 16px 16px 0;
 }
 
 .teaser__form {
-    @include sectionFills();
+    @include mixins.sectionFills();
     width: 100%;
     height: auto;
     display: block;

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_testimonial.scss

@@ -1,17 +1,20 @@
+@use "breakpoints";
+@use "colors";
+
 .testimonial {
     width: 100%;
     padding: 0 32px;
     text-align: center;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 80%;
         width: 50%;
         &:not(:last-child) {
-            border-right: 1px solid $color-divider;
+            border-right: 1px solid colors.$color-divider;
         }
     }
 
-    @include mq($from: desktop) {
+    @include breakpoints.mq($from: desktop) {
         width: 25%;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_tiles.scss

@@ -1,3 +1,7 @@
+@use "breakpoints";
+@use "colors";
+@use "mixins";
+
 .tiles {
     padding-bottom: 0;
 }
@@ -15,7 +19,7 @@
     padding: 16px;
     text-decoration: none;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 50%;
         padding: 16px;
     }
@@ -26,12 +30,12 @@
     background-size: cover;
     background-position: center;
 
-    @include mq($from: mobile) {
+    @include breakpoints.mq($from: mobile) {
         min-height: 250px;
         padding: 32px;
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding: 32px 32px 0;
         min-height: 375px;
     }
@@ -42,33 +46,33 @@
     color: white;
     text-align: center;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         width: 70%;
         margin: 0 auto;
     }
 }
 
 .tile__caption__inner {
-    @include sectionBackgrounds(0.75);
+    @include mixins.sectionBackgrounds(0.75);
     width: 100%;
     padding: 24px 0;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         padding: 32px 0;
 
         .tile:hover .section-incentives & {
-            background-color: $color-incentives;
+            background-color: colors.$color-incentives;
         }
         .tile:hover .section-teambuilding & {
-            background-color: $color-teambuilding;
+            background-color: colors.$color-teambuilding;
         }
 
         .tile:hover .section-meetings & {
-            background-color: $color-meetings;
+            background-color: colors.$color-meetings;
         }
 
         .tile:hover .section-events & {
-            background-color: $color-events;
+            background-color: colors.$color-events;
         }
     }
 }
@@ -77,7 +81,7 @@
     display: none;
     padding: 16px 32px 0;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         .tile:hover & {
             display: block;
         }
@@ -91,10 +95,10 @@
     margin-top: -1px;
 
     polygon {
-        @include sectionFills();
+        @include mixins.sectionFills();
     }
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         .tile:hover & {
             display: block;
         }
@@ -114,7 +118,7 @@
     font-weight: 700;
     min-height: 54px;
 
-    @include mq($from: tablet) {
+    @include breakpoints.mq($from: tablet) {
         font-size: 24px;
     }
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/_video.scss

@@ -1,5 +1,7 @@
+@use "mixins";
+
 .video {
-    @include container();
+    @include mixins.container();
     padding-top: 32px;
     padding-bottom: 32px;
 }

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/main.scss

@@ -1,39 +1,39 @@
-@import "variables";
+@use "variables";
-@import "mixins";
+@use "mixins";
-@import "breakpoints";
+@use "breakpoints";
 
-@import "colors";
+@use "colors";
-@import "fonts";
+@use "fonts";
 
-@import "base";
+@use "base";
-@import "buttons";
+@use "buttons";
-@import "page-header";
+@use "page-header";
-@import "page-footer";
+@use "page-footer";
-@import "layout";
+@use "layout";
-@import "sitenav";
+@use "sitenav";
-@import "helpernav";
+@use "helpernav";
-@import "mobilenav";
+@use "mobilenav";
-@import "herounit";
+@use "herounit";
-@import "carousel";
+@use "carousel";
-@import "slider";
+@use "slider";
-@import "configurator";
+@use "configurator";
-@import "statement";
+@use "statement";
-@import "testimonial";
+@use "testimonial";
-@import "brands";
+@use "brands";
-@import "iconbar";
+@use "iconbar";
-@import "tiles";
+@use "tiles";
-@import "card";
+@use "card";
-@import "box";
+@use "box";
-@import "banner";
+@use "banner";
-@import "iconnav";
+@use "iconnav";
-@import "forms";
+@use "forms";
-@import "teasers";
+@use "teasers";
-@import "badge";
+@use "badge";
-@import "team";
+@use "team";
-@import "search";
+@use "search";
-@import "offerlist";
+@use "offerlist";
-@import "paginator";
+@use "paginator";
-@import "news";
+@use "news";
-@import "datepicker";
+@use "datepicker";
-@import "cookiefirst";
+@use "cookiefirst";
-@import "video";
+@use "video";

public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/rte.scss

@@ -1,18 +1,14 @@
-@import "mixins";
+@use "mixins";
-@import "colors";
+@use "colors";
 
 @font-face {
   font-family: 'Cairo';
   font-style: normal;
   font-weight: 400;
   font-display: swap;
-  src: url('../fonts/cairo-v2-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
   src: local('Cairo'), local('Cairo-Regular'),
-  url('../fonts/cairo-v2-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('../fonts/cairo-v2-latin-ext_latin-regular.woff2') format('woff2'),
-  url('../fonts/cairo-v2-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
+  url('../fonts/cairo-v2-latin-ext_latin-regular.woff') format('woff');
-  url('../fonts/cairo-v2-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
-  url('../fonts/cairo-v2-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
-  url('../fonts/cairo-v2-latin-ext_latin-regular.svg#Cairo') format('svg'); /* Legacy iOS */
 }
 
 @font-face {
@@ -20,13 +16,9 @@
   font-style: normal;
   font-weight: 700;
   font-display: swap;
-  src: url('../fonts/cairo-v2-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
   src: local('Cairo Bold'), local('Cairo-Bold'),
-  url('../fonts/cairo-v2-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('../fonts/cairo-v2-latin-ext_latin-700.woff2') format('woff2'),
-  url('../fonts/cairo-v2-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
+  url('../fonts/cairo-v2-latin-ext_latin-700.woff') format('woff');
-  url('../fonts/cairo-v2-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
-  url('../fonts/cairo-v2-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
-  url('../fonts/cairo-v2-latin-ext_latin-700.svg#Cairo') format('svg'); /* Legacy iOS */
 }
 
 $font-main: 'Cairo';
@@ -34,12 +26,8 @@ $font-main: 'Cairo';
 @font-face {
   font-family: 'fontello';
   font-display: swap;
-  src: url('../fonts/fontello.eot?39986861');
+  src: url('../fonts/fontello.woff2?39986861') format('woff2'),
-  src: url('../fonts/fontello.eot?39986861#iefix') format('embedded-opentype'),
+  url('../fonts/fontello.woff?39986861') format('woff');
-  url('../fonts/fontello.woff2?39986861') format('woff2'),
-  url('../fonts/fontello.woff?39986861') format('woff'),
-  url('../fonts/fontello.ttf?39986861') format('truetype'),
-  url('../fonts/fontello.svg?39986861#fontello') format('svg');
   font-weight: normal;
   font-style: normal;
 }
@@ -123,7 +111,7 @@ ul {
       left: 0;
       content: "\25CF";
       font-size: 18px;
-      @include sectionColoursFromParent();
+      @include mixins.sectionColoursFromParent();
     }
   }
 }
@@ -141,8 +129,8 @@ p {
 hr {
   max-width: 25%;
   margin: 32px auto 32px 0;
-  color: $color-ruler;
+  color: colors.$color-ruler;
-  background-color: $color-ruler;
+  background-color: colors.$color-ruler;
   height: 1px;
   border: none;
 }
@@ -158,7 +146,7 @@ h3,
 }
 
 .headline {
-  @include sectionColoursFromParent();
+  @include mixins.sectionColoursFromParent();
 
   &--icon {
     display: flex;
@@ -192,9 +180,9 @@ h1,
     display: block;
     font-size: 16px;
     line-height: 120%;
-    color: $color-brand-primary;
+    color: colors.$color-brand-primary;
     text-transform: none;
-    @include sectionColoursFromParent();
+    @include mixins.sectionColoursFromParent();
 
     &--box {
       color: white;
@@ -229,7 +217,7 @@ h3 {
 
   &--default {
     display: inline-block;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     color: white;
     padding: 4px 16px;
   }
@@ -237,7 +225,7 @@ h3 {
   &--page-header {
     display: block;
     min-width: 186px;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     color: white;
     font-size: 18px;
     padding: 0 32px 0 24px;
@@ -250,8 +238,8 @@ h3 {
     display: block;
     min-width: 220px;
     text-align: center;
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
-    @include sectionBackgroundsFromParent();
+    @include mixins.sectionBackgroundsFromParent();
     color: white;
     line-height: 48px;
     border: none;
@@ -271,7 +259,7 @@ h3 {
 
     &:hover {
       background: white;
-      color: $color-font-main;
+      color: colors.$color-font-main;
     }
   }
 
@@ -280,7 +268,7 @@ h3 {
   }
 
   &--icon {
-    background-color: $color-brand-primary;
+    background-color: colors.$color-brand-primary;
     color: white;
     width: 16px;
     height: 16px;

public/typo3conf/ext/ep_products/Classes/Controller/SearchController.php

@@ -87,12 +87,16 @@ class SearchController extends ActionController
 
     public function initializeSearchresultAction()
     {
-        // Process encoded filtersettings from static search result
+        // Process encoded filtersettings from static search result.
+        // Explicit filter settings win: they carry the visitor's current selection,
+        // whereas a stale 'f' riding along on a link would silently replace it.
         $encodedFilterSettings = GeneralUtility::_GET('f');
-        if ($encodedFilterSettings) {
+        if ($encodedFilterSettings && !$this->request->hasArgument('filterSettings')) {
             $filterSettingsEncoder = new FilterSettingsEncoder();
             $filterSettings = $filterSettingsEncoder->decode($encodedFilterSettings);
-            $this->request->setArgument('filterSettings', $filterSettings);
+            if (count($filterSettings) > 0) {
+                $this->request->setArgument('filterSettings', $filterSettings);
+            }
         }
         $forcedConceptUids = GeneralUtility::intExplode(',', $this->settings['forcedConceptUids'], true);
         $this->processFilterSettingsArgument($forcedConceptUids);

public/typo3conf/ext/ep_products/Classes/Domain/Model/Room.php

@@ -30,12 +30,17 @@ namespace EP\EpProducts\Domain\Model;
 class Room
 {
 
+    const ROOM_TYPE_UNCLASSIFIED = 0;
     const ROOM_TYPE_FOR_ONE = 1;
     const ROOM_TYPE_FOR_TWO = 2;
     const ROOM_TYPE_FOR_THREE = 3;
     const ROOM_TYPE_FOR_FOUR = 4;
-    const ROOM_TYPE_WITH_OTHERS = 5;
+    const ROOM_TYPE_FOR_FIVE = 5;
-    const ROOM_TYPE_OTHER = 6;
+    const ROOM_TYPE_FOR_SIX = 6;
+    const ROOM_TYPE_FOR_SEVEN = 7;
+    const ROOM_TYPE_FOR_EIGHT = 8;
+    const ROOM_TYPE_FOR_NINE_PLUS = 9;
+    const ROOM_TYPE_WITH_OTHERS = 10;
 
     const ROOM_STATUS_AVAILABLE = 1;
     const ROOM_STATUS_ON_REQUEST = 2;

public/typo3conf/ext/ep_products/Classes/Domain/Model/RoomMapping.php

@@ -1,75 +0,0 @@
-<?php
-
-namespace EP\EpProducts\Domain\Model;
-
-/***************************************************************
- *
- *  Copyright notice
- *
- *  (c) 2016 Björn Fromme <[email protected]>, dreipunktnull
- *
- *  All rights reserved
- *
- *  This script is part of the TYPO3 project. The TYPO3 project is
- *  free software; you can redistribute it and/or modify
- *  it under the terms of the GNU General Public License as published by
- *  the Free Software Foundation; either version 3 of the License, or
- *  (at your option) any later version.
- *
- *  The GNU General Public License can be found at
- *  http://www.gnu.org/copyleft/gpl.html.
- *
- *  This script is distributed in the hope that it will be useful,
- *  but WITHOUT ANY WARRANTY; without even the implied warranty of
- *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *  GNU General Public License for more details.
- *
- *  This copyright notice MUST APPEAR in all copies of the script!
- ***************************************************************/
-
-class RoomMapping extends \TYPO3\CMS\Extbase\DomainObject\AbstractEntity
-{
-
-    /**
-     * @var string
-     */
-    protected $code = '';
-
-    /**
-     * @var int
-     */
-    protected $type = 0;
-
-    /**
-     * @return string
-     */
-    public function getCode()
-    {
-        return $this->code;
-    }
-
-    /**
-     * @param string $code
-     */
-    public function setCode($code)
-    {
-        $this->code = $code;
-    }
-
-    /**
-     * @return int
-     */
-    public function getType()
-    {
-        return $this->type;
-    }
-
-    /**
-     * @param int $type
-     */
-    public function setType($type)
-    {
-        $this->type = $type;
-    }
-
-}

public/typo3conf/ext/ep_products/Classes/Domain/Repository/ProductRepository.php

@@ -76,9 +76,11 @@ class ProductRepository extends AbstractRepository
                 'date.services_included as servicesIncluded', 'date.skipass_included as skiPassIncluded',
                 'date.bus_available as busAvailable', 'date.new as new',
                 'date.min_price as minPrice', 'date.nights as nights', 'date.available as available',
-                'date.pseudo_price as pseudoPrice', 'date.hide_booking_button as hideBookingButton',
+                'date.pseudo_price as pseudoPrice', 'date.hide_booking_button as hideBookingButton'
-                'room.type as roomType'
             )
+            // The GROUP BY below collapses many room rows per group; an arbitrary
+            // room.type would hide most types from the filter facet.
+            ->addSelectLiteral('GROUP_CONCAT(DISTINCT room.type) as roomTypes')
             ->from('tx_epproducts_domain_model_date', 'date')
             ->leftJoin('date', 'tx_epproducts_domain_model_concept', 'con', 'date.concept = con.uid')
             ->leftJoin('date', 'tx_epproducts_domain_model_room', 'room', 'room.date = date.uid')

public/typo3conf/ext/ep_products/Classes/Domain/Repository/RoomMappingRepository.php

@@ -1,31 +0,0 @@
-<?php
-
-namespace EP\EpProducts\Domain\Repository;
-
-/***************************************************************
- *
- *  Copyright notice
- *
- *  (c) 2016 Björn Fromme <[email protected]>, dreipunktnull
- *
- *  All rights reserved
- *
- *  This script is part of the TYPO3 project. The TYPO3 project is
- *  free software; you can redistribute it and/or modify
- *  it under the terms of the GNU General Public License as published by
- *  the Free Software Foundation; either version 3 of the License, or
- *  (at your option) any later version.
- *
- *  The GNU General Public License can be found at
- *  http://www.gnu.org/copyleft/gpl.html.
- *
- *  This script is distributed in the hope that it will be useful,
- *  but WITHOUT ANY WARRANTY; without even the implied warranty of
- *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
- *  GNU General Public License for more details.
- *
- *  This copyright notice MUST APPEAR in all copies of the script!
- ***************************************************************/
-
-class RoomMappingRepository extends AbstractRepository
-{}

public/typo3conf/ext/ep_products/Classes/EpTeam/ApiClient.php

@@ -0,0 +1,244 @@
+<?php
+
+namespace EP\EpProducts\EpTeam;
+
+use Psr\Log\LoggerAwareInterface;
+use Psr\Log\LoggerAwareTrait;
+use Symfony\Component\HttpClient\HttpClient;
+use Symfony\Component\HttpFoundation\Response;
+use Symfony\Contracts\HttpClient\Exception\TransportExceptionInterface;
+use Symfony\Contracts\HttpClient\HttpClientInterface;
+use Symfony\Contracts\HttpClient\ResponseInterface;
+use TYPO3\CMS\Core\Configuration\ExtensionConfiguration;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+
+/**
+ * The MyE&P Team application (Symfony). Separate from EP\EpProducts\MyEP\ApiClient on purpose:
+ * this is a different application on its own host, authenticated with a shared key in a header
+ * instead of the OAuth client-credentials flow MyE&P uses, so it shares neither the base URI nor
+ * the token handling.
+ */
+class ApiClient implements LoggerAwareInterface
+{
+    use LoggerAwareTrait;
+
+    /**
+     * Applied when extension configuration does not override them. Seconds.
+     */
+    private const DEFAULT_TIMEOUT = 5;
+    private const DEFAULT_MAX_DURATION = 15;
+
+    /**
+     * Status codes the endpoint answers a stored submission with. A conflict is included for the
+     * dedupe the team application may add later - it is not returned today - because a
+     * double-clicked submit button is not something to report.
+     */
+    private const ACCEPTED_STATUS_CODES = [
+        Response::HTTP_OK,
+        Response::HTTP_CREATED,
+        Response::HTTP_ACCEPTED,
+        Response::HTTP_NO_CONTENT,
+        Response::HTTP_CONFLICT,
+    ];
+
+    /**
+     * How much of a rejected response is carried into the exception message. A 400 names the
+     * offending field in its body, which is the only way to tell from a log why a submission
+     * was refused.
+     */
+    private const ERROR_BODY_EXCERPT_LENGTH = 500;
+
+    /**
+     * Shared, like the MyE&P client: Symfony's CurlHttpClient keeps its connection pool and TLS
+     * session cache per instance. The API key is a constant, so unlike a bearer token it can be
+     * a client default header and the instance can live as long as the request.
+     */
+    private static ?HttpClientInterface $httpClient = null;
+
+    private ?array $configuration = null;
+
+    /**
+     * Posts a submitted TYPO3 form to POST /api/application-forms.
+     *
+     * @throws ApiException
+     */
+    public function submitApplicationForm(array $payload): void
+    {
+        $uri = 'api/application-forms';
+
+        // 'json' also sets the Content-Type the endpoint requires - without it the body is not
+        // read as JSON and the answer is a 400.
+        $response = $this->request('POST', $uri, [
+            'json' => $payload,
+        ]);
+
+        $statusCode = $this->readStatusCode($response, 'POST', $uri);
+
+        if (false === in_array($statusCode, self::ACCEPTED_STATUS_CODES, true)) {
+            $message = sprintf(
+                'EP Team API returned unexpected status %d for POST %s: %s',
+                $statusCode,
+                $uri,
+                $this->readErrorBody($response)
+            );
+            $this->logWarning($message);
+
+            throw new ApiException($message, $statusCode);
+        }
+
+        $this->logAcceptedSubmission($response, $payload);
+    }
+
+    /**
+     * @throws ApiException
+     */
+    private function request(string $method, string $uri, array $options): ResponseInterface
+    {
+        try {
+            return $this->getHttpClient()->request($method, $uri, $options);
+        } catch (TransportExceptionInterface $e) {
+            $message = sprintf('EP Team API transport error for %s %s: %s', $method, $uri, $e->getMessage());
+            $this->logError($message, ['exception' => $e]);
+
+            throw new ApiException($message, 0, $e);
+        }
+    }
+
+    /**
+     * Reading the status completes the transfer, so this is also what turns the lazy response
+     * returned by the client into a finished request.
+     *
+     * @throws ApiException
+     */
+    private function readStatusCode(ResponseInterface $response, string $method, string $uri): int
+    {
+        try {
+            return $response->getStatusCode();
+        } catch (TransportExceptionInterface $e) {
+            $message = sprintf('EP Team API transport error while reading status for %s %s: %s', $method, $uri, $e->getMessage());
+            $this->logError($message, ['exception' => $e]);
+
+            throw new ApiException($message, 0, $e);
+        }
+    }
+
+    private function readErrorBody(ResponseInterface $response): string
+    {
+        try {
+            $body = trim($response->getContent(false));
+        } catch (TransportExceptionInterface $e) {
+            return '<no response body>';
+        }
+
+        if ('' === $body) {
+            return '<empty response body>';
+        }
+
+        if (mb_strlen($body) > self::ERROR_BODY_EXCERPT_LENGTH) {
+            $body = mb_substr($body, 0, self::ERROR_BODY_EXCERPT_LENGTH) . '…';
+        }
+
+        return $body;
+    }
+
+    /**
+     * The submission uuid the endpoint returns is what makes a support question ("did our
+     * application arrive?") answerable from the TYPO3 log alone. Reading the body also drains
+     * the response, which returns the connection to the pool instead of cancelling the transfer.
+     * Deliberately without any of the submitted values: these payloads are personal data.
+     */
+    private function logAcceptedSubmission(ResponseInterface $response, array $payload): void
+    {
+        try {
+            $data = $response->toArray(false);
+        } catch (\Throwable $e) {
+            // A body that is absent (204) or not JSON costs nothing here - the submission is
+            // stored either way, which the asserted status has already established.
+            return;
+        }
+
+        if (null !== $this->logger) {
+            $this->logger->info('Application form submission accepted by the EP Team API.', [
+                'form' => $payload['form'] ?? null,
+                'pageUid' => $payload['pageUid'] ?? null,
+                'uuid' => $data['uuid'] ?? null,
+            ]);
+        }
+    }
+
+    /**
+     * @throws ApiException
+     */
+    private function getHttpClient(): HttpClientInterface
+    {
+        if (null !== static::$httpClient) {
+            return static::$httpClient;
+        }
+
+        $config = $this->getConfiguration();
+        $baseUrl = trim((string)($config['epTeamApiBaseUrl'] ?? ''));
+        $apiKey = trim((string)($config['epTeamApiKey'] ?? ''));
+
+        if ('' === $baseUrl) {
+            throw new ApiException('EP Team API base URL is not configured.');
+        }
+        if ('' === $apiKey) {
+            throw new ApiException('EP Team API key is not configured.');
+        }
+        if (0 !== strpos($baseUrl, 'https://')) {
+            // The application answers an http request with a 301 to the https URL, and this
+            // client does not follow redirects, so a plain http base URL fails every submission.
+            $this->logWarning(sprintf('EP Team API base URL is not https (%s); submissions will fail on the redirect.', $baseUrl));
+        }
+
+        $options = [
+            'headers' => [
+                'X-Api-Key' => $apiKey,
+            ],
+        ];
+
+        // Without these the client falls back to PHP's default_socket_timeout (commonly 60s),
+        // so a stalled API pins a PHP worker for a minute per request - and this call happens
+        // inside the visitor's form submission, with the visitor waiting for it. The defaults
+        // live in code rather than in ext_conf_template.txt: ExtensionConfiguration::get()
+        // returns the stored configuration verbatim and only syncs the template when an
+        // extension has no configuration at all, so a newly added template key is absent until
+        // someone saves extension configuration by hand. Falling back to 0 there would silently
+        // mean "no timeout" - the opposite of what this guard is for. An explicit 0 still
+        // disables.
+        $timeout = (int)($config['epTeamApiTimeout'] ?? self::DEFAULT_TIMEOUT);
+        if ($timeout > 0) {
+            $options['timeout'] = $timeout;
+        }
+        $maxDuration = (int)($config['epTeamApiMaxDuration'] ?? self::DEFAULT_MAX_DURATION);
+        if ($maxDuration > 0) {
+            $options['max_duration'] = $maxDuration;
+        }
+
+        return static::$httpClient = HttpClient::createForBaseUri(rtrim($baseUrl, '/') . '/', $options);
+    }
+
+    private function getConfiguration(): array
+    {
+        if (null === $this->configuration) {
+            $this->configuration = GeneralUtility::makeInstance(ExtensionConfiguration::class)
+                ->get('ep_products');
+        }
+
+        return $this->configuration;
+    }
+
+    private function logError(string $message, array $context = []): void
+    {
+        if (null !== $this->logger) {
+            $this->logger->error($message, $context);
+        }
+    }
+
+    private function logWarning(string $message, array $context = []): void
+    {
+        if (null !== $this->logger) {
+            $this->logger->warning($message, $context);
+        }
+    }
+}

public/typo3conf/ext/ep_products/Classes/EpTeam/ApiException.php

@@ -0,0 +1,7 @@
+<?php
+
+namespace EP\EpProducts\EpTeam;
+
+class ApiException extends \RuntimeException
+{
+}

public/typo3conf/ext/ep_products/Classes/MyEP/ApiClient.php

@@ -49,8 +49,22 @@ class ApiClient implements LoggerAwareInterface
      */
     private const ACCESS_TOKEN_DEFAULT_TTL = 300;
 
+    /**
+     * Status codes that mean the token was rejected rather than the request being wrong.
+     */
+    private const UNAUTHORIZED_STATUS_CODES = [Response::HTTP_UNAUTHORIZED, Response::HTTP_FORBIDDEN];
+
     private static ?AccessToken $accessToken = null;
 
+    /**
+     * Shared on purpose. Symfony's CurlHttpClient keeps its connection pool and TLS session
+     * cache in a CurlClientState owned by the instance, so building a client per call throws
+     * both away and forces a fresh DNS lookup, TCP connect and TLS handshake every time -
+     * TravelinfoController alone makes two calls per page render. The bearer token is passed
+     * per request rather than as a client default so one instance can outlive one token.
+     */
+    private static ?HttpClientInterface $httpClient = null;
+
     private ?FrontendInterface $cache = null;
 
     private ?array $configuration = null;
@@ -100,7 +114,10 @@ class ApiClient implements LoggerAwareInterface
             'json' => $addressData,
         ]);
 
-        $this->assertStatusCode($response, [Response::HTTP_OK, Response::HTTP_CREATED, Response::HTTP_ACCEPTED, Response::HTTP_NO_CONTENT], 'POST', 'contactform');
+        // A conflict means the address is already registered, which is the normal answer to a
+        // resubmitted contact form and not worth reporting.
+        $this->assertStatusCode($response, [Response::HTTP_OK, Response::HTTP_CREATED, Response::HTTP_ACCEPTED, Response::HTTP_NO_CONTENT, Response::HTTP_CONFLICT], 'POST', 'contactform');
+        $this->drainResponse($response);
     }
 
     /**
@@ -183,6 +200,30 @@ class ApiClient implements LoggerAwareInterface
      */
     private function request(string $method, string $uri, array $options = []): ResponseInterface
     {
+        $response = $this->sendRequest($method, $uri, $options);
+
+        if (false === in_array($this->readStatusCode($response, $method, $uri), self::UNAUTHORIZED_STATUS_CODES, true)) {
+            return $response;
+        }
+
+        // The token outlives a single PHP request, so one the API has stopped accepting - after
+        // a MyEP restart or a revoked client - would keep failing every call for the rest of its
+        // cached lifetime unless it is actively discarded here.
+        $this->logWarning(sprintf('MyEP API rejected the cached access token for %s %s, re-authenticating once', $method, $uri));
+        $this->discardAccessToken();
+
+        return $this->sendRequest($method, $uri, $options);
+    }
+
+    /**
+     * @throws ApiException
+     */
+    private function sendRequest(string $method, string $uri, array $options): ResponseInterface
+    {
+        // Resolved here rather than baked into the client's default options so that the shared
+        // client survives a token change, and so the retry above picks up the fresh token.
+        $options['auth_bearer'] = $this->getAccessToken($this->getConfiguration())->getToken();
+
         try {
             return $this->getHttpClient()->request($method, $uri, $options);
         } catch (TransportExceptionInterface $e) {
@@ -199,13 +240,7 @@ class ApiClient implements LoggerAwareInterface
      */
     private function assertStatusCode(ResponseInterface $response, array $expectedStatusCodes, string $method, string $uri): void
     {
-        try {
+        $statusCode = $this->readStatusCode($response, $method, $uri);
-            $statusCode = $response->getStatusCode();
-        } catch (TransportExceptionInterface $e) {
-            $message = sprintf('MyEP API transport error while reading status for %s %s: %s', $method, $uri, $e->getMessage());
-            $this->logError($message, ['exception' => $e]);
-            throw new ApiException($message, 0, $e);
-        }
 
         if (true === in_array($statusCode, $expectedStatusCodes, true)) {
             return;
@@ -217,6 +252,39 @@ class ApiClient implements LoggerAwareInterface
         throw new ApiException($message, $statusCode);
     }
 
+    /**
+     * Reading the status completes the transfer, so this is also what turns the lazy response
+     * returned by the client into a finished request. Symfony keeps the status on the response,
+     * so calling this twice costs nothing.
+     *
+     * @throws ApiException
+     */
+    private function readStatusCode(ResponseInterface $response, string $method, string $uri): int
+    {
+        try {
+            return $response->getStatusCode();
+        } catch (TransportExceptionInterface $e) {
+            $message = sprintf('MyEP API transport error while reading status for %s %s: %s', $method, $uri, $e->getMessage());
+            $this->logError($message, ['exception' => $e]);
+            throw new ApiException($message, 0, $e);
+        }
+    }
+
+    /**
+     * Reads and discards a body nobody else is going to look at. Destroying an unconsumed
+     * response cancels the transfer, which closes the connection instead of returning it to
+     * the pool, so the next call would have to handshake again.
+     */
+    private function drainResponse(ResponseInterface $response): void
+    {
+        try {
+            $response->getContent(false);
+        } catch (TransportExceptionInterface $e) {
+            // The status has already been asserted, so a failure here costs nothing but the
+            // connection reuse this method exists for.
+        }
+    }
+
     /**
      * @throws ApiException
      */
@@ -237,13 +305,13 @@ class ApiClient implements LoggerAwareInterface
 
     private function getHttpClient(): HttpClientInterface
     {
+        if (null !== static::$httpClient) {
+            return static::$httpClient;
+        }
+
         $config = $this->getConfiguration();
 
-        static::$accessToken = $this->getAccessToken($config);
+        $options = [];
-
-        $options = [
-            'auth_bearer' => static::$accessToken->getToken(),
-        ];
 
         // Without these the client falls back to PHP's default_socket_timeout (commonly 60s),
         // so a stalled API pins a PHP worker for a minute per request. The defaults live in
@@ -261,7 +329,7 @@ class ApiClient implements LoggerAwareInterface
             $options['max_duration'] = $maxDuration;
         }
 
-        return HttpClient::createForBaseUri($config['myEpApiBaseUrl'], $options);
+        return static::$httpClient = HttpClient::createForBaseUri($config['myEpApiBaseUrl'], $options);
     }
 
     /**
@@ -296,7 +364,7 @@ class ApiClient implements LoggerAwareInterface
      */
     private function getAccessToken(array $config): AccessToken
     {
-        if (null !== static::$accessToken && false === static::$accessToken->hasExpired()) {
+        if (true === $this->isTokenUsable(static::$accessToken)) {
             return static::$accessToken;
         }
 
@@ -305,7 +373,7 @@ class ApiClient implements LoggerAwareInterface
         $cachedToken = $this->getCache()->get(self::ACCESS_TOKEN_CACHE_IDENTIFIER);
         if (is_array($cachedToken) && isset($cachedToken['access_token'])) {
             $token = new AccessToken($cachedToken);
-            if (false === $token->hasExpired()) {
+            if (true === $this->isTokenUsable($token)) {
                 static::$accessToken = $token;
 
                 return static::$accessToken;
@@ -313,7 +381,7 @@ class ApiClient implements LoggerAwareInterface
         }
 
         try {
-            static::$accessToken = $this->getProvider($config)->getAccessToken('client_credentials');
+            static::$accessToken = $this->normalizeToken($this->getProvider($config)->getAccessToken('client_credentials'));
             $this->cacheAccessToken(static::$accessToken);
         } catch (IdentityProviderException $e) {
             $message = sprintf('MyEP OAuth token request failed: %s', $e->getMessage());
@@ -332,16 +400,53 @@ class ApiClient implements LoggerAwareInterface
         return static::$accessToken;
     }
 
-    private function cacheAccessToken(AccessToken $token): void
+    /**
+     * AccessToken::hasExpired() throws for a token that reports no expiry, so it cannot be used
+     * as the check - a token without one is simply treated as unusable and replaced. The same
+     * margin as the cache lifetime is applied on read as well, so a token cannot lapse between
+     * this check and the API call that uses it, whichever node wrote the cache entry.
+     */
+    private function isTokenUsable(?AccessToken $token): bool
     {
+        if (null === $token) {
+            return false;
+        }
+
         $expires = $token->getExpires();
 
         if (null === $expires) {
-            $lifetime = self::ACCESS_TOKEN_DEFAULT_TTL;
+            return false;
-        } else {
-            $lifetime = $expires - time() - self::ACCESS_TOKEN_EXPIRY_MARGIN;
         }
 
+        return $expires - self::ACCESS_TOKEN_EXPIRY_MARGIN > time();
+    }
+
+    /**
+     * A token that reports no expiry cannot be validated on read - isTokenUsable() rejects it
+     * and AccessToken::hasExpired() throws for it - so it is given the fallback lifetime here,
+     * once, and the rest of the class can treat every token the same way.
+     */
+    private function normalizeToken(AccessToken $token): AccessToken
+    {
+        if (null !== $token->getExpires()) {
+            return $token;
+        }
+
+        return new AccessToken($token->jsonSerialize() + ['expires_in' => self::ACCESS_TOKEN_DEFAULT_TTL]);
+    }
+
+    private function discardAccessToken(): void
+    {
+        static::$accessToken = null;
+        $this->getCache()->remove(self::ACCESS_TOKEN_CACHE_IDENTIFIER);
+    }
+
+    private function cacheAccessToken(AccessToken $token): void
+    {
+        // normalizeToken() has already given a token without a reported expiry the fallback
+        // lifetime, so there is always a real expiry to subtract the margin from here.
+        $lifetime = $token->getExpires() - time() - self::ACCESS_TOKEN_EXPIRY_MARGIN;
+
         if ($lifetime <= 0) {
             return;
         }

public/typo3conf/ext/ep_products/Classes/Service/DateImportService.php

@@ -60,11 +60,6 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
      */
     protected $pid = 0;
 
-    /**
-     * @var array
-     */
-    protected $roomMappings = [];
-
     /**
      * @var array
      */
@@ -90,6 +85,11 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
      */
     protected $importSourceFactory;
 
+    /**
+     * @var RoomTypeResolver
+     */
+    protected $roomTypeResolver;
+
     /**
      * @var array
      */
@@ -101,15 +101,18 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
      * @param ConfigurationManagerInterface $configurationManager
      * @param CacheService $cacheService
      * @param ProductImportSourceFactory $importSourceFactory
+     * @param RoomTypeResolver $roomTypeResolver
      */
     public function __construct(
         ConfigurationManagerInterface $configurationManager,
         CacheService $cacheService,
-        ProductImportSourceFactory $importSourceFactory
+        ProductImportSourceFactory $importSourceFactory,
+        RoomTypeResolver $roomTypeResolver
     ) {
         $this->configurationManager = $configurationManager;
         $this->cacheService = $cacheService;
         $this->importSourceFactory = $importSourceFactory;
+        $this->roomTypeResolver = $roomTypeResolver;
 
         $settings = GeneralUtility::removeDotsFromTS(
             $this->configurationManager->getConfiguration(ConfigurationManagerInterface::CONFIGURATION_TYPE_FULL_TYPOSCRIPT)
@@ -130,7 +133,6 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
     public function import($path): int
     {
         $this->db = $this->getDbConnection();
-        $this->getRoomMappings();
         $this->getHotelMappings();
         $this->importPickups($path);
         $this->createTempTables();
@@ -594,13 +596,9 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
                 continue;
             }
 
-            $roomTypeKey = mb_strtolower($code);
+            $label = (string) $roomXml->attributes()['zimmertext'];
-            if (array_key_exists($roomTypeKey, $this->roomMappings)) {
+            $roomMinPax = (int) $roomXml->attributes()['MinPax'];
-                $roomType = $this->roomMappings[$roomTypeKey];
+            $pax = (int) $roomXml->attributes()['MaxPax'];
-            } else {
-                $this->logger->warning('room type not found', ['code' => $code]);
-                continue;
-            }
 
             $available = (int) $roomXml->attributes()['verfuegbar'];
             $price = (int) $roomXml->attributes()['preis'];
@@ -610,12 +608,23 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
                 continue;
             }
 
-            $pax = (int) $roomXml->attributes()['MinPax'];
+            $roomType = $this->roomTypeResolver->resolve($code, $label, $pax, $roomMinPax);
-            if (0 === $minPax || $pax < $minPax) {
+
-                $minPax = $pax;
+            if ($pax < 1 && $roomMinPax < 1) {
+                $this->logger->warning('room without occupancy', ['code' => $code, 'zimmertext' => $label]);
+            }
+
+            if ($this->roomTypeResolver->needsReview($code, $label, $pax)) {
+                $this->logger->warning(
+                    'single-occupancy room without single-use marker',
+                    ['code' => $code, 'zimmertext' => $label]
+                );
+            }
+
+            if (0 === $minPax || $roomMinPax < $minPax) {
+                $minPax = $roomMinPax;
             }
 
-            $pax = (int) $roomXml->attributes()['MaxPax'];
             $availableTotal += $available * $pax;
 
             // Determine lowest price of available rooms
@@ -648,7 +657,7 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
                 'bus_pro_id' => (int) $roomXml->attributes()['idbuspro_zimmer'],
                 'code' => $code,
                 'type' => $roomType,
-                'name' => (string) $roomXml->attributes()['zimmertext'],
+                'name' => $label,
                 'pax' => $pax,
                 'nights' => (int) $roomXml->attributes()['naechte'],
                 'price' => $price,
@@ -791,16 +800,6 @@ class DateImportService implements SingletonInterface, LoggerAwareInterface
         }
     }
 
-    protected function getRoomMappings(): void
-    {
-        $sql = 'SELECT code, type FROM tx_epproducts_domain_model_roommapping WHERE deleted = 0 AND hidden = 0';
-        $roomMappings = $this->db->fetchAllAssociative($sql);
-        foreach ($roomMappings as $mapping) {
-            $key = trim(mb_strtolower($mapping['code']));
-            $this->roomMappings[$key] = $mapping['type'];
-        }
-    }
-
     protected function getHotelMappings(): void
     {
         $sql = '

public/typo3conf/ext/ep_products/Classes/Service/FilterService.php

@@ -3,6 +3,7 @@
 namespace EP\EpProducts\Service;
 
 use EP\EpProducts\Domain\Model\Dto\FilterOptions;
+use EP\EpProducts\Domain\Model\Room;
 use EP\EpProducts\Domain\Model\SearchResult;
 use Symfony\Component\OptionsResolver\Options;
 use Symfony\Component\OptionsResolver\OptionsResolver;
@@ -212,6 +213,12 @@ class FilterService implements SingletonInterface
                     }
                 }
                 foreach ($item['rooms'] as $roomType) {
+                    // Type 0 is not a room (Baby) and must never become a filter option:
+                    // it has no label, so it would render as an empty checkbox and leave
+                    // a hole in the option list.
+                    if ((int) $roomType === Room::ROOM_TYPE_UNCLASSIFIED) {
+                        continue;
+                    }
                     if (!\in_array($roomType, $roomTypes, false)) {
                         $roomTypes[] = $roomType;
                     }

public/typo3conf/ext/ep_products/Classes/Service/FilterSettingsEncoder.php

@@ -76,11 +76,28 @@ class FilterSettingsEncoder
         return implode('|', $encoded);
     }
 
+    /**
+     * Decodes an encoded filter settings string.
+     *
+     * The format is strictly positional, so a string whose field count does not
+     * match the mapping cannot be interpreted: every field after a missing one
+     * would be read into the wrong setting. Such input is rejected outright
+     * rather than silently producing a shifted - and therefore wrong - result.
+     *
+     * @param string $data
+     * @return array the decoded settings, or an empty array if $data is malformed
+     */
     public function decode(string $data): array
     {
-        $decoded = [];
+        $mapping = $this->getMapping();
         $values = explode('|', $data);
-        foreach ($this->getMapping() as $index => $property)
+
+        if (count($values) !== count($mapping)) {
+            return [];
+        }
+
+        $decoded = [];
+        foreach ($mapping as $index => $property)
         {
             [$name, $type] = $property;
             $value = $values[$index];

public/typo3conf/ext/ep_products/Classes/Service/RoomTypeResolver.php

@@ -0,0 +1,129 @@
+<?php
+
+namespace EP\EpProducts\Service;
+
+/***************************************************************
+ *
+ *  Copyright notice
+ *
+ *  (c) 2016 Björn Fromme <[email protected]>, dreipunktnull
+ *
+ *  All rights reserved
+ *
+ *  This script is part of the TYPO3 project. The TYPO3 project is
+ *  free software; you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation; either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  The GNU General Public License can be found at
+ *  http://www.gnu.org/copyleft/gpl.html.
+ *
+ *  This script is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  This copyright notice MUST APPEAR in all copies of the script!
+ ***************************************************************/
+
+use EP\EpProducts\Domain\Model\Room;
+
+/**
+ * Derives the room type from the data each <preis> element carries.
+ *
+ * Replaces the former tx_epproducts_domain_model_roommapping lookup: zimmercode is
+ * neither unique per room nor a function of room type, so a code-keyed table cannot
+ * classify this data. MaxPax is the advertised occupancy and is present on every row.
+ */
+class RoomTypeResolver
+{
+    /**
+     * Phrases in zimmertext that mark a bed shared with other customers.
+     *
+     * @var array
+     */
+    const LABEL_PATTERNS_WITH_OTHERS = [
+        'bett im',
+        'mit ander',
+    ];
+
+    /**
+     * Phrases in zimmertext that mark a deliberate single use of a larger room.
+     *
+     * @var array
+     */
+    const LABEL_PATTERNS_SINGLE_USE = [
+        'einzel',
+        '1 person',
+    ];
+
+    /**
+     * @param string $code zimmercode
+     * @param string $label zimmertext
+     * @param int $maxPax MaxPax
+     * @param int $minPax MinPax
+     * @return int one of the Room::ROOM_TYPE_* constants
+     */
+    public function resolve(string $code, string $label, int $maxPax, int $minPax): int
+    {
+        // Not a room: "Babypreis für 0-2 Jährige". Kept in the date record for its
+        // price and availability, but hidden from the filter.
+        if ($code === DateImportService::CODE_BABYROOM) {
+            return Room::ROOM_TYPE_UNCLASSIFIED;
+        }
+
+        if ($this->matchesAny($label, static::LABEL_PATTERNS_WITH_OTHERS)) {
+            return Room::ROOM_TYPE_WITH_OTHERS;
+        }
+
+        $pax = $maxPax > 0 ? $maxPax : $minPax;
+
+        if ($pax >= 1) {
+            // Type numbering is chosen so that type === pax for pax 1-8.
+            return $pax >= 9 ? Room::ROOM_TYPE_FOR_NINE_PLUS : $pax;
+        }
+
+        // No usable occupancy - should never happen on current data, the caller logs it.
+        return Room::ROOM_TYPE_WITH_OTHERS;
+    }
+
+    /**
+     * Tripwire for an under-matching label pattern: a row classified as a single room
+     * whose label carries no single-use marker is most likely a shared bed phrased in
+     * a way LABEL_PATTERNS_WITH_OTHERS does not yet cover.
+     *
+     * @param string $code zimmercode
+     * @param string $label zimmertext
+     * @param int $maxPax MaxPax
+     * @return bool
+     */
+    public function needsReview(string $code, string $label, int $maxPax): bool
+    {
+        if ($this->resolve($code, $label, $maxPax, $maxPax) !== Room::ROOM_TYPE_FOR_ONE) {
+            return false;
+        }
+
+        if ($maxPax !== 1) {
+            return false;
+        }
+
+        return !$this->matchesAny($label, static::LABEL_PATTERNS_SINGLE_USE);
+    }
+
+    /**
+     * @param string $label
+     * @param array $patterns
+     * @return bool
+     */
+    protected function matchesAny(string $label, array $patterns): bool
+    {
+        foreach ($patterns as $pattern) {
+            if (mb_strpos(mb_strtolower($label), mb_strtolower($pattern)) !== false) {
+                return true;
+            }
+        }
+
+        return false;
+    }
+}

public/typo3conf/ext/ep_products/Classes/Service/SearchResultService.php

@@ -31,6 +31,7 @@ use EP\EpProducts\Domain\Model\SearchResult;
 use EP\EpProducts\Domain\Repository\ProductRepository;
 use Symfony\Component\OptionsResolver\OptionsResolver;
 use TYPO3\CMS\Core\SingletonInterface;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
 
 class SearchResultService implements SingletonInterface
 {
@@ -216,8 +217,10 @@ class SearchResultService implements SingletonInterface
                 $item['filterMetadata']['boardTypes'][] = $boardType;
             }
 
-            if (isset($row['roomType']) && !\in_array($row['roomType'], $item['rooms'], false)) {
+            foreach (GeneralUtility::trimExplode(',', (string) ($row['roomTypes'] ?? ''), true) as $roomType) {
-                $item['rooms'][] = $row['roomType'];
+                if (!\in_array($roomType, $item['rooms'], false)) {
+                    $item['rooms'][] = $roomType;
+                }
             }
 
             if (!\in_array($row['nights'], $item['nights'], false)) {

public/typo3conf/ext/ep_products/Classes/Service/SnowreportImportService.php

@@ -47,10 +47,12 @@ class SnowreportImportService implements SingletonInterface
     const XML_FILE_URL = 'https://www.skiresort-service.com/xml-feed/';
 
     /**
-     * Connection and read timeout for the feed download, in seconds.
+     * Connection and read timeout for the feed download, in seconds. A healthy response to this
+     * endpoint arrives in well under a second, so the ceiling is kept low enough that an outage on
+     * the vendor side fails visibly instead of stalling the scheduler task or the backend request.
      */
-    const HTTP_CONNECT_TIMEOUT = 10;
+    const HTTP_CONNECT_TIMEOUT = 5;
-    const HTTP_TIMEOUT = 120;
+    const HTTP_TIMEOUT = 30;
 
     /**
      * @var array

public/typo3conf/ext/ep_products/Configuration/TCA/tx_epproducts_domain_model_roommapping.php

@@ -1,144 +0,0 @@
-<?php
-return [
-	'ctrl' => [
-		'title'	=> 'LLL:EXT:ep_products/Resources/Private/Language/locallang.xlf:tx_epproducts_domain_model_roommapping',
-		'label' => 'code',
-		'prependAtCopy' => '[COPY %s]',
-		'default_sortby' => 'ORDER BY code',
-		'tstamp' => 'tstamp',
-		'crdate' => 'crdate',
-		'cruser_id' => 'cruser_id',
-		'dividers2tabs' => true,
-		'versioningWS' => false,
-		'languageField' => 'sys_language_uid',
-		'transOrigPointerField' => 'l10n_parent',
-		'transOrigDiffSourceField' => 'l10n_diffsource',
-		'delete' => 'deleted',
-		'enablecolumns' => [
-			'disabled' => 'hidden',
-			'starttime' => 'starttime',
-			'endtime' => 'endtime',
-		],
-		'searchFields' => 'code',
-        'iconfile' => 'EXT:ep_theme/Resources/Public/images/icon_ce.svg',
-	],
-	'types' => [
-		'1' => ['showitem' => 'code, type'],
-	],
-	'palettes' => [
-		'1' => ['showitem' => ''],
-	],
-	'columns' => [
-
-		'sys_language_uid' => [
-			'exclude' => 0,
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.language',
-			'config' => [
-				'type' => 'select',
-				'default' => 0,
-				'renderType' => 'selectSingle',
-				'foreign_table' => 'sys_language',
-				'foreign_table_where' => 'ORDER BY sys_language.title',
-				'items' => [
-					['LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.allLanguages', -1],
-					['LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.default_value', 0]
-				],
-			],
-		],
-		'l10n_parent' => [
-			'displayCond' => 'FIELD:sys_language_uid:>:0',
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.l18n_parent',
-			'config' => [
-				'type' => 'select',
-				'default' => 0,
-				'renderType' => 'selectSingle',
-				'items' => [
-					['', 0],
-				],
-				'foreign_table' => 'tx_epproducts_domain_model_roommapping',
-				'foreign_table_where' => 'AND tx_epproducts_domain_model_roommapping.pid=###CURRENT_PID### AND tx_epproducts_domain_model_roommapping.sys_language_uid IN (-1,0)',
-			],
-		],
-		'l10n_diffsource' => [
-			'config' => [
-				'type' => 'passthrough',
-			],
-		],
-
-		't3ver_label' => [
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.versionLabel',
-			'config' => [
-				'type' => 'input',
-				'size' => 30,
-				'max' => 255,
-			]
-		],
-
-		'hidden' => [
-			'exclude' => 0,
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.hidden',
-			'config' => [
-				'type' => 'check',
-			],
-		],
-		'starttime' => [
-			'exclude' => 0,
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.starttime',
-			'config' => [
-				'type' => 'input',
-				'size' => 13,
-				'eval' => 'datetime',
-				'checkbox' => 0,
-				'default' => 0,
-                'behaviour' => [
-                    'allowLanguageSynchronization' => true,
-                ],
-                'renderType' => 'inputDateTime',
-			],
-		],
-		'endtime' => [
-			'exclude' => 0,
-			'label' => 'LLL:EXT:core/Resources/Private/Language/locallang_general.xlf:LGL.endtime',
-			'config' => [
-				'type' => 'input',
-				'size' => 13,
-				'eval' => 'datetime',
-				'checkbox' => 0,
-				'default' => 0,
-                'behaviour' => [
-                    'allowLanguageSynchronization' => true,
-                ],
-                'renderType' => 'inputDateTime',
-			],
-		],
-
-		'code' => [
-			'exclude' => 0,
-			'label' => 'Code',
-			'config' => [
-				'type' => 'input',
-				'size' => 30,
-				'eval' => 'trim'
-			],
-		],
-		'type' => [
-			'exclude' => 0,
-			'label' => 'Typ',
-			'config' => [
-				'type' => 'select',
-				'renderType' => 'selectSingle',
-				'items' => [
-					['Einzelzimmer', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_FOR_ONE],
-					['Doppelzimmer und Apartm. f. 2 Pers.', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_FOR_TWO],
-					['Zimmer und Apartm. f. 3 Pers.', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_FOR_THREE],
-					['Zimmer und Apartm. f. 4 Pers.', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_FOR_FOUR],
-					['Zimmer und Apartm. mit Anderen', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_WITH_OTHERS],
-					['weitere Zimmer und Apartments', \EP\EpProducts\Domain\Model\Room::ROOM_TYPE_OTHER],
-				],
-				'size' => 1,
-				'minItems' => 1,
-				'maxItems' => 1
-			],
-		],
-	],
-];

public/typo3conf/ext/ep_products/Resources/Private/Language/locallang.xlf

@@ -39,9 +39,6 @@
 			<trans-unit id="tx_epproducts_domain_model_teammember">
 				<source>Mitarbeiter/Teamer</source>
 			</trans-unit>
-			<trans-unit id="tx_epproducts_domain_model_roommapping">
-				<source>Zimmermapping</source>
-			</trans-unit>
 			<trans-unit id="tx_epproducts_domain_model_journey">
 				<source>Anreise</source>
 			</trans-unit>

public/typo3conf/ext/ep_products/ext_conf_template.txt

@@ -40,6 +40,18 @@ bpnConnectApiTimeout = 5
 # cat=MyEpAPI; type=int; label=Bpn Connect API max total request duration in seconds (0 = unlimited)
 bpnConnectApiMaxDuration = 15
 
+# cat=EpTeamAPI; type=string; label=MyE&P Team base URL (https, e.g. https://team.ep-reisen.de) - receives application form submissions
+epTeamApiBaseUrl =
+
+# cat=EpTeamAPI; type=string; label=MyE&P Team application form API key (sent as X-Api-Key)
+epTeamApiKey =
+
+# cat=EpTeamAPI; type=int; label=MyE&P Team API inactivity timeout in seconds (0 = PHP default_socket_timeout)
+epTeamApiTimeout = 5
+
+# cat=EpTeamAPI; type=int; label=MyE&P Team API max total request duration in seconds (0 = unlimited)
+epTeamApiMaxDuration = 15
+
 # cat=SftpImport; type=options[Remote SFTP server=sftp,Local directory (fileadmin/xmlexport)=local]; label=Product/date import source
 productImportSource = sftp
 

public/typo3conf/ext/ep_products/ext_tables.sql

@@ -494,47 +494,6 @@ CREATE TABLE tx_epproducts_domain_model_room
     KEY constraints (date, type)
 );
 
-#
-# Table structure for table 'tx_epproducts_domain_model_roommapping'
-#
-CREATE TABLE tx_epproducts_domain_model_roommapping
-(
-
-    uid              int(11)                         NOT NULL auto_increment,
-    pid              int(11)             DEFAULT '0' NOT NULL,
-
-    code             varchar(255)        DEFAULT ''  NOT NULL,
-    type             int(11)             DEFAULT '0' NOT NULL,
-
-    tstamp           int(11) unsigned    DEFAULT '0' NOT NULL,
-    crdate           int(11) unsigned    DEFAULT '0' NOT NULL,
-    cruser_id        int(11) unsigned    DEFAULT '0' NOT NULL,
-    deleted          tinyint(4) unsigned DEFAULT '0' NOT NULL,
-    hidden           tinyint(4) unsigned DEFAULT '0' NOT NULL,
-    starttime        int(11) unsigned    DEFAULT '0' NOT NULL,
-    endtime          int(11) unsigned    DEFAULT '0' NOT NULL,
-
-    t3ver_oid        int(11)             DEFAULT '0' NOT NULL,
-    t3ver_id         int(11)             DEFAULT '0' NOT NULL,
-    t3ver_wsid       int(11)             DEFAULT '0' NOT NULL,
-    t3ver_label      varchar(255)        DEFAULT ''  NOT NULL,
-    t3ver_state      tinyint(4)          DEFAULT '0' NOT NULL,
-    t3ver_stage      int(11)             DEFAULT '0' NOT NULL,
-    t3ver_count      int(11)             DEFAULT '0' NOT NULL,
-    t3ver_tstamp     int(11)             DEFAULT '0' NOT NULL,
-    t3ver_move_id    int(11)             DEFAULT '0' NOT NULL,
-
-    sys_language_uid int(11)             DEFAULT '0' NOT NULL,
-    l10n_parent      int(11)             DEFAULT '0' NOT NULL,
-    l10n_diffsource  mediumblob,
-
-    PRIMARY KEY (uid),
-    KEY parent (pid),
-    KEY t3ver_oid (t3ver_oid, t3ver_wsid),
-    KEY language (l10n_parent, sys_language_uid)
-
-);
-
 #
 # Table structure for table 'tx_epproducts_domain_model_concept'
 #

public/typo3conf/ext/ep_theme/Classes/Form/AbstractMappedFinisher.php

@@ -4,25 +4,43 @@ namespace EP\EpTheme\Form;
 
 use TYPO3\CMS\Core\Log\LogManager;
 use TYPO3\CMS\Core\Utility\GeneralUtility;
+use TYPO3\CMS\Extbase\Domain\Model\FileReference;
 use TYPO3\CMS\Form\Domain\Finishers\AbstractFinisher;
 
 abstract class AbstractMappedFinisher extends AbstractFinisher
 {
-    protected function buildPayload(): array
+    /**
+     * Resolves the 'mapping' option into remote name => local form element identifier.
+     */
+    protected function parseMapping(): array
     {
-        $values = [];
+        $mappings = [];
-        $formValues = $this->finisherContext->getFormValues();
         $mappingOption = (string)$this->parseOption('mapping');
-        $mappings = GeneralUtility::trimExplode(',', $mappingOption, true);
 
-        foreach ($mappings as $mapping) {
+        foreach (GeneralUtility::trimExplode(',', $mappingOption, true) as $mapping) {
             $parts = GeneralUtility::trimExplode(':', $mapping, true, 2);
             if (2 !== count($parts)) {
                 continue;
             }
 
             [$remote, $local] = $parts;
-            if ('' === $remote || '' === $local || false === array_key_exists($local, $formValues)) {
+            if ('' === $remote || '' === $local) {
+                continue;
+            }
+
+            $mappings[$remote] = $local;
+        }
+
+        return $mappings;
+    }
+
+    protected function buildPayload(): array
+    {
+        $values = [];
+        $formValues = $this->finisherContext->getFormValues();
+
+        foreach ($this->parseMapping() as $remote => $local) {
+            if (false === array_key_exists($local, $formValues)) {
                 continue;
             }
 
@@ -32,6 +50,95 @@ abstract class AbstractMappedFinisher extends AbstractFinisher
         return $values;
     }
 
+    /**
+     * Every submitted value that the mapping does not already cover, keyed by the element label
+     * as the editor sees it in the form editor. Forms built in the backend use generated
+     * identifiers (text-1, singleselect-2, ...) that carry no meaning and cannot be renamed
+     * without breaking existing finisher options, so the label is the only stable description
+     * of what was asked.
+     *
+     * The label is taken from the form definition, not through TranslationService: a translated
+     * label would change the payload keys with the site language, and these keys are stored.
+     */
+    protected function buildLabeledValues(): array
+    {
+        $formValues = $this->finisherContext->getFormValues();
+        $skip = array_merge(
+            array_values($this->parseMapping()),
+            GeneralUtility::trimExplode(',', (string)$this->parseOption('exclude'), true)
+        );
+
+        // Keyed by identifier in form order, and contains only real form elements - iterating
+        // this instead of the form values keeps the collection in the order of the form and
+        // leaves out anything that is not an element the visitor filled in.
+        $elements = $this->finisherContext->getFormRuntime()->getFormDefinition()->getElements();
+
+        $collected = [];
+        foreach ($elements as $identifier => $element) {
+            if (true === in_array($identifier, $skip, true) || false === array_key_exists($identifier, $formValues)) {
+                continue;
+            }
+
+            $value = $this->normalizeValue($formValues[$identifier], $identifier);
+            if (null === $value || '' === $value || [] === $value) {
+                continue;
+            }
+
+            $label = trim($element->getLabel());
+            if ('' === $label) {
+                $label = $identifier;
+            }
+            if (true === array_key_exists($label, $collected)) {
+                $label .= ' (' . $identifier . ')';
+            }
+
+            $collected[$label] = $value;
+        }
+
+        return $collected;
+    }
+
+    /**
+     * @param mixed $value
+     *
+     * @return mixed null when the value has no JSON representation
+     */
+    protected function normalizeValue($value, string $identifier)
+    {
+        if (true === is_array($value)) {
+            $normalized = [];
+            foreach ($value as $item) {
+                $item = $this->normalizeValue($item, $identifier);
+                if (null !== $item && '' !== $item) {
+                    $normalized[] = $item;
+                }
+            }
+
+            return $normalized;
+        }
+
+        if ($value instanceof \DateTimeInterface) {
+            return $value->format('Y-m-d');
+        }
+
+        if ($value instanceof FileReference) {
+            $resource = $value->getOriginalResource();
+
+            return null !== $resource ? $resource->getName() : null;
+        }
+
+        if (true === is_object($value)) {
+            $this->logWarning('Form value skipped while collecting labeled values: unsupported type.', [
+                'element' => $identifier,
+                'class' => get_class($value),
+            ]);
+
+            return null;
+        }
+
+        return $value;
+    }
+
     protected function logWarning(string $message, array $context = []): void
     {
         GeneralUtility::makeInstance(LogManager::class)

public/typo3conf/ext/ep_theme/Classes/Form/ApplicationApiFinisher.php

@@ -0,0 +1,83 @@
+<?php
+
+namespace EP\EpTheme\Form;
+
+use EP\EpProducts\EpTeam\ApiClient;
+use TYPO3\CMS\Core\Site\SiteFinder;
+use TYPO3\CMS\Core\Utility\GeneralUtility;
+
+class ApplicationApiFinisher extends AbstractMappedFinisher
+{
+    /**
+     * @var ApiClient
+     */
+    protected $apiClient;
+
+    /**
+     * @param ApiClient $apiClient
+     */
+    public function injectApiClient(ApiClient $apiClient)
+    {
+        $this->apiClient = $apiClient;
+    }
+
+    protected function executeInternal()
+    {
+        try {
+            $payload = $this->buildPayload();
+            if ([] === $payload) {
+                $this->logWarning('Application form API finisher skipped: the mapping produced no values.');
+
+                return;
+            }
+
+            $formDefinition = $this->finisherContext->getFormRuntime()->getFormDefinition();
+            $formLabel = trim($formDefinition->getLabel());
+
+            $payload['form'] = $formDefinition->getIdentifier();
+            // The name the editor gave the form, so the receiving side can label a submission
+            // without keeping a list of identifiers. Taken from the definition rather than
+            // through TranslationService: a translated label would differ per site language.
+            $payload['formLabel'] = '' !== $formLabel ? $formLabel : $formDefinition->getIdentifier();
+            $payload['submittedAt'] = (new \DateTimeImmutable())->format(\DateTimeInterface::ATOM);
+            $payload = array_merge($payload, $this->resolvePageContext());
+            $payload['details'] = $this->buildLabeledValues();
+
+            $this->apiClient->submitApplicationForm($payload);
+        } catch (\Throwable $e) {
+            $this->logWarning('Application form API finisher request failed.', [
+                'exception' => $e,
+            ]);
+        }
+    }
+
+    /**
+     * The page the form was submitted from. The URL is generated through the site router in the
+     * visitor's language, the same way AddReferrerFinisher does it, so it is the page's canonical
+     * URL rather than the submit request with its form arguments attached.
+     */
+    private function resolvePageContext(): array
+    {
+        if (false === isset($GLOBALS['TSFE']) || 0 === (int)$GLOBALS['TSFE']->id) {
+            return [];
+        }
+
+        $pageUid = (int)$GLOBALS['TSFE']->id;
+        $context = ['pageUid' => $pageUid];
+
+        try {
+            $site = GeneralUtility::makeInstance(SiteFinder::class)->getSiteByPageId($pageUid);
+            $context['pageUrl'] = (string)$site->getRouter()->generateUri($pageUid, [
+                '_language' => $GLOBALS['TSFE']->getLanguage(),
+            ]);
+        } catch (\Throwable $e) {
+            // An unroutable page must not cost the submission, so the uid is sent without a URL.
+            $this->logWarning('Application form API finisher could not resolve the page URL.', [
+                'pageUid' => $pageUid,
+                'exception' => $e,
+            ]);
+        }
+
+        return $context;
+    }
+}

public/typo3conf/ext/ep_theme/Configuration/TypoScript/Extensions/EpProducts.typoscript

@@ -17,5 +17,8 @@ plugin.tx_epproducts {
         ratingWidgetLabel = {$plugin.tx_eptheme.settings.ratingWidgetLabel}
         skipassPageUid = {$plugin.tx_eptheme.settings.skipassPageUid}
         conceptsPageUid = {$plugin.tx_eptheme.settings.conceptsPageUid}
+        mapTileUrl = {$plugin.tx_eptheme.settings.mapTileUrl}
+        mapApiKey = {$plugin.tx_eptheme.settings.mapApiKey}
+        mapAttribution = {$plugin.tx_eptheme.settings.mapAttribution}
     }
 }

public/typo3conf/ext/ep_theme/Configuration/TypoScript/Extensions/FluidStyledContent.typoscript

@@ -7,5 +7,8 @@ lib.contentElement {
     settings < plugin.tx_eptheme.settings
     settings.themekey = {$plugin.tx_eptheme.settings.themekey}
     settings.defaultAjaxUid = {$plugin.tx_eptheme.settings.defaultAjaxUid}
+    settings.mapTileUrl = {$plugin.tx_eptheme.settings.mapTileUrl}
+    settings.mapApiKey = {$plugin.tx_eptheme.settings.mapApiKey}
+    settings.mapAttribution = {$plugin.tx_eptheme.settings.mapAttribution}
 }
 

public/typo3conf/ext/ep_theme/Configuration/TypoScript/Extensions/Replacer.typoscript

@@ -1,10 +1,20 @@
 config.tx_replacer {
     enable_regex = 1
+
+    # The quote character is captured rather than matched literally, because the
+    # @font-face block in Page/Main.typoscript writes its url() values with single
+    # quotes - anchoring on `"` alone would skip every font.
+    # typo3conf is scoped to ep_theme/Resources/Public on purpose: it keeps other
+    # extensions, Configuration/ and Resources/Private/ out of the CDN.
+    # The icon sprite is excluded: SVG <use href="...#icon"> may only reference a
+    # document from the same origin - browsers block an external sprite on the CDN
+    # host outright, and no CORS header on bunny.net changes that. It has to stay
+    # on the origin domain or every icon renders empty.
     search {
-        10 = /"\/?(fileadmin|typo3temp|uploads)/
+        10 = /(["'])\/?(fileadmin|typo3temp|uploads|typo3conf\/ext\/ep_theme\/Resources\/Public(?!\/images\/icons_sprite\.svg))/
     }
 
     replace {
-        10 = "https://cdn.ep-reisen.de/$1
+        10 = $1https://cdn.ep-reisen.de/$2
     }
 }

public/typo3conf/ext/ep_theme/Configuration/TypoScript/Extensions/Typo3Encore.typoscript

@@ -5,5 +5,6 @@ plugin.tx_typo3encore {
         builds {
             EpThemeConfig = EXT:ep_theme/Resources/Public
         }
+        preload.enable = 0
     }
 }

public/typo3conf/ext/ep_theme/Configuration/TypoScript/constants.typoscript

@@ -75,6 +75,13 @@ plugin.tx_eptheme {
 		# cat=eptheme/200/350; type=string; label='Corona Updates' page UID
 		coronaUpdatesPageUid =
 
+		# cat=eptheme/500/100; type=string; label=Map tile URL template (without apiKey)
+		mapTileUrl = https://api-eu.geoapify.com/v1/tile/osm-bright/{z}/{x}/{y}.png
+		# cat=eptheme/500/110; type=string; label=Map tile API key (Geoapify), restricted by referrer
+		mapApiKey =
+		# cat=eptheme/500/120; type=string; label=Map attribution (Geoapify and OpenStreetMap credits are both required)
+		mapAttribution = Powered by <a href="https://www.geoapify.com/">Geoapify</a> | &copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors
+
 		# cat=eptheme/400/100; type=string; label=Phone number general
 		phoneNumber = 0221 - 272 276 0
 		# cat=eptheme/400/110; type=string; label=Phone number WhatsApp

public/typo3conf/ext/ep_theme/Configuration/Yaml/BaseSetup.yaml

@@ -23,6 +23,8 @@ TYPO3:
           finishersDefinition:
             BpnApiFinisher:
               implementationClassName: 'EP\EpTheme\Form\BpnApiFinisher'
+            ApplicationApiFinisher:
+              implementationClassName: 'EP\EpTheme\Form\ApplicationApiFinisher'
             WebhookFinisher:
               implementationClassName: 'EP\EpTheme\Form\WebhookFinisher'
             AddReferrerFinisher:

public/typo3conf/ext/ep_theme/Configuration/Yaml/FormFinishersBackend.yaml

@@ -12,6 +12,9 @@ TYPO3:
                       1000:
                         value: 'BpnApiFinisher'
                         label: 'BusPro Finisher'
+                      1010:
+                        value: 'ApplicationApiFinisher'
+                        label: 'Application Finisher'
                       1050:
                         value: 'WebhookFinisher'
                         label: 'Webhook Finisher'
@@ -34,6 +37,25 @@ TYPO3:
                           propertyPath: 'options.mapping'
                           propertyValidators:
                             10: 'NotEmpty'
+                    1010:
+                      identifier: 'ApplicationApiFinisher'
+                      editors:
+                        __inheritances:
+                          10: 'TYPO3.CMS.Form.mixins.formElementMixins.BaseCollectionEditorsMixin'
+                        100:
+                          label: 'Application Finisher'
+                        110:
+                          identifier: 'mapping'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Mapping'
+                          propertyPath: 'options.mapping'
+                          propertyValidators:
+                            10: 'NotEmpty'
+                        120:
+                          identifier: 'exclude'
+                          templateName: 'Inspector-TextEditor'
+                          label: 'Exclude'
+                          propertyPath: 'options.exclude'
                     1050:
                       identifier: 'WebhookFinisher'
                       editors:
@@ -70,6 +92,13 @@ TYPO3:
                 predefinedDefaults:
                   options:
                     mapping: 'lastName:text-1,firstName:text-2,gender:singleselect-1,email:email-1,phone:telephone-1'
+            ApplicationApiFinisher:
+              formEditor:
+                iconIdentifier: 'form-finisher'
+                predefinedDefaults:
+                  options:
+                    mapping: 'firstName:text-1,lastName:text-2,email:email-1,phone:telephone-1'
+                    exclude: 'captcha,privacypolicyaccepted'
             WebhookFinisher:
               formEditor:
                 iconIdentifier: 'form-finisher'

public/typo3conf/ext/ep_theme/Configuration/Yaml/FormFinishersFrontend.yaml

@@ -11,6 +11,14 @@ TYPO3:
                 options:
                   identifier: 'BpnApiFinisher'
                   mapping: 'lastName:text-1,firstName:text-2,gender:singleselect-1,email:email-1,phone:telephone-1'
+            ApplicationApiFinisher:
+              implementationClassName: 'EP\EpTheme\Form\ApplicationApiFinisher'
+              formEditor:
+                label: 'Application Finisher'
+                options:
+                  identifier: 'ApplicationApiFinisher'
+                  mapping: 'firstName:text-1,lastName:text-2,email:email-1,phone:telephone-1'
+                  exclude: 'captcha,privacypolicyaccepted'
             WebhookFinisher:
               implementationClassName: 'EP\EpTheme\Form\WebhookFinisher'
               formEditor:

public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/controllers/osm_controller.js

@@ -9,6 +9,9 @@ export default class extends Controller {
         zoom: Number,
         externalLink: String,
         markers: Array,
+        tileUrl: String,
+        apiKey: String,
+        attribution: String,
     }
 
     connect() {
@@ -44,9 +47,21 @@ export default class extends Controller {
             }
             this.map.fitBounds(bounds)
         }
-        L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+        L.tileLayer(this.tileUrl(), {
             maxZoom: 19,
-            attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
+            // The site sends Referrer-Policy: same-origin, which strips the Referer on
+            // cross-origin requests. The tile provider needs it to match its key against
+            // the allowed-domain list, so widen the policy for tile requests only.
+            referrerPolicy: 'strict-origin-when-cross-origin',
+            attribution: this.attributionValue
         }).addTo(this.map)
     }
+
+    tileUrl() {
+        if ('' === this.tileUrlValue || '' === this.apiKeyValue) {
+            return ''
+        }
+        const separator = -1 === this.tileUrlValue.indexOf('?') ? '?' : '&'
+        return this.tileUrlValue + separator + 'apiKey=' + encodeURIComponent(this.apiKeyValue)
+    }
 }

public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/mixins/use_fetch.js

@@ -1,5 +1,3 @@
-import 'whatwg-fetch'
-
 export const useFetch = controller => {
     Object.assign(controller, {
         checkStatus(response) {

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/_base.scss

@@ -1,13 +1,12 @@
+@use "sass:meta";
 @layer base {
     body {
         padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
     }
-    @import "base/typography";
+    @include meta.load-css("base/typography");
-    @import "base/images";
+    @include meta.load-css("base/images");
 
-    [data-rte-content] {
+    @include meta.load-css("base/rte-content");
-        @import "base/rte-content";
-    }
 
     iframe {
         width: 100%;

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/_components.scss

@@ -1,14 +1,15 @@
+@use "sass:meta";
 @layer components {
-    @import "components/topnav";
+    @include meta.load-css("components/topnav");
-    @import "components/background";
+    @include meta.load-css("components/background");
-    @import "components/badges";
+    @include meta.load-css("components/badges");
-    @import "components/buttons";
+    @include meta.load-css("components/buttons");
-    @import "components/contact-bar";
+    @include meta.load-css("components/contact-bar");
-    @import "components/calendar";
+    @include meta.load-css("components/calendar");
-    @import "components/forms";
+    @include meta.load-css("components/forms");
-    @import "components/herounit";
+    @include meta.load-css("components/herounit");
-    @import "components/misc";
+    @include meta.load-css("components/misc");
-    @import "components/searchbar";
+    @include meta.load-css("components/searchbar");
-    @import "components/teaser";
+    @include meta.load-css("components/teaser");
-    @import "components/travelinfo";
+    @include meta.load-css("components/travelinfo");
 }

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/_vendor.scss

@@ -1,8 +1,10 @@
+@use "sass:meta";
+
 // Lightbox
 @import "~glightbox/dist/css/glightbox.css";
 
 // Tooltips
-@import "~cooltipz-css/src/cooltipz";
+@include meta.load-css("cooltipz-css/cooltipz.css");
 
 :root {
     --cooltipz-bg-color: theme('colors.zinc.700');

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/base/_rte-content.scss

@@ -1,82 +1,86 @@
-h1,
+// Self-contained: the wrapper lives here so `&` and @extend resolve the same
-.headline--primary,
+// way they did when this file was @imported into a [data-rte-content] block.
-h2,
+[data-rte-content] {
-.headline--secondary,
+    h1,
-h3,
+    .headline--primary,
-.headline--3,
+    h2,
-h4,
+    .headline--secondary,
-.headline--4 {
+    h3,
-    @apply mb-4;
+    .headline--3,
-}
+    h4,
+    .headline--4 {
+        @apply mb-4;
+    }
 
-ul {
+    ul {
-    @apply list-disc pl-4 mb-4;
+        @apply list-disc pl-4 mb-4;
-}
+    }
 
-ol {
+    ol {
-    @apply list-decimal pl-4 mb-4;
+        @apply list-decimal pl-4 mb-4;
-}
+    }
 
-p {
+    p {
-    @apply mb-4;
+        @apply mb-4;
-}
+    }
 
-a:not(.button):not(.rte-button):not(.rte-button--full) {
+    a:not(.button):not(.rte-button):not(.rte-button--full) {
-    @apply underline text-ep-primary-dark sbw:text-sbw-primary-dark;
+        @apply underline text-ep-primary-dark sbw:text-sbw-primary-dark;
 
-    .bg-brand-gradient & {
+        .bg-brand-gradient & {
-        @apply text-white underline;
+            @apply text-white underline;
+        }
+    }
+
+    a.rte-button {
+        @apply inline-flex items-center justify-center px-4 py-2 md:px-8;
+        @apply uppercase leading-none text-center;
+        @apply transition-colors outline-none;
+        @apply bg-ep-primary-light text-white;
+        @apply sbw:bg-sbw-secondary;
+        @apply snz:bg-snz-secondary;
+        @apply suz:bg-suz-secondary;
+        @apply uch:bg-uch-secondary;
+        @apply ser:bg-ser-secondary;
+        @apply hover:bg-ep-secondary group-hover:bg-ep-secondary;
+        @apply sbw:hover:bg-sbw-primary-dark sbw:group-hover:bg-sbw-primary-dark;
+        @apply snz:hover:bg-snz-primary-dark snz:group-hover:bg-snz-primary-dark;
+        @apply suz:hover:bg-suz-primary-dark suz:group-hover:bg-suz-primary-dark;
+        @apply uch:hover:bg-uch-primary-dark uch:group-hover:bg-uch-primary-dark;
+        @apply ser:hover:bg-ser-primary ser:group-hover:bg-ser-primary;
+        @apply focus:outline focus:outline-2 focus:outline-offset-2;
+        @apply focus:outline-ep-primary-dark sbw:focus:outline-sbw-secondary uch:focus:outline-uch-secondary;
+        @apply suz:focus:outline-suz-secondary ser:focus:outline-ser-secondary snz:focus:outline-snz-secondary;
+
+    }
+
+    a.rte-button--full {
+        @extend .rte-button;
+        @apply w-full;
+    }
+
+    table,
+    .table {
+        @apply w-full;
+    }
+
+    thead {
+        tr {
+            @apply bg-zinc-200;
+        }
+    }
+
+    tbody {
+        tr {
+            @apply odd:bg-zinc-100;
+        }
+    }
+
+    th {
+        @apply border-r border-white/50 px-2 py-1 md:p-2 text-left text-sm md:text-base;
+    }
+
+    td {
+        @apply border-r border-zinc-200 px-2 py-1 md:p-2;
     }
 }
-
-a.rte-button {
-    @apply inline-flex items-center justify-center px-4 py-2 md:px-8;
-    @apply uppercase leading-none text-center;
-    @apply transition-colors outline-none;
-    @apply bg-ep-primary-light text-white;
-    @apply sbw:bg-sbw-secondary;
-    @apply snz:bg-snz-secondary;
-    @apply suz:bg-suz-secondary;
-    @apply uch:bg-uch-secondary;
-    @apply ser:bg-ser-secondary;
-    @apply hover:bg-ep-secondary group-hover:bg-ep-secondary;
-    @apply sbw:hover:bg-sbw-primary-dark sbw:group-hover:bg-sbw-primary-dark;
-    @apply snz:hover:bg-snz-primary-dark snz:group-hover:bg-snz-primary-dark;
-    @apply suz:hover:bg-suz-primary-dark suz:group-hover:bg-suz-primary-dark;
-    @apply uch:hover:bg-uch-primary-dark uch:group-hover:bg-uch-primary-dark;
-    @apply ser:hover:bg-ser-primary ser:group-hover:bg-ser-primary;
-    @apply focus:outline focus:outline-2 focus:outline-offset-2;
-    @apply focus:outline-ep-primary-dark sbw:focus:outline-sbw-secondary uch:focus:outline-uch-secondary;
-    @apply suz:focus:outline-suz-secondary ser:focus:outline-ser-secondary snz:focus:outline-snz-secondary;
-
-}
-
-a.rte-button--full {
-    @extend .rte-button;
-    @apply w-full;
-}
-
-table,
-.table {
-    @apply w-full;
-}
-
-thead {
-    tr {
-        @apply bg-zinc-200;
-    }
-}
-
-tbody {
-    tr {
-        @apply odd:bg-zinc-100;
-    }
-}
-
-th {
-    @apply border-r border-white/50 px-2 py-1 md:p-2 text-left text-sm md:text-base;
-}
-
-td {
-    @apply border-r border-zinc-200 px-2 py-1 md:p-2;
-}

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/main.scss

@@ -1,10 +1,12 @@
-@import "tailwindcss/base";
+@use "sass:meta";
-@import "base";
 
-@import "tailwindcss/components";
+@include meta.load-css("tailwindcss/base");
-@import "components";
+@include meta.load-css("base");
 
-@import "tailwindcss/utilities";
+@include meta.load-css("tailwindcss/components");
-@import "utilities";
+@include meta.load-css("components");
 
-@import "vendor";
+@include meta.load-css("tailwindcss/utilities");
+@include meta.load-css("utilities");
+
+@include meta.load-css("vendor");

public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/rte.scss

@@ -1,4 +1,4 @@
-@import "base/fonts";
+@use "base/fonts";
 
 body {
     @apply antialiased text-zinc-800 font-sans;

public/typo3conf/ext/ep_theme/Resources/Private/Partials/Map/Osm.html

@@ -0,0 +1,10 @@
+<div class="w-full aspect-w-16 aspect-h-9 {class}"
+     data-controller="osm"
+     data-osm-tile-url-value="{settings.mapTileUrl}"
+     data-osm-api-key-value="{settings.mapApiKey}"
+     data-osm-attribution-value="{settings.mapAttribution}"
+     <f:if condition="{zoom}">data-osm-zoom-value="{zoom}"</f:if>
+     <f:if condition="{lat}">data-osm-lat-value="{lat}" data-osm-lng-value="{lng}"</f:if>
+     <f:if condition="{externalLink}">data-osm-external-link-value="{externalLink}"</f:if>
+     <f:if condition="{markers}">data-osm-markers-value='{markers -> f:format.raw()}'</f:if>
+></div>

public/typo3conf/ext/ep_theme/Resources/Private/Partials/Search/FilterPanel.html

@@ -274,8 +274,12 @@
                         2: 'DZ / 2er',
                         3: '3er',
                         4: '4er',
-                        5: 'ab 5 Pers.',
+                        5: '5er',
-                        6: 'mit anderen'
+                        6: '6er',
+                        7: '7er',
+                        8: '8er',
+                        9: '9er und mehr',
+                        10: 'mit anderen'
                     }"/>
         <div class="py-2"
              data-controller="collapse"
@@ -291,17 +295,19 @@
             <div data-collapse-target="container">
                 <ul class="mb-0 p-0 pt-4 space-y-2">
                     <f:for each="{filterOptions.roomTypes}" as="type">
-                        <li>
+                        <f:if condition="{roomTypes.{type}}">
-                            <label class="flex items-start">
+                            <li>
-                                <f:form.checkbox class="w-5 h-5 border-ep-primary-light ring-0 bg-transparent focus:ring-0 focus:border-none text-ep-primary"
+                                <label class="flex items-start">
-                                                 property="roomTypes"
+                                    <f:form.checkbox class="w-5 h-5 border-ep-primary-light ring-0 bg-transparent focus:ring-0 focus:border-none text-ep-primary"
-                                                 data="{action: '{stimulusController}#filter'}"
+                                                     property="roomTypes"
-                                                 value="{type}"/>
+                                                     data="{action: '{stimulusController}#filter'}"
-                                <span class="leading-none pl-2">
+                                                     value="{type}"/>
-                                    {roomTypes.{type}}
+                                    <span class="leading-none pl-2">
-                                </span>
+                                        {roomTypes.{type}}
-                            </label>
+                                    </span>
-                        </li>
+                                </label>
+                            </li>
+                        </f:if>
                     </f:for>
                 </ul>
             </div>

public/typo3conf/ext/ep_theme/Resources/Private/Templates/FluidStyledContent/Gmap.html

@@ -13,11 +13,7 @@
             <f:variable name="latitude" value="{region.0.data.latitude}"/>
             <f:variable name="longitude" value="{region.0.data.longitude}"/>
         </f:if>
-        <div class="w-full aspect-w-16 aspect-h-9 mb-8"
+        <f:render partial="Map/Osm" arguments="{settings: settings, class: 'mb-8', zoom: 17, lat: latitude, lng: longitude}"/>
-             data-controller="osm"
-             data-osm-lat-value="{latitude}"
-             data-osm-lng-value="{longitude}"
-             data-osm-zoom-value="17"></div>
     </f:section>
 
 </html>

public/typo3conf/ext/ep_theme/Resources/Private/Templates/Hotel/Detail.html

@@ -26,11 +26,7 @@
                     <div class="bg-zinc-50 p-4">
                         <p><strong>Lage</strong></p>
                         <div>
-                            <div class="w-full aspect-w-16 aspect-h-9"
+                            <f:render partial="Map/Osm" arguments="{settings: settings, lat: hotel.latitude, lng: hotel.longitude, externalLink: '{f:uri.typolink(parameter: hotel.externalLink)}'}"/>
-                                 data-controller="osm"
-                                 data-osm-lat-value="{hotel.latitude}"
-                                 data-osm-lng-value="{hotel.longitude}"
-                                 data-osm-external-link-value="{f:uri.typolink(parameter: hotel.externalLink)}"></div>
                         </div>
                     </div>
                 </div>

public/typo3conf/ext/ep_theme/Resources/Private/Templates/Map/General.html

@@ -7,9 +7,7 @@
     <f:section name="Main">
         <f:if condition="{markerData}">
             <ep:container data="{data}">
-                <div class="w-full aspect-w-16 aspect-h-9 mb-8"
+                <f:render partial="Map/Osm" arguments="{settings: settings, class: 'mb-8', markers: markerData}"/>
-                     data-controller="osm"
-                     data-osm-markers-value='{markerData -> f:format.raw()}'></div>
             </ep:container>
         </f:if>
     </f:section>

public/typo3conf/ext/ep_theme/Resources/Private/Templates/Product/Detail.html

@@ -216,12 +216,7 @@
             <p class="font-bold mb-2">
                 Lage
             </p>
-            <div class="w-full aspect-w-16 aspect-h-9"
+            <f:render partial="Map/Osm" arguments="{settings: settings, zoom: 15, lat: hotel.latitude, lng: hotel.longitude, externalLink: '{f:uri.typolink(parameter: hotel.externalLink)}'}"/>
-                 data-controller="osm"
-                 data-osm-zoom-value="15"
-                 data-osm-lat-value="{hotel.latitude}"
-                 data-osm-lng-value="{hotel.longitude}"
-                 data-osm-external-link-value="{f:uri.typolink(parameter: hotel.externalLink)}"></div>
         </div>
         <f:render partial="Region/Webcam" arguments="{region: product.region}"/>
         <f:render partial="RegionMaps" arguments="{region: product.region}"/>

public/typo3conf/ext/ep_theme/Resources/Private/Templates/Searchbar/Index.html

@@ -53,7 +53,7 @@
                                              data-action="click->collapse#toggle">
                                             <use href="{f:uri.image(src: 'EXT:ep_theme/Resources/Public/images/icons_sprite.svg')}#icon-calendar"></use>
                                         </svg>
-                                        <div class="hidden absolute z-50 top-100 mt-2 left-0 min-w-full bg-white p-4 shadow-md rounded"
+                                        <div class="hidden absolute z-100 top-100 mt-2 left-0 min-w-full bg-white p-4 shadow-md rounded"
                                              data-collapse-target="container">
                                             <div class="flex justify-between divide-x divide-zinc-200">
                                                 <div class="pr-2">

webpack.config.js

@@ -1,4 +1,5 @@
 const Encore = require('@symfony/webpack-encore');
+const path = require('path');
 
 if (!Encore.isRuntimeEnvironmentConfigured()) {
     Encore.configureRuntimeEnvironment(process.env.NODE_ENV || 'dev');
@@ -12,8 +13,18 @@ Encore
     .addStyleEntry('rte', './public/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/rte.scss')
     .splitEntryChunks()
     .enableSingleRuntimeChunk()
-    .enableSassLoader()
+    .enableSassLoader(options => {
-    .enableVueLoader(() => {}, { runtimeCompilerBuild: false })
+        // Opt into the modern Sass JS API (sass-loader defaults to the legacy one,
+        // which Dart Sass 2.0 removes). Encore still passes `outputStyle`, which
+        // the modern API ignores in favour of `style`.
+        options.api = 'modern'
+        delete options.sassOptions.outputStyle
+        options.sassOptions.style = 'expanded'
+
+        // sass-loader's webpack importer declines `.css` requests, so plain CSS
+        // pulled in with meta.load-css() has to be resolvable by Dart Sass itself.
+        options.sassOptions.loadPaths = [path.join(__dirname, 'node_modules')]
+    })
     .enableVersioning(Encore.isProduction())
     .enableSourceMaps(!Encore.isProduction())
     .cleanupOutputBeforeBuild()
@@ -41,13 +52,8 @@ Encore
     .configureFontRule({
         filename: 'fonts/[name][ext]',
     })
-    .configureBabel(function (babelConfig) {
-        babelConfig.plugins = [ '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-syntax-dynamic-import' ]
-    })
     .configureBabelPresetEnv((config) => {
         config.shippedProposals = true
-        config.useBuiltIns = 'usage'
-        config.corejs = 3
     });
 
 const EpThemeConfig = Encore.getWebpackConfig();
@@ -65,7 +71,18 @@ Encore
     .addStyleEntry('rte', './public/typo3conf/ext/ep_events/Resources/Private/Assets/scss/rte.scss')
     .enableSingleRuntimeChunk()
     .splitEntryChunks()
-    .enableSassLoader()
+    .enableSassLoader(options => {
+        // Opt into the modern Sass JS API (sass-loader defaults to the legacy one,
+        // which Dart Sass 2.0 removes). Encore still passes `outputStyle`, which
+        // the modern API ignores in favour of `style`.
+        options.api = 'modern'
+        delete options.sassOptions.outputStyle
+        options.sassOptions.style = 'expanded'
+
+        // sass-loader's webpack importer declines `.css` requests, so plain CSS
+        // pulled in with meta.load-css() has to be resolvable by Dart Sass itself.
+        options.sassOptions.loadPaths = [path.join(__dirname, 'node_modules')]
+    })
     .enableVueLoader()
     .autoProvidejQuery()
     .enableSourceMaps(!Encore.isProduction())
@@ -86,9 +103,6 @@ Encore
     })
     .configureFontRule({
         filename: 'fonts/[name][ext]',
-    })
-    .configureBabel(function (babelConfig) {
-        babelConfig.plugins = [ '@babel/plugin-proposal-object-rest-spread', '@babel/plugin-syntax-dynamic-import' ]
     });
 
 const EpEventsConfig = Encore.getWebpackConfig();