/* Goal Pulse Animation (Updated for Dark Background) */
.animate-goal-pulse {
    animation: pulse-bg 1s infinite alternate;
}

/* Use a bright but muted yellow for the pulse background */
@keyframes pulse-bg {
    from {
        background-color: #475569;
        /* Slate 700 */
    }
    to {
        background-color: #64748b;
        /* Slate 600 */
    }
}

/* Container for Chart Scrolling */
.history-chart-container {
    position: relative;
    max-width: 100%; 
    height: 100px; 
    overflow: hidden; 
}

.chart-canvas {
    /* IMPORTANT: Tells Chart.js to fill the container's dimensions exactly */
    width: 100% !important; 
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important; 
}

/* Slide transition for the goal notification */
.slide-fade-enter-active {
    transition: all .3s ease;
}

.slide-fade-leave-active {
    transition: all .8s cubic-bezier(1.0, 0.5, 0.8, 1.0);
}

.slide-fade-enter,
.slide-fade-leave-to
/* .slide-fade-leave-active in <2.1.8 */

{
    transform: translateY(-20px);
    opacity: 0;
}