/* TPF Theme - optional skins (member setting "Design", 0.93.0). One theme, several looks: the plugin puts tpf-skin-modern or tpf-skin-abend on (TP_Accounts::body_class(), reading the member's tp_users.skin choice). No class = Classic (today's design, completely untouched - this file only ever ADDS scoped overrides). Rules agreed with Miron (19-07-2026, see mockup TPF-Skin-Entwuerfe.html): - Dosis font and the logo stay EXACTLY the same in every skin - only colors, surfaces, corner radii and button shapes may differ */ /* ===================================================================== Skin "Modern" - light, calm surfaces, soft shadows, round buttons ===================================================================== */ body.tpf-skin-modern { --tpf-bg-pink-light: #f8eef5; --tpf-bg-gray: #eee7f0; --tpf-skin-page: #f7f6f9; --tpf-skin-card: #fff; --tpf-skin-border: #eee7f0; --tpf-skin-shadow: 0 4px 18px rgba(80, 20, 60, 0.08); --tpf-skin-grad: linear-gradient(135deg, #902360, #c53387); background: var(--tpf-skin-page); } /* header + nav: white bar, no angled corner graphics, underline for the active item instead of the dark magenta block */ body.tpf-skin-modern .site-header { background: #fff; } body.tpf-skin-modern .nav-wings { display: none !important; } body.tpf-skin-modern .nav-band { background: #fff; border-bottom: 1px solid var(--tpf-skin-border); box-shadow: 0 2px 10px rgba(80, 20, 60, 0.05); } body.tpf-skin-modern .nav-menu .menu a { color: #443a4d; font-weight: 700; } body.tpf-skin-modern .nav-menu .menu a:hover, body.tpf-skin-modern .nav-menu .menu .current_page_item > a, body.tpf-skin-modern .nav-menu .menu .current-menu-item > a { background: none; color: var(--tpf-pink); box-shadow: inset 0 -3px 0 var(--tpf-pink); } body.tpf-skin-modern .nav-toggle .icon-bar { background: #443a4d; } body.tpf-skin-modern .header-search input { border-radius: 999px; } /* buttons: pill shape with a soft brand gradient */ body.tpf-skin-modern .btn-login { clip-path: none; border-radius: 999px; background: var(--tpf-skin-grad); } body.tpf-skin-modern .tpf-submit, body.tpf-skin-modern .btn-search, body.tpf-skin-modern .btn-more, body.tpf-skin-modern .tpf-friend-btn, body.tpf-skin-modern .registration-box .submit { border-radius: 999px; background: var(--tpf-skin-grad); } body.tpf-skin-modern .tpf-submit:hover, body.tpf-skin-modern .btn-search:hover, body.tpf-skin-modern .btn-more:hover, body.tpf-skin-modern .tpf-friend-btn:hover, body.tpf-skin-modern .registration-box .submit:hover { background: var(--tpf-skin-grad); filter: brightness(1.12); } body.tpf-skin-modern .tpf-delete-btn, body.tpf-skin-modern .tpf-friend-btn-secondary, body.tpf-skin-modern .tpf-btn-disabled { border-radius: 999px; } /* forms: flat light fields instead of the pink gradient */ body.tpf-skin-modern .tpf-form input[type='text'], body.tpf-skin-modern .tpf-form input[type='email'], body.tpf-skin-modern .tpf-form input[type='password'], body.tpf-skin-modern .tpf-form input[type='number'], body.tpf-skin-modern .tpf-form input[type='date'], body.tpf-skin-modern .tpf-form select, body.tpf-skin-modern .registration-box .form-group { background: #faf8fb; border: 1px solid var(--tpf-skin-border); border-radius: 10px; } /* cards: white, rounder, soft shadow */ body.tpf-skin-modern .tpf-profile-card, body.tpf-skin-modern .tpf-teacher-card, body.tpf-skin-modern .tpf-venue-card, body.tpf-skin-modern .tpf-latest-posts .tpf-post-card, body.tpf-skin-modern .tpf-classified-ad-item, body.tpf-skin-modern .tpf-message-bubble, body.tpf-skin-modern .tpf-group-chat-message { border-color: var(--tpf-skin-border); border-radius: 14px; box-shadow: var(--tpf-skin-shadow); } /* flat background images from the classic design: off */ body.tpf-skin-modern .site-content { background: none; } body.tpf-skin-modern .breadcrumbs { background: none; } /* footer: dark aubergine block */ body.tpf-skin-modern .site-footer { background: #241627; color: #e9dfee; } body.tpf-skin-modern .footer-column .widget-title, body.tpf-skin-modern .site-footer h2 { color: #e9dfee; } body.tpf-skin-modern .footer-column li { border-color: #453349; } body.tpf-skin-modern .site-footer a { color: #e8a9cd; } body.tpf-skin-modern .footer-bottom { border-top: 1px solid #453349; } body.tpf-skin-modern .copyright p { color: #9d8ba3; } body.tpf-skin-modern .footer-column .shadow { background: linear-gradient(to right, var(--tpf-pink) 0 60px, #453349 60px); } /* ===================================================================== Skin "Abend" - dark, aubergine tones, pink accents ===================================================================== */ body.tpf-skin-abend { /* brand tones brightened so they stay readable on dark ground */ --tpf-magenta: #b23579; --tpf-magenta-dark: #d84f97; --tpf-magenta-mid: #c04487; --tpf-pink: #e87cba; --tpf-link: #e87cba; --tpf-bg-pink-light: #2a1a2d; --tpf-bg-gray: #3c2a3f; --tpf-text: #efe6ee; --tpf-text-light: #a893a8; --tpf-skin-page: #191019; --tpf-skin-card: #221525; --tpf-skin-border: #3c2a3f; background: var(--tpf-skin-page); color: var(--tpf-text); } /* header + nav */ body.tpf-skin-abend .site-header { background: var(--tpf-skin-page); } body.tpf-skin-abend .nav-wings { display: none !important; } body.tpf-skin-abend .slogan .site-title { color: #fff; } body.tpf-skin-abend .nav-band { background: #241726; border-top: 1px solid var(--tpf-skin-border); border-bottom: 1px solid var(--tpf-skin-border); } body.tpf-skin-abend .nav-menu .menu a { color: #e7d9e6; } body.tpf-skin-abend .nav-menu .menu a:hover, body.tpf-skin-abend .nav-menu .menu .current_page_item > a, body.tpf-skin-abend .nav-menu .menu .current-menu-item > a { background: none; color: #fff; box-shadow: inset 0 -3px 0 var(--tpf-pink); } body.tpf-skin-abend .btn-login { clip-path: none; border-radius: 8px; background: transparent; border: 1px solid var(--tpf-pink); color: var(--tpf-pink); } body.tpf-skin-abend .btn-login:hover, body.tpf-skin-abend .btn-login:focus { background: var(--tpf-pink); color: #191019; } /* flat background images from the classic design: off */ body.tpf-skin-abend .site-content { background: none; } body.tpf-skin-abend .breadcrumbs { background: none; } /* content surfaces that are hard-wired to white in main.css */ body.tpf-skin-abend .tpf-location-suggestions, body.tpf-skin-abend .tpf-profile-card, body.tpf-skin-abend .tpf-teacher-card, body.tpf-skin-abend .tpf-venue-card, body.tpf-skin-abend .tpf-message-bubble, body.tpf-skin-abend .tpf-group-chat-message, body.tpf-skin-abend .tpf-support-faq-chip, body.tpf-skin-abend .tpf-support-faq-chip-answer, body.tpf-skin-abend .tpf-crop-dialog, body.tpf-skin-abend .tpf-view-toggle-btn, body.tpf-skin-abend .tpf-latest-posts .tpf-post-card { background: var(--tpf-skin-card); border-color: var(--tpf-skin-border); } body.tpf-skin-abend .tpf-star-photo-wrap > .tpf-favorite-star, body.tpf-skin-abend .tpf-conversation-item > .tpf-favorite-star { background: var(--tpf-skin-card); } body.tpf-skin-abend .tpf-message-own, body.tpf-skin-abend .tpf-group-chat-message.tpf-group-chat-own { background: #3a2135; } body.tpf-skin-abend .tpf-board-masonry .tpf-classified-ad-item, body.tpf-skin-abend .tpf-ad-slot, body.tpf-skin-abend .tpf-classified-ad-item { background: var(--tpf-skin-card); border-color: var(--tpf-skin-border); } body.tpf-skin-abend .tpf-report-form { background: var(--tpf-skin-card); border-color: var(--tpf-skin-border); } /* forms: dark fields, light text */ body.tpf-skin-abend .tpf-form input[type='text'], body.tpf-skin-abend .tpf-form input[type='email'], body.tpf-skin-abend .tpf-form input[type='password'], body.tpf-skin-abend .tpf-form input[type='number'], body.tpf-skin-abend .tpf-form input[type='date'], body.tpf-skin-abend .tpf-form select, body.tpf-skin-abend .tpf-message-input, body.tpf-skin-abend .tpf-group-chat-input, body.tpf-skin-abend .tpf-profile textarea, body.tpf-skin-abend .tpf-classified-form textarea, body.tpf-skin-abend .tpf-report-form textarea, body.tpf-skin-abend .tpf-faq-search, body.tpf-skin-abend .header-search input, body.tpf-skin-abend .registration-box .form-group { background: #1d1220; border: 1px solid var(--tpf-skin-border); color: var(--tpf-text); } body.tpf-skin-abend .registration-box .form-group input { color: var(--tpf-text); } /* muted grays from the classic design, re-tuned for dark ground */ body.tpf-skin-abend .tpf-profile-card-meta, body.tpf-skin-abend .tpf-teacher-card-bio, body.tpf-skin-abend .tpf-venue-card-address, body.tpf-skin-abend .tpf-event-list-date, body.tpf-skin-abend .tpf-event-list-venue, body.tpf-skin-abend .tpf-event-page-datetime, body.tpf-skin-abend .tpf-profile-page-lastseen, body.tpf-skin-abend .tpf-friend-status, body.tpf-skin-abend .tpf-mutual-friends, body.tpf-skin-abend .tpf-conversation-preview, body.tpf-skin-abend .tpf-message-meta, body.tpf-skin-abend .tpf-message-ref-notice, body.tpf-skin-abend .tpf-course-list-dates, body.tpf-skin-abend .tpf-course-list-schedule, body.tpf-skin-abend .tpf-course-list-venue, body.tpf-skin-abend .tpf-course-page-dates, body.tpf-skin-abend .tpf-course-page-schedule, body.tpf-skin-abend .tpf-course-page-venue, body.tpf-skin-abend .tpf-classified-ad-date, body.tpf-skin-abend .tpf-classified-ad-author, body.tpf-skin-abend .tpf-latest-posts .tpf-post-date, body.tpf-skin-abend .tpf-visitors .tpf-visit-time, body.tpf-skin-abend .tpf-support-faq dd, body.tpf-skin-abend .tpf-support-faq-chip-answer, body.tpf-skin-abend .tpf-support-resolved-notice, body.tpf-skin-abend .copyright p, body.tpf-skin-abend .slogan .site-tagline { color: var(--tpf-text-light); } body.tpf-skin-abend .tpf-message-icon-btn, body.tpf-skin-abend .tpf-ad-label, body.tpf-skin-abend .tpf-report-btn, body.tpf-skin-abend .tpf-group-chat-action-btn, body.tpf-skin-abend .tpf-favorite-star, body.tpf-skin-abend .tpf-event-follow-star, body.tpf-skin-abend .tpf-course-follow-star, body.tpf-skin-abend .tpf-block-icon { color: #bfa0ba; } /* light borders -> dark borders */ body.tpf-skin-abend .tpf-styles th, body.tpf-skin-abend .tpf-styles td, body.tpf-skin-abend .tpf-saved-searches th, body.tpf-skin-abend .tpf-saved-searches td, body.tpf-skin-abend .tpf-favorites-list td, body.tpf-skin-abend .tpf-conversation-item, body.tpf-skin-abend .post-list-item, body.tpf-skin-abend .footer-column li, body.tpf-skin-abend .tpf-classifieds-list th, body.tpf-skin-abend .tpf-classifieds-list td, body.tpf-skin-abend .tpf-blocked-section, body.tpf-skin-abend .tpf-hidden-conversations, body.tpf-skin-abend .tpf-einzelplatz-entry, body.tpf-skin-abend .tpf-einzelplatz-course-badge-entry, body.tpf-skin-abend .tpf-event-list-item, body.tpf-skin-abend .tpf-course-list-item, body.tpf-skin-abend .tpf-account-content h3, body.tpf-skin-abend .tpf-report-block-prompt, body.tpf-skin-abend .footer-bottom, body.tpf-skin-abend .pagination .page-numbers, body.tpf-skin-abend .tpf-photo-btn { border-color: var(--tpf-skin-border); } body.tpf-skin-abend .slogan .site-title, body.tpf-skin-abend .footer-column .widget-title { color: #fff; } /* toggles (course/event partner search) */ body.tpf-skin-abend .tpf-event-partner-toggle .tpf-toggle-track, body.tpf-skin-abend .tpf-course-partner-toggle .tpf-toggle-track { background: #4a3450; } /* notices + badges: same signal colors, dark surfaces */ body.tpf-skin-abend .tpf-notice { background: var(--tpf-bg-pink-light); } body.tpf-skin-abend .tpf-notice.tpf-error, body.tpf-skin-abend .tpf-badge-expired { background: #3d1f22; color: #f2b8bd; } body.tpf-skin-abend .tpf-notice.tpf-success { background: #1f3524; color: #b9e6c2; } body.tpf-skin-abend .tpf-event-badge-cancelled { background: #4a2328; color: #f2b8bd; } body.tpf-skin-abend .tpf-event-badge-soldout, body.tpf-skin-abend .tpf-course-badge-ad { background: #453a1c; color: #f0dfa1; } body.tpf-skin-abend .tpf-course-badge-einzelplatz { background: #3d1f22; color: #f2b8bd; } body.tpf-skin-abend .tpf-ad-slot-preview { background: #3a2135; } body.tpf-skin-abend .tpf-delete-btn { background: transparent; color: #e77d87; border-color: #e77d87; } /* hover surfaces hard-wired to light pink in main.css */ body.tpf-skin-abend .tpf-event-page-ical a, body.tpf-skin-abend .tpf-course-page-register a { border-color: var(--tpf-skin-border); color: var(--tpf-text); } body.tpf-skin-abend .tpf-event-page-ical a:hover, body.tpf-skin-abend .tpf-course-page-register a:hover { background: #3a2135; } /* front page */ body.tpf-skin-abend .registration-box .submit { background: linear-gradient(#c04487, #7d2058); } body.tpf-skin-abend .registration-box .submit:hover { background: linear-gradient(#d84f97, #c04487); } /* footer */ body.tpf-skin-abend .site-footer { background: #120a13; color: var(--tpf-text-light); } body.tpf-skin-abend .site-footer a { color: var(--tpf-pink); } body.tpf-skin-abend .footer-column .shadow { background: linear-gradient(to right, var(--tpf-pink) 0 60px, var(--tpf-skin-border) 60px); } /* ===================================================================== Skin "TanzPartnerForum (neu)" - external redesign handoff (0.94.0, design_handoff_tanzpartnerforum, README v19-07-2026). Unlike Modern/ Abend this skin ALSO swaps logo + font: Poppins (self-hosted, see fonts.css) and the new wordmark/swirl lockup - those live in skin- gated template branches (header.php / footer.php / front-page.php). Tokens 1:1 from design-tokens.css, scoped to body.tpf-skin-neu. ===================================================================== */ body.tpf-skin-neu { /* handoff tokens mapped onto the theme's existing variables */ --tpf-magenta: #bb3282; --tpf-magenta-dark: #a12a6f; --tpf-magenta-mid: #812b5c; --tpf-pink: #bb3282; --tpf-link: #bb3282; --tpf-bg-pink-light: #f6dfeb; --tpf-bg-gray: #f3dde8; --tpf-text: #3a1226; --tpf-text-light: #a5809a; --tpf-font: 'Poppins', Arial, Helvetica, sans-serif; /* handoff-only tokens */ --neu-bg: #f7edf1; --neu-surface: #fff; --neu-accent-soft: #f6dfeb; --neu-plum: #812b5c; --neu-plum-dark: #4d0f30; --neu-plum-black: #2a0a1c; --neu-magenta-light: #d46a9e; --neu-gold: #cf9b52; --neu-gold-light: #f0c987; --neu-border: #ecccdc; --neu-border-card: #f3dde8; --neu-text-muted: #7d5668; --neu-nav-inactive: #5a2848; --neu-on-dark: #f7edf1; --neu-on-dark-muted: #e6cdda; --neu-shadow-card: 0 24px 44px -38px rgba(110, 21, 70, 0.45); --neu-shadow-raised: 0 30px 60px -40px rgba(110, 21, 70, 0.6); --neu-shadow-glow: 0 16px 30px -18px rgba(187, 50, 130, 0.9); background: var(--neu-bg); font-family: var(--tpf-font); } /* ---------- header: sticky, translucent, pill navigation ---------- */ body.tpf-skin-neu .site-header { position: sticky; top: 0; z-index: 60; background: rgba(247, 237, 241, 0.92); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--neu-border); } body.tpf-skin-neu .nav-wings { display: none !important; } body.tpf-skin-neu .header-top { padding-top: 14px; padding-bottom: 6px; } /* new logo lockup (markup from tpf_theme_neu_logo()) */ body.tpf-skin-neu .neu-logo { display: flex; align-items: center; gap: 12px; text-decoration: none; } body.tpf-skin-neu .neu-logo-tile { width: 46px; height: 46px; display: block; } body.tpf-skin-neu .neu-logo-word { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; color: var(--neu-plum-black); } body.tpf-skin-neu .neu-logo-word span { color: var(--tpf-magenta); } body.tpf-skin-neu .neu-logo:hover { opacity: 0.75; text-decoration: none; } body.tpf-skin-neu .nav-band { background: transparent; } body.tpf-skin-neu .nav-menu .menu a { color: var(--neu-nav-inactive); font-weight: 500; padding: 9px 18px; border-radius: 99px; } body.tpf-skin-neu .nav-menu .menu a:hover { background: var(--neu-accent-soft); color: var(--neu-plum); box-shadow: none; text-decoration: none; } body.tpf-skin-neu .nav-menu .menu .current_page_item > a, body.tpf-skin-neu .nav-menu .menu .current-menu-item > a { background: var(--tpf-magenta); color: #fff; font-weight: 600; box-shadow: none; } body.tpf-skin-neu .nav-toggle .icon-bar { background: var(--neu-plum); } body.tpf-skin-neu .member-name { color: var(--tpf-magenta); } body.tpf-skin-neu .btn-login { clip-path: none; border-radius: 99px; background: var(--tpf-magenta); font-weight: 600; } body.tpf-skin-neu .btn-login:hover, body.tpf-skin-neu .btn-login:focus { background: var(--tpf-magenta-dark); } body.tpf-skin-neu .header-search input { background: #fbf3f7; border: 1px solid var(--neu-border); border-radius: 12px; color: var(--tpf-text); } /* ---------- flat classic background images: off ---------- */ body.tpf-skin-neu .site-content, body.tpf-skin-neu .breadcrumbs { background: none; } /* ---------- buttons: pills with glow ---------- */ body.tpf-skin-neu .tpf-submit, body.tpf-skin-neu .btn-search, body.tpf-skin-neu .btn-more, body.tpf-skin-neu .tpf-friend-btn, body.tpf-skin-neu .registration-box .submit, body.tpf-skin-neu .neu-btn-primary { border-radius: 99px; background: var(--tpf-magenta); box-shadow: var(--neu-shadow-glow); font-family: var(--tpf-font); font-weight: 600; } body.tpf-skin-neu .tpf-submit:hover, body.tpf-skin-neu .btn-search:hover, body.tpf-skin-neu .btn-more:hover, body.tpf-skin-neu .tpf-friend-btn:hover, body.tpf-skin-neu .registration-box .submit:hover, body.tpf-skin-neu .neu-btn-primary:hover { background: var(--tpf-magenta-dark); } body.tpf-skin-neu .tpf-friend-btn-secondary, body.tpf-skin-neu .tpf-btn-disabled, body.tpf-skin-neu .tpf-delete-btn, body.tpf-skin-neu .tpf-photo-btn { border-radius: 99px; font-family: var(--tpf-font); } /* soft secondary buttons ("Profil ansehen" style from the handoff) */ body.tpf-skin-neu .tpf-event-page-ical a, body.tpf-skin-neu .tpf-course-page-register a { background: var(--neu-accent-soft); border: 0; border-radius: 99px; color: var(--neu-plum); font-weight: 600; } body.tpf-skin-neu .tpf-event-page-ical a:hover, body.tpf-skin-neu .tpf-course-page-register a:hover { background: #f0d3e3; } /* ---------- forms ---------- */ body.tpf-skin-neu .tpf-form input[type='text'], body.tpf-skin-neu .tpf-form input[type='email'], body.tpf-skin-neu .tpf-form input[type='password'], body.tpf-skin-neu .tpf-form input[type='number'], body.tpf-skin-neu .tpf-form input[type='date'], body.tpf-skin-neu .tpf-form select, body.tpf-skin-neu .tpf-message-input, body.tpf-skin-neu .tpf-group-chat-input, body.tpf-skin-neu .tpf-profile textarea, body.tpf-skin-neu .tpf-classified-form textarea, body.tpf-skin-neu .tpf-report-form textarea, body.tpf-skin-neu .tpf-faq-search { background: #fbf3f7; border: 1px solid var(--neu-border); border-radius: 12px; color: var(--tpf-text); font-family: var(--tpf-font); } body.tpf-skin-neu ::placeholder { color: #b191a4; } /* ---------- cards / panels ---------- */ body.tpf-skin-neu .tpf-profile-card, body.tpf-skin-neu .tpf-teacher-card, body.tpf-skin-neu .tpf-venue-card, body.tpf-skin-neu .tpf-latest-posts .tpf-post-card, body.tpf-skin-neu .tpf-classified-ad-item, body.tpf-skin-neu .tpf-message-bubble, body.tpf-skin-neu .tpf-group-chat-message, body.tpf-skin-neu .tpf-report-form { background: var(--neu-surface); border: 1px solid var(--neu-border-card); border-radius: 20px; box-shadow: var(--neu-shadow-card); } body.tpf-skin-neu .tpf-profile-card:hover { box-shadow: var(--neu-shadow-raised); } /* search bar as a white card (handoff: "Suchleiste (weiße Karte)") */ body.tpf-skin-neu .tpf-search-form, body.tpf-skin-neu .tpf-course-filter-form { background: var(--neu-surface); border: 1px solid var(--neu-border-card); border-radius: 20px; box-shadow: var(--neu-shadow-card); padding: 18px; } /* muted text tones */ body.tpf-skin-neu .tpf-profile-card-meta, body.tpf-skin-neu .tpf-event-list-venue, body.tpf-skin-neu .tpf-course-list-venue, body.tpf-skin-neu .tpf-conversation-preview, body.tpf-skin-neu .tpf-message-meta, body.tpf-skin-neu .slogan .site-tagline { color: var(--neu-text-muted); } /* ---------- tabs & account menu as pills ---------- */ body.tpf-skin-neu .tpf-account-menu a, body.tpf-skin-neu .tpf-tabs-nav .tpf-tab-btn { border-radius: 99px; background: var(--neu-accent-soft); color: var(--neu-plum); font-weight: 600; border: 0; } body.tpf-skin-neu .tpf-account-menu .active a, body.tpf-skin-neu .tpf-account-menu a:hover, body.tpf-skin-neu .tpf-tabs-nav .tpf-tab-btn.active, body.tpf-skin-neu .tpf-tabs-nav .tpf-tab-btn:hover { background: var(--neu-plum); color: #fff; text-decoration: none; } /* ---------- badges (Nachtrag: exact handoff colors) ---------- */ body.tpf-skin-neu .tpf-course-badge-ad { background: #fbeecb; color: #9a6a10; border-radius: 99px; } body.tpf-skin-neu .tpf-course-badge-einzelplatz { background: #fbe0e0; color: #b23b3b; border-radius: 99px; } body.tpf-skin-neu .tpf-course-badge-search, body.tpf-skin-neu .tpf-course-badge-group { background: #e0f2e2; color: #2f8a44; border-radius: 99px; } body.tpf-skin-neu .tpf-event-badge, body.tpf-skin-neu .tpf-course-badge { border-radius: 99px; } /* ---------- notices ---------- */ body.tpf-skin-neu .tpf-notice { border-radius: 14px; } /* ---------- pagination ---------- */ body.tpf-skin-neu .pagination .page-numbers, body.tpf-skin-neu .tpf-view-toggle-btn { border-radius: 99px; border-color: var(--neu-border); } /* ---------- event/course list rows ---------- */ body.tpf-skin-neu .tpf-event-list-item, body.tpf-skin-neu .tpf-course-list-item, body.tpf-skin-neu .tpf-einzelplatz-entry { background: var(--neu-surface); border: 1px solid var(--neu-border-card); border-radius: 18px; box-shadow: var(--neu-shadow-card); padding: 14px 18px; margin-bottom: 14px; } /* ---------- footer: near-black plum ---------- */ body.tpf-skin-neu .site-footer { background: var(--neu-plum-black); color: #c8a9ba; } body.tpf-skin-neu .footer-column .widget-title, body.tpf-skin-neu .site-footer h2 { color: var(--neu-on-dark); } body.tpf-skin-neu .footer-column li { border-color: #4a2038; } body.tpf-skin-neu .site-footer a { color: var(--neu-magenta-light); } body.tpf-skin-neu .footer-bottom { border-top: 1px solid #4a2038; } body.tpf-skin-neu .copyright p { color: #c8a9ba; } body.tpf-skin-neu .footer-column .shadow { background: linear-gradient(to right, var(--neu-magenta-light) 0 60px, #4a2038 60px); } body.tpf-skin-neu .neu-footer-lockup { margin-bottom: 18px; } body.tpf-skin-neu .neu-logo-dark .neu-logo-word { color: #fff; } body.tpf-skin-neu .neu-logo-dark .neu-logo-word span { color: var(--neu-magenta-light); } /* ---------- front page (skin-gated markup in front-page.php) ---------- */ body.tpf-skin-neu .neu-hero { position: relative; min-height: 560px; display: flex; align-items: center; overflow: hidden; } body.tpf-skin-neu .neu-hero-media { position: absolute; inset: 0; background-size: cover; background-position: 72% center; } body.tpf-skin-neu .neu-hero-overlay { position: absolute; inset: 0; background: linear-gradient(100deg, #2a0a1c 0%, rgba(42, 10, 28, 0.94) 30%, rgba(42, 10, 28, 0.35) 62%, rgba(42, 10, 28, 0.55) 100%); } body.tpf-skin-neu .neu-hero-inner { position: relative; max-width: 1180px; padding-top: 56px; padding-bottom: 56px; } body.tpf-skin-neu .neu-hero-badge { display: inline-block; padding: 8px 16px; border: 1px solid rgba(214, 106, 158, 0.5); border-radius: 99px; background: rgba(255, 255, 255, 0.06); color: var(--neu-on-dark); font-size: 13px; font-weight: 600; letter-spacing: 0.06em; } body.tpf-skin-neu .neu-hero-title { max-width: 560px; margin: 22px 0 0; font-size: 58px; font-weight: 700; line-height: 1.03; color: #fff; } body.tpf-skin-neu .neu-hero-title em { font-style: normal; color: var(--neu-magenta-light); } body.tpf-skin-neu .neu-hero-sub { max-width: 560px; margin: 20px 0 0; font-size: 19px; line-height: 1.6; color: var(--neu-on-dark-muted); } body.tpf-skin-neu .neu-hero-ctas { margin: 28px 0 0; display: flex; flex-wrap: wrap; gap: 14px; } body.tpf-skin-neu .neu-btn-primary { display: inline-block; padding: 13px 28px; color: #fff; border: 0; font-size: 16px; cursor: pointer; text-decoration: none; } body.tpf-skin-neu .neu-btn-glass { display: inline-block; padding: 13px 28px; border-radius: 99px; background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.35); color: #fff; font-size: 16px; font-weight: 600; text-decoration: none; } body.tpf-skin-neu .neu-btn-glass:hover, body.tpf-skin-neu .neu-btn-primary:hover { opacity: 0.9; text-decoration: none; color: #fff; } body.tpf-skin-neu .neu-why { padding: 56px 0; } body.tpf-skin-neu .neu-why h2 { text-align: center; font-size: 32px; font-weight: 700; margin: 0 0 30px; } body.tpf-skin-neu .neu-why-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 22px; } body.tpf-skin-neu .neu-why-card { background: var(--neu-surface); border-radius: 24px; padding: 34px; box-shadow: var(--neu-shadow-card); } body.tpf-skin-neu .neu-why-icon { display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; background: var(--neu-accent-soft); color: var(--tpf-magenta); font-size: 26px; margin-bottom: 16px; } body.tpf-skin-neu .neu-why-icon-gold { color: var(--neu-gold); } body.tpf-skin-neu .neu-why-icon-plum { color: var(--neu-plum); } body.tpf-skin-neu .neu-why-card h3 { margin: 0 0 8px; font-size: 19px; font-weight: 600; } body.tpf-skin-neu .neu-why-card p { margin: 0; font-size: 14.5px; line-height: 1.6; color: var(--neu-text-muted); } body.tpf-skin-neu .neu-cta-band-wrap { padding: 0 0 64px; } body.tpf-skin-neu .neu-cta-band { background: linear-gradient(120deg, var(--neu-plum-dark), var(--neu-plum)); border-radius: 28px; padding: 52px; text-align: center; color: var(--neu-on-dark); } body.tpf-skin-neu .neu-cta-band h2 { margin: 0 0 10px; font-size: 32px; font-weight: 700; color: #fff; } body.tpf-skin-neu .neu-cta-band p { margin: 0 0 24px; color: var(--neu-on-dark-muted); } body.tpf-skin-neu .neu-cta-form { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; } body.tpf-skin-neu .neu-cta-form input { padding: 12px 20px; border: 1px solid rgba(214, 106, 158, 0.35); border-radius: 99px; background: rgba(255, 255, 255, 0.08); color: #fff; font-family: var(--tpf-font); font-size: 15px; min-width: 220px; } body.tpf-skin-neu .neu-cta-form input::placeholder { color: var(--neu-on-dark-muted); } /* ---------- responsive ---------- */ @media (max-width: 760px) { body.tpf-skin-neu .neu-hero-title { font-size: 38px; } body.tpf-skin-neu .neu-cta-band { padding: 32px 20px; } } /* ===================================================================== Skin "neu" - Feinschliff-Stufe (0.95.0): Profil-Titelband, Event-Highlight-Karte + Datumskacheln, Konto/Nachrichten-Details ===================================================================== */ /* ---------- profile: gradient title band, raised cards ---------- */ body.tpf-skin-neu .tpf-profile-page { position: relative; padding-top: 110px; } body.tpf-skin-neu .tpf-profile-page::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 200px; border-radius: 26px; background: linear-gradient(120deg, var(--neu-plum-dark), var(--tpf-magenta)); } body.tpf-skin-neu .tpf-profile-page-photos, body.tpf-skin-neu .tpf-profile-page-info { position: relative; background: var(--neu-surface); border-radius: 24px; padding: 24px; box-shadow: var(--neu-shadow-raised); } body.tpf-skin-neu .tpf-profile-page-mainphoto { width: 180px; max-width: 180px; border-radius: 50%; border: 5px solid #fff; box-shadow: var(--neu-shadow-card); margin: 0 auto; } body.tpf-skin-neu .tpf-profile-page-mainphoto-wrap { text-align: center; } body.tpf-skin-neu .tpf-profile-page-thumbs { justify-content: center; } body.tpf-skin-neu .tpf-profile-page-thumb { border-radius: 12px; } body.tpf-skin-neu .tpf-profile-page-info h1 { font-size: 26px; font-weight: 700; } /* dance style tags as chips (first = active look, handoff profile) */ body.tpf-skin-neu .tpf-profile-page-styles li { display: inline-block; margin: 0 6px 6px 0; padding: 5px 14px; border-radius: 99px; background: #fff; border: 1px solid var(--neu-border); color: var(--neu-plum); font-weight: 600; font-size: 14px; } body.tpf-skin-neu .tpf-profile-page-styles li:first-child { background: var(--tpf-magenta); border-color: var(--tpf-magenta); color: #fff; } body.tpf-skin-neu .tpf-profile-page-nearby { margin-top: 26px; } /* ---------- events: date tile + highlight card ---------- */ body.tpf-skin-neu .tpf-event-list-date, body.tpf-skin-neu .tpf-course-list-dates { display: inline-block; min-width: 64px; padding: 8px 12px; border-radius: 14px; background: var(--neu-accent-soft); color: var(--neu-plum); font-weight: 700; text-align: center; } body.tpf-skin-neu .tpf-event-highlight { display: grid; grid-template-columns: 1.1fr 1fr; gap: 22px; align-items: center; border-radius: 26px; padding: 22px; box-shadow: var(--neu-shadow-raised); } body.tpf-skin-neu .tpf-event-highlight .tpf-event-list-photo, body.tpf-skin-neu .tpf-event-highlight .tpf-event-list-photo-noimg { width: 100%; height: 260px; object-fit: cover; border-radius: 18px; grid-row: 1 / span 2; } body.tpf-skin-neu .tpf-event-highlight .tpf-event-list-title { display: block; font-size: 24px; font-weight: 700; margin: 8px 0; } body.tpf-skin-neu .tpf-event-highlight-badge { display: inline-block; padding: 5px 14px; border-radius: 99px; background: var(--neu-accent-soft); color: var(--tpf-magenta); font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; } @media (max-width: 760px) { body.tpf-skin-neu .tpf-event-highlight { grid-template-columns: 1fr; } body.tpf-skin-neu .tpf-event-highlight .tpf-event-list-photo, body.tpf-skin-neu .tpf-event-highlight .tpf-event-list-photo-noimg { height: 180px; grid-row: auto; } } /* ---------- account dashboard: columns as cards ---------- */ body.tpf-skin-neu .tpf-dashboard-col-main, body.tpf-skin-neu .tpf-dashboard-col-side { background: var(--neu-surface); border-radius: 22px; padding: 22px; box-shadow: var(--neu-shadow-card); } /* ---------- messages: softer inbox + bubbles ---------- */ body.tpf-skin-neu .tpf-conversation-item { border-bottom: 0; border-radius: 16px; padding: 12px 14px; margin-bottom: 6px; background: var(--neu-surface); box-shadow: var(--neu-shadow-card); } body.tpf-skin-neu .tpf-conversation-item:hover { background: var(--neu-accent-soft); } body.tpf-skin-neu .tpf-message-bubble { border-radius: 18px; } body.tpf-skin-neu .tpf-message-own { background: var(--neu-accent-soft); border-color: var(--neu-border); border-bottom-right-radius: 6px; } body.tpf-skin-neu .tpf-message-other { border-bottom-left-radius: 6px; } /* ---------- photos: rounded grid + upload button ---------- */ body.tpf-skin-neu .tpf-photo img { border-radius: 16px; } body.tpf-skin-neu .tpf-photo { border-radius: 16px; box-shadow: var(--neu-shadow-card); }