/* 
 * Widgets Links CSS
 * Alle Link-Definitionen
 * Farben müssen via Custom Properties aus der colors.css genutzt werden
 */

/* Standard Link (basierend auf Vorlage) */
.base-link-standard {
    color: #1f6fd5;
    text-decoration: none;
    transition: color var(--transition-fast);
    font-family: var(--font-family-base);
    line-height: var(--line-height-normal);
}

.base-link-standard:hover {
    color: #1b5db3;
    text-decoration: underline;
}

/* Secondary Link */
.base-link-secondary {
    color: var(--color-text-secondary);
    text-decoration: none;
    transition: color var(--transition-fast);
    font-family: var(--font-family-base);
    line-height: var(--line-height-normal);
}

.base-link-secondary:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Text Link */
.base-link-text {
    color: var(--color-text-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
    font-family: var(--font-family-base);
    line-height: var(--line-height-normal);
}

.base-link-text:hover {
    color: var(--color-primary);
    text-decoration: underline;
}

/* Breadcrumb Navigation */
.base-breadcrumb {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-xs);
    margin-bottom: var(--spacing-lg);
    font-size: var(--font-size-sm);
    color: var(--color-text-secondary);
    font-family: var(--font-family-base);
    line-height: var(--line-height-normal);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}

.base-breadcrumb a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color var(--transition-fast);
}

.base-breadcrumb a:hover {
    color: var(--color-primary-dark);
    text-decoration: underline;
}

.base-breadcrumb-separator {
    color: var(--color-text-secondary);
    margin: 0;
}

.base-breadcrumb span:last-child {
    color: var(--color-text-primary);
    font-weight: var(--font-weight-medium);
}

/* Breadcrumb – Vorlage font-size 0.85rem, color #6b7280, breadcrumb a #4b5563 */
.base-breadcrumb-alt {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--spacing-xs);
    margin-top: var(--spacing-xl);
    margin-bottom: var(--spacing-lg);
    font-size: 0.85rem;
    color: #6b7280;
    font-family: var(--font-family-base);
    line-height: var(--line-height-normal);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}

.base-breadcrumb-alt a {
    color: #4b5563;
    text-decoration: none;
    transition: color var(--transition-fast);
}

.base-breadcrumb-separator-alt {
    margin: 0 var(--spacing-xs);
}

.base-breadcrumb-alt span:last-child {
    color: var(--color-text-primary);
    font-weight: var(--font-weight-semibold);
}

/* Touch vs Hover: Hover-Effekte nur auf Geräten mit Hover */
@media (hover: hover) and (pointer: fine) {
    .base-breadcrumb a:hover,
    .base-breadcrumb-alt a:hover {
        color: var(--color-primary-dark);
        text-decoration: underline;
    }
}