/*
 * Turnen-App – zentrale Typografie
 * Version 19.5.3
 *
 * Diese Datei wird nach app.css und dem Tenant-Theme geladen.
 * Alle sichtbaren Schriftgrößen werden aus dieser einen Skala abgeleitet.
 */

:root {
    --type-xs: 0.68rem;
    --type-sm: 0.75rem;
    --type-base: 0.82rem;
    --type-md: 0.9rem;
    --type-lg: 1rem;
    --type-xl: 1.12rem;
    --type-page: clamp(1.34rem, 1.8vw, 1.55rem);
    --type-display: clamp(1.65rem, 3.1vw, 2.05rem);
    --type-stat: clamp(1.05rem, 1.7vw, 1.28rem);
    --line-compact: 1.25;
    --line-body: 1.45;
}

html {
    font-size: 100%;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

body {
    font-size: var(--type-base);
    line-height: var(--line-body);
}

/* Kopfbereich und Vereinskennung */
.brand-text strong {
    font-size: var(--type-md) !important;
    line-height: var(--line-compact) !important;
}

.brand-text small,
.app-footer {
    font-size: var(--type-sm) !important;
    line-height: var(--line-compact) !important;
}

/* Desktop- und Tablet-Quer-Navigation */
.app-nav--desktop .nav-main-link,
.app-nav--desktop .nav-group__trigger,
.app-nav--desktop .nav-form button {
    font-size: var(--type-sm) !important;
    line-height: var(--line-compact) !important;
}

.app-nav--desktop .nav-group__menu a,
.app-nav--desktop .nav-group__item {
    font-size: var(--type-sm) !important;
    line-height: 1.3 !important;
}

.app-nav--desktop .nav-group__item small,
.app-nav--desktop .task-count-badge {
    font-size: var(--type-xs) !important;
}

/* Einheitliche Hierarchie innerhalb aller App-Seiten */
.app-main {
    font-size: var(--type-base) !important;
    line-height: var(--line-body) !important;
}

.app-main h1,
.app-main .page-hero h1,
.app-main .dashboard-hero-v2 h1,
.app-main .admin-dashboard-hero h1 {
    font-size: var(--type-page) !important;
    line-height: 1.12 !important;
    letter-spacing: -0.02em !important;
}

.app-main h2,
.app-main .page-hero h2,
.app-main .section-header h2,
.app-main .dashboard-panel-v2 h2,
.app-main .admin-dashboard-section h2 {
    font-size: var(--type-xl) !important;
    line-height: 1.2 !important;
}

.app-main h3,
.app-main .dashboard-stat-group h3,
.app-main .card h3,
.app-main summary strong {
    font-size: var(--type-lg) !important;
    line-height: 1.25 !important;
}

.app-main h4,
.app-main h5,
.app-main h6 {
    font-size: var(--type-md) !important;
    line-height: 1.3 !important;
}

.app-main p,
.app-main li,
.app-main dd,
.app-main dt,
.app-main label,
.app-main .notice,
.app-main .empty-state,
.app-main .dashboard-panel-v2 p,
.app-main .page-hero p,
.app-main .tenant-home__lead,
.app-main .tenant-home__features span,
.app-main .tenant-home__roles p {
    font-size: var(--type-base) !important;
    line-height: var(--line-body) !important;
}

.app-main small,
.app-main .muted,
.app-main .help-text,
.app-main .form-help,
.app-main .field small,
.app-main .data-table td small,
.app-main .quick-action-card small,
.app-main .dashboard-mini-stats span,
.app-main .admin-dashboard-status span {
    font-size: var(--type-sm) !important;
    line-height: 1.4 !important;
}

/* Formulare und Aktionen */
.app-main input,
.app-main select,
.app-main textarea,
.app-main button,
.app-main .button,
.app-main .field span,
.app-main .filter-bar,
.app-main .filter-bar label {
    font-size: var(--type-base) !important;
    line-height: 1.3 !important;
}

.app-main .button-small,
.app-main .table-actions .button,
.app-main .compact-actions .button {
    font-size: var(--type-sm) !important;
}

/* Tabellen und Listen */
.app-main table,
.app-main th,
.app-main td,
.app-main .data-table,
.app-main .data-table--compact th,
.app-main .data-table--compact td {
    font-size: var(--type-sm) !important;
    line-height: 1.35 !important;
}

/* Kleine Kennzeichnungen */
.app-main .badge,
.app-main .eyebrow,
.app-main .chip,
.app-main .status-pill,
.app-main .task-count-badge,
.app-main .progress-status-badge {
    font-size: var(--type-xs) !important;
    line-height: 1.2 !important;
}

/* Kennzahlen */
.app-main .dashboard-stat-card strong,
.app-main .dashboard-mini-stats strong,
.app-main .admin-dashboard-status strong,
.app-main .stat-card strong,
.app-main .metric-card strong,
.app-main .summary-stat strong {
    font-size: var(--type-stat) !important;
    line-height: 1.1 !important;
}

/* Öffentliche Startseite – bewusst etwas größer, aber aus derselben Skala */
.app-main .tenant-home__copy h1,
.app-main .public-auth-copy h1,
.app-main .hero-card > h1 {
    font-size: var(--type-display) !important;
    line-height: 1.05 !important;
    letter-spacing: -0.035em !important;
}

.app-main .tenant-home__access h2 {
    font-size: var(--type-xl) !important;
}

.app-main .tenant-home__register,
.app-main .tenant-home__roles h3 {
    font-size: var(--type-base) !important;
}

/* Meldungen */
.toast {
    font-size: var(--type-base) !important;
}

.toast__close {
    font-size: var(--type-sm) !important;
}

/* Mobile Navigation: Text kompakt halten, Icons und Touchflächen nicht verkleinern. */
.mobile-tabbar__item,
.mobile-subnav__item {
    font-size: var(--type-xs) !important;
    line-height: 1.15 !important;
}

.mobile-tabbar__item small,
.mobile-subnav__item small,
.mobile-tabbar .task-count-badge,
.mobile-subnav .task-count-badge {
    font-size: 0.62rem !important;
}

/* Smartphone und Tablet hochkant */
@media (max-width: 760px),
       (min-width: 761px) and (max-width: 1024px) and (orientation: portrait) {
    :root {
        --type-xs: 0.64rem;
        --type-sm: 0.72rem;
        --type-base: 0.79rem;
        --type-md: 0.86rem;
        --type-lg: 0.94rem;
        --type-xl: 1.04rem;
        --type-page: 1.28rem;
        --type-display: 1.55rem;
        --type-stat: 1.08rem;
    }

    .app-main h1,
    .app-main .page-hero h1,
    .app-main .dashboard-hero-v2 h1,
    .app-main .admin-dashboard-hero h1 {
        line-height: 1.15 !important;
    }
}

/* Sehr kleine Telefone */
@media (max-width: 390px) {
    :root {
        --type-sm: 0.7rem;
        --type-base: 0.77rem;
        --type-page: 1.2rem;
        --type-display: 1.42rem;
    }
}
