/* Grid Agenda Block Frontend Styles */
.block-grid-agenda {
    width: 100%;
    overflow: hidden;
}

/* Grid agenda container */
.grid-agenda-container {
    width: 100%;
}

/* Track filter styling */
.track-filter {
    transition: all 0.2s ease;
    white-space: nowrap;
}

.track-filter:hover {
    transform: translateY(-1px);
}

.track-filter.active {
    ring: 2px solid #374151;
}

/* Agenda wrapper - stable grid layout */
.grid-agenda-wrapper {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.5rem;
    align-items: start;
    width: 100%;
    background: transparent;
}

/* Ensure single column on mobile/tablet */
@media (max-width: 1023px) {
    .block-grid-agenda .grid-agenda-wrapper {
        grid-template-columns: 1fr !important;
    }
}

.wp-block-acf-grid-agenda .grid-agenda-wrapper .acf-innerblocks-container {
    display: contents
}

/* Individual agenda items - normal width (1 column) */
.grid-agenda-wrapper .wp-block-acf-item-agenda .item-agenda {
    width: 100%;
    position: relative;
    grid-column: span 1;
}

/* Full width items (4 columns) */
.grid-agenda-wrapper .wp-block-acf-item-agenda[data-width="full"] .item-agenda {
    grid-column: span 4;
}

/* Remove any transitions that might cause flickering */
.grid-agenda-wrapper .wp-block-acf-item-agenda * {
    transition: none !important;
}

/* Read more functionality */
.read-more-btn {
    transition: color 0.2s ease;
    cursor: pointer;
    pointer-events: auto;
    text-decoration: underline;
    background: none;
    border: none;
    padding: 0;
    font: inherit;
}

.read-more-btn:hover {
    opacity: 0.8;
    color:white!important;
    text-decoration: underline;
}

.read-more-btn:focus {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

.read-more-content {
    transition: all 0.3s ease;
}

.read-more-content.hidden {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
}

.read-more-content:not(.hidden) {
    opacity: 1;
    max-height: 500px;
}

/* Responsive adjustments */
@media (max-width: 1023px) {
    .grid-agenda-wrapper {
        grid-template-columns: 1fr !important;
        gap: 0.5rem;
    }
    
    .grid-agenda-wrapper .wp-block-acf-item-agenda[data-width="full"] .item-agenda {
        grid-column: span 1 !important;
    }
    
    .track-filter {
        font-size: 0.875rem;
        padding: 0.5rem 1rem;
    }
}

/* Additional spacing for mobile */
@media (max-width: 768px) {
    .block-grid-agenda {
        padding: 0.5rem;
    }
    
    .grid-agenda-wrapper {
        grid-template-columns: 1fr !important;
    }
}