/* ZENTRALE MASTER STIL-DATEI FÜR ALLE OBEREN PILLS (Shop / Ankauf / B2B) */
/* Diese CSS-Datei erzwingt ein identisches Layout der Navigationskapsel auf allen Sub-Domains */

.tm24-pill-nav {
    display: inline-flex !important;
    align-items: center !important;
    background: #f8fafc !important;
    padding: 4px !important;
    border-radius: 9999px !important;
    gap: 4px !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.02) !important;
    border: 1px solid #e2e8f0 !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

.tm24-pill {
    padding: 8px 16px !important;
    border-radius: 9999px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    font-family: 'Figtree', sans-serif !important;
    color: #475569 !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    height: 38px !important;
    box-sizing: border-box !important;
}

.tm24-pill i {
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.tm24-pill span {
    display: inline-block !important;
    line-height: 1 !important;
}

.tm24-pill:hover {
    color: #0f172a !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !important;
    transform: translateY(-1px) !important;
}

/* N E U E R   S T A N D A R D : NUR NOCH GRÜN für "is-active", egal wo! */
.tm24-pill.is-active {
    background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
    color: #fff !important;
    border-color: transparent !important;
    box-shadow: 0 4px 16px rgba(22, 163, 74, 0.25) !important;
}

.tm24-pill.is-active:hover {
    color: #fff !important;
    box-shadow: 0 6px 22px rgba(22, 163, 74, 0.35) !important;
    transform: translateY(-1px) !important;
}
