/* ================================================================
   RDC YouTube Player — CSS v1.0.0
   ================================================================ */

.rdc-yt-player { width: 100%; font-family: inherit; }

/* ── Layout: player esquerda + playlist direita ── */
.rdc-yt-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 28px;
    align-items: start;
}

/* ── Player (iframe 16:9) ── */
.rdc-yt-main { width: 100%; }

.rdc-yt-iframe-wrap {
    position: relative;
    width: 100%;
    padding-top: 56.25%; /* 16:9 */
    overflow: hidden;
}
.rdc-yt-frame {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

/* ── Playlist ── */
.rdc-yt-playlist { min-width: 0; }

/* ── Item ── */
.rdc-yt-item { transition: opacity .15s; }
.rdc-yt-item:hover { opacity: .85; }
.rdc-yt-item:focus-visible { outline: 2px solid #FF6A00; outline-offset: 2px; border-radius: 4px; }

/* ── Thumbnail ── */
.rdc-yt-thumb-wrap img {
    /* fill garantido via inline style no PHP */
}

/* ── Título ── */
.rdc-yt-item-title { word-break: break-word; }

/* ================================================================
   Responsive
   ================================================================ */
@media (max-width: 1024px) {
    .rdc-yt-layout { grid-template-columns: 1fr 300px; gap: 20px; }
    .rdc-yt-thumb-wrap { width: 130px !important; height: 73px !important; }
}

@media (max-width: 768px) {
    .rdc-yt-layout { grid-template-columns: 1fr; }
    .rdc-yt-thumb-wrap { width: 120px !important; height: 68px !important; }
}

@media (max-width: 480px) {
    .rdc-yt-thumb-wrap { width: 100px !important; height: 56px !important; }
    .rdc-yt-num { font-size: 20px !important; }
}

/* ── Accessibility ── */
@media (prefers-reduced-motion: reduce) {
    .rdc-yt-item { transition: none; }
}
