/* --- DASHBOARD KACHEL-HINTERGRUENDE + OFFENE-TIPPS-KARTE --- */
/* Eigene Zusatzdatei. Keine app.js-Logik. Cemal bleibt bewusst unangetastet. */

/* WICHTIG: Bilder bitte in den Ordner images/dashboard/ legen. */

#dash-tile-tippen,
#dash-tile-gruppen,
#dash-tile-rangliste,
#dash-tile-ergebnisse,
#dash-tile-quiz,
#dash-tile-mediathek,
#dash-tile-preispool,
#dash-tile-anleitung,
#dash-tile-kaffee-duell {
    position: relative !important;
    overflow: hidden !important;
    isolation: isolate !important;
    background-color: #0d1018 !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    border: 3px solid #7a0012 !important;
    border-top: 3px solid #7a0012 !important;
    box-shadow: none !important;
}

#dash-tile-tippen::before,
#dash-tile-tippen::after,
#dash-tile-gruppen::before,
#dash-tile-gruppen::after,
#dash-tile-rangliste::before,
#dash-tile-rangliste::after,
#dash-tile-ergebnisse::before,
#dash-tile-ergebnisse::after,
#dash-tile-quiz::before,
#dash-tile-quiz::after,
#dash-tile-mediathek::before,
#dash-tile-mediathek::after,
#dash-tile-preispool::before,
#dash-tile-preispool::after,
#dash-tile-anleitung::before,
#dash-tile-anleitung::after,
#dash-tile-kaffee-duell::before,
#dash-tile-kaffee-duell::after {
    content: none !important;
    display: none !important;
}

#dash-tile-tippen > *,
#dash-tile-gruppen > *,
#dash-tile-rangliste > *,
#dash-tile-ergebnisse > *,
#dash-tile-quiz > *,
#dash-tile-mediathek > *,
#dash-tile-preispool > *,
#dash-tile-anleitung > *,
#dash-tile-kaffee-duell > * {
    position: relative !important;
    z-index: 1 !important;
}

#dash-tile-tippen .icon,
#dash-tile-gruppen .icon,
#dash-tile-rangliste .icon,
#dash-tile-ergebnisse .icon,
#dash-tile-quiz .icon,
#dash-tile-mediathek .icon,
#dash-tile-preispool .icon,
#dash-tile-anleitung .icon,
#dash-tile-kaffee-duell .icon {
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.65) !important;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.48));
}

#dash-tile-tippen h2,
#dash-tile-gruppen h2,
#dash-tile-rangliste h2,
#dash-tile-ergebnisse h2,
#dash-tile-quiz h2,
#dash-tile-mediathek h2,
#dash-tile-preispool h2,
#dash-tile-anleitung h2,
#dash-tile-kaffee-duell h2 {
    color: #ffffff !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.70) !important;
}

#dash-tile-tippen p,
#dash-tile-gruppen p,
#dash-tile-rangliste p,
#dash-tile-ergebnisse p,
#dash-tile-quiz p,
#dash-tile-mediathek p,
#dash-tile-preispool p,
#dash-tile-anleitung p,
#dash-tile-kaffee-duell p {
    color: rgba(255, 255, 255, 0.95) !important;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.70) !important;
}

#dash-tile-tippen:hover,
#dash-tile-gruppen:hover,
#dash-tile-rangliste:hover,
#dash-tile-ergebnisse:hover,
#dash-tile-quiz:hover,
#dash-tile-mediathek:hover,
#dash-tile-preispool:hover,
#dash-tile-anleitung:hover,
#dash-tile-kaffee-duell:hover {
    border-color: var(--porsche-red) !important;
    border-top-color: var(--porsche-red) !important;
}

/* Einzelne Bilder */
#dash-tile-tippen {
    background-image:
        linear-gradient(rgba(4, 8, 16, 0.52), rgba(4, 8, 16, 0.74)),
        url('images/dashboard/dashboard-tippen-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-gruppen {
    background-image:
        linear-gradient(rgba(5, 11, 24, 0.56), rgba(5, 11, 24, 0.76)),
        url('images/dashboard/dashboard-gruppen-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-rangliste {
    background-image:
        linear-gradient(rgba(4, 8, 18, 0.42), rgba(4, 8, 18, 0.74)),
        url('images/dashboard/dashboard-rangliste-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-ergebnisse {
    background-image:
        linear-gradient(rgba(5, 8, 18, 0.52), rgba(5, 8, 18, 0.76)),
        url('images/dashboard/dashboard-ergebnisse-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-quiz {
    background-image:
        linear-gradient(rgba(4, 10, 18, 0.48), rgba(4, 10, 18, 0.78)),
        url('images/dashboard/dashboard-quiz-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-mediathek {
    background-image:
        linear-gradient(rgba(3, 7, 16, 0.54), rgba(3, 7, 16, 0.78)),
        url('images/dashboard/dashboard-mediathek-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-preispool {
    background-image:
        linear-gradient(rgba(7, 8, 16, 0.46), rgba(7, 8, 16, 0.76)),
        url('images/dashboard/dashboard-preispool-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-anleitung {
    background-image:
        linear-gradient(rgba(4, 8, 18, 0.56), rgba(4, 8, 18, 0.78)),
        url('images/dashboard/dashboard-anleitung-bg.png') !important;
    background-position: center center !important;
}

#dash-tile-kaffee-duell {
    background-image:
        linear-gradient(rgba(7, 8, 16, 0.42), rgba(7, 8, 16, 0.76)),
        url('images/dashboard/dashboard-kaffee-duell-bg.png') !important;
    background-position: center top !important;
}

/* Offene Tipps / Tipp-Erinnerung */
.tip-reminder-card {
    border: 1px solid rgba(255, 215, 0, 0.28) !important;
    background:
        linear-gradient(rgba(5, 9, 18, 0.54), rgba(5, 9, 18, 0.80)),
        url('images/dashboard/dashboard-offene-tipps-bg.png') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

.tip-reminder-card::before {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.045), transparent 34%, rgba(255, 255, 255, 0.03)) !important;
}

.tip-reminder-next {
    background: rgba(0, 0, 0, 0.28) !important;
    border: 1px solid rgba(255, 255, 255, 0.10) !important;
}

@media (max-width: 700px) {
    #dash-tile-tippen,
    #dash-tile-gruppen,
    #dash-tile-rangliste,
    #dash-tile-ergebnisse,
    #dash-tile-quiz,
    #dash-tile-mediathek,
    #dash-tile-preispool,
    #dash-tile-anleitung,
    #dash-tile-kaffee-duell {
        background-position: center center !important;
    }

    #dash-tile-kaffee-duell {
        background-position: center top !important;
    }

    .tip-reminder-card {
        background-position: center center !important;
    }
}


/* Dashboard-Kacheln: Emojis/Symbole ausblenden, weil die neuen Bildhintergründe die Kategorie zeigen */
/* Cemal bleibt ausgenommen und behält sein Symbol. */
#dash-tile-tippen .icon,
#dash-tile-gruppen .icon,
#dash-tile-rangliste .icon,
#dash-tile-ergebnisse .icon,
#dash-tile-quiz .icon,
#dash-tile-mediathek .icon,
#dash-tile-preispool .icon,
#dash-tile-anleitung .icon,
#dash-tile-kaffee-duell .icon {
    display: none !important;
}

#dash-tile-cemal .icon {
    display: block !important;
}