/* Copyright (c) 2026 Tinker Tarsier Plugins / Nevin Stoltz. All rights reserved. */
/* Tinker's YouTube Galleries — canonical frontend gallery styles. Also loaded in Designer preview. */
.ytgb-gallery{--thumb-count:var(--desk);box-sizing:border-box;margin:auto;padding:var(--gap);background:var(--bg);max-width:var(--mw);border-radius:var(--rad);box-shadow:var(--sh)}
.ytgb-frame{position:relative;width:100%;aspect-ratio:16/9;height:auto!important;min-height:0!important;padding:0!important;overflow:hidden;border-radius:var(--rad);background:#000}
.ytgb-frame iframe{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;display:block}
.ytgb-lazy-player{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:#000;cursor:pointer;display:block}
.ytgb-lazy-player img{width:100%;height:100%;object-fit:cover;display:block}
.ytgb-play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:72px;height:50px;border-radius:14px;background:rgba(0,0,0,.78);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;padding-left:4px}
.ytgb-info{margin:14px 0;font-family:var(--ff)}
.ytgb-gallery .ytgb-title{color:var(--tc);font-size:var(--ts)!important;line-height:var(--tl)!important;letter-spacing:var(--tls)!important;font-weight:700;margin-bottom:6px;font-family:var(--ff)}
.ytgb-gallery .ytgb-desc{color:var(--dc);font-size:var(--ds)!important;line-height:var(--dl)!important;letter-spacing:var(--dls)!important;margin:0;font-family:var(--ff)}
.ytgb-row{display:flex;align-items:center;gap:8px}
.ytgb-carousel{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - (var(--thumb-count) - 1)*10px)/var(--thumb-count));gap:10px;overflow:hidden;scroll-behavior:smooth;flex:1}
.ytgb-thumb{box-sizing:border-box;border:2px solid var(--bc);padding:0;background:#000;border-radius:calc(var(--rad)*.7);overflow:hidden;cursor:pointer;aspect-ratio:16/9;position:relative}
.ytgb-thumb.active{border-color:var(--ac)}.ytgb-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ytgb-arrow{border:0;background:transparent;color:var(--ar);font-size:32px;cursor:pointer}
.ytgb-watch{display:flex;align-items:center;justify-content:center;text-align:center;color:var(--tc);background:#222;text-decoration:none;font-weight:700;border-color:var(--ac)}

@media(max-width:600px){
    .ytgb-gallery{--thumb-count:var(--mob)}
    .ytgb-gallery .ytgb-title{font-size:var(--tsm)!important;line-height:var(--tlm)!important;letter-spacing:var(--tlsm)!important}
    .ytgb-gallery .ytgb-desc{font-size:var(--dsm)!important;line-height:var(--dlm)!important;letter-spacing:var(--dlsm)!important}
    .ytgb-carousel{grid-auto-columns:calc((100% - (var(--thumb-count) - 1)*8px)/var(--thumb-count));gap:8px}
}

/* Independent gallery + video-window borders */
.ytgb-gallery{border:var(--gbw) solid var(--gbc)}
.ytgb-frame{box-sizing:border-box;border:var(--vbw) solid var(--vbc)}
/* Expandable Grid — scoped to preserve legacy carousel galleries. */
.ytgb-grid-gallery .ytgb-video-grid{display:grid;grid-template-columns:repeat(var(--grid-desktop),minmax(0,1fr));gap:var(--gap)}
.ytgb-grid-gallery .ytgb-grid-video{display:block;position:relative;aspect-ratio:16/9;width:100%;padding:0;border:var(--vbw) solid var(--vbc);border-radius:var(--rad);overflow:hidden;background:#000;cursor:pointer;box-sizing:border-box}
.ytgb-grid-gallery [hidden]{display:none!important}
.ytgb-grid-video img{width:100%;height:100%;object-fit:cover;display:block}
.ytgb-grid-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:68px;height:46px;border-radius:12px;background:#e62117;color:#fff;font-size:22px;padding-left:3px;box-sizing:border-box;transition:background .15s}
.ytgb-grid-video:hover .ytgb-grid-play,.ytgb-grid-video:focus-visible .ytgb-grid-play{background:#c31810}
.ytgb-grid-actions{display:flex;justify-content:center;margin-top:calc(var(--gap)*1.5)}
.ytgb-grid-more,.ytgb-grid-final{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 25px;border:1px solid var(--ac);border-radius:var(--rad);background:var(--ac);color:var(--bg);font:600 15px/1.3 var(--ff);cursor:pointer;text-decoration:none;box-sizing:border-box}
.ytgb-grid-more:hover,.ytgb-grid-final:hover{filter:brightness(1.12)}
.ytgb-lightbox{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;padding:48px 20px;box-sizing:border-box}
.ytgb-lightbox-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.88)}
.ytgb-lightbox-panel{position:relative;width:min(100%,1000px);z-index:1}
.ytgb-lightbox-frame{position:relative;aspect-ratio:16/9;background:#000}
.ytgb-lightbox-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.ytgb-lightbox-close{position:absolute;right:0;top:-45px;background:transparent;color:white;border:0;font-size:36px;line-height:40px;cursor:pointer}
@media(max-width:900px){.ytgb-grid-gallery .ytgb-video-grid{grid-template-columns:repeat(var(--grid-tablet),minmax(0,1fr))}}
@media(max-width:600px){.ytgb-grid-gallery .ytgb-video-grid{grid-template-columns:repeat(var(--grid-mobile),minmax(0,1fr))}.ytgb-grid-play{width:58px;height:40px}}

/* rc.7: grid captions and accessible button contrast, independent of transparency. */
.ytgb-grid-gallery .ytgb-grid-item{min-width:0}
.ytgb-grid-gallery .ytgb-grid-title{margin:9px 0 0;overflow-wrap:anywhere}
.ytgb-grid-gallery .ytgb-grid-desc{margin:5px 0 0;overflow-wrap:anywhere}
.ytgb-grid-gallery .ytgb-grid-more,.ytgb-grid-gallery .ytgb-grid-final{color:#fff!important;-webkit-text-fill-color:#fff!important;opacity:1;text-shadow:none}
.ytgb-grid-gallery .ytgb-grid-more:focus-visible,.ytgb-grid-gallery .ytgb-grid-final:focus-visible{outline:2px solid var(--tc);outline-offset:3px}
