/**
 * News Article component styles for filterable components
 * Follows the JPK theme's design system
 */

.filterable-system {
    /* News Article component styling */
    & .filterable-card[data-type="news-article"] {
        position: relative;
        overflow: hidden;
        padding: var(--spacing-md);
        background: linear-gradient(to bottom, #000000 0%, #181818 100%);
        border: 1px solid #ffffff;
        
        & .card-content {
            height: 100%;
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        
        & .news-article-content {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 100%;
            text-align: center;
            
            & h2.yellow-text {
                text-align: center;
                margin-bottom: var(--spacing-sm);
            }
            
            & .news-excerpt {
                color: #ffffff;
                margin-bottom: var(--spacing-md);
                flex-grow: 1;
                font-size: 1.3rem;
            }
            
            & .news-button-container {
                display: flex;
                justify-content: center;
                margin-top: auto;
                
                & .btn {
                    min-width: 150px;
                }
            }
        }
    }
}