/* Minimal Styles - Most styling moved to Tailwind */

.background-image {
    background: url('background.png') no-repeat center center/cover;
}

/* Snow Animation */
.snowflake {
    position: absolute;
    top: -10px;
    background: white;
    border-radius: 50%;
    opacity: 0.8;
    animation: fall linear infinite;
}

@keyframes fall {
    to {
        transform: translateY(110vh);
    }
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    background: #0b1026;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #1f2937;
    border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
    background: #ffb74d;
    /* Warm Glow */
}

/* Tab Transitions */
.tab-content {
    animation: fadeIn 0.5s ease-out forwards;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* News Card & Expansion */
.news-card {
    transition: background-color 0.2s;
}

.news-card:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

.news-card-breakdown {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}

.news-card.expanded .news-card-breakdown {
    max-height: 500px;
    /* Arbitrary large height for transition */
    transition: max-height 0.5s cubic-bezier(1, 0, 1, 0);
}

.news-card .chevron {
    transition: transform 0.3s ease;
}

.news-card.expanded .chevron {
    transform: rotate(180deg);
}

/* News Image */
.news-thumbnail {
    width: 80px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
    filter: brightness(0.8);
    transition: all 0.3s ease;
}

.news-card:hover .news-thumbnail {
    filter: brightness(1);
}

/* Economic Calendar */
#calendar-body tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    transition: background-color 0.2s;
}

#calendar-body tr:hover {
    background-color: rgba(255, 255, 255, 0.02);
}

.impact-high {
    color: #ef4444;
}

.impact-mid {
    color: #f59e0b;
}

.impact-low {
    color: #10b981;
}

/* Chart Canvas Helper */
canvas#stockChart {
    width: 100% !important;
    height: 100% !important;
}