.youtube-accordion {
    border: 1px solid #ccc;
    border-radius: 1px;
    overflow: hidden;
}

/* Header */
.accordion-header {
    cursor: pointer;
    padding: 8px;
    margin: 0;
    font-weight: 500;
    border-bottom: 1px solid #ddd;
    transition: background 0.3s, color 0.3s;
    font-size: 20px;
    background: var(--yt-color-inactive);
    color: var(--yt-font-inactive);
}

.accordion-header:hover {
    color: var(--yt-color-hover);
	background: var(--yt-bg-hover);
}


.accordion-header.active {
    background: var(--yt-color-active);
    color: var(--yt-font-active);
}

/* Content */
.accordion-content {
    display: none;
    padding: 15px;
    background: var(--yt-accordion-bg);
}

.accordion-content.show {
    display: block;
}

/* Video grid */
.video-row {
    display: flex;
    flex-wrap: wrap;
    gap: var(--yt-gap, 20px); /* koristi parametar ili default 20px */
}

.video-wrapper {
    flex: 1 1 var(--yt-width, 450px);   /* širina iz backenda ili 450px */
    max-width: var(--yt-width, 450px);
}

.video-wrapper iframe {
    width: 100%;
    aspect-ratio: 16 / 9; /* automatska visina */
    display: block;
}


