/* Overlay theme accents for v2 shell/pages — each overlay defines --theme-stripe */

.profile-hero,
.auth-shell .auth-card,
.song-hero,
.articles-page .article-card,
.member-card,
.follow-list-modal .modal-content,
.profile-message-form,
.profile-message-thread > .profile-message-item--root > .profile-message-body,
.notif-menu,
.aap-sheet {
    position: relative;
    overflow: hidden;
}

.profile-hero::after,
.auth-shell .auth-card::before,
.song-hero::before,
.articles-page .article-card::before,
.member-card::before,
.follow-list-modal .modal-content::before,
.profile-message-form::before,
.profile-message-thread > .profile-message-item--root > .profile-message-body::before,
.notif-menu::before,
.aap-sheet::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 2px;
    background: var(--theme-stripe, linear-gradient(90deg, #00c853, #434ce7));
    opacity: 0.72;
    pointer-events: none;
    z-index: 2;
}

.profile-hero::after {
    top: auto;
    bottom: 0;
    height: 3px;
    opacity: 0.85;
}

.footer-online-badge,
.auth-hero-badge,
.profile-stat-card {
    border-color: var(--theme-accent-border, rgba(255, 255, 255, 0.14)) !important;
}

.footer-online-badge {
    background: var(--theme-accent-soft, rgba(255, 255, 255, 0.06)) !important;
}

.auth-tab.active {
    box-shadow: inset 0 0 0 1px var(--theme-accent-border, rgba(0, 200, 83, 0.35));
}

.station-bubble.is-active,
.station-bubble[aria-current="true"] {
    box-shadow: 0 0 0 2px var(--theme-accent-soft, rgba(67, 76, 231, 0.25));
}

.profile-tab.is-active {
    color: #fff;
    border-bottom-color: var(--theme-accent, var(--color-success, #00c853));
}

.profile-message-replies {
    border-left-color: var(--theme-accent-border, rgba(255, 255, 255, 0.1));
}

/* Home mini timetable — edge fades match active theme background */
.miniTimetable::before {
    background: linear-gradient(90deg, var(--mini-tt-fade, var(--color-bg)) 40%, transparent) !important;
}

.miniTimetable::after {
    background: linear-gradient(-90deg, var(--mini-tt-fade, var(--color-bg)) 50%, transparent) !important;
}

.miniTimetable .pageContainer::after {
    background: var(--mini-tt-now-line, #f90050) !important;
}
