/* ========================================================================== FALKENTHAL MODERN SHOP UI/UX UPGRADE (presale.css - v1.8.1) Farb-, Geometrie- & Kontrastneutral: Respektiert 100 % der Veranstalter-Farben, Logos, Bootstrap-Input-Groups sowie helle UND dunkle Veranstalter-Hintergründe! ========================================================================== */ body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; line-height: 1.6; } /* 1. MODERNE CARDS & PANELS IM TICKETSHOP */ .panel { border-radius: 10px; border: 1px solid rgba(128, 128, 128, 0.16); border-color: color-mix(in srgb, currentColor 12%, transparent); box-shadow: 0 2px 12px -2px rgba(0, 0, 0, 0.05); overflow: hidden; transition: box-shadow 0.2s ease; } .panel-heading { padding: 14px 18px; font-weight: 600; letter-spacing: -0.01em; } /* 2. PRODUKT- & TICKETZEILEN (SAUBERE LINIEN & RUHIGER HOVER FÜR LIGHT & DARK THEMES) */ .product-row, .variation-row { transition: background-color 0.15s ease; } .product-row:hover, .variation-row:hover { background-color: rgba(128, 128, 128, 0.045); background-color: color-mix(in srgb, currentColor 3.5%, transparent); } /* 3. BUTTONS, EINGABEFELDER & MENGENAUSWAHL (INPUT-GROUP-SICHER OHNE SPRINGEN) */ .btn { border-radius: 6px; font-weight: 600; transition: box-shadow 0.18s ease, background-color 0.15s ease, border-color 0.15s ease, opacity 0.15s ease; } /* Sanfter Tiefenschatten beim Hover auf alleinstehenden Buttons (kein translateY-Springen!) */ .btn:not(.input-group .btn):hover, .btn:not(.input-group .btn):focus { box-shadow: 0 3px 10px rgba(0, 0, 0, 0.12); } /* Standalone-Eingabefelder (außerhalb von .input-group) dezent abrunden, aber Pretix/Bootstrap-Höhen für perfekte Ausrichtung mit + / - Buttons bewahren */ .form-control:not(.input-group .form-control) { border-radius: 6px; } .form-control { box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.03); transition: border-color 0.18s ease, box-shadow 0.18s ease; } /* Fokusring übernimmt automatisch die vom Veranstalter gesetzte Rahmen-/Primärfarbe */ .form-control:focus { box-shadow: 0 0 0 3px rgba(128, 128, 128, 0.16); box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 15%, transparent); outline: none; } /* Mengenauswahl ([-][ 0 ][+]) und andere Bootstrap .input-group Elemente exakt bündig auf einer Linie halten */ .input-group .form-control { border-radius: 0; } .input-group > .form-control:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-addon:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; border-top-right-radius: 0; border-bottom-right-radius: 0; } .input-group > .form-control:last-child, .input-group-btn:last-child > .btn, .input-group-btn:last-child > .btn-group > .btn, .input-group-addon:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; border-top-left-radius: 0; border-bottom-left-radius: 0; } /* 4. KALENDER & EVENT-KACHELN IN REIHEN */ .event-calendar td.has-events { border-radius: 6px; } .subevent-list .subevent-row { border-radius: 8px; transition: background-color 0.15s ease, box-shadow 0.18s ease; } /* 5. WARENKORB & HINWEISBOXEN (INKL. TESTMODUS-BANNER MIT LINKEM ICON-BALKEN) */ .cart-row { padding: 12px 8px; } .alert { border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); } /* ========================================================================== 6. FOOTER & PLATTFORM-RECHTSTEXTE (ADAPTIV FÜR HELLE & DUNKLE VERANSTALTER-SHOPS) ========================================================================== */ footer { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 40px; padding-bottom: 24px; } footer nav ul { margin-bottom: 0; padding-left: 0; list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; } footer nav ul li a { font-weight: 500; } .falkenthal-platform-bar { width: 100%; margin-top: 14px; padding-top: 16px; border-top: 1px solid rgba(128, 128, 128, 0.2); border-top-color: color-mix(in srgb, currentColor 15%, transparent); font-size: 12px; color: inherit; opacity: 0.78; text-align: center; line-height: 1.6; } .falkenthal-platform-bar .falkenthal-platform-info { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 4px 0; max-width: 100%; padding: 0 8px; } .falkenthal-platform-bar .ft-brand { font-weight: 600; color: inherit; letter-spacing: 0.02em; } .falkenthal-platform-bar a { color: inherit !important; text-decoration: none !important; font-weight: 500; opacity: 0.92; transition: opacity 0.15s ease, text-decoration 0.15s ease; } .falkenthal-platform-bar a:hover, .falkenthal-platform-bar a:focus { opacity: 1; text-decoration: underline !important; } .falkenthal-platform-bar .ft-sep { margin: 0 6px; opacity: 0.55; } /* Kompakter Modus für eingebettete Pretix-Widgets (iFrame) & Mobilgeräte */ .is-iframe footer, body.iframe footer { margin-top: 20px; padding-bottom: 14px; } @media (max-width: 767px) { .falkenthal-platform-bar { font-size: 11px; } .falkenthal-platform-bar .ft-sep { margin: 0 4px; } }