/* Global Base Styling */
body {
    /* Use Infinito.Nexus color scheme variables */
    background-color: var(--color-01-90);
    color: var(--color-01-05);
    min-height: 100vh;
    padding-bottom: 4rem; /* Space for footer bar */
}

/* Card Styling (Infinito.Nexus Homepage Style) */
.app-card {
    border-radius: 1rem;
    background: radial-gradient(
    circle at top left,
    rgba(var(--color-rgb-01-10), 0.95),
    rgba(var(--color-rgb-01-20), 0.90)
    );
    border: 1px solid rgba(var(--color-rgb-01-40), 0.35);
    box-shadow: 0 18px 45px rgba(var(--color-rgb-01-90), 0.65);
    transition: transform .12s ease-out, box-shadow .12s ease-out, border-color .12s ease-out;
}

.app-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 60px rgba(var(--color-rgb-01-90), 0.90);
    border-color: rgba(var(--color-rgb-01-30), 0.70);
}

.app-icon {
    font-size: 2.6rem;
}

.app-badge {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: .12em;
}

/* Footer Bar */
.footer-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1030;
}

.footer-bar .btn-link {
    text-decoration: none;
    font-size: 0.8rem;
}

.footer-bar .btn-link:hover {
    text-decoration: underline;
}

/* Nested dropdown - open to the left */
.dropdown-menu .dropdown-submenu {
    position: relative;
}

.dropdown-menu .dropdown-submenu > .dropdown-menu {
    top: 0;
    right: 100%;      /* statt left:100%; */
    left: auto;       /* überschreibt Bootstrap default */
    margin-right: .1rem;
}