/* layout.css – 실제 사용되는 YouTube 컴포넌트 스타일만 유지 */

/* ── Icon shape host ── */
.ytSpecIconShapeHost {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

/* ── Simple endpoint (link) ── */
.yt-simple-endpoint {
    display: inline-block;
    cursor: pointer;
    text-decoration: none;
    color: var(--yt-endpoint-color, var(--yt-spec-text-primary, #0f0f0f));
}

.yt-simple-endpoint:hover {
    color: var(--yt-endpoint-hover-color, var(--yt-spec-text-primary, #0f0f0f));
    text-decoration: var(--yt-endpoint-text-decoration, none);
}

/* ── Compact link renderer ── */
.yt-simple-endpoint.ytd-compact-link-renderer {
    display: block;
    cursor: pointer;
    text-decoration: none;
    color: var(--yt-endpoint-color, var(--yt-spec-text-primary, #0f0f0f));
}

.yt-simple-endpoint.ytd-compact-link-renderer:hover {
    color: var(--yt-endpoint-hover-color, var(--yt-spec-text-primary, #0f0f0f));
    text-decoration: var(--yt-endpoint-text-decoration, none);
}

/* ── Formatted string endpoint ── */
a.yt-simple-endpoint.yt-formatted-string {
    color: var(--yt-endpoint-color, var(--yt-spec-call-to-action, #065fd4));
    display: var(--yt-endpoint-display, inline-block);
    text-decoration: var(--yt-endpoint-text-regular-decoration, none);
}

a.yt-simple-endpoint.yt-formatted-string:hover {
    color: var(--yt-endpoint-hover-color, var(--yt-spec-call-to-action, #065fd4));
    text-decoration: var(--yt-endpoint-text-decoration, none);
}