/*
 * WarteCheck.de Typography Refresh – 2026-08-25
 * Ziel: bessere Lesbarkeit ohne pauschales Skalieren des gesamten Layouts.
 * Die Größen folgen einer festen Typografie-Skala und überschreiben gezielt
 * die historisch sehr kleinen 8–12px-Komponenten.
 */
:root {
  --wc-font-xs: .75rem;      /* 12px – echte Sekundärinfos/Badges */
  --wc-font-sm: .8125rem;    /* 13px – Meta, Aktionen, Tabs */
  --wc-font-md: .875rem;     /* 14px – UI/Buttons/Benutzernamen */
  --wc-font-body: .9375rem;  /* 15px – kompakter Fließtext */
  --wc-font-base: 1rem;      /* 16px – normaler Fließtext */
  --wc-font-lg: 1.125rem;    /* 18px – Abschnittsüberschriften */
}

/* Globale Lesbarkeit: keine kleingedruckten Meta-Texte unter 12px. */
body { font-size: var(--wc-font-body); }
.app-stage :where(small, time, figcaption) { font-size: var(--wc-font-sm); line-height: 1.4; }
.app-stage :where(label:not(.visually-hidden)) { font-size: var(--wc-font-sm); line-height: 1.4; }
.app-stage :where(.eyebrow) { font-size: var(--wc-font-xs); line-height: 1.4; }
.app-stage :where(.section-help, .card-data-note, .forecast-disclaimer, .calendar-info, .leaderboard-note) {
  font-size: var(--wc-font-sm);
  line-height: 1.55;
}

/* Header, Konto-Menüs und mobile Hauptnavigation. */
.topbar-context span,
.site-user-menu summary small,
.desktop-user-identity small,
.desktop-user-identity em,
.mobile-account-section small,
.sidebar-meta,
.footer-brand span,
.footer-source span,
.footer-legal a,
.footer-privacy-settings,
.footer-social > span,
.qt-powered { font-size: var(--wc-font-xs); }

.desktop-user-profile-actions a,
.desktop-user-panel nav a,
.mobile-account-section nav strong,
.mobile-account-section nav small,
.topbar-notification-popover button,
.topbar-notification-footer { font-size: var(--wc-font-sm); }

.mobile-app-nav a,
.mobile-app-nav button { font-size: var(--wc-font-sm); line-height: 1.15; }

/* Allgemeine Controls: Text soll lesbar bleiben, Icon-only Buttons behalten ihre Icons. */
.app-stage :where(.btn, .form-control, .form-select) { font-size: var(--wc-font-md); }
.app-stage :where(input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="date"], input[type="number"], textarea, select) {
  font-size: var(--wc-font-md);
}

/* Community-Navigation, Feed und Composer. */
.community-page .community-section-nav a,
.community-page .community-feed-switch a,
.community-page .community-contact-tabs button,
.community-page .community-person-primary,
.community-page .community-person-menu button,
.community-page .community-back-link { font-size: var(--wc-font-sm); }

.community-page .community-section-nav b,
.community-page .community-contact-tabs button b,
.community-page .community-media-counter { font-size: var(--wc-font-xs); }

.community-page .community-context-copy,
.community-page .community-composer-author small,
.community-page .community-composer-counter,
.community-page .community-form-status,
.community-page .community-post-context,
.community-page .community-person-copy small,
.community-page .community-contact-panel header p,
.community-page .community-side-card small { font-size: var(--wc-font-sm); line-height: 1.45; }

.community-page .community-composer-start > button strong,
.community-page .community-composer-author strong,
.community-page .community-person-copy strong { font-size: var(--wc-font-md); }

.community-page .community-composer-start > button small,
.community-page .community-composer-head > div small,
.community-page .community-composer-tools button:not(.btn),
.community-page .community-file-button,
.community-page .community-poll-editor > button,
.community-page .community-composer-linkbar,
.community-page .community-poll-editor label { font-size: var(--wc-font-sm); }

.community-page .community-composer textarea,
.community-page .community-comment-form textarea,
.community-page .community-friend-search input,
.community-page .community-link-search input,
.community-page .community-poll-editor input { font-size: var(--wc-font-body); line-height: 1.5; }

.community-post-author > a strong { font-size: var(--wc-font-body); }
.community-post-author > a small,
.community-post-author > div { font-size: .78125rem; line-height: 1.4; } /* 12.5px */
.community-post-body { font-size: .96875rem; line-height: 1.65; } /* 15.5px */
.community-post-context { font-size: var(--wc-font-sm); }
.community-post-actions a,
.community-post-actions b { font-size: var(--wc-font-sm); }

/* Feed-Kommentare – höchste Priorität. */
.community-comments-head strong { font-size: var(--wc-font-base); }
.community-comments-head span { font-size: .78125rem; }
.community-comment-body strong { font-size: var(--wc-font-md); }
.community-comment-body small { font-size: .78125rem; line-height: 1.4; }
.community-comment-body p { margin-top: .28rem; font-size: var(--wc-font-body); line-height: 1.5; }
.community-comment-actions button { min-height: 2rem; font-size: var(--wc-font-sm); line-height: 1.3; }
.community-comment-form textarea { font-size: var(--wc-font-body); }

/* Messenger: Nachrichten 15px, Meta 12–13px, Bedienelemente 13–14px. */
.messenger-list-heading .eyebrow,
.messenger-chat-menu-title,
.messenger-unread-divider,
.messenger-request-compose-note,
.messenger-emoji-section-head strong,
.messenger-emoji-more { font-size: var(--wc-font-xs); }

.messenger-list-heading p,
.messenger-conversation-copy small,
.messenger-conversation small,
.messenger-conversation-meta time,
.messenger-conversation-meta b,
.messenger-chat-identity small,
.messenger-chat > header > a:nth-of-type(2) small,
.messenger-message > div > small,
.messenger-share-card small,
.messenger-typing,
.messenger-new-panel small,
.messenger-media-preview small,
.messenger-request-banner p,
.messenger-emoji-picker > header small,
.messenger-emoji-empty { font-size: .78125rem; line-height: 1.4; }

.messenger-conversation-copy strong,
.messenger-conversation strong,
.messenger-chat-identity strong,
.messenger-chat > header > a:nth-of-type(2) strong,
.messenger-share-card strong,
.messenger-media-preview strong,
.messenger-request-banner strong,
.messenger-emoji-picker > header strong { font-size: var(--wc-font-md); }

.messenger-message p { font-size: var(--wc-font-body); line-height: 1.55; }
.messenger-message em,
.messenger-disabled,
.messenger-share-pending { font-size: var(--wc-font-sm); }
.messenger-composer textarea,
.messenger-search input { font-size: var(--wc-font-body); line-height: 1.5; }
.messenger-chat-menu button,
.messenger-chat > header details button { font-size: var(--wc-font-sm) !important; }

/* Topliste: Ranking soll kompakt bleiben, aber Zusatzdaten nicht wie Kleingedrucktes wirken. */
.leaderboard-head .eyebrow,
.leaderboard-ranking-mode-copy .eyebrow,
.leaderboard-list-head,
.leaderboard-park-group-title { font-size: var(--wc-font-xs); }

.leaderboard-head p,
.leaderboard-head-status small,
.leaderboard-ranking-mode-copy p,
.leaderboard-ranking-tabs small,
.leaderboard-filter-open em,
.leaderboard-park-option small,
.leaderboard-filter-summary,
.leaderboard-active-filters > a,
.leaderboard-member-search small,
.leaderboard-own-copy small,
.leaderboard-own-gap,
.leaderboard-ride-split,
.leaderboard-user small,
.leaderboard-details,
.leaderboard-rides small,
.leaderboard-empty p,
.leaderboard-search-empty p,
.leaderboard-note { font-size: var(--wc-font-xs); line-height: 1.4; }

.leaderboard-ranking-tabs strong,
.leaderboard-periods a,
.leaderboard-filter-open,
.leaderboard-filters label,
.leaderboard-filter-actions > a,
.leaderboard-own-rank.is-empty > a { font-size: var(--wc-font-sm); }

.leaderboard-select-trigger,
.leaderboard-park-search input,
.leaderboard-park-option strong,
.leaderboard-member-search input,
.leaderboard-own-copy strong,
.leaderboard-user strong { font-size: var(--wc-font-md); }

.leaderboard-rank { font-size: var(--wc-font-base); }
.leaderboard-rides { font-size: 1.2rem; }

/* Profile, Konto, RideCount und Besuchsplaner. */
.member-panel > header > span,
.member-panel > header > a,
.member-form small,
.member-check,
.member-auth-links,
.member-resend summary,
.member-kpi-grid span,
.profile-stat-grid span,
.member-kpi-grid small,
.member-compact-list small,
.member-compact-list time,
.member-ride-history span,
.member-alert-list small,
.member-wishlist-grid small,
.member-wishlist-grid span,
.member-notification-list small,
.member-notification-list time,
.member-session-list small,
.achievement-grid small,
.member-primary-badge { font-size: var(--wc-font-sm); line-height: 1.45; }

.member-form label,
.ride-alert-form label,
.ride-backdate label,
.member-tabs a,
.profile-social-fields legend,
.plan-wishlist-options legend,
.visit-plan-edit-dialog label { font-size: var(--wc-font-sm); }

.member-form label > span,
.profile-social-fields legend small,
.profile-social-fields > p,
.profile-stat-grid article small,
.profile-ride-date small,
.profile-ride-copy small,
.profile-favorite-list small,
.visit-planner-count small,
.plan-range-hint,
.plan-wishlist-options > p,
.plan-wishlist-options small,
.visit-plan-date small,
.visit-plan-overview-back,
.visit-plan-library > header > span,
.visit-plan-edit-dialog > div small { font-size: var(--wc-font-sm); line-height: 1.4; }

.profile-handle { font-size: var(--wc-font-md); }
.profile-bio { font-size: var(--wc-font-body); line-height: 1.6; }
.profile-social-links a { font-size: var(--wc-font-sm); }
.profile-ride-copy strong,
.profile-favorite-list strong { font-size: var(--wc-font-body); }

/* Park-/Wartezeiten-, Ride- und Kalenderseiten. */
.park-live-page :where(.park-breadcrumbs, .park-back-link, .park-active-label, .park-filter-row button, .park-sort-menu summary),
.ride-dashboard :where(.ride-breadcrumbs, .ride-range-tabs a),
.calendar-dashboard :where(.park-breadcrumbs, .park-page-tabs a) { font-size: var(--wc-font-sm); }

.park-live-page :where(.park-live-title small, .park-context-line small, .park-ride-copy small, .park-ride-subline, .park-wait-summary small),
.ride-dashboard :where(.data-state, .data-quality, .detail-meta-line b, .analytics-kpi-grid span, .ride-chart-head span, .ride-insight-panel dt, .forecast-disclaimer),
.calendar-dashboard :where(.calendar-step-nav span, .calendar-forecast-badge, .calendar-predicted, .calendar-crowd, .calendar-hours, .calendar-note, .calendar-legend, .attendance-summary span, .attendance-summary small) { font-size: var(--wc-font-xs); line-height: 1.4; }

.park-live-page :where(.park-ride-copy strong, .park-filter-row button, .park-sort-menu label),
.ride-dashboard :where(.ride-card h3, .current-ride-status, .detail-meta-line span, .ride-range-tabs a, .ride-chart-head strong, .ride-insight-panel dd),
.calendar-dashboard :where(.calendar-info, .calendar-weekday, .calendar-day-number) { font-size: var(--wc-font-sm); }

/* Blog: Artikel großzügig, Metadaten/Kommentare wie im Feed. */
.blog-article-body { font-size: 1.0625rem; line-height: 1.7; } /* 17px */
.blog-card-meta,
.blog-card-parks,
.blog-breadcrumb,
.blog-article-meta,
.blog-related time,
.blog-comment-count,
.blog-view-count,
.blog-article-cover figcaption,
.blog-article-body figcaption { font-size: var(--wc-font-xs); line-height: 1.4; }

.blog-filter-reset,
.blog-pagination span,
.blog-park-filter-toggle strong,
.blog-park-filter-toggle small,
.blog-park-filter-options strong,
.blog-park-filter-options small,
.blog-park-filter-empty { font-size: var(--wc-font-sm); }

.blog-comments-head h2 { font-size: var(--wc-font-lg); }
.blog-comments-head h2 span { font-size: var(--wc-font-xs); }
.blog-comment-input-row textarea { font-size: var(--wc-font-body); line-height: 1.5; }
.blog-comment-reply-context { font-size: var(--wc-font-sm); }
.blog-comment-bubble header strong { font-size: var(--wc-font-md); }
.blog-comment-bubble header small { font-size: .78125rem; line-height: 1.4; }
.blog-comment-bubble p { font-size: var(--wc-font-body); line-height: 1.5; }
.blog-comment-actions button,
.blog-comment-actions > span { min-height: 2rem; font-size: var(--wc-font-sm); }

/* Footer und Datenschutz: klein, aber lesbar. */
.footer-brand strong { font-size: var(--wc-font-sm); }
.footer-brand span,
.footer-source span,
.footer-legal a,
.footer-privacy-settings,
.footer-social > span,
.footer-social a,
.qt-powered,
.privacy-consent a { font-size: var(--wc-font-xs); }
.privacy-consent p { font-size: var(--wc-font-sm); line-height: 1.5; }

/* Mobile: Lesbarkeit nicht wieder reduzieren. */
@media (max-width: 767.98px) {
  body { font-size: var(--wc-font-body); }
  .mobile-app-nav a,
  .mobile-app-nav button { font-size: var(--wc-font-sm); }
  .community-page .community-section-nav a,
  .community-page .community-feed-switch a,
  .community-post-actions a,
  .community-post-actions b,
  .community-comment-actions button { font-size: var(--wc-font-sm); }
  .community-comment-body p,
  .messenger-message p,
  .messenger-composer textarea,
  .blog-comment-bubble p,
  .blog-comment-input-row textarea { font-size: var(--wc-font-body); }
  .park-page-tabs a { font-size: var(--wc-font-sm); }
}