/* Video library: browsing first, focused upload and editing surfaces. */
#content-video-library, .vl-overlay { --vl-surface: rgb(var(--ft-surface-rgb)); --vl-border: rgb(var(--ft-border-rgb) / .65); --vl-muted: rgb(var(--ft-text-secondary-rgb)); --vl-text: rgb(var(--ft-text-primary-rgb)); color: var(--vl-text); }
#content-video-library .vl-page-heading { position:relative; isolation:isolate; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; min-height:9.5rem; margin:0 0 1rem; padding:1.25rem 1.4rem; overflow:hidden; border:1px solid rgb(var(--ft-primary-rgb) / .18); border-radius:1rem; background:radial-gradient(circle at 88% 30%,rgb(var(--ft-accent-rgb) / .16),transparent 34%),linear-gradient(112deg,rgb(var(--ft-primary-rgb) / .11),rgb(var(--ft-surface-rgb) / .96) 68%); box-shadow:var(--ft-shadow-sm); }
#content-video-library .vl-heading-copy { min-width:0; max-width:48rem; }
#content-video-library .vl-page-heading h2 { margin:0; color:var(--vl-text); font-size:clamp(1.25rem,1.55vw,1.65rem); font-weight:800; line-height:1.18; }
#content-video-library .vl-page-heading .vl-heading-eyebrow { margin:0 0 .3rem; color:var(--ft-primary); font-size:.69rem; font-weight:850; letter-spacing:.11em; line-height:1.2; text-transform:uppercase; }
#content-video-library .vl-page-heading .vl-heading-copy > p:not(.vl-heading-eyebrow) { max-width:43rem; margin:.5rem 0 0; color:var(--vl-muted); font-size:.88rem; line-height:1.5; }
.vl-heading-benefits { display:flex; flex-wrap:wrap; gap:.45rem; margin-top:.75rem; }
.vl-heading-benefits span { display:inline-flex; align-items:center; gap:.35rem; padding:.28rem .58rem; border:1px solid rgb(var(--ft-primary-rgb) / .2); border-radius:999px; background:rgb(var(--ft-surface-rgb) / .72); color:var(--vl-muted); font-size:.72rem; font-weight:650; }
.vl-heading-benefits span::before { content:""; width:.38rem; height:.38rem; border-radius:999px; background:var(--ft-primary); }
.vl-heading-actions { position:relative; z-index:1; display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:.6rem; }
#content-video-library .video-library-main-grid { display:block; }
#content-video-library .video-library-main-grid > section { background:transparent; border:0; box-shadow:none; padding:0; min-height:0; }
.vl-browser-toolbar { display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; margin-bottom:1rem; }
#content-video-library #trainerVideoLibraryScopeToggle { flex:0 0 auto; width:auto; }
#content-video-library #trainerVideoLibrarySearchInput { flex:1 1 16rem; width:auto; min-width:0; }
#content-video-library #trainerVideoLibrarySortSelect { width:auto; max-width:12rem; }
.vl-active-filters { display:flex; flex-wrap:wrap; gap:.5rem; }
.vl-active-filters:not(:empty) { margin-bottom:1rem; }
.vl-active-filters button, .vl-chip-values button { background:rgb(var(--ft-primary-rgb) / .09); color:var(--vl-text); border:1px solid var(--vl-border); border-radius:6px; padding:.3rem .6rem; font-size:.8rem; overflow-wrap:anywhere; }
#trainerVideoLibraryList.vl-results { display:grid; gap:1rem; overflow:visible; padding:0; align-content:start; }
#trainerVideoLibraryList.vl-results--grid { grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr)); }
#trainerVideoLibraryList.vl-results--list { grid-template-columns:minmax(0,1fr); gap:0; }
#content-video-library .vl-video-card { position:relative; margin:0; padding:0; border:1px solid var(--vl-border); border-radius:12px; background:var(--vl-surface); box-shadow:none; min-width:0; overflow:visible; }
#content-video-library .vl-video-card:hover { transform:none; border-color:rgb(var(--ft-border-rgb)); box-shadow:0 3px 12px rgb(0 0 0 / .04); }
#content-video-library .vl-video-card.is-selected { outline:2px solid rgb(var(--ft-primary-rgb)); outline-offset:1px; }
.vl-thumbnail { display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:16/9; position:relative; overflow:hidden; background:rgb(var(--ft-surface-elevated-rgb)); border:0; border-radius:11px 11px 0 0; padding:0; cursor:pointer; }
.vl-thumbnail img { width:100%; height:100%; object-fit:contain; }
.vl-no-preview { color:var(--vl-muted); font-size:.8rem; padding-bottom:3rem; }
.vl-play { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:grid; place-items:center; width:2.3rem; height:2.3rem; border-radius:50%; color:white; background:rgb(15 23 42 / .66); font-size:.85rem; }
.vl-duration { position:absolute; right:.6rem; bottom:.6rem; color:white; background:rgb(15 23 42 / .8); border-radius:4px; font-size:.75rem; padding:.1rem .4rem; font-variant-numeric:tabular-nums; }
.vl-video-copy { padding:1rem; min-width:0; }
.vl-video-title { display:block; width:100%; text-align:left; color:var(--vl-text); font-size:.95rem; font-weight:600; line-height:1.4; background:none; border:0; padding:0; overflow-wrap:anywhere; cursor:pointer; }
.vl-video-meta { color:var(--vl-muted); font-size:.8rem; margin:.4rem 0; overflow-wrap:anywhere; }
.vl-video-scope { display:block; color:var(--vl-muted); font-size:.75rem; margin-top:.5rem; }
.vl-video-actions { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:0 1rem .75rem; }
.vl-select { display:flex; align-items:center; min-width:28px; min-height:28px; cursor:pointer; }
.vl-select input { width:1rem; height:1rem; accent-color:rgb(var(--ft-primary-rgb)); }
.vl-card-menu { position:relative; }
.vl-card-menu summary { list-style:none; cursor:pointer; padding:.25rem .55rem; border-radius:6px; color:var(--vl-muted); }
.vl-card-menu summary::-webkit-details-marker { display:none; }
.vl-card-menu > div { position:absolute; right:0; top:100%; width:11rem; border:1px solid var(--vl-border); background:var(--vl-surface); padding:.3rem; border-radius:8px; box-shadow:0 8px 24px rgb(0 0 0 / .12); z-index:20; }
.vl-card-menu button { display:block; width:100%; padding:.65rem; text-align:left; font-size:.8rem; border-radius:4px; }
.vl-card-menu button:hover { background:rgb(var(--ft-surface-elevated-rgb)); }
.vl-card-menu .vl-delete { color:rgb(220 60 60); }
#content-video-library .vl-video-card--list { display:grid; grid-template-columns:140px minmax(0,1fr) auto; align-items:center; border:0; border-bottom:1px solid var(--vl-border); border-radius:0; padding:.85rem 0; background:transparent; }
.vl-video-card--list .vl-thumbnail { border-radius:8px; }
.vl-video-card--list .vl-video-actions { padding:.5rem; }
#trainerVideoLibraryPagination { padding:1rem 0; }
.vl-panel-open { overflow:hidden; }
.vl-overlay[hidden], .vl-overlay [hidden] { display:none !important; }
.vl-overlay { position:fixed; inset:0; z-index:2147483500; display:flex; align-items:center; justify-content:center; padding:1.5rem; background:rgb(15 23 42 / .42); }
.vl-dialog { display:flex; flex-direction:column; width:min(100%,960px); max-height:calc(100dvh - 3rem); min-width:0; background:var(--vl-surface); border:1px solid var(--vl-border); border-radius:16px; box-shadow:0 24px 80px rgb(0 0 0 / .2); overflow:hidden; }
.vl-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.5rem; border-bottom:1px solid var(--vl-border); flex-shrink:0; }
.vl-dialog-header h2 { font-size:1.15rem; font-weight:600; }
.vl-dialog-body { padding:1.5rem; min-height:0; overflow:auto; }
.vl-overlay .library-resource-subpanel, .vl-overlay .library-review-panel { background:transparent; border:0; box-shadow:none; padding:0; margin:0; }
.vl-overlay .video-library-review-grid { display:grid; grid-template-columns:minmax(240px,.85fr) minmax(0,1.15fr); gap:1.5rem; }
.vl-overlay .video-library-bulk-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:1.5rem; }
.vl-overlay input:not([type=checkbox]):not([type=file]), .vl-overlay textarea, .vl-overlay select { width:100%; background:var(--vl-surface); border:1px solid var(--vl-border); border-radius:8px; padding:.65rem .75rem; color:var(--vl-text); font-size:.85rem; min-height:42px; }
.vl-field-label { display:block; font-size:.8rem; color:var(--vl-muted); margin:.7rem 0 .3rem; }
#vl-filter-panel .vl-dialog, #vl-upload-panel .vl-dialog { max-width:560px; }
#vl-filter-panel .vl-dialog-body { display:grid; gap:.7rem; }
#vl-filter-panel .vl-field-label { margin:0; }
#vl-filter-panel select { display:block; margin-top:.35rem; }
.vl-source-tabs { display:flex; gap:.5rem; margin-bottom:1.5rem; }
.vl-source-tabs button { padding:.5rem .85rem; border:1px solid var(--vl-border); border-radius:8px; font-size:.85rem; }
.vl-source-tabs button[aria-pressed=true] { background:rgb(var(--ft-primary-rgb) / .1); border-color:rgb(var(--ft-primary-rgb)); }
.vl-upload-files { padding:1.5rem !important; border:1px dashed var(--vl-border) !important; border-radius:12px; }
#vl-upload-errors:not(:empty) { color:rgb(220 60 60); margin-top:1rem; font-size:.85rem; overflow-wrap:anywhere; }
.vl-overlay--side { justify-content:flex-end; padding:0; }
.vl-overlay--side .vl-dialog { width:min(100%,600px); height:100dvh; max-height:100dvh; border-radius:0; }
.vl-preview-title { overflow-wrap:anywhere; font-size:1.1rem; font-weight:600; margin-bottom:1rem; }
.vl-player-slot { background:rgb(var(--ft-surface-elevated-rgb)); border-radius:10px; overflow:hidden; margin-bottom:1rem; }
.vl-player-slot video, .vl-player-slot iframe { display:block; width:100%; aspect-ratio:16/9; object-fit:contain; border:0; }
.vl-preview-meta { color:var(--vl-muted); font-size:.85rem; margin:.75rem 0; }
.vl-preview-notes { white-space:pre-wrap; overflow-wrap:anywhere; }
.vl-chip-field { border:1px solid var(--vl-border); border-radius:8px; padding:.35rem; }
.vl-chip-values { display:flex; flex-wrap:wrap; gap:.3rem; }
.vl-overlay .vl-chip-field input { border:0; min-height:34px; padding:.4rem; }
#trainerVideoThumbnailModal { backdrop-filter:none; padding:1rem; }
#trainerVideoThumbnailModal > div { display:flex; flex-direction:column; max-width:900px; max-height:calc(100dvh - 2rem); border-radius:14px; }
#trainerVideoThumbnailModal > div > div:nth-child(2) { overflow-y:auto; min-height:0; }
#trainerVideoThumbnailModal > div > div:first-child, #trainerVideoThumbnailModal > div > div:last-child { flex-shrink:0; }
#trainerVideoThumbnailModalTitle { font-size:1.2rem; }
#trainerVideoThumbnailModalSubtitle { overflow-wrap:anywhere; }
#trainerVideoThumbnailModal section:has(#trainerVideoThumbnailPreviewImage) { border:0; background:transparent; padding:0; }
#trainerVideoThumbnailModal section:has(#trainerVideoThumbnailPreviewImage) > div { max-height:34dvh; width:100%; aspect-ratio:16/9; background:rgb(15 23 42); }
#trainerVideoThumbnailPreviewMeta { display:none; }
#trainerVideoThumbnailFramesStrip, #trainerVideoThumbnailScrubber { height:64px; }
@media (max-width:900px) { .vl-overlay .video-library-review-grid, .vl-overlay .video-library-bulk-grid { grid-template-columns:minmax(0,1fr); } }
@media (max-width:640px) {
    #content-video-library .vl-page-heading { align-items:flex-start; flex-direction:column; }
    .vl-browser-toolbar { gap:.5rem; }
    #content-video-library #trainerVideoLibraryScopeToggle { width:100%; }
    #content-video-library #trainerVideoLibrarySearchInput { flex-basis:100%; }
    #content-video-library .vl-video-card--list { grid-template-columns:100px minmax(0,1fr); }
    .vl-video-card--list .vl-video-actions { grid-column:2; justify-content:flex-end; }
    .vl-overlay { padding:0; }
    .vl-dialog { max-height:100dvh; height:100dvh; border-radius:0; }
    .vl-dialog-body, .vl-dialog-header { padding:1rem; }
    .vl-overlay input:not([type=checkbox]):not([type=file]), .vl-overlay textarea, .vl-overlay select { font-size:16px; }
    .vl-overlay .video-library-review-grid video { max-height:28dvh; }
    #trainerVideoThumbnailModal { padding:0; }
    #trainerVideoThumbnailModal > div { max-height:100dvh; height:100dvh; border-radius:0; }
    #trainerVideoThumbnailModal > div > div:nth-child(2) { flex:1; }
    .vl-select, .vl-card-menu summary { min-width:44px; min-height:44px; }
}
/* Utility visibility must win over the shared button display rules. */
#content-video-library .hidden, .vl-overlay .hidden, #trainerVideoThumbnailModal.hidden, #trainerVideoThumbnailModal .hidden { display:none !important; }
#content-video-library .library-action-primary, #content-video-library .library-action-secondary, .vl-overlay .library-action-primary, .vl-overlay .library-action-secondary, .vl-overlay .library-action-danger { font-weight:600; box-shadow:none; border-radius:8px; }
.vl-browser-toolbar > .ft-searchable-select { width:auto !important; max-width:13rem; flex:0 1 auto; }
.vl-overlay .ft-searchable-select { width:100% !important; min-width:0; }
.vl-overlay .grid > *, .vl-overlay .flex > * { min-width:0; }
.vl-review-actions { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.75rem; padding-top:1rem; border-top:1px solid var(--vl-border); }
.vl-review-actions > div { display:flex; flex-wrap:wrap; gap:.5rem; }
.vl-upload-items { display:grid; gap:.65rem; margin-top:1rem; }
.vl-upload-items li { display:flex; justify-content:space-between; gap:1rem; font-size:.8rem; color:var(--vl-muted); }
.vl-upload-items li span:first-child { overflow-wrap:anywhere; min-width:0; }
.vl-upload-items li span:last-child { flex-shrink:0; }
#vl-upload-activity { max-width:22rem; white-space:normal; font-size:.8rem; }
/* Keep the result surface inset without a second enclosing card border. */
#content-library #content-video-library .video-library-main-grid > section {
    border:0 !important;
    background:transparent !important;
    border-radius:0;
    box-shadow:none;
    padding:1rem;
}
.vl-dialog:focus { outline:none; }
@media (max-width:640px) {
    #content-library #content-video-library .video-library-main-grid > section { padding:.65rem; }
}
/* Results rhythm: one compact toolbar, equal breathing room on both sides. */
#content-video-library .vl-browser-toolbar { margin-bottom:0; }
#content-library #content-video-library .video-library-main-grid > section { padding:0; }
#content-video-library .vl-results-toolbar { display:flex; min-height:3.6rem; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; padding:.55rem .75rem; margin:.7rem 0 .5rem; border:1px solid var(--vl-border); border-radius:.8rem; background:rgb(var(--ft-surface-elevated-rgb) / .48); }
#content-video-library .vl-results-count { margin:0; font-size:.88rem; font-weight:500; color:var(--vl-muted); }
#content-video-library .vl-results-count > span:first-child { color:var(--vl-text); font-weight:600; }
#content-library #content-video-library .vl-video-card--list { padding:.85rem 1rem; }
#content-video-library #trainerVideoLibraryList.vl-results--grid { padding:0 1rem; }
#content-video-library #trainerVideoLibraryPagination { padding:1rem; }
/* Review lives outside #content-library, so it needs its own segmented control styles. */
#vl-review-panel .library-segmented-control { display:inline-flex; flex-wrap:wrap; gap:.25rem; padding:.25rem; border:1px solid var(--vl-border); border-radius:10px; background:rgb(var(--ft-surface-elevated-rgb)); }
#vl-review-panel .library-view-mode-btn { padding:.5rem .85rem; border:1px solid transparent; border-radius:7px; font-size:.82rem; font-weight:600; white-space:nowrap; color:var(--vl-muted); }
#vl-review-panel .library-view-mode-btn.is-active { color:var(--vl-text); border-color:rgb(var(--ft-primary-rgb) / .3); background:rgb(var(--ft-primary-rgb) / .1); }
#vl-review-panel .video-library-review-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; }
#vl-review-panel .vl-review-fields { display:flex; flex-direction:column; gap:.45rem; }
#vl-review-panel .vl-review-fields > * { margin-top:0; margin-bottom:0; }
#vl-review-panel .vl-field-label { margin:0; }
#vl-review-panel .vl-review-tag-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; margin:.25rem 0; }
#vl-review-panel .vl-review-field-group { display:flex; flex-direction:column; gap:.4rem; min-width:0; }
#vl-review-panel .vl-chip-field input { border:0 !important; box-shadow:none; background:transparent; padding:.35rem; min-height:32px; }
#vl-review-panel .vl-review-fields textarea { min-height:70px; }
#vl-review-panel .vl-review-actions { margin-top:1rem; }
@media(max-width:900px) { #vl-review-panel .video-library-review-grid { grid-template-columns:minmax(0,1fr); } }
@media(max-width:480px) {
    #vl-review-panel .vl-review-tag-pair { grid-template-columns:minmax(0,1fr); }
    #content-video-library .vl-results-toolbar { padding:.75rem; }
    #content-library #content-video-library .vl-video-card--list { padding:.75rem; }
    #content-video-library #trainerVideoLibraryList.vl-results--grid { padding:0 .75rem; }
}

@media(max-width:640px) {
    #content-video-library .vl-page-heading { align-items:stretch; min-height:0; padding:1rem; }
    #content-video-library .vl-heading-actions { justify-content:flex-start; }
    .vl-heading-benefits { display:none; }
}