From 5efc1105e9a56424d2252d73c04cafe484fb9e92 Mon Sep 17 00:00:00 2001 From: lscambo13 Date: Fri, 4 Sep 2026 18:21:41 +0530 Subject: [PATCH] RELEASE: ElegantFin v26.09.05 --- README.md | 40 +- ...n-jellyfin-theme-build-latest-minified.css | 2 +- Theme/ElegantFin-theme-v26.09.05.css | 4374 +++++++++++++++++ .../custom-media-covers-latest-min.css | 2 +- .../add-ons/custom-media-covers-v26.09.05.css | 149 + .../media-bar-plugin-support-latest-min.css | 2 +- .../media-bar-plugin-support-v26.09.05.css | 206 + 7 files changed, 4752 insertions(+), 23 deletions(-) create mode 100644 Theme/ElegantFin-theme-v26.09.05.css create mode 100644 Theme/assets/add-ons/custom-media-covers-v26.09.05.css create mode 100644 Theme/assets/add-ons/media-bar-plugin-support-v26.09.05.css diff --git a/README.md b/README.md index c109558..5fcdc0c 100644 --- a/README.md +++ b/README.md @@ -324,15 +324,15 @@ https://github.com/user-attachments/assets/bb7f3174-b703-4c98-a23c-e6bb4abba390 > image > > - These variables control the visibility of small UI elements that show up on phones and small screens. -> ```css -> :root{ -> --miniOverlayButtonVisibility: block; /* block: show the mini play or three-dot button on cards on mobile [default]; none: always hide them on mobile */ -> --endsAtVisibility: block; /* block: show the 'Ends at...' time indicator on phones [default]; none: always hide it on phones */ -> --criticsRatingVisibility: none; /* none: hide the critics tomato rating on phones [default]; block: show it on phones */ -> } -> ``` +> ```css +> :root { +> --miniOverlayButtonVisibility: block; /* block: show the mini play or three-dot button on cards on mobile [default]; none: always hide them on mobile */ +> --endsAtVisibility: block; /* block: show the 'Ends at...' time indicator on phones [default]; none: always hide it on phones */ +> --criticsRatingVisibility: none; /* none: hide the critics tomato rating on phones [default]; block: show it on phones */ +> } +> ``` > - To undo these changes, simply remove the variables you added or set the values back to their defaults shown above. - +
@@ -364,28 +364,28 @@ https://github.com/user-attachments/assets/bb7f3174-b703-4c98-a23c-e6bb4abba390 > > - Star rating icon in ElegantFin uses the TMDB colors by default, since that is where the rating is sourced from. > - To switch them to the gold IMDb colors, copy and paste the following code at the end in Custom CSS box, click save and finally refresh your app/webpage. -> ```css -> .starIcon{ -> --colors: var(--imdb); -> } -> ``` +> ```css +> .starIcon { +> --colors: var(--imdb); +> } +> ``` > - To go back to the TMDB colors, replace `var(--imdb)` with `var(--tmdb)` or simply remove the code block. - +
15. Switch between Light and Dark modes -|Desktop|Mobile| -|---|---| -|

Dark
|
-|

Light
|
| +| Desktop | Mobile | +| ----------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | +|

Dark
|
| +|

Light
|
| > - ElegantFin now comes with a dark by default, but an alternative light mode is also available > - To switch between these modes, go to `User Settings > Display > Theme` and select either **Dark** or **Light**. > - The "Theme" setting above is **not** to be confused with the "Server Dashboard Theme" in the Dashboard, which is **not supported**. > - Only the Light and Dark theme options are supported, and Jellyfin does not automatically switch between them, so you have to change it manually. - +
@@ -425,7 +425,7 @@ https://github.com/user-attachments/assets/bb7f3174-b703-4c98-a23c-e6bb4abba390 3️⃣ - Why do I notice visual bugs and inconsistencies on Jellyfin Media Player? > - JMP is based on Qt 5.x which uses a very outdated web engine. It does not support many new CSS features, so it is unsupported. -> - You might want to try [Jellium Desktop](https://github.com/andrewrabert/jellium-desktop)) which is an unofficial client, and it is still in testing right now. +> - You might want to try [Jellium Desktop](https://github.com/andrewrabert/jellium-desktop) which is an unofficial client, and it is still in testing right now. diff --git a/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css b/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css index 6cb19e0..e41b264 100644 --- a/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css +++ b/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css @@ -1 +1 @@ -/*! ElegantFin Theme v26.06.06 for Jellyfin by lscambo13 */@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");:root{--activeColor:#775bf4;--activeColorAlpha:rgba(119,91,244,.9);--appBarHeight:5em;--artistClearLogoVisibility:block;--artistPageBackground:unset;--artistTitleVisibility:none;--backdropTrimFromTop:10%;--backgroundAlphaOverlay:linear-gradient(180deg,var(--darkerGradientPointAlpha) 80%,transparent);--backgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint) 35%,var(--lighterGradientPoint));--blurDefault:blur(5px);--blurLarge:blur(10px);--blurLargest:blur(20px);--blurSmallest:blur(2px);--borderColor:#47505c;--borderWidth:0.06em;--borderWidthDouble:0.12em;--bottomOSDGradient:linear-gradient(0deg,rgba(0,0,0,.8),45%,transparent);--btnDeleteBorderColor:#d95454;--btnDeleteColor:#a91d1d;--btnMiniPlayBorderColor:#32a769;--btnMiniPlayColor:#299a5d;--btnSubmitBorderColor:#756fe2;--btnSubmitColor:#3d36b2;--cardBackgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint),25%,var(--lighterGradientPoint));--cardFooterGradient:linear-gradient(0deg,rgba(0,0,0,.9),40%,transparent);--cardHoverEffect:"";--checkboxCheckedBgColor:#4f46e5;--clearLogoVisibility:block;--darkerBorderColor:#31373f;--darkerGradientPoint:#111827;--darkerGradientPointAlpha:rgba(17,24,39,.85);--defaultBorder:var(--borderWidth) solid var(--borderColor);--defaultLighterBorder:var(--borderWidth) solid var(--lighterBorderColor);--dimTextColor:#9ca3af;--drawerColor:rgba(30,40,54,.9);--elegantFinFooterText:"ElegantFin v26.06.06";--extraCardButtonsVisibility:none;--gradientPointAlpha:rgba(29,38,53,.3);--headerBackground:var(--headerColorGradient);--headerBlurLayerVisibility:"";--headerBlurMask:linear-gradient(180deg,#fff 50%,85%,transparent);--headerColor:rgba(30,40,54,.8);--headerColorGradient:linear-gradient(180deg,rgba(30,40,54,.95) 30%,55%,transparent 90%);--headerColorGradientAlt:linear-gradient(180deg,#1e2836,70%,transparent);--highlightOutlineColor:#2563eb;--hoverGradientH:linear-gradient(90deg,transparent,hsla(0,0%,100%,.35) 45%,hsla(0,0%,100%,.35) 55%,transparent);--hoverGradientV:linear-gradient(0deg,transparent,hsla(0,0%,100%,.35) 45%,hsla(0,0%,100%,.35) 55%,transparent);--iconPack:"Material Symbols Rounded";--itemBackdropMask:linear-gradient(180deg,rgba(0,0,0,.8),75%,transparent);--itemColumnGap:1em;--itemOriginalTitleVisibility:block;--itemTitleVisibility:none;--largeRadius:1em;--largerRadius:1.25em;--libraryLabelVisibility:none;--lighterBorderColor:hsla(0,0%,100%,.2);--lighterGradientPoint:#1d2635;--lighterGradientPointAlpha:rgba(29,38,53,.85);--loginPageBgUrl:url();--loginPageText:"Sign in to continue";--menuButtonVisibility:block;--minEpisodeCardWidth:26em;--miniOverlayButtonVisibility:block;--osdSeekBarBufferedColorAlpha:hsla(0,0%,50%,.5);--osdSeekBarPlayedColor:var(--textColor);--osdSeekBarThumbColor:#fff;--overlayPlayButtonPosition:2.8em;--resumeCardScale:1;--selectorBackgroundColor:#374151;--selectorBackgroundColorAlpha:rgba(55,65,81,.5);--shadow:0.1em 0.1em 0.15em rgba(0,0,0,.3);--sidePadding:3.3%;--smallerRadius:0.375em;--smallRadius:0.5em;--tableBodyColor:#1f2937;--textColor:#d1d5db;--topOSDGradient:linear-gradient(180deg,rgba(0,0,0,.8),45%,transparent);--uiAccentColor:#756fe2;color-scheme:dark}html{font-family:Inter,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:425;-webkit-tap-highlight-color:transparent!important}body{--clearLogoBottomSpace:11em;--primaryItemPageNegativeSpace:14vh;--secondaryItemPageNegativeSpace:60vh}select{text-overflow:ellipsis}.layout-desktop>body:has(>audio[src]){--primaryItemPageNegativeSpace:calc(14vh + 5em);--secondaryItemPageNegativeSpace:calc(60vh + 5em)}.layout-mobile{--blurLargest:blur(12px);--headerBlurMask:linear-gradient(180deg,#fff 60%,90%,transparent);--headerColorGradient:var(--headerColorGradientAlt);--itemColumnGap:0.5em}.layout-mobile>body{--secondaryItemPageNegativeSpace:45vh}@font-face{font-family:Material Symbols Rounded Minimal;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/l/font?kit=sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190FjzarESMdAUY9qjb3u1M7e05tMSFFiwiIx7ihGnzWmz-lkbsBJUso54WUKiEWtV5-yu0mchXaMnO1vqpcxiqEd46a1XUtwWncyNNmxYr8hocRsPBG56BqeEkny0qMU_aSz_M2MYR8p9qc8uUfT0rnccAg__qWWJGuzJMRCBsajdQcef&skey=70ddea8fe54d532e&v=v346) format("woff2")}@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsrounded/v346/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format("woff2")}.material-icons{direction:ltr;display:inline-block;font-family:var(--iconPack),Material Icons!important;-webkit-font-feature-settings:"liga";-webkit-font-smoothing:antialiased;font-style:normal;font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 48;font-weight:400;letter-spacing:normal;line-height:1;-moz-osx-font-smoothing:grayscale;text-rendering:geometricPrecision;text-transform:none;vertical-align:middle;white-space:nowrap;word-wrap:normal}.material-icons.info_outline:before{content:"\e88e";font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48}.dashboardFooter{font-family:Noto Sans,serif;transition:transform 50ms}#myPreferencesMenuPage>div:after,.dashboardFooter:after{color:var(--borderColor);content:var(--elegantFinFooterText);display:inline-grid;font-size:.8em;font-weight:600;justify-content:center;width:100%;width:-webkit-fill-available}::selection{background:var(--activeColorAlpha)}.cardImageIcon{color:var(--borderColor)}.cardPadder .cardImageIcon{color:var(--selectorBackgroundColorAlpha)}.card:focus .cardBox.visualCardBox,.card:focus .cardBox:not(.visualCardBox) .cardScalable{border-color:#fff!important}.mdl-radio.show-focus .mdl-radio__button:focus+.mdl-radio__circles .mdl-radio__inner-circle,.mdl-radio.show-focus .mdl-radio__button:focus+.mdl-radio__circles .mdl-radio__outer-circle,.mdl-radio__focus-circle{background:var(--uiAccentColor);color:var(--uiAccentColor)}.emby-button{gap:1ch}.emby-button.show-focus:focus,.emby-tabs .emby-button.show-focus:focus,.paper-icon-button-light.show-focus:focus{background-color:var(--highlightOutlineColor)!important;color:#fff!important}.emby-tabs .emby-button.show-focus:focus{outline:none!important}[dir=ltr] .itemsContainer>.card>.cardBox{margin-left:auto;margin-right:auto}.cardBox-bottompadded{margin-bottom:.5em!important}@media (max-width:50em){.cardBox-bottompadded{margin-bottom:.25em!important}}.padded-right-withalphapicker>.vertical-wrap,.vertical-wrap.padded-right-withalphapicker,.vertical-wrap:not(.centered){justify-content:flex-start!important}#channelsTab>.vertical-wrap,#episodesTab>.vertical-wrap,#genresTab>.vertical-wrap,#recordingsTab>.vertical-wrap,#studiosTab>.vertical-wrap{justify-content:center!important}.countIndicator,.fullSyncIndicator,.mediaSourceIndicator{background:#1f50bd;border:var(--defaultLighterBorder)}.layout-mobile .indicator{font-size:70%}.cardScalable{border:var(--darkerBorderColor) solid var(--borderWidthDouble)!important;border-radius:var(--largeRadius);box-shadow:0 0 .25em 0 rgba(0,0,0,.4);overflow:hidden!important;transition:transform 125ms}@supports (aspect-ratio:1/1){#castCollapsible .cardScalable,#guestCastContent .cardScalable{aspect-ratio:1/1;border-radius:50%}}#castCollapsible .cardContent.cardImageContainer,#guestCastContent .cardContent.cardImageContainer{background-position-y:33%}.layout-mobile .cardScalable,.paperList,.visualCardBox{border:var(--defaultBorder)!important}.paperList,.visualCardBox{background-color:var(--headerColor)!important;border-radius:var(--largeRadius)!important;box-shadow:unset!important;overflow:hidden}.layout-desktop .visualCardBox{border-width:var(--borderWidthDouble)!important}.visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important;border-radius:0!important;border-width:0 0 var(--borderWidth) 0!important}.cardImageContainer{transition:transform .375s}.card.squareCard[data-type=TvChannel] .cardImageContainer.cardContent{background-color:hsla(0,0%,100%,.2)}.cardImageContainer>.cardDefaultText{color:transparent;font-size:2em;padding-top:1.5em;white-space:pre}.cardImageContainer>.cardDefaultText:before{color:var(--borderColor);content:"?\A"}.card-hoverable:hover .cardScalable,.card-hoverable:hover .visualCardBox{border-color:#fff!important}.card-hoverable:hover .visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important}.card-hoverable:hover .cardImageContainer{transform:scale(1.025)}.card-hoverable .itemSelectionPanel{transition:transform .125s}.card-hoverable:hover .cardScalable,.card-hoverable:hover .itemSelectionPanel{transform:scale(1.02)}.card-hoverable .cardScalable:active{transform:scale(1);transition:transform 75ms}.cardScalable:has(.cardOverlayButton-hover:hover)>.cardImageContainer{transform:scale(1)}.cardOverlayContainer{background:hsla(0,0%,100%,.05);transition:.5s}.cardOverlayContainer:after{background:var(--hoverGradientV);bottom:0;content:var(--cardHoverEffect);left:0;position:absolute;right:0;top:0;transform:translateY(-100%) translateX(0);transition:.65s}.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(100%) translateX(0)}.backdropCard.card-hoverable .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable .cardOverlayContainer:after{background:var(--hoverGradientH);transform:translateY(0) translateX(-100%)}.backdropCard.card-hoverable:hover .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(0) translateX(100%)}.cardBox:not(.visualCardBox) .cardPadder{background-color:var(--lighterGradientPoint)}.cardOverlayContainer>.cardOverlayFab-primary{bottom:calc(var(--overlayPlayButtonPosition) - 1.5em);left:unset;left:calc(var(--overlayPlayButtonPosition) - 1.5em);margin-left:unset;margin-top:unset;top:unset}.cardOverlayContainer>.cardOverlayFab-primary,.layout-mobile .cardOverlayButton-br:not([data-action=menu])>.cardOverlayButtonIcon,.listItemImageButton{background-color:var(--btnMiniPlayColor)!important;border:var(--defaultLighterBorder);border-color:var(--btnMiniPlayBorderColor);box-shadow:var(--shadow);color:#fff;font-size:75%;z-index:2}.cardOverlayContainer>.cardOverlayFab-primary:hover,.listItemImageButton:hover{color:#fff}.layout-desktop .cardOverlayButton-br,[dir=ltr].layout-desktop .cardOverlayButton-br{bottom:1.2em;font-size:.8em;right:.7em;z-index:1}.layout-desktop .cardOverlayButton-br>button{color:#fff;display:var(--extraCardButtonsVisibility);text-shadow:var(--shadow)}.cardOverlayButton-br .cardOverlayButton-hover[data-action=menu],.layout-desktop .listItemButton[data-action=menu]{display:var(--menuButtonVisibility)}.layout-mobile .cardOverlayButton{font-size:60%;padding:1em}.layout-mobile .cardOverlayButton-br,[dir=ltr] .layout-mobile .cardOverlayButton-br{display:var(--miniOverlayButtonVisibility)}.layout-mobile .backdropCard .cardOverlayButton-br:not([data-action=menu]),.layout-mobile .portraitCard .cardOverlayButton-br:not([data-action=menu]){display:none}.layout-mobile .cardOverlayButton-br[data-action=menu]>.cardOverlayButtonIcon{background-color:transparent!important;border:none;color:#fff;text-shadow:1px 1px .1em #000}.cardOverlayContainer:has(>button:hover){backdrop-filter:var(--blurDefault)}.listViewUserDataButtons{font-size:small}.layout-mobile .listViewUserDataButtons{flex-direction:column;font-size:x-small}@supports (display:revert){.layout-desktop .vertical-list:has(.listItem-largeImage){display:grid;gap:var(--itemColumnGap);grid-template-columns:repeat(auto-fill,minmax(min(var(--minEpisodeCardWidth),100%),1fr))}.layout-desktop .listItem-largeImage{display:grid;margin-bottom:0!important}.layout-desktop .listItem-largeImage>.listItem-content{align-items:start;display:grid;grid-template-columns:1fr 1fr 2em;height:100%;order:1}.layout-desktop .listItem-largeImage>.listItem-bottomoverview{order:2}.layout-desktop .listItem-largeImage .listItemImage-large{aspect-ratio:16/9;box-sizing:border-box;grid-column:1/-1;height:max-content;min-height:15em;order:1;width:100%}.layout-desktop .listItem-largeImage .listItemBody{grid-column:1/3;order:2;padding:1em .125em}.layout-desktop .listItem-largeImage .listViewUserDataButtons{align-self:center;flex-direction:column;font-size:small;grid-column:3;order:2}}.portraitCard{min-width:5em}.bannerCard{--cardCount:2}@media (min-width:300em){.portraitCard,.squareCard{--cardCount:16}.overflowPortraitCard,.overflowSquareCard{--cardCount:15}.squareCard:has(.cardFooter){--cardCount:12}.backdropCard{--cardCount:12}.overflowBackdropCard{--cardCount:11}}@media (max-width:300em){.portraitCard,.squareCard{--cardCount:15}.overflowPortraitCard,.overflowSquareCard{--cardCount:14}.squareCard:has(.cardFooter){--cardCount:11}.backdropCard{--cardCount:11}.overflowBackdropCard{--cardCount:10}}@media (max-width:270em){.portraitCard,.squareCard{--cardCount:14}.overflowPortraitCard,.overflowSquareCard{--cardCount:13}.squareCard:has(.cardFooter){--cardCount:10}.backdropCard{--cardCount:10}.overflowBackdropCard{--cardCount:9}}@media (max-width:240em){.portraitCard,.squareCard{--cardCount:13}.overflowPortraitCard,.overflowSquareCard{--cardCount:12}.squareCard:has(.cardFooter){--cardCount:10}.backdropCard{--cardCount:10}.overflowBackdropCard{--cardCount:9}}@media (max-width:220em){.portraitCard,.squareCard{--cardCount:12}.overflowPortraitCard,.overflowSquareCard{--cardCount:11}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard,.overflowBackdropCard{--cardCount:7}}@media (max-width:200em){.portraitCard,.squareCard{--cardCount:11}.overflowPortraitCard,.overflowSquareCard{--cardCount:10}.squareCard:has(.cardFooter){--cardCount:9}}@media (max-width:170em){.portraitCard,.squareCard{--cardCount:10}.overflowPortraitCard,.overflowSquareCard{--cardCount:9}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard,.overflowBackdropCard{--cardCount:6}}@media (max-width:140em){.portraitCard,.squareCard{--cardCount:9}.overflowPortraitCard,.overflowSquareCard{--cardCount:8}.squareCard:has(.cardFooter){--cardCount:7}.backdropCard,.overflowBackdropCard{--cardCount:5}}@media (max-width:120em){.portraitCard,.squareCard{--cardCount:8}.overflowPortraitCard,.overflowSquareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard,.layout-tv .overflowPortraitCard,.layout-tv .overflowSquareCard,.layout-tv .portraitCard,.layout-tv .squareCard,.overflowBackdropCard{--cardCount:5}.layout-tv .backdropCard,.layout-tv .overflowBackdropCard{--cardCount:3}}@media (max-width:100em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:80em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:6}.squareCard:has(.cardFooter){--cardCount:5}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:62em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:5}.squareCard:has(.cardFooter){--cardCount:4}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:48.125em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:4}.squareCard:has(.cardFooter){--cardCount:3}.backdropCard,.overflowBackdropCard{--cardCount:3}}@media (max-width:30em){.layout-mobile .overflowPortraitCard,.layout-mobile .overflowSquareCard,.layout-mobile .portraitCard,.layout-mobile .squareCard,.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:3}.squareCard:has(.cardFooter){--cardCount:2}.backdropCard,.overflowBackdropCard{--cardCount:2}}.cardBox{margin-top:0}.card{--cardWidth:calc(var(--effectiveWidth)/var(--cardCount) - var(--itemColumnGap));--effectiveWidth:calc(100vw - var(--padding)*2 - var(--sidePadding)*2);--padding:0.375em;box-sizing:content-box;padding:var(--padding);transition:width .5s;width:var(--cardWidth)!important}@supports (aspect-ratio:1/1){.card{box-sizing:border-box}}.layout-mobile .card{--padding:1px}@media (orientation:landscape) and (max-height:40em){.layout-mobile .card{--effectiveWidth:calc(65vw - var(--sidePadding)*2)}}#homeTab .overflowBackdropCard[data-positionticks],#resumableItems>.card,.nextUpItems>.card{width:calc(var(--cardWidth)*var(--resumeCardScale))!important}.card .cardTextCentered{text-shadow:1px 1px 2px rgba(0,0,0,.8)}.detailPageWrapperContainer{margin-top:unset;padding-top:unset}.layout-desktop .detailPageWrapperContainer{background:transparent;background:linear-gradient(180deg,transparent,17vh,var(--darkerGradientPointAlpha) 50vh);min-height:46vh}.layout-tv .detailPageWrapperContainer{background:transparent;background:linear-gradient(0deg,var(--darkerGradientPointAlpha) 70%,85%,transparent);min-height:46vh;padding-left:30vw}.detailPagePrimaryContainer{align-content:space-between;align-items:stretch;align-items:center;flex-direction:column;justify-content:end;text-align:left}.layout-mobile .detailPagePrimaryContainer.detailRibbon,.layout-mobile .detailPagePrimaryContainer>.detailRibbon{padding:0 var(--sidePadding)}.layout-desktop .detailPagePrimaryContainer{background:transparent}.layout-desktop .detailPageSecondaryContainer{background-color:transparent}.detailPagePrimaryContainer>.detailPagePrimaryContent,[dir=ltr] .detailPagePrimaryContainer.detailRibbon,[dir=ltr] .detailPagePrimaryContainer>.detailRibbon{padding-left:var(--sidePadding)}.layout-mobile .detailPagePrimaryContent{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}.layout-desktop [dir=ltr] .detailRibbon,.layout-tv [dir=ltr] .detailRibbon{flex-direction:column}.detailPagePrimaryContainer>.detailPagePrimaryContent{padding-top:0}.detailPageSecondaryContainer{padding-top:0!important}.skinHeader-withBackground:not(.semiTransparent) .headerHomeButton{display:none}.layout-mobile:has(#itemDetailPage:not(.hide)) .headerHomeButton{display:block}.pageTitle{height:1.5em}.headerLeft .pageTitle{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:1;overflow:hidden}.paper-icon-button-light>.material-icons{font-size:1.25em}#itemDetailPage .emby-scroller,#itemDetailPage .emby-scroller-container,#itemDetailPage .scrollX{margin:0 calc(var(--sidePadding)*-1);padding-left:calc(var(--sidePadding))}.layout-desktop .emby-scroller,.layout-desktop .emby-scroller-container,.layout-desktop .scrollX{--itemColumnGap:0.5em}.emby-scroller,.scrollX{padding-left:calc(var(--sidePadding))}.sectionTabs .scrollX{padding-left:0}.itemsContainer:not(.editorsChoiceItemsContainer,.vertical-list){column-gap:var(--itemColumnGap);row-gap:1em}.layout-mobile .itemsContainer:not(.editorsChoiceItemsContainer,.vertical-wrap,.vertical-list):after{color:transparent;content:"13"}.layout-desktop .sectionTitle,.layout-tv .sectionTitle{font-size:1.5rem!important}.emby-scrollbuttons,[dir=ltr] .emby-scrollbuttons{padding-top:0}.emby-scrollbuttons-button.paper-icon-button-light>.material-icons{font-size:1.5em;place-content:center}.detailRibbon{background-color:transparent}.mediaInfoItem{border-radius:var(--smallRadius);font-weight:500;padding-bottom:0;padding-top:0}.itemMiscInfo-primary{column-gap:.5em}.mediaInfoOfficialRating{background:transparent!important;border:var(--defaultBorder);color:var(--textColor);font-family:Noto Sans,sans-serif;font-size:.75em;font-weight:600;line-height:1.5em;transform:translateY(-.15em)}.starIcon{background:linear-gradient(90deg,#90cea1,#01b4e4);-webkit-background-clip:text;margin-left:-.125em;-webkit-text-fill-color:transparent;transform:translateY(-.02em)}[dir=ltr] .mediaInfoCriticRating{background-size:30%;padding-left:1.5em}[dir=ltr] .mediaInfoCriticRating:after{content:"%"}.detailRibbon:has(.portraitCard .folder){align-content:flex-end;min-height:32vh}.layout-desktop .detailRibbon:has(.person){align-content:flex-end;min-height:15vh}.layout-desktop .detailRibbon{height:100%;margin-top:unset;min-height:25vh}@keyframes animMoveDown{0%{opacity:0;transform:translateY(-2em)}to{opacity:1;transform:translateY(0)}}@keyframes animMoveDownSecondaryPage{0%{opacity:0;transform:translateY(-2em)}to{opacity:.3;transform:translateY(0)}}@keyframes animMoveUp{0%{opacity:0;transform:translateY(-90%)}to{opacity:1;transform:translateY(-100%)}}.itemBackdrop{display:block!important}.layout-desktop .itemBackdrop{height:calc(73vh - var(--primaryItemPageNegativeSpace))}.layout-mobile .itemBackdrop{animation:animMoveDown .5s ease-out forwards;height:45vh;margin-top:0;-webkit-mask:var(--itemBackdropMask);mask:var(--itemBackdropMask);position:sticky;top:-30%}.layout-tv .itemBackdrop{height:33vh}#itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .book) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .live_tv) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .person) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .queue) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop,#itemDetailPage:has(.musicParentName) .itemBackdrop,#itemDetailPage:has(.subtitle) .itemBackdrop{height:calc(73vh - var(--secondaryItemPageNegativeSpace))}#itemDetailPage:has(.detailImageContainer .cardPadder-square>.person) .itemBackdrop{height:calc(92vh - var(--secondaryItemPageNegativeSpace))}.detailLogo{background-position:bottom;display:var(--clearLogoVisibility);height:25vh;left:0;margin:auto 30%;top:calc(100vh - var(--clearLogoBottomSpace) - var(--primaryItemPageNegativeSpace));transform:translateY(-100%);width:40%}.layout-mobile .detailLogo{animation:animMoveUp 1s ease-out forwards;display:var(--clearLogoVisibility);left:1em;margin:auto 0;max-height:17vh;position:absolute;top:45vh;width:calc(100vw - 2em);z-index:1}.layout-tv .detailLogo{display:var(--clearLogoVisibility);height:20vh;left:30vw;margin:auto 5vw;top:39vh;width:60vw}#itemDetailPage:has(.subtitle) .detailLogo{top:calc(100vh - 6em - var(--secondaryItemPageNegativeSpace))}.layout-desktop #itemDetailPage:has(.detailImageContainer .person) .detailLogo{top:calc(100vh - var(--secondaryItemPageNegativeSpace))}.layout-mobile #itemDetailPage:has(.subtitle) .detailLogo{top:calc(100vh - 11em - var(--secondaryItemPageNegativeSpace))}.layout-desktop .detailImageContainer .card{float:none;left:0!important;margin:auto auto 0;place-self:center;position:relative!important;right:0;top:0;width:22vh!important}.detailImageContainer .card.backdropCard{max-width:50vw;width:40vh!important}.detailImageContainer .card{display:none}.layout-tv .detailImageContainer .card{align-content:center;bottom:0;display:block!important;left:var(--sidePadding);margin:auto;position:fixed!important;top:0;transform:none;width:25vw!important}.layout-mobile .detailImageContainer .card{-webkit-filter:drop-shadow(0 0 .25rem rgba(0,0,0,.25));filter:drop-shadow(0 0 .25rem rgba(0,0,0,.25))}.layout-mobile .infoWrapper,.layout-mobile [dir=ltr] .infoWrapper{padding-left:0}.infoWrapper{align-content:end;display:grid;place-items:center;text-align:center}.layout-mobile .detailImageContainer{align-items:flex-end;display:flex;justify-content:center;padding-left:0!important}.layout-mobile .detailImageContainer:has(.card:not(.portraitCard)){height:0}.layout-mobile .detailImageContainer .card{margin-top:-150%;max-width:60vw;position:inherit!important}.layout-mobile .detailPageWrapperContainer{margin-top:.5em;padding-top:0}#itemDetailPage:has(.detailImageContainer .album) .detailLogo,#itemDetailPage:has(.detailImageContainer .backdropCard) .detailLogo{display:none;z-index:2}#itemDetailPage:has(.detailImageContainer .person) .detailLogo{display:var(--artistClearLogoVisibility);z-index:2}.detailLogo:not(.hide)~.detailPageWrapperContainer .nameContainer h1{display:var(--itemTitleVisibility);z-index:2}.detailImageContainer:has(.squareCard .person)~.nameContainer h1{display:var(--artistTitleVisibility)}.detailLogo.hide~.detailPageWrapperContainer .nameContainer h1{display:block!important}.detailImageContainer:has(.album)~.nameContainer h1,.detailImageContainer:has(.backdropCard)~.nameContainer h1{display:block!important}.detailImageContainer .card.backdropCard:has(.cardImageIcon.album){max-width:20vh}.detailImageContainer .card.backdropCard:has(.cardImageIcon.album) .cardScalable{aspect-ratio:1/1}#childrenContent:has(.listItem[data-type=Audio]),.programGuideSection{background-color:var(--lighterGradientPointAlpha);border:var(--defaultBorder);border-radius:var(--largeRadius);padding:.5em}.detailImageContainer>.backdropCard,.detailImageContainer>.card:has(.album),.detailImageContainer>.card:has(.book),.detailImageContainer>.card:has(.live_tv),.detailImageContainer>.card:has(.person),.detailImageContainer>.card:has(.queue),.detailImageContainer>.squareCard{display:block}.detailImageContainer .squareCard:has(.person){display:none}#itemDetailPage:has(.musicParentName),#itemDetailPage:has(.subtitle){background:var(--backgroundAlphaOverlay)}#itemDetailPage:has(.detailImageContainer .cardPadder-square>.person){background:var(--artistPageBackground,var(--backgroundAlphaOverlay))}.layout-mobile #itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop,.layout-mobile #itemDetailPage:has(.musicParentName) .itemBackdrop,.layout-mobile #itemDetailPage:has(.subtitle) .itemBackdrop{animation:animMoveDownSecondaryPage .5s ease-out forwards}.layout-mobile .cardImageIcon{font-size:3.5em}.homeLibraryButton{margin:0!important;min-width:15%;width:min(45%,12rem)}@media (max-width:50em){.homeLibraryButton{width:47.6%!important}}@media (orientation:portrait) and (max-width:40em){[data-type=Movie] .listItemImage,[data-type=Series] .listItemImage{display:unset}.dashboardActionsContainer{font-size:min(3.6vw,98%)}}@media (orientation:portrait){.layout-mobile .skinHeader.noHomeButtonHeader .headerSyncButton{display:none}.layout-mobile .btnPlay.detailButton:not(.play-button){flex:0 0 100%;margin-right:0!important}}h2{font-size:1.25em}h1,h2{font-weight:600}.tagline{color:var(--textColor);font-size:1.3em;font-style:italic;font-weight:400;margin:0}.backdropContainer,.backgroundContainer:not(.backgroundContainer-transparent),.backgroundContainer:not(.withBackdrop),.nowPlayingContextMenu,.nowPlayingPlaylist,html{background-color:var(--darkerGradientPoint);background:var(--backgroundGradient)}.backdropImage{background-position-y:clamp(0%,calc(var(--backdropTrimFromTop)*5),100%)}.backdropImage:after,.backdropImage:before{background:inherit;bottom:0;content:"";left:0;position:absolute;right:0;top:0}.backdropImage:after{height:80vh;-webkit-mask:linear-gradient(180deg,#000 75%,transparent);mask:linear-gradient(180deg,#000 75%,transparent);z-index:0}.layout-desktop .backdropImage:after{transition:opacity .25s}.backdropImage:before{filter:var(--blurLargest);transform:scale(1.1)}.backgroundContainer.withBackdrop{background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.25));opacity:.9}.layout-tv .backgroundContainer.withBackdrop{background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.95))}.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop{opacity:.9}.layout-mobile .backgroundContainer.withBackdrop{background:var(--darkerGradientPoint);opacity:1}.withSectionTabs .backgroundContainer.withBackdrop{background:var(--darkerGradientPoint)}.layout-desktop .withSectionTabs .backdropImage:after{opacity:0}.layout-mobile .withSectionTabs .backdropImage:after{display:none}@keyframes animScaleUp{0%{opacity:0;transform:translateY(-2.5%)}to{opacity:1;transform:translateY(0)}}.backdropImageFadeIn{animation:animScaleUp .5s ease-out forwards;transform-origin:bottom center}.appfooter{backdrop-filter:var(--blurLargest)!important;background-color:var(--headerColor)!important}.lyricPage{padding:0 var(--sidePadding)}.lyricsLine{align-self:center;color:var(--textColor);font-size:2em;font-weight:600;text-align:center;transition:transform .125s}.futureLyric,.pastLyric{font-weight:400;text-align:center;transform:scale(.85)}.pastLyric{opacity:.45}.buttonActive{color:var(--uiAccentColor)!important}#divRunningTasks progress{width:calc(100% - 7em)}.listItemImage .itemProgressBar{margin:8%;position:absolute}.layout-mobile .listItemImage .itemProgressBar{justify-self:center;margin-bottom:5%;position:absolute}.itemProgressBar:not(.backgroundProgress):not(.playbackProgress):not(.transcodingProgress){backdrop-filter:var(--blurLarge);background-color:var(--osdSeekBarBufferedColorAlpha)!important;border-radius:var(--largeRadius);height:.35em;overflow:hidden}.layout-mobile .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress){width:calc(100% - 2em)}.layout-mobile .backdropCard .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress),.layout-mobile .portraitCard .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress){width:100%;width:-webkit-fill-available}.itemProgressBarForeground{background-color:var(--dimTextColor);border-radius:0 var(--largeRadius) var(--largeRadius) 0}.backgroundProgress,.backgroundProgress>div{background-color:var(--darkerGradientPoint)}.playbackProgress>div{background-color:var(--uiAccentColor)}::-moz-progress-bar{background:var(--uiAccentColor)!important;border-radius:var(--smallRadius) inherit var(--smallRadius) 0}::-webkit-progress-value{background:var(--uiAccentColor)!important;border-radius:var(--smallRadius) inherit var(--smallRadius) 0}::-webkit-progress-bar,progress{background:var(--darkerGradientPoint)!important;border:var(--defaultBorder)!important;border-radius:var(--smallRadius);overflow:hidden}progress+span{color:var(--uiAccentColor)!important}.mdl-spinner__circle{border-color:var(--textColor);border-style:inset;border-width:.25em}.mdl-slider-container{height:1em}.mdl-slider{height:unset}.mdl-slider-background-flex-container{padding:0}.mdl-slider-background-flex{background:var(--osdSeekBarBufferedColorAlpha);border-radius:var(--smallRadius);height:.4em;margin-top:-.2em;transition:.2s linear}.sliderContainer:active .mdl-slider-background-flex{height:.6em;margin-top:-.3em}.mdl-slider-background-lower{background-color:var(--osdSeekBarPlayedColor)}.mdl-slider-background-upper{background-color:var(--osdSeekBarBufferedColorAlpha)}.mdl-slider::-webkit-slider-thumb{background:var(--osdSeekBarThumbColor);border-radius:.4em;height:.4em!important;width:.4em!important}.sliderContainer:hover .mdl-slider::-webkit-slider-thumb{border-radius:.2em;height:.8em!important;transform:scale(1);width:.2em!important}.mdl-slider.show-focus:focus::-webkit-slider-thumb,.sliderContainer:active .mdl-slider::-webkit-slider-thumb{border-radius:.2em;height:.8em!important;transform:scale(1) scaleY(1.25);width:.2em!important}.mdl-slider::-moz-range-thumb{background:var(--osdSeekBarThumbColor);border-radius:.4em;height:.4em!important;width:.4em!important}.sliderContainer:hover .mdl-slider::-moz-range-thumb{border-radius:.2em;height:.8em!important;transform:scale(1);width:.2em!important}.mdl-slider.show-focus:focus::-moz-range-thumb,.sliderContainer:active .mdl-slider::-moz-range-thumb{border-radius:.2em;height:.8em!important;transform:scale(1) scaleY(1.25);width:.2em!important}.sliderMarkerContainer{margin:0 .1em}.sliderMarker.watched{background-color:var(--osdSeekBarPlayedColor)}.sliderMarker{border-radius:2px;height:4px}.iconOsdProgressInner{background:var(--osdSeekBarPlayedColor)}.selectLabel{max-height:2em}.button-link{color:#c8c8c8}.button-link:hover{color:unset!important;text-decoration:none}.button-link:active{color:#f3f3f3!important;text-decoration:none}.drawer-open,.mainDrawer{backdrop-filter:var(--blurLarge);background-color:var(--drawerColor);border-right:var(--defaultBorder)}.mainDrawer-scrollContainer{padding-bottom:5vh}.mainDrawer-scrollContainer>div:first-child{margin-bottom:1em}.btnHeaderSave.button-flat{border-radius:var(--smallRadius);color:var(--uiAccentColor)!important;gap:.3em}.button-flat:hover{color:unset}.button-flat:active{background-color:hsla(0,0%,100%,.2);color:unset}.playstatebutton-icon-played{color:#22c55e}.videoOsdBottom.videoOsdBottom-maincontrols .btnPause{font-size:2em}.osdControls{display:flex;flex-direction:column-reverse}.itemExternalLinks{color:var(--textColor)}.itemExternalLinks.focuscontainer-x{color:transparent}.itemExternalLinks.focuscontainer-x>.button-link{background-color:var(--selectorBackgroundColor);border-radius:var(--smallerRadius);color:var(--textColor);margin-bottom:.5em;padding:.125em .5em}.layout-mobile .itemExternalLinks.focuscontainer-x>.button-link:hover:not(:active){color:var(--textColor)!important}.itemExternalLinks.focuscontainer-x>a:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a:hover{background-color:var(--activeColor)!important;color:#fff!important}.itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:hover{background-color:#1ab7d8!important;color:#000!important}.itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:hover{background-color:#e2b616!important;color:#000!important}.itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:hover{background-color:#6cd591!important;color:#000!important}.itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:hover{background-color:#ab3aad!important;color:var(--textColor)!important}.itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:hover{background-color:#6399cc!important;color:#0f161c!important}.itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:active,.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:hover{background-color:#ba478f!important;color:var(--textColor)!important}.itemTags,.itemTags>a{display:none;font-size:unset!important;font-weight:200}.detail-clamp-text{color:var(--dimTextColor);margin-bottom:0;margin-top:0;text-align:start}.detail-clamp-text p{margin-bottom:.25em;margin-top:.25em}.layout-desktop .detail-clamp-text{-webkit-line-clamp:2}.layout-mobile .detail-clamp-text{-webkit-line-clamp:4}.layout-tv .detail-clamp-text{-webkit-line-clamp:10;transition:none}.overview-expand.emby-button{color:transparent;margin-bottom:1.4em;margin-top:1.4em;padding:0}.overview-expand.emby-button:after{align-content:center;background:var(--selectorBackgroundColor);border-radius:50%;color:var(--textColor);content:"keyboard_arrow_down";font-family:var(--iconPack),Material Icons;font-feature-settings:"liga";height:1.5em;line-height:1.6ch;transition:transform .5s;width:1.5em}.overview.detail-clamp-text~.overview-controls .overview-expand:after{transform:rotate(0deg)}.overview:not(.detail-clamp-text)~.overview-controls .overview-expand:after{transform:rotate(180deg)}.overview-controls{height:0}.detailSectionContent:has(.itemExternalLinks.hide) .overview-controls{height:1em}#seriesAirTime{margin-top:.5em}.itemMiscInfo{align-items:flex-end!important;justify-content:center}.chapterCardImageContainer,.innerCardFooter{box-sizing:border-box;width:100%}.chapterThumbTextContainer,.innerCardFooter{align-content:end;background:var(--cardFooterGradient);display:grid;height:100%;padding:0 2em 2em;text-shadow:.1em .1em 0 #000}.chapterCardImageContainer{background-size:135%}.chapterCardImageContainer+.innerCardFooter{height:auto;padding:0 1em 1em}.layout-mobile .innerCardFooter{padding:5em 1em 1.25em}.layout-mobile .chapterCardImageContainer+.innerCardFooter{padding:0 .5em .5em}.centerMessage{width:unset}.noItemsMessage{width:90%}.dialog{backdrop-filter:var(--blurDefault);background-color:var(--drawerColor);min-width:11em}[dir=ltr] .emby-collapsible-button{padding-left:1em}.dialog:not(.dialog-fullscreen){border:var(--defaultBorder);border-radius:var(--largeRadius)!important}@media (max-height:45em),(max-width:80em){.dialog.dialog-fixedSize,.dialog.dialog-fullscreen-lowres{border:unset;border-radius:unset!important}}.dialogBackdropOpened{opacity:.66}.imageEditor-dropZone,.lyricsEditor-dropZone,.subtitleEditor-dropZone{border-radius:var(--largeRadius)}.formDialogHeaderTitle{margin-inline-end:0!important;margin-inline-start:0!important;padding:0 .5em!important;text-align:center}.formDialogFooter:not(.formDialogFooter-clear.formDialogFooter-flex)>.formDialogFooterItem{-webkit-flex-basis:6em;flex-basis:6em}.collapseContent{backdrop-filter:unset!important;background-color:unset!important}.selectionCommandsPanel{backdrop-filter:var(--blurLarge);background:var(--lighterGradientPoint);border-bottom:var(--defaultBorder);height:3.5em;padding-top:max(env(safe-area-inset-top),var(--safe-area-inset-top))}.selectionCommandsPanel>h1{font-size:large}.itemSelectionPanel{background-color:transparent;border:unset}.emby-checkbox:checked+span+.checkboxOutline{background:transparent;border-color:#fff;border-radius:var(--smallerRadius)!important;border-style:solid;border-width:var(--borderWidthDouble);box-shadow:inset 0 7em 10em 20px rgba(0,0,0,.8);outline:none}@supports (display:revert){.emby-checkbox:checked+span+.checkboxOutline{outline:solid var(--borderWidth) #fff}}.checkboxOutline{border-radius:var(--smallerRadius);height:1.3em;top:unset;width:1.3em}.itemSelectionPanel .material-icons.check:before{color:#fff;font-size:4em;padding:.25em}.cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 1.75em)}.overflowBackdropCard .cardText-first+.itemSelectionPanel>.checkboxContainer{height:100%}.checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius)!important}#castCollapsible .checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline,#guestCastContent .checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline{border-radius:50%!important}.cardPadder{text-align:center}#castCollapsible .cardPadder .cardImageIcon,#guestCastContent .cardPadder .cardImageIcon{display:none}.cardText-secondary+.itemSelectionPanel>.checkboxContainer,.cardText.cardTextCentered:not(.cardText-secondary,.cardText-first)+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 3em)}.cardFooter+.itemSelectionPanel>.checkboxContainer,.cardScalable+.itemSelectionPanel>.checkboxContainer{height:100%}.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius);border-width:0;height:100%;width:100%}.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon{font-size:.9em;font-weight:900}.checkboxOutline:not(.multiSelectCheckboxOutline){background-color:#fff;border:var(--borderWidth) solid gray;transition:all .125s}.emby-checkbox:checked+span+.checkboxOutline:not(.multiSelectCheckboxOutline){background:var(--checkboxCheckedBgColor);border:var(--defaultLighterBorder);box-shadow:none}.emby-checkbox:focus+span+.checkboxOutline,.emby-checkbox:focus:not(:checked)+span+.checkboxOutline{border-color:var(--highlightOutlineColor)!important;outline:none}@supports (display:revert){.emby-checkbox:focus:not(:checked)+span+.checkboxOutline{outline:var(--borderWidth) solid gray;outline-offset:calc(var(--borderWidth)*-2.5)}.emby-checkbox:focus+span+.checkboxOutline{border-color:#fff!important;outline:var(--borderWidth) solid var(--highlightOutlineColor)}}.cardIndicators{-webkit-align-items:center;align-items:center;top:.5em}[dir=ltr] .cardIndicators{right:.5em}.layout-mobile .cardIndicators{right:.5em;top:.45em}.indicator{border:var(--borderWidth) solid hsla(0,0%,48.6%,.5);border-radius:100em}.playedIndicator{background:#22c55e}.playedIndicator,.videoIndicator{border:var(--defaultLighterBorder)}.videoIndicator{background:#292929;font-size:.75em;padding:.5em;transform:scale(.85)}.videoIndicator:has(.folder),.videoIndicator:has(.photo_album){background:peru}.videoIndicator:has(.photo){background:#4682b4}.videoIndicator:has(.videocam){background:#cd5c5c}.cardScalable,.defaultCardBackground{background:var(--cardBackgroundGradient)}div[data-type=Book] .play_arrow:before{content:"book";font-size:85%}div[data-type=Photo] .play_arrow:before{content:"photo"}div[data-type=PhotoAlbum] .play_arrow:before{content:"photo_album"}#btnDeleteImage,.button-alt,.dashboardActionsContainer>.emby-button,.emby-button.block,.manageRecordingButton,.raised{background:var(--lighterGradientPoint);border:var(--defaultBorder);border-radius:var(--smallRadius);color:#fff;transition:all .125s}.editItemMetadataForm>.metadataFormFields div:has(.formDialogFooterItem){display:flex;justify-content:center}.btnBrowse>.folder{margin-inline-end:.5em}.fab{background:var(--lighterGradientPoint);border:var(--defaultBorder);color:#fff}.fab:focus{background:var(--lighterGradientPoint)!important;filter:brightness(1.2)}.raised:focus{background:inherit;filter:brightness(1.2)}.emby-button:active,.fab:active,.raised:active{filter:brightness(1.2)!important;transform:scale(.98)}.detailButton{border:var(--defaultLighterBorder);padding:.5em!important}.detailButton-icon{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 48}.cardScalable .material-icons.check:before{font-variation-settings:"FILL" 1,"wght" 700,"GRAD" 0,"opsz" 20;transform:scale(1.25)}.emby-button[title=Favorite] .material-icons.favorite:before{font-variation-settings:"FILL" 1,"wght" 400,"GRAD" 0,"opsz" 20}.detailButton:not(.btnPlay){backdrop-filter:none;background:transparent;border-color:transparent;border-radius:50%;color:var(--textColor);margin:.5em!important;padding:.6em!important}.layout-desktop .detailButton:not(.btnPlay):hover{background:var(--dimTextColor);color:#000}.detailButton:active{background:var(--textColor);color:#000}.btnPlay.detailButton{background-color:var(--textColor);border-color:var(--borderColor);border-radius:3em;color:#000;flex-direction:row;height:3em;margin-right:.5em!important;min-width:10em}.mainDetailButtons>.btnPlay:after{content:attr(title);padding-right:1ch}.btnPlay>.detailButton-content:after{padding:0 1ch;place-content:center}.btnPlay>.detailButton-content{align-content:unset;-webkit-align-items:unset;align-items:unset;display:-webkit-flex;display:flex;-webkit-flex-direction:unset;flex-direction:unset;-webkit-justify-content:unset;justify-content:flex-start}.mainDetailButtons:has(.detailButton[data-type=Book]) .btnPlay[title=Play]:after{content:"Read"}.mainDetailButtons:has(.detailButton[data-type=Book]) .btnPlay .material-icons.play_arrow:before{content:"book";padding-inline-end:1ch}.mainDetailButtons{justify-content:center;margin:0}.layout-mobile [dir=ltr] .mainDetailButtons{flex-wrap:wrap;padding:0 1.25em}@media (min-width:100em){.mainDetailButtons{font-size:unset;margin:0}}.localnav>.emby-button{background:var(--lighterGradientPoint)!important;color:#fff;padding:.8em}div[data-role=controlgroup] a.ui-btn-active{background:var(--selectorBackgroundColor)!important;color:#fff!important}.guide-date-tab-button.emby-tab-button-active,.guide-date-tab-button:focus{color:#fff}#btnDeleteImage,#btnShutdown,.btnRevoke,.button-delete{background:var(--btnDeleteColor);border:solid var(--btnDeleteBorderColor) var(--borderWidth)}.button-submit{background:var(--btnSubmitColor)!important;border:solid var(--btnSubmitBorderColor) var(--borderWidth)!important}.collapseContent,.formDialogFooter:not(.formDialogFooter-clear),.formDialogHeader:not(.formDialogHeader-clear){backdrop-filter:var(--blurDefault);background-color:var(--headerColor)}.paperList{padding:.4em}.serverInfo{padding:1em}.serverInfo>:nth-child(1n){-webkit-flex:1 0 30%;flex:1 0 30%}.serverInfo>:nth-child(2n){-webkit-flex:1 0 50%;flex:1 0 50%;text-align:end}.listItemIcon:not(.listItemIcon-transparent){background-color:var(--lighterGradientPoint)!important}.listItemIcon.notification_important{background-color:var(--btnDeleteColor)!important;border:solid var(--btnDeleteBorderColor) var(--borderWidth)}.listItemIcon.live_tv:not(.listItemIcon-transparent),.listItemIcon.notifications:not(.listItemIcon-transparent),.listItemIcon.person:not(.listItemIcon-transparent),.listItemIcon.schedule:not(.listItemIcon-transparent){background-color:#293153!important;border:var(--defaultBorder)}.readOnlyContent{flex-direction:column!important}.MuiAppBar-root{backdrop-filter:var(--blurDefault);background:var(--headerColor);border-bottom:var(--defaultBorder)}.MuiDrawer-paper{backdrop-filter:var(--blurLarge);background:var(--drawerColor);border-right:var(--defaultBorder);padding:.25em}.listItemImage{border:var(--defaultBorder);border-radius:var(--smallRadius);margin-right:.75em!important}[dir=ltr] .listItem:not(.actionSheetMenuItem,.childrenItemsContainer .listItem,.activityLogListWidget .listItem){padding:.375em!important}[dir=ltr] .listItem:not(.actionSheetMenuItem,.childrenItemsContainer .listItem,.activityLogListWidget .listItem):not(:last-child){margin-bottom:.5em}[dir=ltr] .listItem:not(.actionSheetMenuItem)[data-type=Episode]{margin-bottom:.5em;padding:.375em}.layout-mobile #playlist .listItem[data-type=Audio],.layout-mobile #songsTab .listItem[data-type=Audio]{margin:auto 1em}.listItem[data-type=Audio]:has(.playlistIndexIndicatorImage) .listItemBodyText{color:#fff;font-weight:600}.listItem[data-type=Audio]:has(.playlistIndexIndicatorImage):not(:hover){background-color:hsla(0,0%,100%,.07)}.listItem-largeImage .listItemBodyText:not(.secondary){color:var(--textColor);font-size:1.17em;font-weight:600}.listItemBodyText.secondary{color:var(--dimTextColor)}.listItemBody>.listItemBodyText:not(.secondary){-webkit-box-orient:vertical;color:var(--textColor);display:-webkit-box;-webkit-line-clamp:3;overflow:hidden}.listItem-overview{-webkit-box-orient:vertical;display:-webkit-box;-webkit-line-clamp:4;overflow:hidden}.listItem-bottomoverview,[dir=ltr] .listItem:not(.actionSheetMenuItem)[data-type=Episode] .listItem-overview p{margin-bottom:0;margin-top:.75em}.listItem,.navMenuOption{border-radius:.7em}.listItem:hover,.navMenuOption:hover{background:unset;border-radius:.7em}.listItem:focus{background:var(--highlightOutlineColor)}.listItem:active,.navMenuOption:active{background:hsla(0,0%,100%,.125)}.listItem-border{border-color:transparent!important}.listItem-border.emby-button.show-focus:focus{border-radius:var(--smallRadius)}.MuiList-root>a,.MuiListItem-root>a,.MuiListItem-root>div{border:var(--borderWidth) solid transparent;border-radius:.7em}.Mui-selected{background-color:var(--activeColor)!important}.actionsheetDivider{background:hsla(0,0%,100%,.05);height:2px}.actionsheet-xlargeFont{line-height:normal}.actionSheetContent{padding:.4em!important}.actionSheetContent>h1{font-size:unset}[dir=ltr] .actionsheetMenuItemIcon{margin:0 .2em 0 .45em!important}.actionSheetMenuItem:has(.listItemIcon.check){background-color:var(--activeColor)}.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText{color:#fff}.actionSheetMenuItem:has(.listItemIcon.check) .listItemIcon.check{display:none}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]){background-color:transparent}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]):active{background-color:hsla(0,0%,100%,.125)}.navMenuOption{border-radius:var(--smallRadius)!important;margin:0 1em!important}[dir=ltr] .navMenuOption{margin-bottom:unset;padding:.75em 1em!important}#myPreferencesMenuPage .listItemIcon{margin-left:.5em;margin-right:.25em}.navMenuOption-selected{background-color:var(--activeColor)!important}#itemDetailPage .detailSection{column-gap:3em;display:grid;grid-template-columns:1.3fr .7fr 1fr 1fr;margin-bottom:1.5em;max-width:unset!important;row-gap:1em}.detailPageContent{gap:1em}.trackSelections{background-color:var(--lighterGradientPointAlpha);border:var(--defaultBorder);border-radius:var(--smallRadius);grid-column:3/5;margin-top:1em;max-width:unset!important;order:3;padding:1em}.layout-mobile .trackSelections{margin-top:0}.layout-tv .trackSelections{order:2}.recordingFields{order:4}.recordingButton{gap:1ch}.detailsGroupItem,.trackSelections .selectContainer{align-items:baseline;max-width:unset!important}.selectArrowContainer{opacity:.5;top:0}.trackSelectionFieldContainer>.selectArrowContainer{top:.5em}.trackSelectionFieldContainer>label{background-repeat:no-repeat;color:transparent;max-width:2.75em;transform:scale(.9)}.selectVideoContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M2 12c0-4.7 0-7 1.5-8.5C4.9 2 7.3 2 12 2s7 0 8.5 1.5C22 4.9 22 7.3 22 12s0 7-1.5 8.5C19.1 22 16.7 22 12 22s-7 0-8.5-1.5C2 19.1 2 16.7 2 12Z'/%3E%3Cpath stroke-linecap='round' d='M17 2.5v19M7 2.5v19M2.5 7H7m14.5 0H17M2.5 17H7m14.5 0H17M2 12h20'/%3E%3C/g%3E%3C/svg%3E")}.selectAudioContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M9 19a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm12-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9 19V8m12 9V6'/%3E%3Cpath stroke-linecap='round' d='m15.7 3.8-4 1.3c-1.3.4-2 .6-2.3 1.2C9 6.8 9 7.5 9 8.9V12l12-4v-.5c0-2.5 0-3.7-.8-4.3-.9-.6-2-.2-4.5.6Z'/%3E%3C/g%3E%3C/svg%3E")}.selectSubtitlesContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M2 12c0-3.8 0-5.7 1.2-6.8C4.3 4 6.2 4 10 4h4c3.8 0 5.7 0 6.8 1.2C22 6.3 22 8.2 22 12s0 5.7-1.2 6.8C19.7 20 17.8 20 14 20h-4c-3.8 0-5.7 0-6.8-1.2C2 17.7 2 15.8 2 12Z'/%3E%3Cpath stroke-linecap='round' d='M10 16H6m8-3h4m-4 3h-1.5m-3-3h2m6.5 3h-1.5M6 13h1'/%3E%3C/g%3E%3C/svg%3E")}.selectSourceContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%23d1d5db' d='m15.4 4.05-.5.56zm3.95 3.57-.5.55zm2.3 2.53-.68.3zM3.17 20.83l.53-.53zm17.66 0-.53-.53zm-6.83.42h-4v1.5h4zM2.75 14v-4h-1.5v4zm18.5-.44V14h1.5v-.44zm-6.36-8.95 3.96 3.56 1-1.11L15.9 3.5l-1 1.11Zm7.86 8.95c0-1.69.02-2.75-.41-3.71l-1.37.6c.26.6.28 1.3.28 3.11zm-3.9-5.39c1.35 1.22 1.85 1.7 2.12 2.29l1.37-.61c-.43-.96-1.23-1.66-2.49-2.8zm-8.82-5.42c1.58 0 2.18.01 2.71.22l.54-1.4c-.85-.33-1.78-.32-3.25-.32zm5.86.75c-1.08-.98-1.76-1.6-2.61-1.93l-.54 1.4c.53.2.98.59 2.15 1.64zM10 21.25c-1.9 0-3.26 0-4.29-.14-1-.13-1.58-.39-2-.81l-1.07 1.06c.75.75 1.7 1.08 2.87 1.24 1.15.15 2.63.15 4.49.15zM1.25 14c0 1.86 0 3.34.15 4.49a4.7 4.7 0 0 0 1.24 2.87L3.7 20.3c-.42-.43-.67-1-.81-2.01A36 36 0 0 1 2.75 14zM14 22.75c1.86 0 3.34 0 4.49-.15a4.7 4.7 0 0 0 2.87-1.24L20.3 20.3c-.43.42-1 .68-2.01.81-1.03.14-2.38.14-4.29.14zM21.25 14c0 1.9 0 3.26-.14 4.29-.13 1-.39 1.58-.81 2l1.06 1.07a4.7 4.7 0 0 0 1.24-2.87c.15-1.15.15-2.63.15-4.49zm-18.5-4c0-1.9 0-3.26.14-4.29.14-1 .39-1.58.81-2L2.64 2.63A4.7 4.7 0 0 0 1.4 5.51c-.15 1.15-.15 2.63-.15 4.49zm7.28-8.75c-1.87 0-3.36 0-4.51.15a4.72 4.72 0 0 0-2.88 1.24L3.7 3.7c.42-.42 1-.67 2.02-.81 1.03-.14 2.4-.14 4.31-.14z'/%3E%3Cpath stroke='%23d1d5db' stroke-width='1.5' d='M13 2.5V5c0 2.36 0 3.54.73 4.27S15.64 10 18 10h4'/%3E%3C/svg%3E")}.detailSectionContent a:not(.overview-expand){text-align:start}.layout-desktop .detailSectionContent{align-content:end;display:grid;min-height:16vh}.detailSectionContent:has(.tagline.hide+.overview.hide){min-height:unset}.itemDetailsGroup{background-color:var(--lighterGradientPointAlpha);border:none;border-radius:var(--smallRadius);box-shadow:inset 0 0 0 .06em var(--borderColor)!important;grid-column:1/3;margin-top:1em;order:2;outline:none;overflow:hidden}.layout-mobile .itemDetailsGroup{margin-top:0}.detailsGroupItem{align-items:baseline;justify-content:space-between;margin:0!important;padding:.5em .9em}.detailsGroupItem:not(:last-child){border-bottom:var(--defaultBorder)}.detailsGroupItem>.label{flex-basis:6em;font-weight:600}.detailsGroupItem>.content>a{font-weight:400;text-align:end}.detailsGroupItem>.content{color:var(--dimTextColor);text-align:end}.detailsGroupItem>.label{color:var(--textColor)}.layout-tv .itemDetailsGroup{order:2}.detailSection>.nextUpSection{grid-column:1;order:5}.detailSection>#listChildrenCollapsible{grid-column:2/-1;order:6}.detailSectionContent{grid-column:1/-1;order:1}.collectionItems,.layout-mobile .detailSection>#listChildrenCollapsible,.layout-mobile .detailSectionContent,.layout-mobile .itemDetailsGroup,.layout-mobile .nextUpSection,.layout-mobile .trackSelections,.layout-tv .detailSection>#listChildrenCollapsible,.layout-tv .detailSectionContent,.layout-tv .itemDetailsGroup,.layout-tv .nextUpSection,.layout-tv .trackSelections,.nextUpSection.hide~#listChildrenCollapsible,.programGuideSection,.trackSelections.hide~.recordingFields.hide~.itemDetailsGroup{grid-column:1/-1}.collectionItems{order:2}.programGuideSection:not(.hide){margin-top:2em;order:-1}.layout-desktop .programGuide{padding-right:var(--sidePadding)}.collectionItems .sectionTitleContainer.padded-left{padding-left:.375em}.collectionItemsContainer.padded-left{padding-left:0}.sliderBubble{border:var(--defaultBorder);border-radius:var(--largeRadius);overflow:hidden;z-index:3}.alphaPickerButton{color:hsla(0,0%,100%,.25);font-family:monospace;margin:.15em}.alphaPickerButton-selected{color:#fff}.alphaPicker-vertical{height:70%}.layout-mobile .alphaPicker-vertical{right:0!important}.alphaPicker{justify-content:center}.alphaPickerButton-tv{transition:transform .2s}.alphaPickerButton-tv:focus{background-color:var(--highlightOutlineColor);transform:scale(1.75)}.padded-right{padding-right:var(--sidePadding)!important}.content-primary,[dir=ltr] .detailPageContent{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}[dir=ltr] .detailPageContent>.detailPagePrimaryContent{padding-left:0!important;padding-right:0!important}#itemDetailPage .verticalSection .itemsContainer.padded-right{padding-right:0!important}.vertical-list>.listGroupHeader{padding-left:.5ch}.listPaging>span{padding:0 .5em}.layout-mobile #myPreferencesMenuPage{padding-top:var(--appBarHeight)!important}.headerUserButton{border:var(--defaultBorder);height:2em;margin-inline-end:1em;width:2em}.MuiAvatar-circular{border:var(--defaultBorder);height:1.5em;width:1.5em}.dashboardDocument .content-primary{padding-top:4.25rem}.editorNode{align-items:center;display:flex}.metadataSidebarIcon{color:#6c7bab}.jstree-default .jstree-wholerow-clicked{background:var(--selectorBackgroundColor)!important}.verticalSection{margin-bottom:1em;margin-top:.5em}.sectionTitleTextButton{padding:0 .5em}.sectionTitleTextButton:hover{background:transparent!important}.sectionTitleTextButton:active{color:#fff!important}.sectionTitleContainer-cards{padding-bottom:.2em;padding-top:0}.sectionTitleTextButton>*{margin:0!important;max-width:88vw;overflow:hidden;padding:.3em 0!important;text-align:left;text-overflow:ellipsis;white-space:nowrap}.dashboardSection .sectionTitleTextButton>.material-icons,.dashboardSection .sectionTitleTextButton>.material-icons.material-icons,.sectionTitleTextButton>.material-icons{font-size:unset}.sectionTitleTextButton>.material-icons:before{display:none}.sectionTitleTextButton>.material-icons.chevron_right{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' stroke-width='1.5' aria-hidden='true' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='m12.75 15 3-3m0 0-3-3m3 3h-7.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0'/%3E%3C/svg%3E") no-repeat 50%;background-size:contain;height:1.5rem;width:1.5rem}.toast{border-radius:var(--smallRadius)}.upNextContainer{border-radius:var(--largeRadius);color:var(--textColor)}[dir=ltr] .upNextContainer{box-sizing:border-box;margin:2em;max-width:80vw}.upNextContainer .btnStartNow{background-color:var(--btnSubmitColor);border-color:var(--btnSubmitBorderColor)}.upNextDialog-title{white-space:pre-wrap;width:unset}.upNextDialog-buttons{flex-wrap:wrap;width:unset}.upNextContainer .upNextDialog-countdownText{color:#fff}.skip-button-container{bottom:9rem}.skip-button{background-color:var(--textColor);border-radius:3em;box-shadow:var(--shadow);color:#000;margin-right:var(--sidePadding)}.layout-tv .skip-button{margin-left:var(--sidePadding);margin-right:auto}.skip-button:hover{background-color:#fff}.skip-button:active{background-color:hsla(0,0%,96%,.7);box-shadow:none}.toast,.upNextContainer{backdrop-filter:var(--blurDefault);background:var(--headerColor)!important;border:var(--defaultBorder)!important}.activeSession{width:98%!important}.emby-tab-button:hover{color:#f5f5f5}@media (hover:hover) and (pointer:fine){.paper-icon-button-light:hover:not(:disabled){background-color:hsla(0,0%,100%,.05);color:#fff}.actionSheetMenuItem.emby-button:has(.listItemIcon.material-icons.check[style*=hidden]):hover{background-color:hsla(0,0%,100%,.125)}.emby-input:hover:not(:focus),.emby-select-withcolor:hover:not(.emby-select[disabled],:focus),.emby-textarea:hover:not(:focus){border-color:var(--dimTextColor)!important}.checkboxContainer:hover .checkboxOutline:not(.multiSelectCheckboxOutline){border-color:var(--checkboxCheckedBgColor);border-width:var(--borderWidthDouble)}.button-flat:hover{background-color:hsla(0,0%,100%,.2);color:#fff}.btnPlay.detailButton:hover{background-color:var(--textColor);color:#000}.alphaPickerButton:hover{color:#fff}.listItem:hover{backdrop-filter:var(--blurLargest)}.listItem:hover,.navMenuOption:hover{background:hsla(0,0%,100%,.125)}.inputContainer .emby-input-iconbutton:hover,.searchfields-icon:hover{color:hsla(0,0%,100%,.8)}#scenesContent .cardScalable:hover{border-color:var(--dimTextColor)!important}.sectionTitleTextButton:hover{background:transparent!important;color:#fff!important}.button-link:hover{color:#f3f3f3!important;text-decoration:none}}.paper-icon-button-light:active:not(:disabled){background-color:hsla(0,0%,100%,.05);color:#fff}.emby-textarea{font-family:consolas,monaco,monospace}.customCssContainer textarea{max-height:40vh;overflow-y:auto!important}.emby-input,.emby-select,.emby-select-withcolor,.emby-textarea{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);border-radius:var(--smallRadius);padding:.5em!important}.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused{color:#fff}.emby-input:focus,.emby-select-withcolor:focus,.emby-textarea:focus{border-color:var(--highlightOutlineColor)!important;outline:none!important}@supports (display:revert){.emby-input:focus,.emby-select-withcolor:focus,.emby-textarea:focus{border-color:var(--highlightOutlineColor)!important;outline:thin solid var(--highlightOutlineColor)!important}}.emby-select-withcolor>option{background-color:var(--selectorBackgroundColor);color:inherit}.inputContainer .emby-input-iconbutton{background-color:transparent!important;color:hsla(0,0%,100%,.5);margin-left:-2.5em}.searchfields-txtSearch{border-radius:4em;padding:.75em 1.5em!important}.searchfields-icon{border-radius:var(--largeRadius);color:hsla(0,0%,100%,.5);margin-bottom:0;margin-left:-1.75em;padding:.25em}.inputContainer .emby-input-iconbutton:active,.searchfields-icon:active{color:hsla(0,0%,100%,.8)}.searchFields>.searchFieldsInner{flex-direction:row-reverse}.nameContainer>h1,.nameContainer>h3{overflow:hidden;word-break:break-word}.nameContainer>h1.itemName,.nameContainer>h1.parentName{color:#fff;font-size:4em;padding-bottom:.5ch;white-space:pre-wrap}.nameContainer>h1.itemName,.nameContainer>h1.itemName a,.nameContainer>h1.parentName,.nameContainer>h1.parentName a{font-weight:200}.nameContainer>h1.itemName a,.nameContainer>h1.itemName bdi,.nameContainer>h1.parentName a,.nameContainer>h1.parentName bdi{-webkit-box-orient:vertical;display:-webkit-box!important;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}.layout-mobile .nameContainer>h1.itemName,.layout-mobile .nameContainer>h1.parentName,.layout-mobile .nameContainer>h1.parentNameLast{font-size:2em;padding-bottom:0;word-wrap:break-word}.subtitle{font-size:2em;padding-bottom:1em}.layout-mobile .subtitle{font-size:1.5em;padding-bottom:.5em}.itemName.originalTitle{color:var(--dimTextColor);display:var(--itemOriginalTitleVisibility);padding-bottom:.25em;padding-top:.25em}.channelPrograms,.programCell{background-color:transparent!important;border-color:transparent;border-radius:var(--smallRadius);height:4.42em}.guideProgramName{background-color:hsla(0,0%,100%,.05);border-radius:var(--smallerRadius);height:calc(100% - .7em);margin:.35em 0 .35em .7em}.guide-programNameCaret{display:none}.programCell-active .guideProgramName{background-color:hsla(0,0%,100%,.125)}.guideVerticalScroller{padding:0}.layout-mobile .guideChannelImage{background-position:50%;right:0;width:calc(100% - var(--sidePadding))}.guide-channelHeaderCell{background-color:hsla(0,0%,100%,.125);border-radius:var(--smallRadius);height:3.72em;margin:.35em .7em .7em;width:auto}.guideChannelNumber{font-size:1em}#guideTab{padding-top:3em!important}.guide-channelHeaderCell:focus{background-color:var(--highlightOutlineColor)!important}.programCell:focus{background-color:transparent!important}.programCell:focus>.guideProgramName{background-color:var(--highlightOutlineColor)}.emby-select-iconbutton{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);margin-inline-start:1em}.emby-select-iconbutton,.subtitleappearance-preview{border-radius:var(--smallRadius)}.infoBanner{background-color:var(--headerColor)!important;border:var(--defaultBorder)!important;border-radius:var(--largeRadius)!important;display:flex;place-content:center}.sliderBubbleText{font-size:1.5em}fieldset{border:var(--defaultBorder);border-radius:var(--smallRadius)}table:not(.MuiTable-root.MuiTable-stickyHeader){background:var(--tableBodyColor);border-color:var(--borderColor)!important;border:var(--defaultBorder);border-collapse:separate;border-radius:var(--smallRadius);border-spacing:1px;overflow:hidden}.detailTableHeaderCell{vertical-align:middle}#serverActivityPage .MuiPaper-elevation2{border:var(--defaultBorder)!important;box-shadow:unset!important}#serverActivityPage .MuiPaper-elevation2,#serverActivityPage .MuiPaper-elevation2>.MuiBox-root,#serverActivityPage .MuiTableRow-root.MuiTableRow-head{background-color:var(--tableBodyColor)}#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(odd),.detailTableBodyRow-shaded:nth-child(odd){background:var(--darkerGradientPointAlpha)!important}#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(2n),.detailTableBodyRow-shaded:nth-child(2n){background:var(--lighterGradientPointAlpha)!important}.MuiList-root.MuiMenu-list{background-color:var(--drawerColor)}ul.MuiList-root.MuiMenu-list.MuiList-dense>div:first-child{gap:.5rem}.iconOsd,.playerStats{backdrop-filter:var(--blurDefault);background-color:rgba(69,69,69,.69);border-radius:var(--largeRadius)}.playerStats-stats{flex-wrap:wrap;max-height:50vh;overflow-x:auto;padding:1em!important}#scenesContent .cardScalable:active{border-color:var(--dimTextColor)!important}.progressring-spiner{border-color:var(--uiAccentColor)}.skinHeader.focuscontainer-x.skinHeader-withBackground.skinHeader-blurred.semiTransparent.noHeaderRight{display:none}#loginPage{align-items:center;background:linear-gradient(to bottom,var(--darkerGradientPointAlpha),var(--lighterGradientPoint)),var(--loginPageBgUrl);background-position:50%;background-repeat:no-repeat;background-size:cover;box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;overflow-y:auto;padding:1em}#loginPage .padded-left.padded-right.padded-bottom-page{backdrop-filter:var(--blurDefault);background:rgba(30,40,54,.7);border-radius:var(--largerRadius);box-sizing:border-box;padding:2em 2em 1em!important;transform:translateY(3em);width:28em}.manualLoginForm .sectionTitle,.visualLoginForm>h1{display:none}#loginPage .padded-left.padded-right.padded-bottom-page:has(.visualLoginForm:not(.hide)){width:40em}#divUsers .squareCard{width:30%!important}.layout-mobile #divUsers .squareCard{width:45%!important}.manualLoginForm:before,.visualLoginForm:before{color:#fff;content:var(--loginPageText);display:block;font-size:1.875em;font-weight:800;margin-bottom:-1em;position:relative;text-align:center;top:-3.5em}.manualLoginForm,.visualLoginForm{position:relative}#quickConnectPreferencesPage .padded-left.padded-right.padded-bottom-page{align-items:center;display:flex;flex-direction:column;justify-content:center}#txtLoginDisclaimer{resize:none}.endTimeText,.positionTime,.runtime,.startTimeText{box-sizing:border-box;width:4.5em}.startTimeText{margin:0!important}.endTimeText{justify-content:right;margin:0 0 0 .75em!important;padding-inline-end:.8em}.endTimeText,.startTimeText{padding-top:.25em}.positionTime,.startTimeText{justify-content:left;text-align:start}.endTimeText,.runtime{justify-content:right;text-align:end}.filterIndicator{background:var(--activeColor)}.overflowBackdropCard[data-type=CollectionFolder] .cardPadder-overflowBackdrop,.overflowBackdropCard[data-type=UserView] .cardPadder-overflowBackdrop{padding-bottom:50%}.overflowBackdropCard[data-type=CollectionFolder] .cardText-first,.overflowBackdropCard[data-type=UserView] .cardText-first{display:var(--libraryLabelVisibility)}.nowPlayingButtonsContainer{margin-top:1em}.nowPlayingPageImageContainerNoAlbum{border:var(--defaultBorder);border-radius:var(--smallRadius);overflow:hidden}.nowPlayingPageImageContainerNoAlbum .defaultCardBackground{background:repeating-radial-gradient(#000,transparent 10em)}.nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon{color:var(--borderColor)}.layout-mobile .playlistSection .playlist{backdrop-filter:var(--blurLargest);background:var(--headerColor);bottom:4.3em;padding:4.3em 0;top:0;z-index:0}.layout-mobile .playlistSectionButton{backdrop-filter:var(--blurSmallest);background:var(--drawerColor);border-top:var(--defaultBorder);z-index:1}.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent{background:transparent;border-top:var(--defaultBorder);border-color:transparent}.layout-desktop .nowPlayingInfoContainer{backdrop-filter:var(--blurLargest);background-color:var(--headerColor);border:var(--defaultLighterBorder);border-radius:var(--largerRadius);box-shadow:var(--shadow);box-sizing:border-box;margin-bottom:2em;padding:1em;position:-webkit-sticky;position:sticky;top:5em;z-index:2}.layout-desktop .nowPlayingInfoControls{margin:0 2em}.nowPlayingPageImage{aspect-ratio:1/1;border-radius:var(--smallRadius);box-shadow:var(--shadow);object-fit:cover}.nowPlayingBar .playPauseButton{font-size:2em}.nowPlayingInfoContainer .btnPlayPause{font-size:3em}.nowPlayingBar .nowPlayingImage{background-size:cover;border-radius:var(--smallerRadius);height:3.5em;margin:.25em;width:3.5em}.nowPlayingBarPositionContainer{top:-.7em}@media (orientation:portrait) and (max-width:43em){.nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon{font-size:8em!important}.nowPlayingInfoContainer{height:calc(95% - 4.2em)}}.nowPlayingSongName.nowPlayingEpisode{color:var(--textColor);font-size:1.25em;margin-bottom:1em}.nowPlayingAlbum.nowPlayingSeason{color:var(--dimTextColor);margin-bottom:.5em}.nowPlayingArtist.nowPlayingSerie{margin-bottom:.5em}.playlistIndexIndicatorImage{background-blend-mode:difference;background-color:var(--textColor);background-size:contain!important}.playlistIndexIndicatorImage.defaultCardBackground .audiotrack{display:none}#dialogToc{background-color:rgba(0,0,0,.5);max-height:unset;max-width:unset}#dialogToc .toc li{font-family:Math,serif;font-size:unset;font-weight:600;list-style-type:circle;margin-bottom:.5em}.MuiTabs-indicator{display:none}.MuiTabs-root>.MuiTabs-scroller{align-content:center}.MuiTabs-flexContainer>.MuiButtonBase-root{border-radius:var(--largeRadius);min-height:40px;min-width:72px}.MuiTabs-flexContainer>.MuiButtonBase-root.Mui-selected{background-color:transparent!important;color:#fff}.MuiToggleButtonGroup-grouped.Mui-selected{color:#fff}.MuiButtonBase-root.MuiIconButton-root:hover{background-color:transparent;color:#fff}#viewPanel .ui-panel-inner{margin-top:4em}.videoOsdBottom.videoOsdBottom-maincontrols{background:var(--bottomOSDGradient)}.skinHeader-withBackground.osdHeader{background:var(--topOSDGradient)}.headroom{transition:transform .5s}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent){backdrop-filter:var(--blurLarge);background:var(--headerColor);border:var(--defaultBorder);border-width:0 0 var(--borderWidth) 0}.layout-mobile .skinHeader-blurred:not(.osdHeader),.layout-mobile .withSectionTabs .headerTop{padding:0}.sectionTabs{display:inline-grid;height:var(--appBarHeight)}.layout-mobile .sectionTabs{align-content:center}.skinHeader-withBackground.semiTransparent{--headerBackground:none;backdrop-filter:none;background-color:transparent;border:none}.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty),.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty):after{--headerBackground:none;backdrop-filter:none;background-color:transparent;border:none}.skinHeader-withBackground.semiTransparent .headerButton,.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty) .headerButton{text-shadow:1px 1px 0 #00000080}.headerTop{-webkit-align-items:center;align-items:center;height:var(--appBarHeight);padding:0}.osdHeader .headerTop{max-height:var(--appBarHeight)}.layout-desktop .headerTop{padding:0 1em}.layout-tv .headerTop{padding:0 .5em}.headroom--unpinned{-webkit-transform:translateY(calc(var(--appBarHeight)*-1 - var(--borderWidth)));transform:translateY(calc(var(--appBarHeight)*-1 - var(--borderWidth)))}.noHomeButtonHeader .emby-tab-button[data-index="1"]:before{content:"favorite"}.noHomeButtonHeader .emby-tab-button[data-index="0"]:before{content:"home"}.noHomeButtonHeader .emby-tab-button:before{font-family:var(--iconPack),Material Icons;font-feature-settings:"liga";font-size:1.2em;font-variation-settings:"FILL" 0}.layout-tv .sectionTabs .emby-tabs.smoothScrollX{overflow:visible!important}.sectionTabs .emby-tab-button{background-color:var(--darkerGradientPointAlpha);border-radius:var(--largeRadius);color:var(--textColor);display:inline-flex;font-weight:400;height:2.5em;margin:.25em .5em;padding:0 1.25em}.sectionTabs .emby-tab-button-active{background-color:var(--textColor);color:#000;margin:.25em .5em}.libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight)*2 + .5em)!important}@media (min-width:75em){.sectionTabs{-webkit-align-items:center;align-items:center;-webkit-align-self:center;align-self:center;-webkit-justify-content:center;justify-content:center;margin-top:calc(var(--appBarHeight)*-1);position:relative;width:auto}.libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight) + .5em)!important}.headroom--unpinned{-webkit-transform:translateY(0);transform:translateY(0)}}@media (min-width:100em){.layout-tv .libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight) + .5em)!important}}@media (max-width:100em){.sectionTabs{font-size:100%}.layout-tv .sectionTabs{margin-top:unset}.layout-tv .libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight)*2 + .5em)!important}}@media (max-width:75em){.layout-mobile .sectionTabs .emby-tab-button:first-child{margin-left:var(--sidePadding)}.layout-mobile .sectionTabs .emby-tab-button:last-child{margin-right:var(--sidePadding)}}.layout-tv .headerLeft{margin:0 .6em;overflow:unset}#reactRoot>div:nth-child(3){container-name:skinHeader;container-type:size;height:var(--appBarHeight);max-height:var(--appBarHeight)}@container skinHeader (min-height: 4.9em){.skinHeader-blurred:not(.osdHeader):not(.semiTransparent){backdrop-filter:none;background-color:transparent;background:var(--headerBackground);border:none;padding:0}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent):after{backdrop-filter:var(--blurLargest);bottom:0;content:var(--headerBlurLayerVisibility);left:0;-webkit-mask:var(--headerBlurMask);mask:var(--headerBlurMask);position:absolute;right:0;top:0;z-index:-1}.sectionTabs{padding-bottom:1.5em}.layout-mobile .sectionTabs{align-content:center}}.skinHeader{padding-top:max(env(safe-area-inset-top),var(--safe-area-inset-top))!important}.nowPlayingPage{background:linear-gradient(var(--darkerGradientPointAlpha),transparent)}.remoteControlContent{background:linear-gradient(transparent,var(--darkerGradientPointAlpha) 20em);padding:0 var(--sidePadding)!important}.emby-select-focusscale:focus,.layout-tv .show-animation:focus,.layout-tv .show-focus:focus{transform:none!important}.layout-tv .backdropImage,.layout-tv .focuscontainer{animation-duration:0s!important;backdrop-filter:none}.card.show-animation .cardBox{transition:transform .05s ease-out,-webkit-transform .05s ease-out}#slides-container{top:calc(var(--appBarHeight)*-.5)}.backdrop-overlay{background:linear-gradient(var(--lighterGradientPoint),var(--gradientPointAlpha),60%,var(--darkerGradientPointAlpha))}.plot{color:var(--textColor);text-shadow:1px 1px var(--lighterGradientPointAlpha)}.button-container{align-items:center}.favorite-button{background:none;color:var(--textColor)}.detail-button:hover,.favorite-button:hover{background:var(--dimTextColor);color:#000} \ No newline at end of file +/*! ElegantFin Theme v26.09.05 for Jellyfin by lscambo13 */@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");@font-face{font-family:Material Symbols Rounded Minimal;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/l/font?kit=sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190FjzarESMdAUY9qjb3u1M7e05tMSFFiwiIx7ihGnzWmz-lkbjBJUko54uQNlqhKP2qww7THOuDASqI-hkRJowUB4AMXqmksLbVSypWpZCoCuR4ppEVE-Vm2EBGaEWVT1QQVqin1CJL8x-Ze-xGUuG3wq4dfIUCyyVOwlP0NhUaux0cITqh7BYw&skey=70ddea8fe54d532e&v=v362) format("woff2")}@font-face{font-family:Material Symbols Rounded;font-style:normal;font-weight:100 700;src:url(https://fonts.gstatic.com/s/materialsymbolsrounded/v362/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format("woff2")}:root{--elegantFinFooterText:"ElegantFin v26.09.05";font-family:Inter,sans-serif;font-optical-sizing:auto;font-style:normal;font-weight:425;-webkit-tap-highlight-color:transparent!important;--fill:1;--wght:400;--grad:0;--opsz:30;color:var(--textColor);color-scheme:dark;--largerRadius:1.25em;--largeRadius:1em;--smallRadius:0.5em;--smallerRadius:0.375em;--borderWidth:0.06em;--borderWidthDouble:0.12em;--defaultBorder:var(--borderWidth) solid var(--borderColor);--defaultLighterBorder:var(--borderWidth) solid var(--lighterBorderColor);--sidePadding:3.3%;--itemColumnGap:1em;--minEpisodeCardWidth:26em;--appBarHeight:5em;--blurSmallest:blur(2px);--blurDefault:blur(5px);--blurLarge:blur(10px);--blurLargest:blur(20px);--darkerGradientPoint:#111827;--darkerGradientPointAlpha:rgba(17,24,39,.85);--lighterGradientPoint:#1d2635;--lighterGradientPointAlpha:rgba(29,38,53,.85);--gradientPointAlpha:rgba(29,38,53,.3);--headerColor:rgba(30,40,54,.8);--drawerColor:rgba(30,40,54,.9);--borderColor:#47505c;--darkerBorderColor:#31373f;--lighterBorderColor:hsla(0,0%,100%,.2);--selectorBackgroundColor:#384252;--selectorBackgroundColorAlpha:rgba(56,66,82,.5);--textColor:#d1d5db;--dimTextColor:#9ca3af;--fullContrastColor:#fff;--zeroContrastColor:#000;--svgIconFilter:none;--clearLogoFilter:none;--accentColor:#5d55e7;--accentHoverColor:#756fe2;--semiTransparentAccentColor:hsla(0,0%,100%,.125);--btnPlayColor:var(--textColor);--btnPlayBorderColor:var(--borderColor);--btnMiniPlayColor:#299a5d;--btnMiniPlayBorderColor:#32a769;--btnDeleteColor:#a91d1d;--btnDeleteBorderColor:#d95454;--btnSubmitColor:#3d36b2;--btnSubmitBorderColor:#756fe2;--checkboxCheckedBgColor:#4f46e5;--highlightOutlineColor:#2563eb;--hoverBackgroundColor:var(--textColor);--hoverTabBackgroundColor:hsla(0,0%,100%,.9);--hoverTextColor:#fff;--activeBackgroundColor:var(--semiTransparentAccentColor);--activeTextColor:#fff;--cardHoverBorderColor:#fff;--cardResumeProgressColor:var(--textColor);--multiSelectOverlayColor:rgba(0,0,0,.8);--dividerColor:hsla(0,0%,100%,.05);--textareaBackgroundColor:var(--selectorBackgroundColor);--tableBodyColor:#1f2937;--osdSeekBarPlayedColor:var(--textColor);--osdSeekBarBufferedColorAlpha:hsla(0,0%,50%,.5);--osdSeekBarThumbColor:#fff;--backgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint) 35%,var(--lighterGradientPoint));--cardBackgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint),25%,var(--lighterGradientPoint));--backgroundAlphaOverlay:linear-gradient(180deg,var(--darkerGradientPointAlpha) 80%,transparent);--headerColorGradient:linear-gradient(180deg,rgba(30,40,54,.95) 30%,55%,transparent 90%);--headerColorGradientAlt:linear-gradient(180deg,#1e2836,70%,transparent);--headerBlurMask:linear-gradient(180deg,#fff 50%,85%,transparent);--cardFooterGradient:linear-gradient(0deg,hsla(0,0%,5%,.95),40%,transparent);--topOSDGradient:linear-gradient(180deg,rgba(0,0,0,.8),45%,transparent);--bottomOSDGradient:linear-gradient(0deg,rgba(0,0,0,.8),45%,transparent);--hoverGradientV:linear-gradient(0deg,transparent,hsla(0,0%,100%,.35) 45%,hsla(0,0%,100%,.35) 55%,transparent);--hoverGradientH:linear-gradient(90deg,transparent,hsla(0,0%,100%,.35) 45%,hsla(0,0%,100%,.35) 55%,transparent);--itemBackdropMask:linear-gradient(180deg,rgba(0,0,0,.8),75%,transparent);--shadow:0.1em 0.1em 0.15em rgba(0,0,0,.3);--cardShadow:0 1px 6px 0px rgba(0,0,0,.3);--iconShadow:0px 0px 2px rgba(0,0,0,.8),1px 1px 0px rgba(0,0,0,.5);--headerBackground:var(--headerColorGradient);--loginPageBgUrl:url();--loginPageText:"Sign in to continue";--overlayPlayButtonPosition:2.8em;--iconPack:"Material Symbols Rounded";--extraCardButtonsVisibility:none;--menuButtonVisibility:block;--itemOriginalTitleVisibility:block;--libraryLabelVisibility:none;--clearLogoVisibility:block;--itemTitleVisibility:none;--artistClearLogoVisibility:block;--artistTitleVisibility:none;--artistPageBackground:unset;--miniOverlayButtonVisibility:block;--endsAtVisibility:block;--criticsRatingVisibility:none;--cardHoverEffect:"";--backdropTrimFromTop:10%;--resumeCardScale:1}:root[data-theme=light]{color-scheme:light;--fill:0;--darkerGradientPoint:#f2f2f2;--darkerGradientPointAlpha:hsla(0,0%,95%,.85);--lighterGradientPoint:#eee;--lighterGradientPointAlpha:hsla(0,0%,100%,.85);--headerColor:hsla(0,0%,93.3%,.8);--drawerColor:hsla(0,0%,93.3%,.9);--borderColor:#b1b1b1;--darkerBorderColor:#cacaca;--lighterBorderColor:rgba(0,0,0,.2);--selectorBackgroundColor:#fff;--selectorBackgroundColorAlpha:hsla(0,0%,89.4%,.5);--textColor:#212121;--dimTextColor:#595959;--fullContrastColor:#000;--zeroContrastColor:#fff;--svgIconFilter:invert(1);--clearLogoFilter:invert(1) brightness(0.5) hue-rotate(180deg);--accentColor:#4e3de6;--accentHoverColor:#5a4ff8;--btnPlayColor:var(--accentColor);--btnPlayBorderColor:var(--btnSubmitBorderColor);--btnMiniPlayColor:#2c965c;--btnMiniPlayBorderColor:#34a868;--btnDeleteColor:#b9312d;--btnDeleteBorderColor:#eb6060;--btnSubmitColor:#4947cd;--btnSubmitBorderColor:#756fe2;--checkboxCheckedBgColor:#5855f6;--highlightOutlineColor:#3374ff;--hoverBackgroundColor:var(--accentHoverColor);--hoverTabBackgroundColor:var(--accentHoverColor);--hoverTextColor:#fff;--activeBackgroundColor:var(--accentHoverColor);--activeTextColor:#fff;--cardHoverBorderColor:var(--accentHoverColor);--cardResumeProgressColor:#fff;--multiSelectOverlayColor:hsla(0,0%,81.6%,.8);--dividerColor:rgba(0,0,0,.05);--textareaBackgroundColor:#fff;--tableBodyColor:#fff;--osdSeekBarPlayedColor:var(--accentHoverColor);--osdSeekBarThumbColor:var(--accentColor);--backgroundGradient:var(--lighterGradientPoint);--headerColorGradient:linear-gradient(180deg,hsla(0,0%,100%,.95) 30%,55%,transparent 90%);--headerColorGradientAlt:linear-gradient(180deg,hsla(0,0%,100%,.95),70%,transparent);--cardFooterGradient:linear-gradient(0deg,hsla(0,0%,8%,.8),40%,transparent);--shadow:0.1em 0.1em 0.15em transparent;--cardShadow:0 1px 6px 0px #d9d9d9}:root.layout-mobile{--headerColorGradient:var(--headerColorGradientAlt);--blurLargest:blur(12px);--headerBlurMask:linear-gradient(180deg,#fff 60%,90%,transparent);--itemColumnGap:0.4em}body{--primaryItemPageNegativeSpace:14vh;--secondaryItemPageNegativeSpace:60vh;--clearLogoBottomSpace:11em}select{text-overflow:ellipsis}.layout-desktop>body:has(>audio[src]){--primaryItemPageNegativeSpace:calc(14vh + 5em);--secondaryItemPageNegativeSpace:calc(60vh + 5em)}.layout-mobile>body{--secondaryItemPageNegativeSpace:45vh}.material-icons{display:inline-block;font-family:var(--iconPack),Material Icons!important;font-style:normal;font-weight:400;letter-spacing:normal;line-height:1;text-transform:none;white-space:nowrap;word-wrap:normal;direction:ltr;font-feature-settings:"liga";text-rendering:geometricPrecision;vertical-align:middle;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;font-variation-settings:"FILL" var(--fill),"wght" var(--wght),"GRAD" var(--grad),"opsz" var(--opsz);transition:font-variation-settings .25s}.material-icons.info_outline:before{content:"\e88e"}.detailButton-icon{--fill:0}.cardImageIcon,.cardOverlayButtonIcon,.indicatorIcon,.ratingbutton-icon-withrating,.starIcon{--fill:1}.dashboardFooter{font-family:Noto Sans,serif;transition:transform 50ms}#myPreferencesMenuPage>div:after,.dashboardFooter:after{color:var(--borderColor);content:var(--elegantFinFooterText);display:inline-grid;font-size:.8em;font-weight:600;justify-content:center;width:100%;width:-webkit-fill-available}::selection{background:var(--accentHoverColor)}.cardImageIcon{color:var(--borderColor)}.cardPadder .cardImageIcon{color:var(--selectorBackgroundColorAlpha)}.card:focus .cardBox.visualCardBox,.card:focus .cardBox:not(.visualCardBox) .cardScalable{border-color:var(--fullContrastColor)!important}.mdl-radio.show-focus .mdl-radio__button:focus+.mdl-radio__circles .mdl-radio__inner-circle,.mdl-radio.show-focus .mdl-radio__button:focus+.mdl-radio__circles .mdl-radio__outer-circle,.mdl-radio__focus-circle{background:var(--accentColor);color:var(--accentColor)}.emby-button{gap:1ch}.emby-button.show-focus:focus,.emby-tabs .emby-button.show-focus:focus,.paper-icon-button-light.show-focus:focus{background-color:var(--highlightOutlineColor)!important;color:var(--fullContrastColor)!important}.emby-tabs .emby-button.show-focus:focus{outline:none!important}[dir=ltr] .itemsContainer>.card>.cardBox{margin-left:auto;margin-right:auto}.cardBox-bottompadded{margin-bottom:.5em!important}@media (max-width:50em){.cardBox-bottompadded{margin-bottom:.25em!important}}.padded-right-withalphapicker>.vertical-wrap,.vertical-wrap.padded-right-withalphapicker,.vertical-wrap:not(.centered){justify-content:flex-start!important}#channelsTab>.vertical-wrap,#episodesTab>.vertical-wrap,#genresTab>.vertical-wrap,#recordingsTab>.vertical-wrap,#studiosTab>.vertical-wrap{justify-content:center!important}.countIndicator,.fullSyncIndicator,.mediaSourceIndicator{background:#1f50bd;border:var(--defaultLighterBorder);color:#fff}.layout-mobile .indicator{font-size:70%}.cardScalable{border:var(--darkerBorderColor) solid var(--borderWidthDouble)!important;border-radius:var(--largeRadius);box-shadow:var(--cardShadow);overflow:hidden!important;transition:transform 125ms}@supports (aspect-ratio:1/1){#castCollapsible .cardScalable,#guestCastContent .cardScalable{aspect-ratio:1/1;border-radius:50%}}#castCollapsible .cardContent.cardImageContainer,#guestCastContent .cardContent.cardImageContainer{background-position-y:33%}.layout-mobile .cardScalable,.paperList,.visualCardBox{border:var(--defaultBorder)!important}.paperList,.visualCardBox{background-color:var(--headerColor)!important;border-radius:var(--largeRadius)!important;box-shadow:unset!important;overflow:hidden}.layout-desktop .visualCardBox{border-width:var(--borderWidthDouble)!important}.visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important;border-radius:0!important;border-width:0 0 var(--borderWidth) 0!important}.cardImageContainer{transition:transform .375s}.card.squareCard[data-type=TvChannel] .cardImageContainer.cardContent{background-color:hsla(0,0%,100%,.2)}.cardImageContainer>.cardDefaultText{color:transparent;font-size:2em;padding-top:1.5em;white-space:pre}.cardImageContainer>.cardDefaultText:before{color:var(--borderColor);content:"?\A"}.card-hoverable:hover .cardScalable,.card-hoverable:hover .visualCardBox{border-color:var(--cardHoverBorderColor)!important}.card-hoverable:hover .visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important}.card-hoverable:hover .cardImageContainer{transform:scale(1.025)}.card-hoverable .itemSelectionPanel{transition:transform .125s}.card-hoverable:hover .cardScalable,.card-hoverable:hover .itemSelectionPanel{transform:scale(1.02)}.card-hoverable .cardScalable:active{transform:scale(1);transition:transform 75ms}.cardScalable:has(.cardOverlayButton-hover:hover)>.cardImageContainer{transform:scale(1)}.cardOverlayContainer{background:hsla(0,0%,100%,.05);transition:.5s}.cardOverlayContainer:after{background:var(--hoverGradientV);bottom:0;content:var(--cardHoverEffect);left:0;position:absolute;right:0;top:0;transform:translateY(-100%) translateX(0);transition:.65s}.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(100%) translateX(0)}.backdropCard.card-hoverable .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable .cardOverlayContainer:after{background:var(--hoverGradientH);transform:translateY(0) translateX(-100%)}.backdropCard.card-hoverable:hover .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(0) translateX(100%)}.cardBox:not(.visualCardBox) .cardPadder{background-color:var(--lighterGradientPoint);box-shadow:none}.cardOverlayContainer>.cardOverlayFab-primary{bottom:calc(var(--overlayPlayButtonPosition) - 1.5em);left:calc(var(--overlayPlayButtonPosition) - 1.5em);margin-left:unset;margin-top:unset;top:unset}.cardOverlayContainer>.cardOverlayFab-primary,.layout-mobile .cardOverlayButton-br:not([data-action=menu])>.cardOverlayButtonIcon,.listItemImageButton{background-color:var(--btnMiniPlayColor)!important;border:var(--defaultLighterBorder);border-color:var(--btnMiniPlayBorderColor);color:#fff!important;font-size:75%;z-index:2}.cardOverlayContainer>.cardOverlayFab-primary:hover,.listItemImageButton:hover{color:#fff}.layout-desktop .cardOverlayButton-br,[dir=ltr] .layout-desktop .cardOverlayButton-br{bottom:1.2em;font-size:.8em;right:.7em;z-index:1}.layout-desktop .cardOverlayButton-br>button{color:#fff;display:var(--extraCardButtonsVisibility);text-shadow:var(--iconShadow)}.cardOverlayButton-br .cardOverlayButton-hover[data-action=menu],.layout-desktop .listItemButton[data-action=menu]{display:var(--menuButtonVisibility)}.layout-mobile .cardOverlayButton{font-size:60%;padding:1em}.layout-mobile .cardOverlayButton-br,[dir=ltr] .layout-mobile .cardOverlayButton-br{display:var(--miniOverlayButtonVisibility)}.layout-mobile .backdropCard .cardOverlayButton-br:not([data-action=menu]),.layout-mobile .portraitCard .cardOverlayButton-br:not([data-action=menu]){display:none}.layout-mobile .cardOverlayButton-br[data-action=menu]>.cardOverlayButtonIcon{background-color:transparent!important;border:none;color:#fff;text-shadow:var(--iconShadow)}.cardOverlayContainer:has(>button:hover){backdrop-filter:var(--blurDefault)}.listViewUserDataButtons{font-size:small}.layout-mobile .listViewUserDataButtons{flex-direction:column;font-size:x-small}@supports (display:revert){.layout-desktop .vertical-list:has(.listItem-largeImage){display:grid;gap:var(--itemColumnGap);grid-template-columns:repeat(auto-fill,minmax(min(var(--minEpisodeCardWidth),100%),1fr))}.layout-desktop .listItem-largeImage{display:grid;margin-bottom:0!important}.layout-desktop .listItem-largeImage>.listItem-content{align-items:start;display:grid;grid-template-columns:1fr 1fr 2em;height:100%;order:1}.layout-desktop .listItem-largeImage>.listItem-bottomoverview{order:2}.layout-desktop .listItem-largeImage .listItemImage-large{aspect-ratio:16/9;box-sizing:border-box;grid-column:1/-1;height:max-content;min-height:15em;order:1;width:100%}.layout-desktop .listItem-largeImage .listItemBody{grid-column:1/3;order:2;padding:1em .125em}.layout-desktop .listItem-largeImage .listViewUserDataButtons{align-self:center;flex-direction:column;font-size:small;grid-column:3;order:2}}.portraitCard{min-width:5em}.bannerCard{--cardCount:2}@media (min-width:300em){.portraitCard,.squareCard{--cardCount:16}.overflowPortraitCard,.overflowSquareCard{--cardCount:15}.squareCard:has(.cardFooter){--cardCount:12}.backdropCard{--cardCount:12}.overflowBackdropCard{--cardCount:11}}@media (max-width:300em){.portraitCard,.squareCard{--cardCount:15}.overflowPortraitCard,.overflowSquareCard{--cardCount:14}.squareCard:has(.cardFooter){--cardCount:11}.backdropCard{--cardCount:11}.overflowBackdropCard{--cardCount:10}}@media (max-width:270em){.portraitCard,.squareCard{--cardCount:14}.overflowPortraitCard,.overflowSquareCard{--cardCount:13}.squareCard:has(.cardFooter){--cardCount:10}.backdropCard{--cardCount:10}.overflowBackdropCard{--cardCount:9}}@media (max-width:240em){.portraitCard,.squareCard{--cardCount:13}.overflowPortraitCard,.overflowSquareCard{--cardCount:12}.squareCard:has(.cardFooter){--cardCount:10}.backdropCard{--cardCount:10}.overflowBackdropCard{--cardCount:9}}@media (max-width:220em){.portraitCard,.squareCard{--cardCount:12}.overflowPortraitCard,.overflowSquareCard{--cardCount:11}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard,.overflowBackdropCard{--cardCount:7}}@media (max-width:200em){.portraitCard,.squareCard{--cardCount:11}.overflowPortraitCard,.overflowSquareCard{--cardCount:10}.squareCard:has(.cardFooter){--cardCount:9}}@media (max-width:170em){.portraitCard,.squareCard{--cardCount:10}.overflowPortraitCard,.overflowSquareCard{--cardCount:9}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard,.overflowBackdropCard{--cardCount:6}}@media (max-width:140em){.portraitCard,.squareCard{--cardCount:9}.overflowPortraitCard,.overflowSquareCard{--cardCount:8}.squareCard:has(.cardFooter){--cardCount:7}.backdropCard,.overflowBackdropCard{--cardCount:5}}@media (max-width:120em){.portraitCard,.squareCard{--cardCount:8}.overflowPortraitCard,.overflowSquareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard,.layout-tv .overflowPortraitCard,.layout-tv .overflowSquareCard,.layout-tv .portraitCard,.layout-tv .squareCard,.overflowBackdropCard{--cardCount:5}.layout-tv .backdropCard,.layout-tv .overflowBackdropCard{--cardCount:3}}@media (max-width:100em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:80em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:6}.squareCard:has(.cardFooter){--cardCount:5}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:62em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:5}.squareCard:has(.cardFooter){--cardCount:4}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:48.125em){.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:4}.squareCard:has(.cardFooter){--cardCount:3}.backdropCard,.overflowBackdropCard{--cardCount:3}}@media (max-width:30em){.layout-mobile .overflowPortraitCard,.layout-mobile .overflowSquareCard,.layout-mobile .portraitCard,.layout-mobile .squareCard,.overflowPortraitCard,.overflowSquareCard,.portraitCard,.squareCard{--cardCount:3}.squareCard:has(.cardFooter){--cardCount:2}.backdropCard,.overflowBackdropCard{--cardCount:2}}.cardBox{margin-top:0}.card{--padding:0.375em;--effectiveWidth:calc(100vw - var(--padding)*2 - var(--sidePadding)*2);--cardWidth:calc(var(--effectiveWidth)/var(--cardCount) - var(--itemColumnGap));box-sizing:content-box;padding:var(--padding);transition:width .5s;width:var(--cardWidth)!important}@supports (aspect-ratio:1/1){.card{box-sizing:border-box}}.layout-mobile .card{--padding:1px;scroll-snap-align:center;scroll-snap-stop:always}@media (orientation:landscape) and (max-height:40em){.layout-mobile .card{--effectiveWidth:calc(65vw - var(--sidePadding)*2)}}#homeTab .overflowBackdropCard[data-positionticks],#resumableItems>.card,.nextUpItems>.card{width:calc(var(--cardWidth)*var(--resumeCardScale))!important}.card .cardTextCentered{text-shadow:var(--shadow)}.detailPageWrapperContainer{margin-top:unset;padding-top:unset}.layout-desktop .detailPageWrapperContainer{background:linear-gradient(180deg,transparent,17vh,var(--darkerGradientPointAlpha) 50vh);min-height:46vh}.layout-tv .detailPageWrapperContainer{background:linear-gradient(0deg,var(--darkerGradientPointAlpha) 70%,85%,transparent);min-height:46vh;padding-left:30vw}.detailPagePrimaryContainer{align-content:space-between;align-items:stretch;align-items:center;flex-direction:column;justify-content:end;text-align:left}.layout-mobile .detailPagePrimaryContainer.detailRibbon,.layout-mobile .detailPagePrimaryContainer>.detailRibbon{padding:0 var(--sidePadding)}.layout-desktop .detailPagePrimaryContainer{background:transparent}.layout-desktop .detailPageSecondaryContainer{background-color:transparent}.detailPagePrimaryContainer>.detailPagePrimaryContent,[dir=ltr] .detailPagePrimaryContainer.detailRibbon,[dir=ltr] .detailPagePrimaryContainer>.detailRibbon{padding-left:var(--sidePadding)}.layout-mobile .detailPagePrimaryContent{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}.layout-desktop [dir=ltr] .detailRibbon,.layout-tv [dir=ltr] .detailRibbon{flex-direction:column}.detailPagePrimaryContainer>.detailPagePrimaryContent{padding-top:0}.detailPageSecondaryContainer{padding-top:0!important}.skinHeader-withBackground:not(.semiTransparent) .headerHomeButton{display:none}.layout-mobile:has(#itemDetailPage:not(.hide)) .headerHomeButton{display:block}.pageTitle{height:1.5em}.headerLeft .pageTitle{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}.paper-icon-button-light{transition:none}.paper-icon-button-light>.material-icons{font-size:1.25em}#itemDetailPage .emby-scroller,#itemDetailPage .emby-scroller-container,#itemDetailPage .scrollX{margin:0 calc(var(--sidePadding)*-1);padding-left:var(--sidePadding)}.layout-desktop .emby-scroller,.layout-desktop .emby-scroller-container,.layout-desktop .scrollX{--itemColumnGap:0.5em}.emby-scroller,.scrollX{padding-left:var(--sidePadding);scroll-padding-inline:var(--sidePadding);scroll-snap-type:x proximity}.sectionTabs .scrollX{padding-left:0}.itemsContainer:not(.editorsChoiceItemsContainer,.vertical-list){column-gap:var(--itemColumnGap);row-gap:1em}.layout-mobile .itemsContainer:not(.editorsChoiceItemsContainer,.vertical-wrap,.vertical-list):after{color:transparent;content:"13"}.sectionTitle{font-size:1.5rem!important}.layout-mobile .sectionTitle{font-size:1.35rem!important}.emby-scrollbuttons,[dir=ltr] .emby-scrollbuttons{padding-top:0}.emby-scrollbuttons-button.paper-icon-button-light>.material-icons{font-size:1.5em;place-content:center}.detailRibbon{background-color:transparent}.mediaInfoItem{border-radius:var(--smallRadius);font-weight:500;padding-bottom:0;padding-top:0}.itemMiscInfo-primary{column-gap:.5em}.mediaInfoOfficialRating{background:transparent!important;border:var(--defaultBorder);color:var(--textColor);font-family:Noto Sans,sans-serif;font-size:.75em;font-weight:600;line-height:1.5em;transform:translateY(-.15em)}.starIcon{--tmdb:linear-gradient(90deg,#90cea1,#01b4e4);--imdb:linear-gradient(90deg,#f2db83,#dba506);--colors:var(--tmdb);background:var(--colors);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-left:-.125em;transform:translateY(-.02em)}[dir=ltr] .mediaInfoCriticRating{background-size:30%;padding-left:1.5em}[dir=ltr] .mediaInfoCriticRating:after{content:"%"}@media (max-width:31.25em){.itemMiscInfo .endsAt{display:var(--endsAtVisibility)}.mediaInfoCriticRating{display:var(--criticsRatingVisibility)}}.detailRibbon:has(.portraitCard .folder){align-content:flex-end;min-height:32vh}.layout-desktop .detailRibbon:has(.person){align-content:flex-end;min-height:15vh}.layout-desktop .detailRibbon{height:100%;margin-top:unset;min-height:25vh}@keyframes animMoveDown{0%{opacity:0;transform:translateY(-2em)}to{opacity:1;transform:translateY(0)}}@keyframes animMoveDownSecondaryPage{0%{opacity:0;transform:translateY(-2em)}to{opacity:.3;transform:translateY(0)}}@keyframes animMoveUp{0%{opacity:0;transform:translateY(-90%)}to{opacity:1;transform:translateY(-100%)}}body:not(.hide-scroll)>.videoPlayerContainer{height:80vh;-webkit-mask:var(--headerBlurMask);mask:var(--headerBlurMask);position:relative!important}.layout-mobile body:not(.hide-scroll)>.videoPlayerContainer{height:40vh;z-index:1}.layout-desktop>body:not(.hide-scroll)>.videoPlayerContainer~#reactRoot>.backgroundContainer.withBackdrop{opacity:.25}.itemBackdrop{display:block!important}.layout-desktop .itemBackdrop{height:calc(73vh - var(--primaryItemPageNegativeSpace))}.layout-mobile .itemBackdrop{animation:animMoveDown .5s ease-out forwards;height:45vh;margin-top:0!important;-webkit-mask:var(--itemBackdropMask);mask:var(--itemBackdropMask);position:sticky;top:-30%}.layout-tv .itemBackdrop{height:33vh}#itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .book) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .live_tv) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .person) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .queue) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop,#itemDetailPage:has(.musicParentName) .itemBackdrop,#itemDetailPage:has(.subtitle) .itemBackdrop{height:calc(73vh - var(--secondaryItemPageNegativeSpace))}#itemDetailPage:has(.detailImageContainer .cardPadder-square>.person) .itemBackdrop{height:calc(96vh - var(--secondaryItemPageNegativeSpace))}.detailLogo{background-position:bottom;display:var(--clearLogoVisibility);filter:var(--clearLogoFilter);height:25vh;left:0;margin:auto 30%;top:calc(100vh - var(--clearLogoBottomSpace) - var(--primaryItemPageNegativeSpace));transform:translateY(-100%);width:40%}.layout-mobile .detailLogo{animation:animMoveUp 1s ease-out forwards;display:var(--clearLogoVisibility);left:1em;margin:auto 0;max-height:17vh;position:absolute;top:45vh;width:calc(100vw - 2em);z-index:1}.layout-tv .detailLogo{display:var(--clearLogoVisibility);height:20vh;left:30vw;margin:auto 5vw;top:39vh;width:60vw}#itemDetailPage:has(.subtitle) .detailLogo{top:calc(100vh - 6em - var(--secondaryItemPageNegativeSpace))}.layout-desktop #itemDetailPage:has(.detailImageContainer .person) .detailLogo{top:calc(100vh - var(--secondaryItemPageNegativeSpace))}.layout-mobile #itemDetailPage:has(.subtitle) .detailLogo{top:calc(100vh - 11em - var(--secondaryItemPageNegativeSpace))}.layout-desktop .detailImageContainer .card{float:none;left:0!important;margin:auto auto 0;place-self:center;position:relative!important;right:0;top:0;width:22vh!important}.detailImageContainer .card.backdropCard{max-width:50vw;width:40vh!important}.detailImageContainer .card{display:none}.layout-tv .detailImageContainer .card{align-content:center;bottom:0;display:block!important;left:var(--sidePadding);margin:auto;position:fixed!important;top:0;transform:none;width:25vw!important}.layout-mobile .detailImageContainer .card{filter:drop-shadow(0 0 .25rem rgba(0,0,0,.25))}.layout-mobile .infoWrapper,.layout-mobile [dir=ltr] .infoWrapper{padding-left:0}.infoWrapper{align-content:end;color:var(--textColor);display:grid;place-items:center;text-align:center}.layout-mobile .detailImageContainer{align-items:flex-end;display:flex;justify-content:center;padding-left:0!important}.layout-mobile .detailImageContainer:has(.card:not(.portraitCard)){height:0}.layout-mobile .detailImageContainer .card{margin-top:-150%;max-width:60vw;position:inherit!important}.layout-mobile .detailPageWrapperContainer{margin-top:.5em;padding-top:0}#itemDetailPage:has(.detailImageContainer .album) .detailLogo,#itemDetailPage:has(.detailImageContainer .backdropCard) .detailLogo{display:none;z-index:2}#itemDetailPage:has(.detailImageContainer .person) .detailLogo{display:var(--artistClearLogoVisibility);z-index:2}.detailLogo:not(.hide)~.detailPageWrapperContainer .nameContainer h1{display:var(--itemTitleVisibility);z-index:2}.detailImageContainer:has(.squareCard .person)~.nameContainer h1{display:var(--artistTitleVisibility)}.detailLogo.hide~.detailPageWrapperContainer .nameContainer h1{display:block!important}.detailImageContainer:has(.album)~.nameContainer h1,.detailImageContainer:has(.backdropCard)~.nameContainer h1{display:block!important}.detailImageContainer .card.backdropCard:has(.cardImageIcon.album){max-width:20vh}.detailImageContainer .card.backdropCard:has(.cardImageIcon.album) .cardScalable{aspect-ratio:1/1}#childrenContent:has(.listItem[data-type=Audio]),.programGuideSection{background-color:var(--lighterGradientPointAlpha);border:var(--defaultBorder);border-radius:var(--largeRadius);padding:.5em}.detailImageContainer>.backdropCard,.detailImageContainer>.card:has(.album),.detailImageContainer>.card:has(.book),.detailImageContainer>.card:has(.live_tv),.detailImageContainer>.card:has(.person),.detailImageContainer>.card:has(.queue),.detailImageContainer>.squareCard{display:block}.detailImageContainer .squareCard:has(.person){display:none}#itemDetailPage:has(.musicParentName),#itemDetailPage:has(.subtitle){background:var(--backgroundAlphaOverlay)}#itemDetailPage:has(.detailImageContainer .cardPadder-square>.person){background:var(--artistPageBackground,var(--backgroundAlphaOverlay))}.layout-mobile #itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop,.layout-mobile #itemDetailPage:has(.musicParentName) .itemBackdrop,.layout-mobile #itemDetailPage:has(.subtitle) .itemBackdrop{animation:animMoveDownSecondaryPage .5s ease-out forwards}.layout-mobile .cardImageIcon{font-size:3.5em}.homeLibraryButton{margin:0!important;min-width:15%;width:min(45%,12rem)}@media (max-width:50em){.homeLibraryButton{width:47.6%!important}}@media (orientation:portrait) and (max-width:40em){[data-type=Movie] .listItemImage,[data-type=Series] .listItemImage{display:unset}.dashboardActionsContainer{font-size:min(3.6vw,98%)}}@media (orientation:portrait){.layout-mobile .skinHeader.noHomeButtonHeader .headerSyncButton{display:none}.layout-mobile .btnPlay.detailButton:not(.play-button){flex:0 0 100%;margin-right:0!important}}h2{font-size:1.25em}h1,h2{font-weight:600}.tagline{color:var(--textColor);font-size:1.3em;font-style:italic;font-weight:400;margin:0}.backdropContainer,.backgroundContainer:not(.backgroundContainer-transparent),.backgroundContainer:not(.withBackdrop),.nowPlayingContextMenu,.nowPlayingPlaylist,html{background-color:var(--darkerGradientPoint);background:var(--backgroundGradient)}.backdropImage{background-position-y:clamp(0%,calc(var(--backdropTrimFromTop)*5),100%)}.backdropImage:after,.backdropImage:before{background:inherit;bottom:0;content:"";left:0;position:absolute;right:0;top:0}.backdropImage:after{height:80vh;-webkit-mask:linear-gradient(180deg,#000 75%,transparent);mask:linear-gradient(180deg,#000 75%,transparent);z-index:0}.layout-desktop .backdropImage:after{transition:opacity .25s}.backdropImage:before{filter:var(--blurLargest);transform:scale(1.1)}.backgroundContainer.withBackdrop{background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.25));opacity:.9}.layout-tv .backgroundContainer.withBackdrop{background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.95))}.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop{opacity:.9}.layout-mobile .backgroundContainer.withBackdrop{background:var(--darkerGradientPoint);opacity:1}.withSectionTabs .backgroundContainer.withBackdrop{background:var(--darkerGradientPoint)}.layout-desktop .withSectionTabs .backdropImage:after{opacity:0}.layout-mobile .withSectionTabs .backdropImage:after{display:none}@keyframes animScaleUp{0%{opacity:0;transform:translateY(-2.5%)}to{opacity:1;transform:translateY(0)}}.backdropImageFadeIn{animation:animScaleUp .5s ease-out forwards;transform-origin:bottom center}.appfooter{backdrop-filter:var(--blurLargest)!important;background-color:var(--headerColor)!important;color:var(--textColor)}.lyricPage{padding:0 var(--sidePadding)}.lyricsLine{align-self:center;color:var(--textColor);font-size:2em;font-weight:600;text-align:center;transition:transform .125s}.futureLyric,.pastLyric{font-weight:400;text-align:center;transform:scale(.85)}.pastLyric{opacity:.45}.buttonActive{color:var(--accentColor)!important}#divRunningTasks progress{width:calc(100% - 7em)}.listItemImage .itemProgressBar{margin:8%;position:absolute}.layout-mobile .listItemImage .itemProgressBar{justify-self:center;margin-bottom:5%;position:absolute}.itemProgressBar:not(.backgroundProgress):not(.playbackProgress):not(.transcodingProgress){backdrop-filter:var(--blurLarge);background-color:var(--osdSeekBarBufferedColorAlpha)!important;border-radius:var(--largeRadius);height:.35em;overflow:hidden}.layout-mobile .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress){width:calc(100% - 2em)}.layout-mobile .backdropCard .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress),.layout-mobile .portraitCard .itemProgressBar:not(.backgroundProgress,.playbackProgress,.transcodingProgress){width:100%;width:-webkit-fill-available}.itemProgressBarForeground{background-color:var(--cardResumeProgressColor);border-radius:0 var(--largeRadius) var(--largeRadius) 0;opacity:.75}.backgroundProgress,.backgroundProgress>div{background-color:var(--darkerGradientPoint)}.playbackProgress>div{background-color:var(--accentColor)}::-moz-progress-bar{background:var(--accentColor)!important}::-webkit-progress-value{background:var(--accentColor)!important}::-webkit-progress-bar,progress{background:var(--darkerGradientPoint)!important;border:var(--defaultBorder)!important;border-radius:var(--smallRadius);overflow:hidden}progress+span{color:var(--accentColor)!important}.mdl-spinner__circle{border-color:var(--textColor);border-style:inset;border-width:.25em}.sliderContainer{--thumb:0.4em}.mdl-slider-container{height:1em}.mdl-slider{height:unset}.mdl-slider-background-flex-container{padding:0 calc(var(--thumb)/2)}.sliderBubbleTrack{margin:0 calc(var(--thumb)/2)}.sliderBubbleText{font-size:1.5em}.mdl-slider-background-flex{background:var(--osdSeekBarBufferedColorAlpha);border-radius:var(--thumb);height:var(--thumb);margin-top:calc(var(--thumb)/-2);transition:.2s linear}.sliderContainer:active .mdl-slider-background-flex{--h:calc(var(--thumb)*1.5);border-radius:var(--h);height:var(--h);margin-top:calc(var(--h)/-2)}.mdl-slider-background-lower{background-color:var(--osdSeekBarPlayedColor)}.mdl-slider-background-upper{background-color:var(--osdSeekBarBufferedColorAlpha)}.mdl-slider::-webkit-slider-thumb{background:var(--osdSeekBarThumbColor);border-radius:var(--thumb);height:var(--thumb)!important;transition:.2s linear;width:var(--thumb)!important}.layout-mobile .mdl-slider::-webkit-slider-thumb,.mdl-slider.show-focus:focus::-webkit-slider-thumb,.mdl-slider:hover::-webkit-slider-thumb{border-radius:var(--thumb);height:calc(var(--thumb)*5)!important;transform:scale(.5);width:calc(var(--thumb)*1.25)!important}.mdl-slider::-moz-range-thumb{background:var(--osdSeekBarThumbColor);border-radius:var(--thumb);height:var(--thumb)!important;transition:.2s linear;width:var(--thumb)!important}.mdl-slider.show-focus:focus::-moz-range-thumb,.mdl-slider:hover::-moz-range-thumb{border-radius:var(--thumb);height:calc(var(--thumb)*5)!important;transform:scale(.5);width:calc(var(--thumb)*1.25)!important}.sliderMarkerContainer{margin:0 .1em}.sliderMarker.watched{background-color:var(--osdSeekBarPlayedColor)}.sliderMarker{border-radius:2px;height:4px}.iconOsdProgressInner{background:var(--osdSeekBarPlayedColor)}.selectLabel{max-height:2em}.inputLabelUnfocused,.selectLabel{color:var(--textColor)}.inputLabelFocused{color:var(--fullContrastColor)}.button-link{color:var(--dimTextColor)}.button-link:hover{color:unset!important;text-decoration:none}.button-link:active{color:var(--fullContrastColor)!important;text-decoration:none}.drawer-open,.mainDrawer{backdrop-filter:var(--blurLarge);background-color:var(--drawerColor);border-right:var(--defaultBorder)}.mainDrawer-scrollContainer{padding-bottom:5vh}.mainDrawer-scrollContainer>div:first-child{margin-bottom:1em}.btnHeaderSave.button-flat{border-radius:var(--smallRadius);color:var(--accentColor)!important;gap:.3em}.button-flat:hover{color:unset}.button-flat:active{background-color:hsla(0,0%,100%,.2);color:unset}.playstatebutton-icon-played{color:#22c55e}.videoOsdBottom.videoOsdBottom-maincontrols .btnPause{font-size:2em}.osdControls{display:flex;flex-direction:column-reverse}.itemExternalLinks{color:transparent}.itemExternalLinks>.button-link{background-color:var(--selectorBackgroundColor);border-radius:var(--smallerRadius);color:var(--textColor);margin-bottom:.5em;padding:.125em .5em}.layout-mobile .itemExternalLinks>.button-link:hover:not(:active){color:var(--textColor)!important}.itemExternalLinks>a:active,.layout-desktop .itemExternalLinks>a:hover{background-color:var(--accentColor)!important;color:#fff!important}.itemExternalLinks>a[href*="themoviedb.org"]:active,.layout-desktop .itemExternalLinks>a[href*="themoviedb.org"]:hover{background-color:#1ab7d8!important;color:#000!important}.itemExternalLinks>a[href*="imdb.com"]:active,.layout-desktop .itemExternalLinks>a[href*="imdb.com"]:hover{background-color:#e2b616!important;color:#000!important}.itemExternalLinks>a[href*="thetvdb.com"]:active,.layout-desktop .itemExternalLinks>a[href*="thetvdb.com"]:hover{background-color:#6cd591!important;color:#000!important}.itemExternalLinks>a[href*="trakt.tv"]:active,.layout-desktop .itemExternalLinks>a[href*="trakt.tv"]:hover{background-color:#ab3aad!important;color:#fff!important}.itemExternalLinks>a[href*="theaudiodb.com"]:active,.layout-desktop .itemExternalLinks>a[href*="theaudiodb.com"]:hover{background-color:#6399cc!important;color:#0f161c!important}.itemExternalLinks>a[href*="musicbrainz.org"]:active,.layout-desktop .itemExternalLinks>a[href*="musicbrainz.org"]:hover{background-color:#ba478f!important;color:#fff!important}.itemExternalLinks>a[href*="letterboxd.com"]:active,.layout-desktop .itemExternalLinks>a[href*="letterboxd.com"]:hover{background-color:#14181c!important;color:#fff!important}.itemExternalLinks>a[title*=Radarr]:active,.layout-desktop .itemExternalLinks>a[title*=Radarr]:hover{background-color:#ffc230!important;color:#000!important}.itemExternalLinks>a[title*=Sonarr]:active,.layout-desktop .itemExternalLinks>a[title*=Sonarr]:hover{background-color:#07bae9!important;color:#000!important}.itemExternalLinks>a[title*=Bazarr]:active,.layout-desktop .itemExternalLinks>a[title*=Bazarr]:hover{background-color:var(--textColor)!important;color:#000!important}.itemTags,.itemTags>a{display:none;font-size:unset!important;font-weight:200}.detail-clamp-text{color:var(--dimTextColor);margin-bottom:0;margin-top:0;text-align:start}.detail-clamp-text p{margin-bottom:.25em;margin-top:.25em}.layout-desktop .detail-clamp-text{-webkit-line-clamp:2}.layout-mobile .detail-clamp-text{-webkit-line-clamp:4}.layout-tv .detail-clamp-text{-webkit-line-clamp:10;transition:none}.overview-expand.emby-button{color:transparent;margin-bottom:1.4em;margin-top:1.4em;padding:0}.overview-expand.emby-button:after{align-content:center;background:var(--selectorBackgroundColor);border-radius:50%;color:var(--textColor);content:"keyboard_arrow_down";font-family:var(--iconPack),Material Icons;font-feature-settings:"liga";height:1.5em;line-height:1.6ch;transition:transform .5s;width:1.5em}.overview.detail-clamp-text~.overview-controls .overview-expand:after{transform:rotate(0deg)}.overview:not(.detail-clamp-text)~.overview-controls .overview-expand:after{transform:rotate(180deg)}.overview-controls{height:0}.detailSectionContent:has(.itemExternalLinks.hide) .overview-controls{height:1em}#seriesAirTime{margin-top:.5em}.itemMiscInfo{align-items:flex-end!important;justify-content:center}.chapterCardImageContainer,.innerCardFooter{box-sizing:border-box;width:100%}.chapterThumbTextContainer,.innerCardFooter{align-content:end;background:var(--cardFooterGradient);display:grid;height:100%;padding:0 2em 2em;text-shadow:var(--iconShadow)}.chapterCardImageContainer{background-size:135%}.chapterCardImageContainer+.innerCardFooter{height:auto;padding:0 1em 1em}.layout-mobile .innerCardFooter{padding:5em 1em 1.25em}.layout-mobile .chapterCardImageContainer+.innerCardFooter{padding:0 .5em .5em}.centerMessage{width:unset}.noItemsMessage{width:90%}.dialog{backdrop-filter:var(--blurDefault);background-color:var(--drawerColor);min-width:11em}[dir=ltr] .emby-collapsible-button{padding-left:1em}.dialog:not(.dialog-fullscreen){border:var(--defaultBorder);border-radius:var(--largeRadius)!important}@media (max-height:45em),(max-width:80em){.dialog.dialog-fixedSize,.dialog.dialog-fullscreen-lowres{border:unset;border-radius:unset!important}}.dialogBackdropOpened{opacity:.66}.imageEditor-dropZone,.lyricsEditor-dropZone,.subtitleEditor-dropZone{border-radius:var(--largeRadius)}.formDialogHeaderTitle{margin-inline-end:0!important;margin-inline-start:0!important;padding:0 .5em!important;text-align:center}.formDialogFooter:not(.formDialogFooter-clear.formDialogFooter-flex)>.formDialogFooterItem{-webkit-flex-basis:6em;flex-basis:6em}.collapseContent{backdrop-filter:unset!important;background-color:unset!important}.selectionCommandsPanel{backdrop-filter:var(--blurLarge);background:var(--lighterGradientPoint);border-bottom:var(--defaultBorder);height:3.5em;padding-top:max(env(safe-area-inset-top),var(--safe-area-inset-top))}.selectionCommandsPanel>h1{font-size:large}.itemSelectionPanel{background-color:transparent;border:unset}.emby-checkbox:checked+span+.checkboxOutline{background:transparent;border-color:var(--fullContrastColor);border-radius:var(--smallerRadius)!important;border-style:solid;border-width:var(--borderWidthDouble);outline:none}.emby-checkbox:checked+span+.multiSelectCheckboxOutline{box-shadow:inset 0 7em 10em 20px var(--multiSelectOverlayColor)}@supports (display:revert){.emby-checkbox:checked+span+.checkboxOutline{outline:solid var(--borderWidth) #fff}}.checkboxOutline{border-radius:var(--smallerRadius);height:1.3em;top:unset;width:1.3em}.itemSelectionPanel .material-icons.check:before{color:var(--fullContrastColor);font-size:4em;padding:.25em}.cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 1.75em)}.overflowBackdropCard .cardText-first+.itemSelectionPanel>.checkboxContainer{height:100%}.checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius)!important}#castCollapsible .checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline,#guestCastContent .checkboxContainer .emby-checkbox:checked+span+.checkboxOutline.multiSelectCheckboxOutline{border-radius:50%!important}.cardPadder{text-align:center}#castCollapsible .cardPadder .cardImageIcon,#guestCastContent .cardPadder .cardImageIcon{display:none}.cardText-secondary+.itemSelectionPanel>.checkboxContainer,.cardText.cardTextCentered:not(.cardText-secondary,.cardText-first)+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 3em)}.cardText-secondary,.fieldDescription,.guide-programNameCaret,.listItem .secondary,.nowPlayingBarSecondaryText,.programSecondaryTitle,.secondaryText{color:var(--dimTextColor)}.cardFooter+.itemSelectionPanel>.checkboxContainer,.cardScalable+.itemSelectionPanel>.checkboxContainer{height:100%}.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius);border-width:0;height:100%;width:100%}.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon{font-size:.9em;font-weight:900}.checkboxOutline:not(.multiSelectCheckboxOutline){background-color:#fff;border:var(--borderWidth) solid gray;transition:all .125s}.emby-checkbox:checked+span+.checkboxOutline:not(.multiSelectCheckboxOutline){background:var(--checkboxCheckedBgColor);border:var(--defaultLighterBorder)}.emby-checkbox:focus+span+.checkboxOutline,.emby-checkbox:focus:not(:checked)+span+.checkboxOutline{border-color:var(--highlightOutlineColor)!important;outline:none}@supports (display:revert){.emby-checkbox:focus+span+.checkboxOutline{border-color:#fff!important;outline:var(--borderWidth) solid var(--highlightOutlineColor)}}.cardIndicators{-webkit-align-items:center;align-items:center;top:.5em}[dir=ltr] .cardIndicators{right:.5em}.layout-mobile .cardIndicators{right:.5em;top:.45em}.indicator{border:var(--borderWidth) solid hsla(0,0%,48.6%,.5);border-radius:100em}.playedIndicator{background:#22c55e}.playedIndicator,.videoIndicator{border:var(--defaultLighterBorder)}.videoIndicator{background:#292929;font-size:.75em;padding:.5em;transform:scale(.85)}.videoIndicator:has(.folder),.videoIndicator:has(.photo_album){background:peru}.videoIndicator:has(.photo){background:#4682b4}.videoIndicator:has(.videocam){background:#cd5c5c}.cardScalable,.defaultCardBackground{background:var(--cardBackgroundGradient)}div[data-type=Book] .play_arrow:before{content:"book";font-size:85%}div[data-type=Photo] .play_arrow:before{content:"photo"}div[data-type=PhotoAlbum] .play_arrow:before{content:"animated_images"}.button-alt,.dashboardActionsContainer>.emby-button,.emby-button.block,.manageRecordingButton,.raised,.raised:focus{background:var(--lighterGradientPoint);border:var(--defaultBorder);border-radius:var(--smallRadius);color:var(--fullContrastColor);transition:all .125s}.editItemMetadataForm>.metadataFormFields div:has(.formDialogFooterItem){display:flex;justify-content:center}.btnBrowse>.folder{margin-inline-end:.5em}.fab{background:var(--lighterGradientPoint);border:var(--defaultBorder);color:var(--fullContrastColor)}.fab:focus{background:var(--lighterGradientPoint)!important;filter:brightness(1.2)}.emby-button:active,.fab:active,.raised:active{filter:brightness(1.05)!important;transform:scale(.98)}.detailButton{border:var(--defaultLighterBorder);padding:.5em!important}.cardScalable .material-icons.check:before{transform:scale(1.25)}.detailButton:not(.btnPlay){backdrop-filter:none;background:transparent;border-color:transparent;border-radius:50%;color:var(--textColor);margin:.5em!important;padding:.6em!important}.layout-desktop .detailButton:not(.btnPlay):hover{background:var(--hoverBackgroundColor);color:var(--zeroContrastColor)}.detailButton:active{background:var(--activeBackgroundColor);color:#fff}.btnPlay.detailButton{background-color:var(--btnPlayColor);border-color:var(--btnPlayBorderColor);border-radius:3em;color:var(--zeroContrastColor);flex-direction:row;height:3em;margin-right:.5em!important;min-width:10em}.mainDetailButtons>.btnPlay:after{content:attr(title);padding-right:1ch}.btnPlay>.detailButton-content:after{padding:0 1ch;place-content:center}.btnPlay>.detailButton-content{align-content:unset;align-items:unset;display:flex;flex-direction:unset;justify-content:flex-start}.mainDetailButtons:has(.detailButton[data-type=Book]) .btnPlay[title=Play]:after{content:"Read"}.mainDetailButtons:has(.detailButton[data-type=Book]) .btnPlay .material-icons.play_arrow:before{content:"book";padding-inline-end:1ch}.mainDetailButtons{justify-content:center;margin:0}.layout-mobile [dir=ltr] .mainDetailButtons{flex-wrap:wrap;padding:0 1.25em}@media (min-width:100em){.mainDetailButtons{font-size:unset;margin:0}}.localnav>.emby-button{background:var(--lighterGradientPoint)!important;color:var(--fullContrastColor);padding:.8em}div[data-role=controlgroup] a.ui-btn-active{background:var(--selectorBackgroundColor)!important;color:var(--fullContrastColor)!important}.guide-date-tab-button.emby-tab-button-active,.guide-date-tab-button:focus{color:var(--fullContrastColor)}#btnDeleteImage,#btnShutdown,.btnRevoke,.button-delete{background:var(--btnDeleteColor)!important;border:solid var(--btnDeleteBorderColor) var(--borderWidth);color:#fff!important}.MuiButton-colorPrimary,.button-submit,.upNextContainer .btnStartNow{background:var(--btnSubmitColor)!important;border:solid var(--btnSubmitBorderColor) var(--borderWidth)!important;color:#fff!important}.userPreferencesPage .button-submit{bottom:calc(1em + max(env(safe-area-inset-bottom), var(--safe-area-inset-bottom, 1px)));box-shadow:0 .75em 2em 2em var(--darkerGradientPoint);position:sticky!important;z-index:2!important}.collapseContent,.formDialogFooter:not(.formDialogFooter-clear),.formDialogHeader:not(.formDialogHeader-clear){backdrop-filter:var(--blurDefault);background-color:var(--headerColor);color:var(--textColor)}.paperList{padding:.4em}.serverInfo{padding:1em}.serverInfo>:nth-child(1n){-webkit-flex:1 0 30%;flex:1 0 30%}.serverInfo>:nth-child(2n){-webkit-flex:1 0 50%;flex:1 0 50%;text-align:end}.listItemIcon:not(.listItemIcon-transparent){background-color:var(--lighterGradientPoint)!important;color:var(--textColor)}.listItemIcon.notification_important{background-color:var(--btnDeleteColor)!important;border:solid var(--btnDeleteBorderColor) var(--borderWidth)}.listItemIcon.live_tv:not(.listItemIcon-transparent),.listItemIcon.notifications:not(.listItemIcon-transparent),.listItemIcon.person:not(.listItemIcon-transparent),.listItemIcon.schedule:not(.listItemIcon-transparent){background-color:var(--darkerGradientPoint)!important;border:var(--defaultBorder)}.readOnlyContent{flex-direction:column!important}.MuiAppBar-root{backdrop-filter:var(--blurDefault);background:var(--headerColor);border-bottom:var(--defaultBorder)}.MuiDrawer-paper{backdrop-filter:var(--blurLarge);background:var(--drawerColor);border-right:var(--defaultBorder);padding:.25em}.listItemImage{border:var(--defaultBorder);border-radius:var(--smallRadius);margin-right:.75em!important}[dir=ltr] .listItem:not(.actionSheetMenuItem,.childrenItemsContainer .listItem,.activityLogListWidget .listItem){padding:.375em!important}[dir=ltr] .listItem:not(.actionSheetMenuItem,.childrenItemsContainer .listItem,.activityLogListWidget .listItem):not(:last-child){margin-bottom:.5em}[dir=ltr] .listItem:not(.actionSheetMenuItem)[data-type=Episode]{margin-bottom:.5em;padding:.375em}.layout-mobile #playlist .listItem[data-type=Audio],.layout-mobile #songsTab .listItem[data-type=Audio]{margin:auto 1em}.listItem[data-type=Audio]:has(.playlistIndexIndicatorImage) .listItemBodyText{color:var(--fullContrastColor);font-weight:600}.listItem[data-type=Audio]:has(.playlistIndexIndicatorImage):not(:hover){background-color:hsla(0,0%,100%,.07)}.listItem-largeImage .listItemBodyText:not(.secondary){color:var(--textColor);font-size:1.17em;font-weight:600}.listItemBodyText.secondary{color:var(--dimTextColor)}.listItemBody>.listItemBodyText:not(.secondary){display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;color:inherit;overflow:hidden}.listItem-overview{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.listItem-bottomoverview,[dir=ltr] .listItem:not(.actionSheetMenuItem)[data-type=Episode] .listItem-overview p{margin-bottom:0;margin-top:.75em}.listItem,.navMenuOption{border-radius:.7em}.listItem:hover,.navMenuOption:hover{background:unset;border-radius:.7em}.listItem:focus{background:var(--highlightOutlineColor)}.listItem:active,.navMenuOption:active{background:var(--activeBackgroundColor);color:#fff}.listItem-border{border-color:transparent!important}.listItem-border.emby-button.show-focus:focus{border-radius:var(--smallRadius)}.MuiList-root>a,.MuiListItem-root>a,.MuiListItem-root>div{border:var(--borderWidth) solid transparent;border-radius:.7em}.Mui-selected{background-color:var(--accentColor)!important;color:#fff}.actionsheetDivider{background:var(--dividerColor);height:2px}.actionsheet-xlargeFont{line-height:normal}.actionSheetContent{padding:.4em!important}.actionSheetContent>h1{font-size:unset}[dir=ltr] .actionsheetMenuItemIcon{margin:0 .2em 0 .45em!important}.actionSheetMenuItem:has(.listItemIcon.check){background-color:var(--accentColor)}.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText{color:var(--activeTextColor)}.actionSheetMenuItem:has(.listItemIcon.check) .listItemIcon.check{display:none}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]){background-color:transparent}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]) .listItemBodyText{background-color:transparent;color:var(--fullContrastColor)}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]):active{background-color:var(--semiTransparentAccentColor)}.navMenuOption{border-radius:var(--smallRadius)!important;margin:0 1em!important}[dir=ltr] .navMenuOption{margin-bottom:unset;padding:.75em 1em!important}#myPreferencesMenuPage .listItemIcon{margin-left:.5em;margin-right:.25em}.navMenuOption-selected{background-color:var(--accentColor)!important}#itemDetailPage .detailSection{column-gap:3em;display:grid;grid-template-columns:1.3fr .7fr 1fr 1fr;margin-bottom:1.5em;max-width:unset!important;row-gap:1em}.tmdb-review-swipe-container{max-width:93vw}.detailPageContent{gap:1em}.trackSelections{background-color:var(--lighterGradientPointAlpha);border:var(--defaultBorder);border-radius:var(--smallRadius);grid-column:3/5;margin-top:1em;max-width:unset!important;order:3;padding:1em}.layout-mobile .trackSelections{margin-top:0}.layout-tv .trackSelections{order:2}.recordingFields{order:4}.recordingButton{gap:1ch}.detailsGroupItem,.trackSelections .selectContainer{align-items:baseline;max-width:unset!important}.selectArrowContainer{opacity:.5;top:0}.trackSelectionFieldContainer>.selectArrowContainer{top:.5em}.trackSelectionFieldContainer>label{background-repeat:no-repeat;color:transparent;max-width:2.75em;transform:scale(.9)}.selectVideoContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M2 12c0-4.7 0-7 1.5-8.5C4.9 2 7.3 2 12 2s7 0 8.5 1.5C22 4.9 22 7.3 22 12s0 7-1.5 8.5C19.1 22 16.7 22 12 22s-7 0-8.5-1.5C2 19.1 2 16.7 2 12Z'/%3E%3Cpath stroke-linecap='round' d='M17 2.5v19M7 2.5v19M2.5 7H7m14.5 0H17M2.5 17H7m14.5 0H17M2 12h20'/%3E%3C/g%3E%3C/svg%3E");filter:var(--svgIconFilter)}.selectAudioContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M9 19a3 3 0 1 1-6 0 3 3 0 0 1 6 0Zm12-2a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9 19V8m12 9V6'/%3E%3Cpath stroke-linecap='round' d='m15.7 3.8-4 1.3c-1.3.4-2 .6-2.3 1.2C9 6.8 9 7.5 9 8.9V12l12-4v-.5c0-2.5 0-3.7-.8-4.3-.9-.6-2-.2-4.5.6Z'/%3E%3C/g%3E%3C/svg%3E");filter:var(--svgIconFilter)}.selectSubtitlesContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23d1d5db' viewBox='0 0 24 24'%3E%3Cg stroke-width='1.5'%3E%3Cpath d='M2 12c0-3.8 0-5.7 1.2-6.8C4.3 4 6.2 4 10 4h4c3.8 0 5.7 0 6.8 1.2C22 6.3 22 8.2 22 12s0 5.7-1.2 6.8C19.7 20 17.8 20 14 20h-4c-3.8 0-5.7 0-6.8-1.2C2 17.7 2 15.8 2 12Z'/%3E%3Cpath stroke-linecap='round' d='M10 16H6m8-3h4m-4 3h-1.5m-3-3h2m6.5 3h-1.5M6 13h1'/%3E%3C/g%3E%3C/svg%3E");filter:var(--svgIconFilter)}.selectSourceContainer.trackSelectionFieldContainer>label{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%23d1d5db' d='m15.4 4.05-.5.56zm3.95 3.57-.5.55zm2.3 2.53-.68.3zM3.17 20.83l.53-.53zm17.66 0-.53-.53zm-6.83.42h-4v1.5h4zM2.75 14v-4h-1.5v4zm18.5-.44V14h1.5v-.44zm-6.36-8.95 3.96 3.56 1-1.11L15.9 3.5l-1 1.11Zm7.86 8.95c0-1.69.02-2.75-.41-3.71l-1.37.6c.26.6.28 1.3.28 3.11zm-3.9-5.39c1.35 1.22 1.85 1.7 2.12 2.29l1.37-.61c-.43-.96-1.23-1.66-2.49-2.8zm-8.82-5.42c1.58 0 2.18.01 2.71.22l.54-1.4c-.85-.33-1.78-.32-3.25-.32zm5.86.75c-1.08-.98-1.76-1.6-2.61-1.93l-.54 1.4c.53.2.98.59 2.15 1.64zM10 21.25c-1.9 0-3.26 0-4.29-.14-1-.13-1.58-.39-2-.81l-1.07 1.06c.75.75 1.7 1.08 2.87 1.24 1.15.15 2.63.15 4.49.15zM1.25 14c0 1.86 0 3.34.15 4.49a4.7 4.7 0 0 0 1.24 2.87L3.7 20.3c-.42-.43-.67-1-.81-2.01A36 36 0 0 1 2.75 14zM14 22.75c1.86 0 3.34 0 4.49-.15a4.7 4.7 0 0 0 2.87-1.24L20.3 20.3c-.43.42-1 .68-2.01.81-1.03.14-2.38.14-4.29.14zM21.25 14c0 1.9 0 3.26-.14 4.29-.13 1-.39 1.58-.81 2l1.06 1.07a4.7 4.7 0 0 0 1.24-2.87c.15-1.15.15-2.63.15-4.49zm-18.5-4c0-1.9 0-3.26.14-4.29.14-1 .39-1.58.81-2L2.64 2.63A4.7 4.7 0 0 0 1.4 5.51c-.15 1.15-.15 2.63-.15 4.49zm7.28-8.75c-1.87 0-3.36 0-4.51.15a4.72 4.72 0 0 0-2.88 1.24L3.7 3.7c.42-.42 1-.67 2.02-.81 1.03-.14 2.4-.14 4.31-.14z'/%3E%3Cpath stroke='%23d1d5db' stroke-width='1.5' d='M13 2.5V5c0 2.36 0 3.54.73 4.27S15.64 10 18 10h4'/%3E%3C/svg%3E");filter:var(--svgIconFilter)}.detailSectionContent a:not(.overview-expand){text-align:start}.layout-desktop .detailSectionContent{align-content:end;display:grid;min-height:16vh}.detailSectionContent:has(.tagline.hide+.overview.hide){min-height:unset}.itemDetailsGroup{background-color:var(--lighterGradientPointAlpha);border:none;border-radius:var(--smallRadius);box-shadow:inset 0 0 0 .06em var(--borderColor)!important;grid-column:1/3;margin-top:1em;order:2;outline:none;overflow:hidden}.layout-mobile .itemDetailsGroup{margin-top:0}.detailsGroupItem{align-items:baseline;justify-content:space-between;margin:0!important;padding:.5em .9em}.detailsGroupItem:not(:last-child),.itemDetailsGroup>div:not(:last-child){border-bottom:var(--defaultBorder)}.itemDetailsGroup>div:empty{border-bottom:none}.detailsGroupItem>.label{flex-basis:6em;font-weight:600}.detailsGroupItem>.focuscontainer-x a{font-weight:400;text-align:end}.detailsGroupItem>.focuscontainer-x{color:var(--dimTextColor);text-align:end}.detailsGroupItem>.label{color:var(--textColor)}.layout-tv .itemDetailsGroup{order:2}.detailSection>.nextUpSection{grid-column:1;order:5}.detailSection>#listChildrenCollapsible{grid-column:2/-1;order:6}.detailSectionContent{grid-column:1/-1;order:1}.nextUpSection.hide~#listChildrenCollapsible,.trackSelections.hide~.recordingFields.hide~.itemDetailsGroup,.collectionItems,.layout-mobile .detailSection>#listChildrenCollapsible,.layout-mobile .detailSectionContent,.layout-mobile .itemDetailsGroup,.layout-mobile .nextUpSection,.layout-mobile .trackSelections,.layout-tv .detailSection>#listChildrenCollapsible,.layout-tv .detailSectionContent,.layout-tv .itemDetailsGroup,.layout-tv .nextUpSection,.layout-tv .trackSelections,.programGuideSection,.series-episodes-section,.series-episodes-section~#listChildrenCollapsible{grid-column:1/-1}.series-episodes-section{order:4}.collectionItems{order:2}.programGuideSection:not(.hide){margin-top:2em;order:-1}.layout-desktop .programGuide{padding-right:var(--sidePadding)}.collectionItems .sectionTitleContainer.padded-left{padding-left:.375em}.collectionItemsContainer.padded-left{padding-left:0}.sliderBubble{border:var(--defaultBorder);border-radius:var(--largeRadius);overflow:hidden;z-index:3}.alphaPickerButton{color:var(--dimTextColor);font-family:monospace;margin:.15em}.alphaPickerButton-selected{background-color:var(--btnPlayColor);color:var(--zeroContrastColor)!important}.alphaPicker-vertical{height:70%}.layout-mobile .alphaPicker-vertical{right:0!important}.alphaPicker{justify-content:center}.alphaPickerButton-tv{transition:transform .2s}.alphaPickerButton-tv:focus{background-color:var(--highlightOutlineColor);transform:scale(1.75)}.padded-right{padding-right:var(--sidePadding)!important}.content-primary,[dir=ltr] .detailPageContent{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}[dir=ltr] .detailPageContent>.detailPagePrimaryContent{padding-left:0!important;padding-right:0!important}#itemDetailPage .verticalSection .itemsContainer.padded-right{padding-right:0!important}.vertical-list>.listGroupHeader{padding-left:.5ch}.listPaging>span{padding:0 .5em}.layout-mobile #myPreferencesMenuPage{padding-top:var(--appBarHeight)!important}.headerUserButton{border:var(--defaultBorder);height:2em;margin-inline-end:1em;width:2em}.MuiAvatar-circular{border:var(--defaultBorder);height:1.5em;width:1.5em}.dashboardDocument .content-primary{padding-top:4.25rem}.editorNode{align-items:center;display:flex}.metadataSidebarIcon{color:#6c7bab}.jstree-default .jstree-wholerow-clicked{background:var(--selectorBackgroundColor)!important}.verticalSection:not(:empty){margin-bottom:1em;margin-top:.5em}.sectionTitleTextButton{padding:0 .5em}.sectionTitleTextButton:hover{background:transparent!important}.sectionTitleTextButton:active{color:var(--fullContrastColor)!important}.sectionTitleContainer-cards{padding-bottom:.2em;padding-top:0}.sectionTitleTextButton>*{margin:0!important;max-width:88vw;overflow:hidden;padding:.3em 0!important;text-align:left;text-overflow:ellipsis;white-space:nowrap}.dashboardSection .sectionTitleTextButton>.material-icons,.dashboardSection .sectionTitleTextButton>.material-icons.material-icons,.sectionTitleTextButton>.material-icons{font-size:unset}.sectionTitleTextButton>.chevron_right{--fill:0;--opsz:48;font-size:1.5rem}.sectionTitleTextButton>.chevron_right:before{content:"arrow_circle_right"}.toast{border-radius:var(--smallRadius)}.upNextContainer{border-radius:var(--largeRadius);color:var(--textColor)}[dir=ltr] .upNextContainer{box-sizing:border-box;margin:2em;max-width:80vw}.upNextDialog-title{white-space:pre-wrap;width:unset}.upNextDialog-buttons{flex-wrap:wrap;width:unset}.upNextContainer .upNextDialog-countdownText{color:var(--fullContrastColor)}.skip-button-container{bottom:9rem}.skip-button{background-color:var(--textColor);border-radius:3em;box-shadow:var(--shadow);color:var(--zeroContrastColor);margin-right:var(--sidePadding)}.layout-tv .skip-button{margin-left:var(--sidePadding);margin-right:auto}.skip-button:hover{background-color:var(--fullContrastColor)}.skip-button:active{background-color:hsla(0,0%,96%,.7);box-shadow:none}.toast,.upNextContainer{backdrop-filter:var(--blurDefault);background:var(--headerColor)!important;border:var(--defaultBorder)!important;color:var(--textColor)}.activeSession{width:98%!important}@media (hover:hover) and (pointer:fine){.paper-icon-button-light:hover:not(:disabled){background-color:var(--hoverBackgroundColor);color:var(--zeroContrastColor);text-shadow:none!important}.emby-input:hover:not(:focus),.emby-select-withcolor:hover:not(.emby-select[disabled],:focus),.emby-textarea:hover:not(:focus){border-color:var(--dimTextColor)!important}.checkboxContainer:hover .checkboxOutline:not(.multiSelectCheckboxOutline){border-color:var(--checkboxCheckedBgColor);border-width:var(--borderWidthDouble)}.button-flat:hover{background-color:hsla(0,0%,100%,.2);color:var(--fullContrastColor)}.btnPlay.detailButton:hover{background-color:var(--btnPlayColor);color:var(--zeroContrastColor);filter:brightness(1.1)}.alphaPickerButton:hover{color:var(--fullContrastColor)}.listItem-largeImage:hover{backdrop-filter:var(--blurLargest)}.listItem:not(.actionSheetMenuItem:has(.check)):hover{background:var(--activeBackgroundColor)!important;color:var(--hoverTextColor)!important}.listItem:hover .listItemBodyText,.listItem:hover .secondary{color:var(--hoverTextColor)!important}.navMenuOption:not(.navMenuOption-selected):hover{background:var(--activeBackgroundColor)!important;color:var(--hoverTextColor)!important}.actionSheetMenuItem:has(.listItemIcon.check[style*=hidden]):hover{background:var(--activeBackgroundColor)!important;color:var(--hoverTextColor)!important}.inputContainer .emby-input-iconbutton:hover,.searchfields-icon:hover{color:hsla(0,0%,100%,.8)}#scenesContent .cardScalable:hover{border-color:var(--dimTextColor)!important}.sectionTitleTextButton:hover{background:transparent!important;color:var(--fullContrastColor)!important}.button-link:hover{color:var(--textColor)!important;text-decoration:none}.sectionTabs .emby-tab-button:hover{background-color:var(--hoverTabBackgroundColor);color:var(--zeroContrastColor)}}.paper-icon-button-light:active:not(:disabled){background-color:var(--hoverBackgroundColor);color:var(--zeroContrastColor);text-shadow:none!important}.layout-mobile .cardOverlayButton-br:active>.cardOverlayButtonIcon{color:var(--zeroContrastColor);text-shadow:none}.emby-textarea{font-family:consolas,monaco,monospace}.customCssContainer textarea{max-height:40vh;overflow-y:auto!important}.emby-input,.emby-select,.emby-select-withcolor,.emby-textarea{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);border-radius:var(--smallRadius);padding:.5em!important}.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused{color:var(--fullContrastColor)}.emby-input:focus,.emby-select-withcolor:focus,.emby-textarea:focus{border-color:var(--highlightOutlineColor)!important;outline:none!important}@supports (display:revert){.emby-input:focus,.emby-select-withcolor:focus,.emby-textarea:focus{background-color:var(--textareaBackgroundColor);border-color:var(--highlightOutlineColor)!important;outline:thin solid var(--highlightOutlineColor)!important}}.emby-select-withcolor>option{background-color:var(--selectorBackgroundColor);color:inherit}.inputContainer .emby-input-iconbutton{background-color:transparent!important;color:hsla(0,0%,100%,.5);margin-left:-2.5em}.searchfields-txtSearch{border-radius:4em;padding:.75em 1.5em!important}.searchfields-icon{border-radius:var(--largeRadius);color:hsla(0,0%,100%,.5);margin-bottom:0;margin-left:-1.75em;padding:.25em}.inputContainer .emby-input-iconbutton:active,.searchfields-icon:active{color:hsla(0,0%,100%,.8)}.searchFields>.searchFieldsInner{flex-direction:row-reverse}.nameContainer>h1,.nameContainer>h3{overflow:hidden;word-break:break-word}.nameContainer>h1.itemName,.nameContainer>h1.parentName{color:var(--fullContrastColor);font-size:4em;padding-bottom:.5ch;white-space:pre-wrap}.nameContainer>h1.itemName,.nameContainer>h1.itemName a,.nameContainer>h1.parentName,.nameContainer>h1.parentName a{font-weight:200}.nameContainer>h1.itemName a,.nameContainer>h1.itemName bdi,.nameContainer>h1.parentName a,.nameContainer>h1.parentName bdi{display:-webkit-box!important;-webkit-line-clamp:3;overflow:hidden;-webkit-box-orient:vertical}.layout-mobile .nameContainer>h1.itemName,.layout-mobile .nameContainer>h1.parentName,.layout-mobile .nameContainer>h1.parentNameLast{font-size:2em;word-wrap:break-word;padding-bottom:0}.subtitle{font-size:2em;padding-bottom:1em}.layout-mobile .subtitle{font-size:1.5em;padding-bottom:.5em}.itemName.originalTitle{color:var(--dimTextColor);display:var(--itemOriginalTitleVisibility);padding-bottom:.25em;padding-top:.25em}.channelPrograms,.programCell{background-color:transparent!important;border-color:transparent;border-radius:var(--smallRadius);height:4.42em}.guideProgramName{background-color:hsla(0,0%,100%,.05);border-radius:var(--smallerRadius);height:calc(100% - .7em);margin:.35em 0 .35em .7em}.guide-programNameCaret{display:none}.programCell-active .guideProgramName{background-color:var(--semiTransparentAccentColor)}.guideVerticalScroller{padding:0}.layout-mobile .guideChannelImage{background-position:50%;right:0;width:calc(100% - var(--sidePadding))}.guide-channelHeaderCell{background-color:var(--semiTransparentAccentColor);border-radius:var(--smallRadius);height:3.72em;margin:.35em .7em .7em;width:auto}.guideChannelNumber{font-size:1em}#guideTab{padding-top:3em!important}.guide-channelHeaderCell:focus{background-color:var(--highlightOutlineColor)!important}.programCell:focus{background-color:transparent!important}.programCell:focus>.guideProgramName{background-color:var(--highlightOutlineColor)}.emby-select-iconbutton{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);margin-inline-start:1em}.emby-select-iconbutton,.subtitleappearance-preview{border-radius:var(--smallRadius)}.infoBanner{background-color:var(--headerColor)!important;border:var(--defaultBorder)!important;border-radius:var(--largeRadius)!important;display:flex;place-content:center}fieldset{border:var(--defaultBorder);border-radius:var(--smallRadius)}table:not(.MuiTable-root.MuiTable-stickyHeader){background:var(--tableBodyColor);border-color:var(--borderColor)!important;border:var(--defaultBorder);border-collapse:separate;border-radius:var(--smallRadius);border-spacing:1px;overflow:hidden}.detailTableHeaderCell{vertical-align:middle}#serverActivityPage .MuiPaper-elevation2{border:var(--defaultBorder)!important;box-shadow:unset!important}#serverActivityPage .MuiPaper-elevation2,#serverActivityPage .MuiPaper-elevation2>.MuiBox-root,#serverActivityPage .MuiTableRow-root.MuiTableRow-head{background-color:var(--tableBodyColor)}#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(odd),.detailTableBodyRow-shaded:nth-child(odd){background:var(--darkerGradientPointAlpha)!important}#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(2n),.detailTableBodyRow-shaded:nth-child(2n){background:var(--lighterGradientPointAlpha)!important}.MuiList-root.MuiMenu-list{background-color:var(--drawerColor);padding:.375em}ul.MuiList-root.MuiMenu-list.MuiList-dense>div:first-child{gap:.5rem}.iconOsd,.playerStats{backdrop-filter:var(--blurDefault);background-color:rgba(69,69,69,.69);border-radius:var(--largeRadius)}.playerStats-stats{flex-wrap:wrap;max-height:50vh;overflow-x:auto;padding:1em!important}#scenesContent .cardScalable:active{border-color:var(--dimTextColor)!important}.progressring-spiner{border-color:var(--accentColor)}.skinHeader.focuscontainer-x.skinHeader-withBackground.skinHeader-blurred.semiTransparent.noHeaderRight{display:none}#loginPage{align-items:center;background:linear-gradient(to bottom,var(--darkerGradientPointAlpha),var(--lighterGradientPoint)),var(--loginPageBgUrl);background-position:50%;background-repeat:no-repeat;background-size:cover;box-sizing:border-box;display:flex;justify-content:center;min-height:100vh;overflow-y:auto;padding:1em}#loginPage .padded-left.padded-right.padded-bottom-page{backdrop-filter:var(--blurDefault);background:rgba(30,40,54,.7);border-radius:var(--largerRadius);box-sizing:border-box;padding:2em 2em 1em!important;transform:translateY(3em);width:28em}.manualLoginForm .sectionTitle,.visualLoginForm>h1{display:none}#loginPage .padded-left.padded-right.padded-bottom-page:has(.visualLoginForm:not(.hide)){width:40em}#divUsers .squareCard{width:30%!important}.layout-mobile #divUsers .squareCard{width:45%!important}.manualLoginForm:before,.visualLoginForm:before{color:var(--fullContrastColor);content:var(--loginPageText);display:block;font-size:1.875em;font-weight:800;margin-bottom:-1em;position:relative;text-align:center;top:-3.5em}.manualLoginForm,.visualLoginForm{position:relative}#quickConnectPreferencesPage .padded-left.padded-right.padded-bottom-page{align-items:center;display:flex;flex-direction:column;justify-content:center}#txtLoginDisclaimer{resize:none}.endTimeText,.positionTime,.runtime,.startTimeText{box-sizing:border-box;font-variant-numeric:tabular-nums;width:4.5em}.startTimeText{margin:0!important}.endTimeText{justify-content:right;margin:0 0 0 .75em!important;padding-inline-end:.8em}.endTimeText,.startTimeText{padding-top:.25em}.positionTime,.startTimeText{justify-content:left;text-align:start}.endTimeText,.runtime{justify-content:right;text-align:end}.filterIndicator{background:var(--accentColor)}.overflowBackdropCard[data-type=CollectionFolder] .cardPadder-overflowBackdrop,.overflowBackdropCard[data-type=UserView] .cardPadder-overflowBackdrop{padding-bottom:50%}.overflowBackdropCard[data-type=CollectionFolder] .cardText-first,.overflowBackdropCard[data-type=UserView] .cardText-first{display:var(--libraryLabelVisibility)}.nowPlayingButtonsContainer{margin-top:1em}.nowPlayingPageImageContainerNoAlbum{border:var(--defaultBorder);border-radius:var(--smallRadius);overflow:hidden}.nowPlayingPageImageContainerNoAlbum .defaultCardBackground{background:repeating-radial-gradient(#000,transparent 10em)}.nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon{color:var(--borderColor)}.layout-mobile .playlistSection .playlist{backdrop-filter:var(--blurLargest);background:var(--headerColor);bottom:4.3em;padding:4.3em 0;top:0;z-index:0}.layout-mobile .playlistSectionButton{backdrop-filter:var(--blurSmallest);background:var(--drawerColor);border-top:var(--defaultBorder);color:var(--textColor);z-index:1}.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent{background:transparent;border-top:var(--defaultBorder);border-color:transparent;color:var(--textColor)}.layout-desktop .nowPlayingInfoContainer{backdrop-filter:var(--blurLargest);background-color:var(--headerColor);border:var(--defaultLighterBorder);border-radius:var(--largerRadius);box-shadow:var(--shadow);box-sizing:border-box;margin-bottom:2em;padding:1em;position:-webkit-sticky;position:sticky;top:5em;z-index:2}.layout-desktop .nowPlayingInfoControls{margin:0 2em}.nowPlayingPageImage{aspect-ratio:1/1;border-radius:var(--smallRadius);box-shadow:var(--shadow);object-fit:cover}.nowPlayingBar .playPauseButton{font-size:2em}.nowPlayingInfoContainer .btnPlayPause{font-size:3em}.nowPlayingBar .nowPlayingImage{background-size:cover;border-radius:var(--smallerRadius);height:3.5em;margin:.25em;width:3.5em}.nowPlayingBarPositionContainer{top:-.7em}@media (orientation:portrait) and (max-width:43em){.nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon{font-size:8em!important}.nowPlayingInfoContainer{height:calc(95% - 4.2em)}}.nowPlayingSongName.nowPlayingEpisode{color:var(--textColor);font-size:1.25em;margin-bottom:1em}.nowPlayingAlbum.nowPlayingSeason{color:var(--dimTextColor);margin-bottom:.5em}.nowPlayingArtist.nowPlayingSerie{margin-bottom:.5em}.playlistIndexIndicatorImage{background-blend-mode:difference;background-color:var(--textColor);background-size:contain!important}.playlistIndexIndicatorImage.defaultCardBackground .audiotrack{display:none}#dialogToc{background-color:rgba(0,0,0,.5);max-height:unset;max-width:unset}#dialogToc .toc li{font-family:Math,serif;font-size:unset;font-weight:600;list-style-type:circle;margin-bottom:.5em}.MuiTabs-indicator{display:none}.MuiTabs-root>.MuiTabs-scroller{align-content:center}.MuiTabs-flexContainer>.MuiButtonBase-root{border-radius:var(--largeRadius);min-height:40px;min-width:72px}.MuiTabs-flexContainer>.MuiButtonBase-root.Mui-selected{background-color:transparent!important;color:var(--fullContrastColor)}.MuiToggleButtonGroup-grouped.Mui-selected{color:var(--fullContrastColor)}.MuiButtonBase-root.MuiIconButton-root:hover{background-color:transparent;color:var(--fullContrastColor)}#viewPanel .ui-panel-inner{margin-top:4em}.videoOsdBottom.videoOsdBottom-maincontrols{background:var(--bottomOSDGradient)}.skinHeader-withBackground.osdHeader{background:var(--topOSDGradient)}.headroom{transition:transform .5s}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent){backdrop-filter:var(--appBarBlurStrength,none);background-color:transparent;background:var(--appBarColor,var(--headerBackground));border:var(--appBarBorder,none);border-width:0 0 var(--borderWidth) 0}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent):after{backdrop-filter:var(--blurLargest);bottom:0;content:var(--appBarSeamlessBlur,"");left:0;-webkit-mask:var(--headerBlurMask);mask:var(--headerBlurMask);position:absolute;right:0;top:0;z-index:-1}.layout-mobile .skinHeader-blurred:not(.osdHeader),.layout-mobile .withSectionTabs .headerTop{padding:0}.sectionTabs{display:inline-grid;height:var(--appBarHeight);padding-bottom:var(--appBarTabsPadding,1.5em)}.layout-mobile .sectionTabs{align-content:center}.skinHeader-withBackground.semiTransparent{--headerBackground:none;backdrop-filter:none;background-color:transparent;border:none}.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty),.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty):after{--headerBackground:none;backdrop-filter:none;background-color:transparent;border:none}.skinHeader-withBackground.semiTransparent .headerButton:not(:hover),.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty) .headerButton:not(:hover){color:#fff;text-shadow:var(--iconShadow)}.headerTop{-webkit-align-items:center;align-items:center;height:var(--appBarHeight);padding:0}.osdHeader .headerTop{max-height:var(--appBarHeight)}.layout-desktop .headerTop{padding:0 1em}.layout-tv .headerTop{padding:0 .5em}.headroom--unpinned{-webkit-transform:translateY(calc(var(--appBarHeight)*-1 - var(--borderWidth)));transform:translateY(calc(var(--appBarHeight)*-1 - var(--borderWidth)))}.noHomeButtonHeader .emby-tab-button[data-index="1"]:before{content:"favorite"}.noHomeButtonHeader .emby-tab-button[data-index="0"]:before{content:"home"}.noHomeButtonHeader .emby-tab-button:before{--fill:0;font-family:var(--iconPack),Material Icons;font-feature-settings:"liga";font-size:1.2em;font-variation-settings:"FILL" var(--fill),"wght" var(--wght),"GRAD" var(--grad),"opsz" var(--opsz);transition:font-variation-settings .25s}.layout-tv .sectionTabs .emby-tabs.smoothScrollX{overflow:visible!important}.sectionTabs .emby-tab-button{background-color:var(--darkerGradientPointAlpha);border-radius:var(--largeRadius);color:var(--textColor);display:inline-flex;font-weight:400;height:2.5em;margin:.25em .5em;padding:0 1.25em}.sectionTabs .emby-tab-button-active{background-color:var(--btnPlayColor);color:var(--zeroContrastColor);margin:.25em .5em}.libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight)*2 + .5em)!important}@media (min-width:75em){.sectionTabs{-webkit-align-items:center;align-items:center;-webkit-align-self:center;align-self:center;-webkit-justify-content:center;justify-content:center;margin-top:calc(var(--appBarHeight)*-1);position:relative;width:auto}.libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight) + .5em)!important}.headroom--unpinned{-webkit-transform:translateY(0);transform:translateY(0)}}@media (min-width:100em){.layout-tv .libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight) + .5em)!important}}@media (max-width:100em){.sectionTabs{font-size:100%}.layout-tv .sectionTabs{margin-top:unset}.layout-tv .libraryPage:not(.noSecondaryNavPage){padding-top:calc(var(--appBarHeight)*2 + .5em)!important}}@media (max-width:75em){.layout-mobile .sectionTabs .emby-tab-button:first-child{margin-left:var(--sidePadding)}.layout-mobile .sectionTabs .emby-tab-button:last-child{margin-right:var(--sidePadding)}}.layout-tv .headerLeft{margin:0 .6em;overflow:unset}.skinHeader{color:var(--textColor);padding-top:max(env(safe-area-inset-top),var(--safe-area-inset-top))!important}.nowPlayingPage{background:linear-gradient(var(--darkerGradientPointAlpha),transparent)}.remoteControlContent{background:linear-gradient(transparent,var(--darkerGradientPointAlpha) 20em);padding:0 var(--sidePadding)!important}.emby-select-focusscale:focus,.layout-tv .show-animation:focus,.layout-tv .show-focus:focus{transform:none!important}.layout-tv .backdropImage,.layout-tv .focuscontainer{animation-duration:0s!important;backdrop-filter:none}.card.show-animation .cardBox{transition:transform .05s ease-out}#slides-container{top:calc(var(--appBarHeight)*-.5)}.backdrop-overlay{background:linear-gradient(var(--lighterGradientPoint),var(--gradientPointAlpha),60%,var(--darkerGradientPointAlpha))}.plot{color:var(--textColor);text-shadow:1px 1px var(--lighterGradientPointAlpha)}.button-container{align-items:center}.favorite-button{background:none;color:var(--textColor)}.detail-button:hover,.favorite-button:hover{background:var(--dimTextColor);color:var(--zeroContrastColor)} \ No newline at end of file diff --git a/Theme/ElegantFin-theme-v26.09.05.css b/Theme/ElegantFin-theme-v26.09.05.css new file mode 100644 index 0000000..ae37c73 --- /dev/null +++ b/Theme/ElegantFin-theme-v26.09.05.css @@ -0,0 +1,4374 @@ +/*! ElegantFin Theme v26.09.05 for Jellyfin by lscambo13 */ + +/* Add-ons: Uncomment to enable */ +/* @import url(./assets/add-ons/media-bar-plugin-support-nightly.css); */ +/* @import url("https://cdn.jsdelivr.net/gh/lscambo13/ElegantFin@main/Theme/assets/add-ons/custom-media-covers-latest-min.css"); */ + +/* Inter Font Family */ +@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"); + +/* Material Symbols Rounded - Minimal */ +/* https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&icon_names=add,airplay,album,animated_images,arrow_back,arrow_circle_right,arrow_forward,arrow_upward,audiotrack,autorenew,backspace,book,brightness_high,call_split,cast,check,chevron_left,chevron_right,clear,close,closed_caption,cloud_download,content_copy,dashboard,delete,devices_other,download,drag_handle,dvr,exit_to_app,expand_more,explore,fast_forward,fast_rewind,favorite,fiber_manual_record,fiber_smart_record,file_download,filter_alt,folder,folder_open,forward_30,fullscreen,get_app,groups,home,image,info,info_outline,keyboard,keyboard_arrow_down,keyboard_arrow_left,keyboard_arrow_right,keyboard_arrow_up,keyboard_return,library_add_check,live_tv,local_movies,lock,lyrics,menu,mode_edit,more_vert,movie,music_note,music_video,navigate_before,navigate_next,pause,pause_circle_filled,pause_circle_outline,person,phonelink_lock,photo,photo_album,picture_in_picture_alt,play,play_arrow,play_circle_filled,play_circle_outline,playlist_add,preview,queue,queue_music,quiz,redo,refresh,remove_circle,remove_red_eye,repeat,repeat_one,replay,replay_10,save,schedule,search,settings,shuffle,skip_next,skip_previous,sort_by_alpha,space_bar,star,stop,storage,subtitles,sync,text_decrease,text_increase,theaters,toc,tv,undo,update,video_library,videocam,view_comfy,volume_off,volume_up */ +@font-face { + font-family: "Material Symbols Rounded Minimal"; + font-style: normal; + font-weight: 100 700; + src: url(https://fonts.gstatic.com/l/font?kit=sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190FjzarESMdAUY9qjb3u1M7e05tMSFFiwiIx7ihGnzWmz-lkbjBJUko54uQNlqhKP2qww7THOuDASqI-hkRJowUB4AMXqmksLbVSypWpZCoCuR4ppEVE-Vm2EBGaEWVT1QQVqin1CJL8x-Ze-xGUuG3wq4dfIUCyyVOwlP0NhUaux0cITqh7BYw&skey=70ddea8fe54d532e&v=v362) + format("woff2"); +} + +/* Material Symbols Rounded - Full */ +/* https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200 */ +@font-face { + font-family: "Material Symbols Rounded"; + font-style: normal; + font-weight: 100 700; + src: url(https://fonts.gstatic.com/s/materialsymbolsrounded/v362/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) + format("woff2"); +} + +:root { + --elegantFinFooterText: "ElegantFin v26.09.05"; + + font-family: "Inter", sans-serif; + font-optical-sizing: auto; + font-weight: 425; + font-style: normal; + -webkit-tap-highlight-color: transparent !important; + + /* Material Symbols font-variation-settings */ + --fill: 1; + --wght: 400; + --grad: 0; + --opsz: 30; + + color-scheme: dark; + color: var(--textColor); + + /* standard component sizes */ + --largerRadius: 1.25em; + --largeRadius: 1em; + --smallRadius: 0.5em; + --smallerRadius: 0.375em; + --borderWidth: 0.06em; + --borderWidthDouble: 0.12em; + + --defaultBorder: var(--borderWidth) solid var(--borderColor); + --defaultLighterBorder: var(--borderWidth) solid var(--lighterBorderColor); + + --sidePadding: 3.3%; + --itemColumnGap: 1em; + + --minEpisodeCardWidth: 26em; + --appBarHeight: 5em; + + --blurSmallest: blur(2px); + --blurDefault: blur(5px); + --blurLarge: blur(10px); + --blurLargest: blur(20px); + + /* Base theme colors */ + --darkerGradientPoint: #111827; + --darkerGradientPointAlpha: rgba(17, 24, 39, 0.85); + --lighterGradientPoint: #1d2635; + --lighterGradientPointAlpha: rgba(29, 38, 53, 0.85); + --gradientPointAlpha: rgba(29, 38, 53, 0.3); + --headerColor: rgba(30, 40, 54, 0.8); + --drawerColor: rgba(30, 40, 54, 0.9); + + --borderColor: hsl(214, 13%, 32%); + --darkerBorderColor: hsl(214, 13%, 22%); + --lighterBorderColor: hsla(0, 0%, 100%, 0.2); + + --selectorBackgroundColor: hsl(217, 19%, 27%); + --selectorBackgroundColorAlpha: hsla(217, 19%, 27%, 0.5); + + /* dark theme colors */ + --textColor: rgb(209, 213, 219); + --dimTextColor: rgb(156, 163, 175); + --fullContrastColor: #fff; + --zeroContrastColor: #000; + --svgIconFilter: none; + --clearLogoFilter: none; + + --accentColor: hsl(243, 75%, 62%); + --accentHoverColor: rgb(117, 111, 226); + --semiTransparentAccentColor: rgba(255, 255, 255, 0.125); + + --btnPlayColor: var(--textColor); + --btnPlayBorderColor: var(--borderColor); + + --btnMiniPlayColor: rgb(41, 154, 93); + --btnMiniPlayBorderColor: rgb(50, 167, 105); + + /* Base component colors */ + --btnDeleteColor: rgb(169, 29, 29); + --btnDeleteBorderColor: rgb(217, 84, 84); + --btnSubmitColor: rgb(61, 54, 178); + --btnSubmitBorderColor: rgb(117, 111, 226); + --checkboxCheckedBgColor: rgb(79, 70, 229); + --highlightOutlineColor: rgb(37, 99, 235); + + --hoverBackgroundColor: var(--textColor); + --hoverTabBackgroundColor: rgba(255, 255, 255, 0.9); + --hoverTextColor: #fff; + --activeBackgroundColor: var(--semiTransparentAccentColor); + --activeTextColor: #fff; + + --cardHoverBorderColor: #fff; + --cardResumeProgressColor: var(--textColor); + --multiSelectOverlayColor: rgba(0, 0, 0, 0.8); + + --dividerColor: rgba(255, 255, 255, 0.05); + --textareaBackgroundColor: var(--selectorBackgroundColor); + + --tableBodyColor: rgb(31, 41, 55); + + --osdSeekBarPlayedColor: var(--textColor); + --osdSeekBarBufferedColorAlpha: rgba(128, 128, 128, 0.5); + --osdSeekBarThumbColor: #fff; + + /* textures */ + --backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint)); + --cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), 25%, var(--lighterGradientPoint)); + --backgroundAlphaOverlay: linear-gradient(180deg, var(--darkerGradientPointAlpha) 80%, transparent); + --headerColorGradient: linear-gradient(180deg, rgba(30, 40, 54, 0.95) 30%, 55%, transparent 90%); + --headerColorGradientAlt: linear-gradient(180deg, rgba(30, 40, 54, 1), 70%, transparent); + --headerBlurMask: linear-gradient(180deg, #fff 50%, 85%, transparent); + + --cardFooterGradient: linear-gradient(0deg, hsla(0, 0%, 5%, 0.95), 40%, transparent); + --topOSDGradient: linear-gradient(180deg, hsla(0, 0%, 0%, 0.8), 45%, hsla(0, 0%, 0%, 0)); + --bottomOSDGradient: linear-gradient(0deg, hsla(0, 0%, 0%, 0.8), 45%, hsla(0, 0%, 0%, 0)); + + --hoverGradientV: linear-gradient( + 0deg, + transparent, + hsla(0, 0%, 100%, 0.35) 45%, + hsla(0, 0%, 100%, 0.35) 55%, + transparent + ); + --hoverGradientH: linear-gradient( + 90deg, + transparent, + hsla(0, 0%, 100%, 0.35) 45%, + hsla(0, 0%, 100%, 0.35) 55%, + transparent + ); + + --itemBackdropMask: linear-gradient(180deg, rgba(0, 0, 0, 0.8), 75%, transparent); + + --shadow: 0.1em 0.1em 0.15em hsla(0, 0%, 0%, 0.3); + --cardShadow: 0 1px 6px 0px hsla(0, 0%, 0%, 0.3); + --iconShadow: 0px 0px 2px hsla(0, 0%, 0%, 0.8), 1px 1px 0px hsla(0, 0%, 0%, 0.5); + + /* use --headerColorGradient if the above is enabled [default]; + use --headerColorGradientAlt otherwise */ + --headerBackground: var(--headerColorGradient); + + /* fill out YOUR-JELLYFIN-SERVER-ADDRESS with a relevant host address; + url("/Branding/Splashscreen?format=webp&foregroundLayer=1&quality=33&width=3840&height=2160&blur=2"); */ + --loginPageBgUrl: url(""); + --loginPageText: "Sign in to continue"; + + /* use 2.8em keep the overlay play button at bottom-left corner [default]; + use 50% to place it at the center of a card */ + --overlayPlayButtonPosition: 2.8em; + + /* use 'Material Symbols Rounded' for the new icons (~5mb) [default]; + use 'Material Symbols Rounded Minimal' to reduce bandwidth usage (~115kb) (may break compatibility with plugins); */ + /* use 'Material Icons' to revert to stock Jellyfin icons */ + --iconPack: "Material Symbols Rounded"; + + /* none: hides the watched and mark favorite buttons on hover [default]; + block: makes them visible */ + --extraCardButtonsVisibility: none; + + /* block: makes the three-dot menu button visible [default]; + none: hides the three-dot menu button on hover */ + --menuButtonVisibility: block; + + /* block: keeps the original (foreign) title visible if it is available [default]; + none: always hides the original title of Movie/TV */ + --itemOriginalTitleVisibility: block; + + /* none: hides the media library card labels [default]; + block: makes them visible */ + --libraryLabelVisibility: none; + + /* block: shows the Movie/TV clear logo if it is available [default]; + none: makes the clear logo always hidden */ + --clearLogoVisibility: block; + + /* none: dynamically hides the main title of Movie/TV if its logo is available [default]; + block: makes the title always visible */ + --itemTitleVisibility: none; + + /* block: shows the music artist clear logo if it is available [default]; + none: makes the music artist clear logo always hidden */ + --artistClearLogoVisibility: block; + + /* none: makes the music artist title always hidden [default]; + block: shows the text-based music artist title */ + --artistTitleVisibility: none; + + /* unset: makes the artist background dim for better clear logo visibility on desktops [default]; + none: makes the music artist page background fully visible */ + --artistPageBackground: unset; + + /* block: shows the mini play or three-dot button on cards only on mobile [default]; + none: makes them always hidden only on mobile */ + --miniOverlayButtonVisibility: block; + + /* none: keeps the media 'Ends at...' time indicator always hidden on phones [default]; + block: shows the time when the media will end */ + --endsAtVisibility: block; + + /* block: keeps the critics tomato rating visible [default]; + none: hides the critics tomato rating on phones */ + --criticsRatingVisibility: none; + + /* use "" to enable the card hover effect [default]; + use none (without quotes) to disable it */ + --cardHoverEffect: ""; + + /* uncomment the block below to enable solid app bar style + keep it commented out to keep the seamless app bar style */ + /* + --appBarSeamlessBlur: none; + --appBarBlurStrength: var(--blurLargest); + --appBarColor: var(--headerColor); + --appBarBorder: var(--defaultBorder); + --appBarTabsPadding: 0; + */ + + /* uncomment the block below to enable fully transparent app bar style */ + /* + --appBarSeamlessBlur: none; + --appBarColor: transparent; + */ + + /* use 10% to crop the top 10% of a backdrop image on a 16:9 screen (recommended) [default]; + use a figure between 0% and 20% according to your liking */ + --backdropTrimFromTop: 10%; + + /* use 1 to keep the size 'Continue Watching' cards normal [default]; + use numbers greater than 1.0 to increase their size (example: 1.25) */ + --resumeCardScale: 1; +} + +:root[data-theme="light"] { + color-scheme: light; + + /* Material Symbols font-variation-settings */ + --fill: 0; + + --darkerGradientPoint: #f2f2f2; + --darkerGradientPointAlpha: rgba(242, 242, 242, 0.85); + --lighterGradientPoint: #eeeeee; + --lighterGradientPointAlpha: rgba(255, 255, 255, 0.85); + + --headerColor: rgba(238, 238, 238, 0.8); + --drawerColor: rgba(238, 238, 238, 0.9); + + --borderColor: #b1b1b1; + --darkerBorderColor: #cacaca; + --lighterBorderColor: rgba(0, 0, 0, 0.2); + + --selectorBackgroundColor: #ffffff; + --selectorBackgroundColorAlpha: rgba(228, 228, 228, 0.5); + + --textColor: hsl(0, 0%, 13%); + --dimTextColor: hsl(0, 0%, 35%); + + --fullContrastColor: #000; + --zeroContrastColor: #fff; + + --svgIconFilter: invert(1); + --clearLogoFilter: invert(1) brightness(0.5) hue-rotate(180deg); + + --accentColor: hsl(246, 77%, 57%); + --accentHoverColor: hsl(244, 92%, 64%); + + --btnPlayColor: var(--accentColor); + --btnPlayBorderColor: var(--btnSubmitBorderColor); + + --btnMiniPlayColor: hsl(147, 55%, 38%); + --btnMiniPlayBorderColor: hsl(147, 53%, 43%); + + --btnDeleteColor: hsl(2, 61%, 45%); + --btnDeleteBorderColor: hsl(0, 78%, 65%); + --btnSubmitColor: hsl(241, 57%, 54%); + --btnSubmitBorderColor: hsl(243, 66%, 66%); + + --checkboxCheckedBgColor: hsl(241, 90%, 65%); + --highlightOutlineColor: hsl(221, 100%, 60%); + + --hoverBackgroundColor: var(--accentHoverColor); + --hoverTabBackgroundColor: var(--accentHoverColor); + --hoverTextColor: #fff; + + --activeBackgroundColor: var(--accentHoverColor); + --activeTextColor: #fff; + + --cardHoverBorderColor: var(--accentHoverColor); + --cardResumeProgressColor: #fff; + --multiSelectOverlayColor: rgb(208, 208, 208, 0.8); + + --dividerColor: rgba(0, 0, 0, 0.05); + --textareaBackgroundColor: #fff; + + --tableBodyColor: #fff; + + --osdSeekBarPlayedColor: var(--accentHoverColor); + --osdSeekBarThumbColor: var(--accentColor); + + --backgroundGradient: var(--lighterGradientPoint); + + --headerColorGradient: linear-gradient(180deg, rgba(255, 255, 255, 0.95) 30%, 55%, transparent 90%); + --headerColorGradientAlt: linear-gradient(180deg, rgba(255, 255, 255, 0.95), 70%, transparent); + + --cardFooterGradient: linear-gradient(0deg, hsla(0, 0%, 8%, 0.8), 40%, transparent); + + --shadow: 0.1em 0.1em 0.15em hsla(0, 0%, 0%, 0); + --cardShadow: 0 1px 6px 0px hsl(0, 0%, 85%); +} + +:root.layout-mobile { + --headerColorGradient: var(--headerColorGradientAlt); + --blurLargest: blur(12px); + --headerBlurMask: linear-gradient(180deg, #fff 60%, 90%, transparent); + --itemColumnGap: 0.4em; +} + +body { + --primaryItemPageNegativeSpace: 14vh; + --secondaryItemPageNegativeSpace: 60vh; + --clearLogoBottomSpace: 11em; +} + +select { + text-overflow: ellipsis; +} + +.layout-desktop > body:has(> audio[src]) { + --primaryItemPageNegativeSpace: calc(14vh + 5em); + --secondaryItemPageNegativeSpace: calc(60vh + 5em); +} + +.layout-mobile > body { + --secondaryItemPageNegativeSpace: 45vh; +} + +.material-icons { + font-family: + var(--iconPack), + Material Icons !important; + font-weight: normal; + font-style: normal; + line-height: 1; + letter-spacing: normal; + text-transform: none; + display: inline-block; + white-space: nowrap; + word-wrap: normal; + direction: ltr; + vertical-align: middle; + text-rendering: geometricPrecision; + font-feature-settings: "liga"; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + font-variation-settings: + "FILL" var(--fill), + "wght" var(--wght), + "GRAD" var(--grad), + "opsz" var(--opsz); + transition: font-variation-settings 0.25s; +} + +.material-icons.info_outline:before { + content: "\e88e"; +} + +.detailButton-icon { + --fill: 0; +} + +.ratingbutton-icon-withrating, +.starIcon, +.cardOverlayButtonIcon, +.indicatorIcon, +.cardImageIcon { + --fill: 1; +} + +.dashboardFooter { + font-family: "Noto Sans", serif; + transition: transform 50ms; +} + +#myPreferencesMenuPage > div:after, +.dashboardFooter::after { + content: var(--elegantFinFooterText); + font-size: 0.8em; + color: var(--borderColor); + display: inline-grid; + width: 100%; + width: -webkit-fill-available; + justify-content: center; + font-weight: 600; +} + +::selection { + background: var(--accentHoverColor); +} + +.cardImageIcon { + color: var(--borderColor); +} + +.cardPadder .cardImageIcon { + color: var(--selectorBackgroundColorAlpha); +} + +.card:focus .cardBox.visualCardBox, +.card:focus .cardBox:not(.visualCardBox) .cardScalable { + border-color: var(--fullContrastColor) !important; +} + +.mdl-radio__focus-circle, +.mdl-radio.show-focus .mdl-radio__button:focus + .mdl-radio__circles .mdl-radio__outer-circle, +.mdl-radio.show-focus .mdl-radio__button:focus + .mdl-radio__circles .mdl-radio__inner-circle { + background: var(--accentColor); + color: var(--accentColor); +} + +.emby-button { + gap: 1ch; +} + +.emby-button.show-focus:focus, +.paper-icon-button-light.show-focus:focus, +.emby-tabs .emby-button.show-focus:focus { + background-color: var(--highlightOutlineColor) !important; + color: var(--fullContrastColor) !important; +} + +.emby-tabs .emby-button.show-focus:focus { + outline: none !important; +} + +[dir="ltr"] .itemsContainer > .card > .cardBox { + margin-left: auto; + margin-right: auto; +} + +.cardBox-bottompadded { + margin-bottom: 0.5em !important; +} + +@media (max-width: 50em) { + .cardBox-bottompadded { + margin-bottom: 0.25em !important; + } +} + +.vertical-wrap:not(.centered), +.vertical-wrap.padded-right-withalphapicker, +.padded-right-withalphapicker > .vertical-wrap { + justify-content: flex-start !important; +} + +#episodesTab > .vertical-wrap, +#studiosTab > .vertical-wrap, +#channelsTab > .vertical-wrap, +#recordingsTab > .vertical-wrap, +#genresTab > .vertical-wrap { + justify-content: center !important; +} + +.countIndicator, +.fullSyncIndicator, +.mediaSourceIndicator { + background: rgb(31, 80, 189); + border: var(--defaultLighterBorder); + color: #fff; +} + +.layout-mobile .indicator { + font-size: 70%; +} + +.cardScalable { + border-radius: var(--largeRadius); + border: var(--darkerBorderColor) solid var(--borderWidthDouble) !important; + overflow: hidden !important; + box-shadow: var(--cardShadow); + transition: transform 125ms; +} + +@supports (aspect-ratio: 1 / 1) { + #castCollapsible .cardScalable, + #guestCastContent .cardScalable { + aspect-ratio: 1 / 1; + border-radius: 50%; + } +} + +#castCollapsible .cardContent.cardImageContainer, +#guestCastContent .cardContent.cardImageContainer { + background-position-y: 33%; +} + +.layout-mobile .cardScalable { + border: var(--defaultBorder) !important; +} + +.visualCardBox, +.paperList { + background-color: var(--headerColor) !important; + border-radius: var(--largeRadius) !important; + border: var(--defaultBorder) !important; + box-shadow: unset !important; + overflow: hidden; +} + +.layout-desktop .visualCardBox { + border-width: var(--borderWidthDouble) !important; +} + +.visualCardBox .cardScalable { + border-width: 0 0 var(--borderWidth) 0 !important; + border-radius: 0 !important; + border-color: var(--darkerBorderColor) !important; +} + +.cardImageContainer { + transition: transform 0.375s; +} + +.card.squareCard[data-type="TvChannel"] .cardImageContainer.cardContent { + background-color: rgba(255, 255, 255, 0.2); +} + +.cardImageContainer > .cardDefaultText { + font-size: 2em; + padding-top: 1.5em; + color: transparent; + white-space: pre; +} + +.cardImageContainer > .cardDefaultText::before { + content: "?\A"; + color: var(--borderColor); +} + +.card-hoverable:hover .cardScalable, +.card-hoverable:hover .visualCardBox { + border-color: var(--cardHoverBorderColor) !important; +} + +.card-hoverable:hover .visualCardBox .cardScalable { + border-color: var(--darkerBorderColor) !important; +} + +.card-hoverable:hover .cardImageContainer { + transform: scale(1.025); +} + +.card-hoverable .itemSelectionPanel { + transition: transform 0.125s; +} + +.card-hoverable:hover .cardScalable, +.card-hoverable:hover .itemSelectionPanel { + transform: scale(1.02); +} + +.card-hoverable .cardScalable:active { + transition: transform 0.075s; + transform: scale(1); +} + +.cardScalable:has(.cardOverlayButton-hover:hover) > .cardImageContainer { + transform: scale(1); +} + +.cardOverlayContainer { + transition: 0.5s; + background: rgba(255, 255, 255, 0.05); +} + +.cardOverlayContainer:after { + content: var(--cardHoverEffect); + transition: 0.65s; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + transform: translateY(-100%) translateX(0); + background: var(--hoverGradientV); +} + +.card-hoverable:hover .cardOverlayContainer:after { + transform: translateY(100%) translateX(0); +} + +.backdropCard.card-hoverable .cardOverlayContainer:after, +.overflowBackdropCard.card-hoverable .cardOverlayContainer:after { + transform: translateY(0) translateX(-100%); + background: var(--hoverGradientH); +} + +.backdropCard.card-hoverable:hover .cardOverlayContainer:after, +.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after { + transform: translateY(0) translateX(100%); +} + +.cardBox:not(.visualCardBox) .cardPadder { + background-color: var(--lighterGradientPoint); + box-shadow: none; +} + +.cardOverlayContainer > .cardOverlayFab-primary { + margin-left: unset; + margin-top: unset; + top: unset; + left: calc(var(--overlayPlayButtonPosition) - 1.5em); + bottom: calc(var(--overlayPlayButtonPosition) - 1.5em); +} + +.cardOverlayContainer > .cardOverlayFab-primary, +.listItemImageButton, +.layout-mobile .cardOverlayButton-br:not([data-action="menu"]) > .cardOverlayButtonIcon { + background-color: var(--btnMiniPlayColor) !important; + color: #fff !important; + border: var(--defaultLighterBorder); + border-color: var(--btnMiniPlayBorderColor); + font-size: 75%; + z-index: 2; +} + +.cardOverlayContainer > .cardOverlayFab-primary:hover, +.listItemImageButton:hover { + color: #fff; +} + +[dir="ltr"] .layout-desktop .cardOverlayButton-br, +.layout-desktop .cardOverlayButton-br { + bottom: 1.2em; + right: 0.7em; + z-index: 1; + font-size: 0.8em; +} + +.layout-desktop .cardOverlayButton-br > button { + color: #fff; + display: var(--extraCardButtonsVisibility); + text-shadow: var(--iconShadow); +} + +.cardOverlayButton-br .cardOverlayButton-hover[data-action="menu"], +.layout-desktop .listItemButton[data-action="menu"] { + display: var(--menuButtonVisibility); +} + +.layout-mobile .cardOverlayButton { + padding: 1em; + font-size: 60%; +} + +.layout-mobile .cardOverlayButton-br, +[dir="ltr"] .layout-mobile .cardOverlayButton-br { + /* bottom: 0.25em; + right: 0.25em; */ + display: var(--miniOverlayButtonVisibility); +} + +.layout-mobile .portraitCard .cardOverlayButton-br:not([data-action="menu"]), +.layout-mobile .backdropCard .cardOverlayButton-br:not([data-action="menu"]) { + display: none; +} + +.layout-mobile .cardOverlayButton-br[data-action="menu"] > .cardOverlayButtonIcon { + background-color: transparent !important; + border: none; + text-shadow: var(--iconShadow); + color: #fff; +} + +.cardOverlayContainer:has(> button:hover) { + backdrop-filter: var(--blurDefault); +} + +.listViewUserDataButtons { + font-size: small; +} + +.layout-mobile .listViewUserDataButtons { + flex-direction: column; + font-size: x-small; +} + +/* episode grid start */ +@supports (display: revert) { + .layout-desktop .vertical-list:has(.listItem-largeImage) { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(min(var(--minEpisodeCardWidth), 100%), 1fr)); + gap: var(--itemColumnGap); + } + + .layout-desktop .listItem-largeImage { + display: grid; + margin-bottom: 0 !important; + } + + .layout-desktop .listItem-largeImage > .listItem-content { + display: grid; + grid-template-columns: 1fr 1fr 2em; + order: 1; + height: 100%; + align-items: start; + } + + .layout-desktop .listItem-largeImage > .listItem-bottomoverview { + order: 2; + } + + .layout-desktop .listItem-largeImage .listItemImage-large { + order: 1; + grid-column: 1 / -1; + height: max-content; + min-height: 15em; + width: 100%; + aspect-ratio: 16 / 9; + box-sizing: border-box; + } + + .layout-desktop .listItem-largeImage .listItemBody { + order: 2; + grid-column: 1 / 3; + padding: 1em 0.125em; + } + + .layout-desktop .listItem-largeImage .listViewUserDataButtons { + flex-direction: column; + font-size: small; + order: 2; + grid-column: 3; + align-self: center; + } +} +/* episode grid end */ + +.portraitCard { + min-width: 5em; +} + +.bannerCard { + --cardCount: 2; +} + +/* if the window width is equal to or more than (at minimum) 300em then the code in the query will trigger */ +/* 16 posters, 12 thumbs */ +@media (min-width: 300em) { + .portraitCard, + .squareCard { + --cardCount: 16; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 15; + } + + .squareCard:has(.cardFooter) { + --cardCount: 12; + } + + .backdropCard { + --cardCount: 12; + } + + .overflowBackdropCard { + --cardCount: 11; + } +} + +/* if the window width is equal to or less than (at maximum) 300em then the code in the query will trigger */ +/* 15 posters, 11 thumbs */ +@media (max-width: 300em) { + .portraitCard, + .squareCard { + --cardCount: 15; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 14; + } + + .squareCard:has(.cardFooter) { + --cardCount: 11; + } + + .backdropCard { + --cardCount: 11; + } + + .overflowBackdropCard { + --cardCount: 10; + } +} + +/* 14 posters, 10 thumbs */ +@media (max-width: 270em) { + .portraitCard, + .squareCard { + --cardCount: 14; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 13; + } + + .squareCard:has(.cardFooter) { + --cardCount: 10; + } + + .backdropCard { + --cardCount: 10; + } + + .overflowBackdropCard { + --cardCount: 9; + } +} + +/* 13 posters, 10 thumbs */ +@media (max-width: 240em) { + .portraitCard, + .squareCard { + --cardCount: 13; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 12; + } + + .squareCard:has(.cardFooter) { + --cardCount: 10; + } + + .backdropCard { + --cardCount: 10; + } + + .overflowBackdropCard { + --cardCount: 9; + } +} + +/* 12 posters, 9 thumbs, 2160p*/ +@media (max-width: 220em) { + .portraitCard, + .squareCard { + --cardCount: 12; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 11; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 7; + } +} + +/* 11 posters, 9 thumbs */ +@media (max-width: 200em) { + .portraitCard, + .squareCard { + --cardCount: 11; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 10; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + /* .backdropCard, + .overflowBackdropCard { + --cardCount: 7; + } */ +} + +/* 10 posters, 8 thumbs, 1440p */ +@media (max-width: 170em) { + .portraitCard, + .squareCard { + --cardCount: 10; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 9; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 6; + } +} + +/* 9 posters, 7 thumbs */ +@media (max-width: 140em) { + .portraitCard, + .squareCard { + --cardCount: 9; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 8; + } + + .squareCard:has(.cardFooter) { + --cardCount: 7; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 5; + } +} + +/* 8 posters, 7 thumbs, 1080p */ +@media (max-width: 120em) { + .portraitCard, + .squareCard { + --cardCount: 8; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 7; + } + + .squareCard:has(.cardFooter) { + --cardCount: 6; + } + + .backdropCard, + .layout-tv .portraitCard, + .layout-tv .squareCard, + .layout-tv .overflowPortraitCard, + .layout-tv .overflowSquareCard, + .overflowBackdropCard { + --cardCount: 5; + } + + .layout-tv .backdropCard, + .layout-tv .overflowBackdropCard { + --cardCount: 3; + } +} + +/* 7 posters, 6 thumbs */ +@media (max-width: 100em) { + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 7; + } + + .squareCard:has(.cardFooter) { + --cardCount: 6; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 4; + } +} + +/* 6 posters, 5 thumbs */ +@media (max-width: 80em) { + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 6; + } + + .squareCard:has(.cardFooter) { + --cardCount: 5; + } + + .overflowBackdropCard, + .backdropCard { + --cardCount: 4; + } +} + +/* 5 posters, 4 thumbs */ +@media (max-width: 62em) { + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 5; + } + + .squareCard:has(.cardFooter) { + --cardCount: 4; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 4; + } +} + +/* 4 posters, 3 thumbs */ +@media (max-width: 48.125em) { + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 4; + } + + .squareCard:has(.cardFooter) { + --cardCount: 3; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 3; + } +} + +/* 3 posters, 2 thumbs, 2 with footer */ +@media (max-width: 30em) { + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard, + .layout-mobile .portraitCard, + .layout-mobile .squareCard, + .layout-mobile .overflowPortraitCard, + .layout-mobile .overflowSquareCard { + --cardCount: 3; + } + + .squareCard:has(.cardFooter) { + --cardCount: 2; + } + + .backdropCard, + .overflowBackdropCard { + --cardCount: 2; + } +} + +.cardBox { + margin-top: 0; +} + +.card { + --padding: 0.375em; + --effectiveWidth: calc(((100vw - (var(--padding) * 2)) - (var(--sidePadding) * 2))); + --cardWidth: calc(var(--effectiveWidth) / var(--cardCount) - var(--itemColumnGap)); + width: var(--cardWidth) !important; + padding: var(--padding); + transition: width 0.5s; + box-sizing: content-box; +} + +/* this makes the cards bigger and center aligned on older browsers */ +@supports (aspect-ratio: 1 / 1) { + .card { + box-sizing: border-box; + } +} + +.layout-mobile .card { + --padding: 1px; + scroll-snap-align: center; + scroll-snap-stop: always; +} + +/* this makes the card sizes smaller when phone is in landscape mode */ +@media (orientation: landscape) and (max-height: 40em) { + .layout-mobile .card { + --effectiveWidth: calc((65vw - (var(--sidePadding) * 2))); + } +} + +#homeTab .overflowBackdropCard[data-positionticks], +.nextUpItems > .card, +#resumableItems > .card { + width: calc(var(--cardWidth) * var(--resumeCardScale)) !important; +} + +.card .cardTextCentered { + /* text-align-last: left; */ + text-shadow: var(--shadow); +} + +.detailPageWrapperContainer { + padding-top: unset; + margin-top: unset; +} + +.layout-desktop .detailPageWrapperContainer { + min-height: 46vh; + background: linear-gradient(180deg, transparent, 17vh, var(--darkerGradientPointAlpha) 50vh); +} + +.layout-tv .detailPageWrapperContainer { + padding-left: 30vw; + min-height: 46vh; + background: linear-gradient(0deg, var(--darkerGradientPointAlpha) 70%, 85%, transparent); +} + +.detailPagePrimaryContainer { + align-content: space-between; + align-items: stretch; + justify-content: end; + flex-direction: column; + /* center content on desktop */ + align-items: center; + /* this aligns the plot to left on 10.11.0 */ + text-align: left; + /* temporarily disabled for 10.11.0 */ + /* margin-bottom: -1.5em; */ +} + +/* this disables block padding on pre-10.11.0 */ +.layout-mobile .detailPagePrimaryContainer.detailRibbon, +/* this disables block padding on 10.11.0 */ +.layout-mobile .detailPagePrimaryContainer>.detailRibbon { + padding: 0 var(--sidePadding); +} + +/* [dir=ltr] .detailPagePrimaryContent { + padding-right: 0; +} */ + +.layout-desktop .detailPagePrimaryContainer { + background: transparent; +} + +.layout-desktop .detailPageSecondaryContainer { + background-color: transparent; +} + +/* this removes the extra large left padding on 10.11.0 */ +.detailPagePrimaryContainer>.detailPagePrimaryContent, +[dir=ltr] .detailPagePrimaryContainer>.detailRibbon, +/* this removes the extra large left padding on pre-10.11.0 */ +[dir=ltr] .detailPagePrimaryContainer.detailRibbon { + padding-left: var(--sidePadding); +} + +.layout-mobile .detailPagePrimaryContent { + padding-left: var(--sidePadding) !important; + padding-right: var(--sidePadding) !important; +} + +/* this places main media buttons below the title on 10.11.0 */ +.layout-desktop [dir="ltr"] .detailRibbon, +.layout-tv [dir="ltr"] .detailRibbon { + flex-direction: column; +} + +.detailPagePrimaryContainer > .detailPagePrimaryContent { + padding-top: 0; +} + +.detailPageSecondaryContainer { + /* use !important for pre-10.11.0 compatibility */ + padding-top: 0 !important; +} + +/* this hides the header home button everywhere except the main media page */ +.skinHeader-withBackground:not(.semiTransparent) .headerHomeButton { + display: none; +} + +/* workaround to show the header home button on the main media page on phones*/ +.layout-mobile:has(#itemDetailPage:not(.hide)) .headerHomeButton { + display: block; +} + +.pageTitle { + height: 1.5em; +} + +.headerLeft .pageTitle { + display: -webkit-box; + -webkit-line-clamp: 1; + -webkit-box-orient: vertical; + overflow: hidden; +} + +.paper-icon-button-light { + transition: none; +} + +.paper-icon-button-light > .material-icons { + font-size: 1.25em; +} + +#itemDetailPage .emby-scroller-container, +#itemDetailPage .emby-scroller, +#itemDetailPage .scrollX { + margin: 0 calc(-1 * var(--sidePadding)); + padding-left: var(--sidePadding); + /* mask-image: linear-gradient(90deg, transparent, #fff var(--sidePadding), #fff calc(100vw - var(--sidePadding)), transparent); */ +} + +.layout-desktop .emby-scroller-container, +.layout-desktop .emby-scroller, +.layout-desktop .scrollX { + --itemColumnGap: 0.5em; +} + +.emby-scroller, +.scrollX { + padding-left: var(--sidePadding); + scroll-snap-type: x proximity; + scroll-padding-inline: var(--sidePadding); +} + +.sectionTabs .scrollX { + padding-left: 0; +} + +.itemsContainer:not(.editorsChoiceItemsContainer, .vertical-list) { + column-gap: var(--itemColumnGap); + row-gap: 1em; +} + +/* this is a workaround to add a gap between the last child and the edge of the screen on phones */ +.layout-mobile .itemsContainer:not(.editorsChoiceItemsContainer, .vertical-wrap, .vertical-list)::after { + content: "13"; + color: transparent; +} + +.sectionTitle { + font-size: 1.5rem !important; +} + +.layout-mobile .sectionTitle { + font-size: 1.35rem !important; +} + +[dir="ltr"] .emby-scrollbuttons, +.emby-scrollbuttons { + padding-top: 0; +} + +.emby-scrollbuttons-button.paper-icon-button-light > .material-icons { + font-size: 1.5em; + place-content: center; +} + +.detailRibbon { + background-color: transparent; +} + +.mediaInfoItem { + border-radius: var(--smallRadius); + font-weight: 500; + padding-top: 0; + padding-bottom: 0; +} + +.itemMiscInfo-primary { + column-gap: 0.5em; +} + +.mediaInfoOfficialRating { + background: transparent !important; + font-size: 0.75em; + font-family: "Noto Sans", sans-serif; + line-height: 1.5em; + transform: translateY(-0.15em); + font-weight: 600; + border: var(--defaultBorder); + color: var(--textColor); +} + +.starIcon { + --tmdb: linear-gradient(to right, #90cea1, #01b4e4); + --imdb: linear-gradient(to right, #f2db83, #dba506); + --colors: var(--tmdb); + background: var(--colors); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + margin-left: -0.125em; + transform: translateY(-0.02em); +} + +[dir="ltr"] .mediaInfoCriticRating { + background-size: 30%; + padding-left: 1.5em; +} + +[dir="ltr"] .mediaInfoCriticRating::after { + content: "%"; +} + +@media (max-width: 31.25em) { + .itemMiscInfo .endsAt { + display: var(--endsAtVisibility); + } + + .mediaInfoCriticRating { + display: var(--criticsRatingVisibility); + } +} + +.detailRibbon:has(.portraitCard .folder) { + min-height: 32vh; + align-content: flex-end; +} + +.layout-desktop .detailRibbon:has(.person) { + min-height: 15vh; + align-content: flex-end; +} + +.layout-desktop .detailRibbon { + height: 100%; + min-height: 25vh; + margin-top: unset; +} + +@keyframes animMoveDown { + from { + transform: translateY(-2em); + opacity: 0; + } + + to { + transform: translateY(0); + opacity: 1; + } +} + +@keyframes animMoveDownSecondaryPage { + from { + transform: translateY(-2em); + opacity: 0; + } + + to { + transform: translateY(0); + opacity: 0.3; + } +} + +@keyframes animMoveUp { + from { + transform: translateY(-90%); + opacity: 0; + } + + to { + transform: translateY(-100%); + opacity: 1; + } +} + +body:not(.hide-scroll) > .videoPlayerContainer { + position: relative !important; + -webkit-mask: var(--headerBlurMask); + mask: var(--headerBlurMask); + height: 80vh; +} + +.layout-mobile body:not(.hide-scroll) > .videoPlayerContainer { + height: 40vh; + z-index: 1; +} + +.layout-desktop > body:not(.hide-scroll) > .videoPlayerContainer ~ #reactRoot > .backgroundContainer.withBackdrop { + opacity: 0.25; +} + +.itemBackdrop { + display: block !important; +} + +.layout-desktop .itemBackdrop { + height: calc(100vh - 27vh - var(--primaryItemPageNegativeSpace)); +} + +.layout-mobile .itemBackdrop { + margin-top: 0 !important; + position: sticky; + top: -30%; + -webkit-mask: var(--itemBackdropMask); + mask: var(--itemBackdropMask); + animation: animMoveDown 0.5s ease-out forwards; + height: 45vh; +} + +.layout-tv .itemBackdrop { + height: 33vh; +} + +#itemDetailPage:has(.subtitle) .itemBackdrop, +#itemDetailPage:has(.musicParentName) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .person) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .queue) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .book) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .live_tv) .itemBackdrop { + height: calc(100vh - 27vh - var(--secondaryItemPageNegativeSpace)); +} + +#itemDetailPage:has(.detailImageContainer .cardPadder-square > .person) .itemBackdrop { + height: calc(100vh - 4vh - var(--secondaryItemPageNegativeSpace)); +} + +.detailLogo { + display: var(--clearLogoVisibility); + top: calc(100vh - var(--clearLogoBottomSpace) - var(--primaryItemPageNegativeSpace)); + left: 0; + width: 40%; + transform: translateY(-100%); + margin: auto 30%; + height: 25vh; + filter: var(--clearLogoFilter); + background-position: bottom; +} + +.layout-mobile .detailLogo { + display: var(--clearLogoVisibility); + z-index: 1; + position: absolute; + left: 1em; + top: 45vh; + margin: auto 0%; + width: calc(100vw - 2em); + max-height: 17vh; + animation: animMoveUp 1s ease-out forwards; +} + +.layout-tv .detailLogo { + display: var(--clearLogoVisibility); + height: 20vh; + top: 39vh; + left: 30vw; + width: 60vw; + margin: auto 5vw; +} + +#itemDetailPage:has(.subtitle) .detailLogo { + top: calc(100vh - 6em - var(--secondaryItemPageNegativeSpace)); +} + +.layout-desktop #itemDetailPage:has(.detailImageContainer .person) .detailLogo { + top: calc(100vh - var(--secondaryItemPageNegativeSpace)); +} + +.layout-mobile #itemDetailPage:has(.subtitle) .detailLogo { + top: calc(100vh - 11em - var(--secondaryItemPageNegativeSpace)); +} + +.layout-desktop .detailImageContainer .card { + position: relative !important; + width: 22vh !important; + float: none; + left: 0 !important; + top: 0; + right: 0; + margin: auto; + margin-bottom: 0; + place-self: center; +} + +.detailImageContainer .card.backdropCard { + width: 40vh !important; + max-width: 50vw; +} + +.detailImageContainer .card { + display: none; +} + +.layout-tv .detailImageContainer .card { + width: 25vw !important; + display: block !important; + position: fixed !important; + top: 0; + bottom: 0; + margin: auto; + left: var(--sidePadding); + align-content: center; + transform: none; +} + +.layout-mobile .detailImageContainer .card { + filter: drop-shadow(0 0 0.25rem rgba(0, 0, 0, 0.25)); +} + +/* this brings the buttons and title to the center in main media page */ +.layout-mobile [dir="ltr"] .infoWrapper, +.layout-mobile .infoWrapper { + padding-left: 0; +} + +.infoWrapper { + align-content: end; + place-items: center; + display: grid; + /* this centers the title and other text on 10.11.0 */ + text-align: center; + color: var(--textColor); +} + +/* Both the blocks below position the poster in main media page in the center */ +.layout-mobile .detailImageContainer { + display: flex; + align-items: flex-end; + justify-content: center; + padding-left: 0 !important; +} + +.layout-mobile .detailImageContainer:has(.card:not(.portraitCard)) { + height: 0; +} + +.layout-mobile .detailImageContainer .card { + position: inherit !important; + margin-top: -150%; + max-width: 60vw; +} + +.layout-mobile .detailPageWrapperContainer { + padding-top: 0; + margin-top: 0.5em; +} + +/* this hides the detail logo when media card is visible */ +#itemDetailPage:has(.detailImageContainer .backdropCard) .detailLogo, +#itemDetailPage:has(.detailImageContainer .album) .detailLogo { + z-index: 2; + display: none; +} + +#itemDetailPage:has(.detailImageContainer .person) .detailLogo { + z-index: 2; + display: var(--artistClearLogoVisibility); +} + +/* this hides the main media title when the clear logo is available*/ +.detailLogo:not(.hide) ~ .detailPageWrapperContainer .nameContainer h1 { + z-index: 2; + display: var(--itemTitleVisibility); +} + +.detailImageContainer:has(.squareCard .person) ~ .nameContainer h1 { + display: var(--artistTitleVisibility); +} + +/* this shows the main media title and the poster when the clear logo is unavailable*/ +.detailLogo.hide ~ .detailPageWrapperContainer .nameContainer h1 { + display: block !important; +} + +.detailImageContainer:has(.backdropCard) ~ .nameContainer h1, +.detailImageContainer:has(.album) ~ .nameContainer h1 { + display: block !important; +} + +.detailImageContainer .card.backdropCard:has(.cardImageIcon.album) { + max-width: 20vh; +} + +.detailImageContainer .card.backdropCard:has(.cardImageIcon.album) .cardScalable { + aspect-ratio: 1 / 1; +} + +#childrenContent:has(.listItem[data-type="Audio"]), +.programGuideSection { + border: var(--defaultBorder); + border-radius: var(--largeRadius); + padding: 0.5em; + background-color: var(--lighterGradientPointAlpha); +} + +/* this shows the poster in the cast, book, live tv and other pages */ +.detailImageContainer > .backdropCard, +.detailImageContainer > .squareCard, +.detailImageContainer > .card:has(.book), +.detailImageContainer > .card:has(.person), +.detailImageContainer > .card:has(.album), +.detailImageContainer > .card:has(.queue), +.detailImageContainer > .card:has(.live_tv) { + display: block; +} + +/* this hides artist's poster */ +.detailImageContainer .squareCard:has(.person) { + display: none; +} + +#itemDetailPage:has(.subtitle), +#itemDetailPage:has(.musicParentName) { + background: var(--backgroundAlphaOverlay); +} + +#itemDetailPage:has(.detailImageContainer .cardPadder-square > .person) { + background: var(--artistPageBackground, var(--backgroundAlphaOverlay)); +} + +.layout-mobile #itemDetailPage:has(.detailImageContainer .backdropCard) .itemBackdrop, +.layout-mobile #itemDetailPage:has(.subtitle) .itemBackdrop, +.layout-mobile #itemDetailPage:has(.musicParentName) .itemBackdrop { + animation: animMoveDownSecondaryPage 0.5s ease-out forwards; +} + +.layout-mobile .cardImageIcon { + font-size: 3.5em; +} + +.homeLibraryButton { + width: min(45%, 12rem); + min-width: 15%; + margin: 0 !important; +} + +@media (max-width: 50em) { + .homeLibraryButton { + width: 47.6% !important; + } +} + +@media (orientation: portrait) and (max-width: 40em) { + [data-type="Movie"] .listItemImage, + [data-type="Series"] .listItemImage { + display: unset; + } + + .dashboardActionsContainer { + font-size: min(3.6vw, 98%); + } +} + +@media (orientation: portrait) { + /* hides sync button on home screen on phones only in portrait mode */ + .layout-mobile .skinHeader.noHomeButtonHeader .headerSyncButton { + display: none; + } + + .layout-mobile .btnPlay.detailButton:not(.play-button) { + flex: 0 0 100%; + margin-right: 0 !important; + } +} + +h2 { + font-size: 1.25em; +} + +h1, +h2 { + font-weight: 600; +} + +.tagline { + font-size: 1.3em; + font-weight: 400; + margin: 0; + font-style: italic; + color: var(--textColor); +} + +html, +.nowPlayingPlaylist, +.nowPlayingContextMenu, +.backgroundContainer:not(.withBackdrop), +.backgroundContainer:not(.backgroundContainer-transparent), +.backdropContainer { + background-color: var(--darkerGradientPoint); + background: var(--backgroundGradient); +} + +.backdropImage { + background-position-y: clamp(0%, calc(var(--backdropTrimFromTop) * 5), 100%); +} + +.backdropImage:after, +.backdropImage:before { + content: ""; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + background: inherit; +} + +.backdropImage:after { + z-index: 0; + height: 80vh; + -webkit-mask: linear-gradient(180deg, rgba(0, 0, 0, 1) 75%, transparent); + mask: linear-gradient(180deg, rgba(0, 0, 0, 1) 75%, transparent); +} + +.layout-desktop .backdropImage:after { + transition: opacity 0.25s; +} + +.backdropImage:before { + transform: scale(1.1); + filter: var(--blurLargest); +} + +.backgroundContainer.withBackdrop { + opacity: 0.9; + background: linear-gradient(0deg, var(--darkerGradientPoint), 45%, rgba(17, 24, 39, 0.25)); +} + +.layout-tv .backgroundContainer.withBackdrop { + background: linear-gradient(0deg, var(--darkerGradientPoint), 45%, rgba(17, 24, 39, 0.95)); +} + +.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop { + opacity: 0.9; +} + +.layout-mobile .backgroundContainer.withBackdrop { + opacity: 1; + background: var(--darkerGradientPoint); +} + +.withSectionTabs .backgroundContainer.withBackdrop { + background: var(--darkerGradientPoint); +} + +.layout-desktop .withSectionTabs .backdropImage:after { + opacity: 0; +} + +.layout-mobile .withSectionTabs .backdropImage:after { + display: none; +} + +@keyframes animScaleUp { + from { + transform: translateY(-2.5%); + opacity: 0; + } + + to { + transform: translateY(0%); + opacity: 1; + } +} + +.backdropImageFadeIn { + transform-origin: bottom center; + animation: animScaleUp 0.5s ease-out forwards; +} + +.appfooter { + background-color: var(--headerColor) !important; + backdrop-filter: var(--blurLargest) !important; + color: var(--textColor); +} + +.lyricPage { + padding: 0 var(--sidePadding); +} + +.lyricsLine { + font-size: 2em; + color: var(--textColor); + text-align: center; + align-self: center; + font-weight: 600; + transition: transform 0.125s; +} + +.pastLyric, +.futureLyric { + transform: scale(0.85); + font-weight: 400; + text-align: center; +} + +.pastLyric { + opacity: 0.45; +} + +.buttonActive { + color: var(--accentColor) !important; +} + +#divRunningTasks progress { + width: calc(100% - 7em); +} + +.listItemImage .itemProgressBar { + position: absolute; + margin: 8%; +} + +.layout-mobile .listItemImage .itemProgressBar { + position: absolute; + justify-self: center; + margin-bottom: 5%; +} + +.itemProgressBar:not(.backgroundProgress):not(.playbackProgress):not(.transcodingProgress) { + backdrop-filter: var(--blurLarge); + background-color: var(--osdSeekBarBufferedColorAlpha) !important; + height: 0.35em; + overflow: hidden; + border-radius: var(--largeRadius); +} + +.layout-mobile .itemProgressBar:not(.backgroundProgress, .playbackProgress, .transcodingProgress) { + width: calc(100% - 2em); +} + +.layout-mobile .backdropCard .itemProgressBar:not(.backgroundProgress, .playbackProgress, .transcodingProgress), +.layout-mobile .portraitCard .itemProgressBar:not(.backgroundProgress, .playbackProgress, .transcodingProgress) { + width: 100%; + width: -webkit-fill-available; +} + +.itemProgressBarForeground { + border-radius: 0 var(--largeRadius) var(--largeRadius) 0; + background-color: var(--cardResumeProgressColor); + opacity: 0.75; +} + +.backgroundProgress > div, +.backgroundProgress { + background-color: var(--darkerGradientPoint); +} + +.playbackProgress > div { + background-color: var(--accentColor); +} + +::-moz-progress-bar { + background: var(--accentColor) !important; + /* border-radius: var(--smallRadius) 0 var(--smallRadius) 0; */ +} + +::-webkit-progress-value { + background: var(--accentColor) !important; + /* border-radius: var(--smallRadius) 0 var(--smallRadius) 0; */ +} + +progress, +::-webkit-progress-bar { + background: var(--darkerGradientPoint) !important; + border: var(--defaultBorder) !important; + border-radius: var(--smallRadius); + overflow: hidden; +} + +progress + span { + color: var(--accentColor) !important; +} + +.mdl-spinner__circle { + border-color: var(--textColor); + border-style: inset; + border-width: 0.25em; +} + +.sliderContainer { + --thumb: 0.4em; +} + +.mdl-slider-container { + height: 1em; +} + +.mdl-slider { + height: unset; +} + +.mdl-slider-background-flex-container { + padding: 0 calc(var(--thumb) / 2); +} + +.sliderBubbleTrack { + margin: 0 calc(var(--thumb) / 2); +} + +.sliderBubbleText { + font-size: 1.5em; +} + +/* this is the osd player slider */ +.mdl-slider-background-flex { + border-radius: var(--thumb); + height: var(--thumb); + margin-top: calc(var(--thumb) / -2); + background: var(--osdSeekBarBufferedColorAlpha); + transition: 0.2s linear; +} + +.sliderContainer:active .mdl-slider-background-flex { + --h: calc(var(--thumb) * 1.5); + height: var(--h); + border-radius: var(--h); + margin-top: calc(var(--h) / -2); +} + +.mdl-slider-background-lower { + background-color: var(--osdSeekBarPlayedColor); +} + +.mdl-slider-background-upper { + background-color: var(--osdSeekBarBufferedColorAlpha); +} + +.mdl-slider::-webkit-slider-thumb { + background: var(--osdSeekBarThumbColor); + width: var(--thumb) !important; + height: var(--thumb) !important; + border-radius: var(--thumb); + transition: 0.2s linear; +} + +.mdl-slider:hover::-webkit-slider-thumb, +.layout-mobile .mdl-slider::-webkit-slider-thumb, +.mdl-slider.show-focus:focus::-webkit-slider-thumb { + width: calc(var(--thumb) * 1.25) !important; + height: calc(var(--thumb) * 5) !important; + border-radius: var(--thumb); + transform: scale(0.5); +} + +/* These Firefox thumb styles are separate because combining them breaks the effect on chrome */ +.mdl-slider::-moz-range-thumb { + background: var(--osdSeekBarThumbColor); + width: var(--thumb) !important; + height: var(--thumb) !important; + border-radius: var(--thumb); + transition: 0.2s linear; +} + +.mdl-slider:hover::-moz-range-thumb, +.mdl-slider.show-focus:focus::-moz-range-thumb { + width: calc(var(--thumb) * 1.25) !important; + height: calc(var(--thumb) * 5) !important; + border-radius: var(--thumb); + transform: scale(0.5); +} + +.sliderMarkerContainer { + margin: 0 0.1em; +} + +.sliderMarker.watched { + background-color: var(--osdSeekBarPlayedColor); +} + +.sliderMarker { + height: 4px; + border-radius: 2px; +} + +.iconOsdProgressInner { + background: var(--osdSeekBarPlayedColor); +} + +.selectLabel { + max-height: 2em; + color: var(--textColor); +} + +.inputLabelUnfocused { + color: var(--textColor); +} + +.inputLabelFocused { + color: var(--fullContrastColor); +} + +.button-link { + color: var(--dimTextColor); +} + +.button-link:hover { + color: unset !important; + text-decoration: none; +} + +.button-link:active { + color: var(--fullContrastColor) !important; + text-decoration: none; +} + +.mainDrawer, +.drawer-open { + background-color: var(--drawerColor); + border-right: var(--defaultBorder); + backdrop-filter: var(--blurLarge); +} + +.mainDrawer-scrollContainer { + padding-bottom: 5vh; +} + +.mainDrawer-scrollContainer > div:first-child { + margin-bottom: 1em; +} + +.btnHeaderSave.button-flat { + color: var(--accentColor) !important; + gap: 0.3em; + border-radius: var(--smallRadius); +} + +.button-flat:hover { + color: unset; +} + +.button-flat:active { + color: unset; + background-color: rgba(255, 255, 255, 0.2); +} + +.playstatebutton-icon-played { + color: rgb(34, 197, 94); +} + +.videoOsdBottom.videoOsdBottom-maincontrols .btnPause { + font-size: 2em; +} + +.osdControls { + display: flex; + flex-direction: column-reverse; +} + +.itemExternalLinks { + color: transparent; +} + +.itemExternalLinks > .button-link { + color: var(--textColor); + background-color: var(--selectorBackgroundColor); + padding: 0.125em 0.5em; + border-radius: var(--smallerRadius); + margin-bottom: 0.5em; +} + +.layout-mobile .itemExternalLinks > .button-link:hover:not(:active) { + color: var(--textColor) !important; +} + +.layout-desktop .itemExternalLinks > a:hover, +.itemExternalLinks > a:active { + background-color: var(--accentColor) !important; + color: #fff !important; +} + +.layout-desktop .itemExternalLinks > a[href*="themoviedb.org"]:hover, +.itemExternalLinks > a[href*="themoviedb.org"]:active { + background-color: #1ab7d8 !important; + color: #000 !important; +} + +.layout-desktop .itemExternalLinks > a[href*="imdb.com"]:hover, +.itemExternalLinks > a[href*="imdb.com"]:active { + background-color: #e2b616 !important; + color: #000 !important; +} + +.layout-desktop .itemExternalLinks > a[href*="thetvdb.com"]:hover, +.itemExternalLinks > a[href*="thetvdb.com"]:active { + background-color: #6cd591 !important; + color: #000 !important; +} + +.layout-desktop .itemExternalLinks > a[href*="trakt.tv"]:hover, +.itemExternalLinks > a[href*="trakt.tv"]:active { + background-color: #ab3aad !important; + color: #fff !important; +} + +.layout-desktop .itemExternalLinks > a[href*="theaudiodb.com"]:hover, +.itemExternalLinks > a[href*="theaudiodb.com"]:active { + background-color: #6399cc !important; + color: rgb(15, 22, 28) !important; +} + +.layout-desktop .itemExternalLinks > a[href*="musicbrainz.org"]:hover, +.itemExternalLinks > a[href*="musicbrainz.org"]:active { + background-color: #ba478f !important; + color: #fff !important; +} + +/* Support for Jellyfin Enhanced (https://github.com/n00bcodr/Jellyfin-Enhanced) */ +.layout-desktop .itemExternalLinks > a[href*="letterboxd.com"]:hover, +.itemExternalLinks > a[href*="letterboxd.com"]:active { + background-color: #14181c !important; + color: #fff !important; +} + +.layout-desktop .itemExternalLinks > a[title*="Radarr"]:hover, +.itemExternalLinks > a[title*="Radarr"]:active { + background-color: #ffc230 !important; + color: #000 !important; +} + +.layout-desktop .itemExternalLinks > a[title*="Sonarr"]:hover, +.itemExternalLinks > a[title*="Sonarr"]:active { + background-color: #07bae9 !important; + color: #000 !important; +} + +.layout-desktop .itemExternalLinks > a[title*="Bazarr"]:hover, +.itemExternalLinks > a[title*="Bazarr"]:active { + background-color: var(--textColor) !important; + color: #000 !important; +} + +.itemTags, +.itemTags > a { + display: none; + font-size: unset !important; + font-weight: 200; +} + +.detail-clamp-text { + text-align: start; + color: var(--dimTextColor); + margin-top: 0; + margin-bottom: 0; +} + +.detail-clamp-text p { + margin-top: 0.25em; + margin-bottom: 0.25em; +} + +.layout-desktop .detail-clamp-text { + -webkit-line-clamp: 2; +} + +.layout-mobile .detail-clamp-text { + -webkit-line-clamp: 4; +} + +.layout-tv .detail-clamp-text { + -webkit-line-clamp: 10; + transition: none; +} + +.overview-expand.emby-button { + padding: 0; + margin-top: 1.4em; + margin-bottom: 1.4em; + color: transparent; +} + +.overview-expand.emby-button:after { + content: "keyboard_arrow_down"; + font-family: + var(--iconPack), + Material Icons; + font-feature-settings: "liga"; + background: var(--selectorBackgroundColor); + border-radius: 50%; + width: 1.5em; + height: 1.5em; + align-content: center; + line-height: 1.6ch; + transition: transform 0.5s; + color: var(--textColor); +} + +.overview.detail-clamp-text ~ .overview-controls .overview-expand:after { + transform: rotateZ(0deg); +} + +.overview:not(.detail-clamp-text) ~ .overview-controls .overview-expand:after { + transform: rotateZ(180deg); +} + +.overview-controls { + height: 0; +} + +.detailSectionContent:has(.itemExternalLinks.hide) .overview-controls { + height: 1em; +} + +#seriesAirTime { + margin-top: 0.5em; +} + +.itemMiscInfo { + align-items: flex-end !important; + justify-content: center; +} + +.innerCardFooter, +.chapterCardImageContainer { + width: 100%; + box-sizing: border-box; +} + +.innerCardFooter, +.chapterThumbTextContainer { + background: var(--cardFooterGradient); + text-shadow: var(--iconShadow); + padding: 0em 2em 2em 2em; + align-content: end; + display: grid; + height: 100%; +} + +.chapterCardImageContainer { + background-size: 135%; +} + +.chapterCardImageContainer + .innerCardFooter { + padding: 0em 1em 1em 1em; + height: auto; +} + +.layout-mobile .innerCardFooter { + padding: 5em 1em 1.25em 1em; +} + +.layout-mobile .chapterCardImageContainer + .innerCardFooter { + padding: 0em 0.5em 0.5em 0.5em; +} + +.centerMessage { + width: unset; +} + +.noItemsMessage { + width: 90%; +} + +.dialog { + backdrop-filter: var(--blurDefault); + background-color: var(--drawerColor); + min-width: 11em; +} + +[dir="ltr"] .emby-collapsible-button { + padding-left: 1em; +} + +.dialog:not(.dialog-fullscreen) { + border-radius: var(--largeRadius) !important; + border: var(--defaultBorder); +} + +@media (max-width: 80em), (max-height: 45em) { + .dialog.dialog-fixedSize, + .dialog.dialog-fullscreen-lowres { + border-radius: unset !important; + border: unset; + } + + /* body:has(.dialog.dialog-fixedSize.opened, + .dialog.dialog-fullscreen-lowres.opened) { + overflow: hidden; + } */ +} + +.dialogBackdropOpened { + opacity: 0.66; +} + +.subtitleEditor-dropZone, +.imageEditor-dropZone, +.lyricsEditor-dropZone { + border-radius: var(--largeRadius); +} + +.formDialogHeaderTitle { + margin-inline-start: 0 !important; + margin-inline-end: 0 !important; + text-align: center; + padding: 0 0.5em !important; +} + +.formDialogFooter:not(.formDialogFooter-clear.formDialogFooter-flex) > .formDialogFooterItem { + -webkit-flex-basis: 6em; + flex-basis: 6em; +} + +.collapseContent { + background-color: unset !important; + backdrop-filter: unset !important; +} + +.selectionCommandsPanel { + background: var(--lighterGradientPoint); + border-bottom: var(--defaultBorder); + backdrop-filter: var(--blurLarge); + height: 3.5em; + padding-top: max(env(safe-area-inset-top), var(--safe-area-inset-top)); +} + +.selectionCommandsPanel > h1 { + font-size: large; +} + +.itemSelectionPanel { + border: unset; + background-color: transparent; +} + +.emby-checkbox:checked + span + .checkboxOutline { + border-radius: var(--smallerRadius) !important; + background: transparent; + border-color: var(--fullContrastColor); + border-style: solid; + border-width: var(--borderWidthDouble); + outline: none; +} + +.emby-checkbox:checked + span + .multiSelectCheckboxOutline { + box-shadow: inset 0em 7em 10em 20px var(--multiSelectOverlayColor); +} + +@supports (display: revert) { + .emby-checkbox:checked + span + .checkboxOutline { + outline: solid var(--borderWidth) #fff; + } +} + +.checkboxOutline { + top: unset; + height: 1.3em; + width: 1.3em; + border-radius: var(--smallerRadius); +} + +.itemSelectionPanel .material-icons.check:before { + font-size: 4em; + color: var(--fullContrastColor); + padding: 0.25em; +} + +.cardText-first + .itemSelectionPanel > .checkboxContainer { + height: calc(100% - 1.75em); +} + +.overflowBackdropCard .cardText-first + .itemSelectionPanel > .checkboxContainer { + height: 100%; +} + +.checkboxContainer .emby-checkbox:checked + span + .checkboxOutline.multiSelectCheckboxOutline { + border-radius: var(--largeRadius) !important; +} + +#castCollapsible .checkboxContainer .emby-checkbox:checked + span + .checkboxOutline.multiSelectCheckboxOutline, +#guestCastContent .checkboxContainer .emby-checkbox:checked + span + .checkboxOutline.multiSelectCheckboxOutline { + border-radius: 50% !important; +} + +.cardPadder { + text-align: center; +} + +#castCollapsible .cardPadder .cardImageIcon, +#guestCastContent .cardPadder .cardImageIcon { + display: none; +} + +.cardText-secondary + .itemSelectionPanel > .checkboxContainer, +.cardText.cardTextCentered:not(.cardText-secondary, .cardText-first) + .itemSelectionPanel > .checkboxContainer { + height: calc(100% - 3em); +} + +.cardText-secondary, +.fieldDescription, +.guide-programNameCaret, +.listItem .secondary, +.nowPlayingBarSecondaryText, +.programSecondaryTitle, +.secondaryText { + color: var(--dimTextColor); +} + +.cardFooter + .itemSelectionPanel > .checkboxContainer, +.cardScalable + .itemSelectionPanel > .checkboxContainer { + height: 100%; +} + +.checkboxOutline.multiSelectCheckboxOutline { + border-radius: var(--largeRadius); + border-width: 0; + width: 100%; + height: 100%; +} + +.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon { + font-size: 0.9em; + font-weight: 900; +} + +.checkboxOutline:not(.multiSelectCheckboxOutline) { + border: solid gray var(--borderWidth); + background-color: #fff; + transition: all 0.125s; +} + +.emby-checkbox:checked + span + .checkboxOutline:not(.multiSelectCheckboxOutline) { + background: var(--checkboxCheckedBgColor); + border: var(--defaultLighterBorder); +} + +.emby-checkbox:focus:not(:checked) + span + .checkboxOutline { + border-color: var(--highlightOutlineColor) !important; + outline: none; +} + +.emby-checkbox:focus + span + .checkboxOutline { + border-color: var(--highlightOutlineColor) !important; + outline: none; +} + +@supports (display: revert) { + .emby-checkbox:focus + span + .checkboxOutline { + border-color: #fff !important; + outline: var(--borderWidth) solid var(--highlightOutlineColor); + } +} + +.cardIndicators { + -webkit-align-items: center; + align-items: center; + top: 0.5em; +} + +[dir="ltr"] .cardIndicators { + right: 0.5em; +} + +.layout-mobile .cardIndicators { + top: 0.45em; + right: 0.5em; +} + +.indicator { + border: solid rgb(124 124 124 / 50%) var(--borderWidth); + border-radius: 100em; +} + +.playedIndicator { + background: rgb(34, 197, 94); + border: var(--defaultLighterBorder); +} + +.videoIndicator { + background: rgb(41 41 41); + padding: 0.5em; + transform: scale(0.85); + border: var(--defaultLighterBorder); + font-size: 0.75em; +} + +.videoIndicator:has(.photo_album), +.videoIndicator:has(.folder) { + background: peru; +} + +.videoIndicator:has(.photo) { + background: steelblue; +} + +.videoIndicator:has(.videocam) { + background: indianred; +} + +.defaultCardBackground, +.cardScalable { + background: var(--cardBackgroundGradient); +} + +div[data-type="Book"] .play_arrow:before { + content: "book"; + font-size: 85%; +} + +div[data-type="Photo"] .play_arrow:before { + content: "photo"; +} + +div[data-type="PhotoAlbum"] .play_arrow:before { + content: "animated_images"; +} + +.emby-button.block, +.button-alt, +.raised, +.raised:focus, +.manageRecordingButton, +.dashboardActionsContainer > .emby-button { + color: var(--fullContrastColor); + border-radius: var(--smallRadius); + background: var(--lighterGradientPoint); + border: var(--defaultBorder); + transition: all 0.125s; +} + +.editItemMetadataForm > .metadataFormFields div:has(.formDialogFooterItem) { + display: flex; + justify-content: center; +} + +.btnBrowse > .folder { + margin-inline-end: 0.5em; +} + +.fab { + color: var(--fullContrastColor); + background: var(--lighterGradientPoint); + border: var(--defaultBorder); +} + +.fab:focus { + background: var(--lighterGradientPoint) !important; + filter: brightness(1.2); +} + +.raised:active, +.fab:active, +.emby-button:active { + filter: brightness(1.05) !important; + transform: scale(0.98); +} + +.detailButton { + border: var(--defaultLighterBorder); + padding: 0.5em 0.5em !important; +} + +.cardScalable .material-icons.check:before { + transform: scale(1.25); +} + +.detailButton:not(.btnPlay) { + color: var(--textColor); + backdrop-filter: none; + border-color: transparent; + margin: 0.5em !important; + border-radius: 50%; + padding: 0.6em !important; + background: transparent; +} + +.layout-desktop .detailButton:not(.btnPlay):hover { + color: var(--zeroContrastColor); + background: var(--hoverBackgroundColor); +} + +.detailButton:active { + color: #fff; + background: var(--activeBackgroundColor); +} + +.btnPlay.detailButton { + background-color: var(--btnPlayColor); + color: var(--zeroContrastColor); + border-radius: 3em; + border-color: var(--btnPlayBorderColor); + height: 3em; + min-width: 10em; + margin-right: 0.5em !important; + flex-direction: row; +} + +.mainDetailButtons > .btnPlay:after { + content: attr(title); + padding-right: 1ch; +} + +.btnPlay > .detailButton-content::after { + padding: 0 1ch; + place-content: center; +} + +.btnPlay > .detailButton-content { + align-items: unset; + display: flex; + flex-direction: unset; + align-content: unset; + justify-content: flex-start; +} + +.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay[title="Play"]:after { + content: "Read"; +} + +.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay .material-icons.play_arrow:before { + content: "book"; + padding-inline-end: 1ch; +} + +.mainDetailButtons { + justify-content: center; + margin: 0; +} + +.layout-mobile [dir="ltr"] .mainDetailButtons { + flex-wrap: wrap; + padding: 0 1.25em; +} + +@media (min-width: 100em) { + .mainDetailButtons { + font-size: unset; + margin: 0; + } +} + +.localnav > .emby-button { + background: var(--lighterGradientPoint) !important; + color: var(--fullContrastColor); + padding: 0.8em 0.8em; +} + +div[data-role="controlgroup"] a.ui-btn-active { + background: var(--selectorBackgroundColor) !important; + color: var(--fullContrastColor) !important; +} + +.guide-date-tab-button.emby-tab-button-active, +.guide-date-tab-button:focus { + color: var(--fullContrastColor); +} + +#btnDeleteImage, +.button-delete, +.btnRevoke, +#btnShutdown { + background: var(--btnDeleteColor) !important; + border: solid var(--btnDeleteBorderColor) var(--borderWidth); + color: #fff !important; +} + +.button-submit, +.upNextContainer .btnStartNow, +.MuiButton-colorPrimary { + background: var(--btnSubmitColor) !important; + border: solid var(--btnSubmitBorderColor) var(--borderWidth) !important; + color: #fff !important; +} + +.userPreferencesPage .button-submit { + position: sticky !important; + bottom: calc(1em + max(env(safe-area-inset-bottom), var(--safe-area-inset-bottom, 1px))); + box-shadow: 0 0.75em 2em 2em var(--darkerGradientPoint); + z-index: 2 !important; +} + +.collapseContent, +.formDialogFooter:not(.formDialogFooter-clear), +.formDialogHeader:not(.formDialogHeader-clear) { + background-color: var(--headerColor); + backdrop-filter: var(--blurDefault); + color: var(--textColor); +} + +.paperList { + padding: 0.4em; +} + +.serverInfo { + padding: 1em; +} + +.serverInfo > :nth-child(1n) { + -webkit-flex: 1 0 30%; + flex: 1 0 30%; +} + +.serverInfo > :nth-child(2n) { + -webkit-flex: 1 0 50%; + flex: 1 0 50%; + text-align: end; +} + +.listItemIcon:not(.listItemIcon-transparent) { + background-color: var(--lighterGradientPoint) !important; + color: var(--textColor); +} + +.listItemIcon.notification_important { + background-color: var(--btnDeleteColor) !important; + border: solid var(--btnDeleteBorderColor) var(--borderWidth); +} + +.listItemIcon.notifications:not(.listItemIcon-transparent), +.listItemIcon.schedule:not(.listItemIcon-transparent), +.listItemIcon.person:not(.listItemIcon-transparent), +.listItemIcon.live_tv:not(.listItemIcon-transparent) { + background-color: var(--darkerGradientPoint) !important; + border: var(--defaultBorder); +} + +.readOnlyContent { + flex-direction: column !important; +} + +.MuiAppBar-root { + background: var(--headerColor); + backdrop-filter: var(--blurDefault); + border-bottom: var(--defaultBorder); +} + +.MuiDrawer-paper { + background: var(--drawerColor); + backdrop-filter: var(--blurLarge); + border-right: var(--defaultBorder); + padding: 0.25em; +} + +.listItemImage { + border-radius: var(--smallRadius); + margin-right: 0.75em !important; + border: var(--defaultBorder); +} + +[dir="ltr"] .listItem:not(.actionSheetMenuItem, .childrenItemsContainer .listItem, .activityLogListWidget .listItem) { + padding: 0.375em !important; +} + +[dir="ltr"] + .listItem:not(.actionSheetMenuItem, .childrenItemsContainer .listItem, .activityLogListWidget .listItem):not( + :last-child + ) { + margin-bottom: 0.5em; +} + +[dir="ltr"] .listItem:not(.actionSheetMenuItem)[data-type="Episode"] { + padding: 0.375em; + margin-bottom: 0.5em; +} + +.layout-mobile #songsTab .listItem[data-type="Audio"], +.layout-mobile #playlist .listItem[data-type="Audio"] { + margin: auto 1em; +} + +.listItem[data-type="Audio"]:has(.playlistIndexIndicatorImage) .listItemBodyText { + color: var(--fullContrastColor); + font-weight: 600; +} + +.listItem[data-type="Audio"]:has(.playlistIndexIndicatorImage):not(:hover) { + background-color: rgba(255, 255, 255, 0.07); +} + +.listItem-largeImage .listItemBodyText:not(.secondary) { + font-size: 1.17em; + font-weight: 600; + color: var(--textColor); +} + +.listItemBodyText.secondary { + color: var(--dimTextColor); +} + +.listItemBody > .listItemBodyText:not(.secondary) { + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + color: inherit; +} + +.listItem-overview { + display: -webkit-box; + -webkit-line-clamp: 4; + -webkit-box-orient: vertical; + overflow: hidden; +} + +.listItem-bottomoverview, +[dir="ltr"] .listItem:not(.actionSheetMenuItem)[data-type="Episode"] .listItem-overview p { + margin-top: 0.75em; + margin-bottom: 0em; +} + +.listItem, +.navMenuOption { + border-radius: 0.7em; +} + +.listItem:hover, +.navMenuOption:hover { + background: unset; + border-radius: 0.7em; +} + +.listItem:focus { + background: var(--highlightOutlineColor); +} + +.listItem:active, +.navMenuOption:active { + background: var(--activeBackgroundColor); + color: #fff; +} + +.listItem-border { + border-color: transparent !important; +} + +.listItem-border.emby-button.show-focus:focus { + border-radius: var(--smallRadius); +} + +.MuiListItem-root > a, +.MuiList-root > a, +.MuiListItem-root > div { + border: solid transparent var(--borderWidth); + border-radius: 0.7em; + /* margin: 0.25em 0.5em !important; */ +} + +.Mui-selected { + background-color: var(--accentColor) !important; + color: #fff; +} + +.actionsheetDivider { + height: 2px; + background: var(--dividerColor); +} + +.actionsheet-xlargeFont { + line-height: normal; +} + +.actionSheetContent { + padding: 0.4em !important; +} + +.actionSheetContent > h1 { + font-size: unset; +} + +[dir="ltr"] .actionsheetMenuItemIcon { + margin: 0 0.2em 0 0.45em !important; +} + +/* [dir="ltr"] .actionsheetMenuItemIcon.check { + margin: 0 0.45em 0 0.45em !important; +} */ + +.actionSheetMenuItem:has(.listItemIcon.check) { + background-color: var(--accentColor); +} + +.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText { + color: var(--activeTextColor); +} + +.actionSheetMenuItem:has(.listItemIcon.check) .listItemIcon.check { + display: none; +} + +.actionSheetMenuItem:has(.listItemIcon.check[style*="hidden"]) { + background-color: transparent; +} + +.actionSheetMenuItem:has(.listItemIcon.check[style*="hidden"]) .listItemBodyText { + color: var(--fullContrastColor); + background-color: transparent; +} + +.actionSheetMenuItem:has(.listItemIcon.check[style*="hidden"]):active { + background-color: var(--semiTransparentAccentColor); +} + +.navMenuOption { + border-radius: var(--smallRadius) !important; + margin: 0em 1em !important; +} + +[dir="ltr"] .navMenuOption { + padding: 0.75em 1em !important; + margin-bottom: unset; +} + +#myPreferencesMenuPage .listItemIcon { + margin-left: 0.5em; + margin-right: 0.25em; +} + +.navMenuOption-selected { + background-color: var(--accentColor) !important; +} + +#itemDetailPage .detailSection { + display: grid; + row-gap: 1em; + column-gap: 3em; + max-width: unset !important; + grid-template-columns: 1.3fr 0.7fr 1fr 1fr; + margin-bottom: 1.5em; +} + +/* Support .tmdb-review-swipe-container for Jellyfin Enhanced + (https://github.com/n00bcodr/Jellyfin-Enhanced) */ +.tmdb-review-swipe-container { + max-width: 93vw; +} + +.detailPageContent { + gap: 1em; +} + +.trackSelections { + order: 3; + max-width: unset !important; + margin-top: 1em; + border: var(--defaultBorder); + border-radius: var(--smallRadius); + padding: 1em; + grid-column: 3 / 5; + background-color: var(--lighterGradientPointAlpha); +} + +.layout-mobile .trackSelections { + margin-top: 0; +} + +.layout-tv .trackSelections { + order: 2; +} + +.recordingFields { + order: 4; +} + +.recordingButton { + gap: 1ch; +} + +.detailsGroupItem, +.trackSelections .selectContainer { + max-width: unset !important; + align-items: baseline; + /* margin: 0.25em !important; */ +} + +.selectArrowContainer { + top: 0em; + opacity: 0.5; +} + +.trackSelectionFieldContainer > .selectArrowContainer { + top: 0.5em; +} + +.trackSelectionFieldContainer > label { + max-width: 2.75em; + background-repeat: no-repeat; + color: transparent; + transform: scale(0.9); +} + +.selectVideoContainer.trackSelectionFieldContainer > label { + background-image: url('data:image/svg+xml,'); + filter: var(--svgIconFilter); +} + +.selectAudioContainer.trackSelectionFieldContainer > label { + background-image: url('data:image/svg+xml,'); + filter: var(--svgIconFilter); +} + +.selectSubtitlesContainer.trackSelectionFieldContainer > label { + background-image: url('data:image/svg+xml,'); + filter: var(--svgIconFilter); +} + +.selectSourceContainer.trackSelectionFieldContainer > label { + background-image: url('data:image/svg+xml,'); + filter: var(--svgIconFilter); +} + +.detailSectionContent a:not(.overview-expand) { + text-align: start; +} + +.layout-desktop .detailSectionContent { + display: grid; + align-content: end; + min-height: 16vh; +} + +.detailSectionContent:has(.tagline.hide + .overview.hide) { + min-height: unset; +} + +.itemDetailsGroup { + outline: none; + overflow: hidden; + margin-top: 1em; + border-radius: var(--smallRadius); + background-color: var(--lighterGradientPointAlpha); + border: none; + box-shadow: inset 0 0 0 0.06em var(--borderColor) !important; + order: 2; + grid-column: 1 / 3; +} + +.layout-mobile .itemDetailsGroup { + margin-top: 0; +} + +.detailsGroupItem { + margin: 0 !important; + justify-content: space-between; + padding: 0.5em 0.9em; + align-items: baseline; +} + +.detailsGroupItem:not(:last-child), +.itemDetailsGroup > div:not(:last-child) { + border-bottom: var(--defaultBorder); +} + +.itemDetailsGroup > div:empty { + border-bottom: none; +} + +.detailsGroupItem > .label { + font-weight: 600; + flex-basis: 6em; +} + +.detailsGroupItem > .focuscontainer-x a { + font-weight: 400; + text-align: end; +} + +.detailsGroupItem > .focuscontainer-x { + text-align: end; + color: var(--dimTextColor); +} + +.detailsGroupItem > .label { + color: var(--textColor); +} + +.layout-tv .itemDetailsGroup { + order: 2; +} + +.detailSection > .nextUpSection { + order: 5; + grid-column: 1; +} + +.detailSection > #listChildrenCollapsible { + order: 6; + grid-column: 2 / -1; +} + +.detailSectionContent { + order: 1; + grid-column: 1 / -1; +} + +.nextUpSection.hide ~ #listChildrenCollapsible, +.trackSelections.hide ~ .recordingFields.hide ~ .itemDetailsGroup { + grid-column: 1 / -1; +} + +.layout-mobile .trackSelections, +.layout-mobile .detailSectionContent, +.layout-mobile .itemDetailsGroup, +.layout-mobile .nextUpSection, +.layout-mobile .detailSection > #listChildrenCollapsible, +.layout-tv .trackSelections, +.layout-tv .detailSectionContent, +.layout-tv .itemDetailsGroup, +.layout-tv .nextUpSection, +.layout-tv .detailSection > #listChildrenCollapsible, +.collectionItems, +.programGuideSection, +/* Support .series-episodes-section for KefinTweaks (https://github.com/ranaldsgift/KefinTweaks) */ +.series-episodes-section, +.series-episodes-section ~ #listChildrenCollapsible { + grid-column: 1 / -1; +} + +.series-episodes-section { + order: 4; +} + +.collectionItems { + order: 2; +} + +.programGuideSection:not(.hide) { + order: -1; + margin-top: 2em; +} + +.layout-desktop .programGuide { + padding-right: var(--sidePadding); +} + +.collectionItems .sectionTitleContainer.padded-left { + padding-left: 0.375em; +} + +.collectionItemsContainer.padded-left { + padding-left: 0; +} + +.sliderBubble { + border-radius: var(--largeRadius); + border: var(--defaultBorder); + overflow: hidden; + z-index: 3; +} + +.alphaPickerButton { + font-family: monospace; + margin: 0.15em; + color: var(--dimTextColor); +} + +.alphaPickerButton-selected { + background-color: var(--btnPlayColor); + color: var(--zeroContrastColor) !important; +} + +.alphaPicker-vertical { + height: 70%; +} + +.layout-mobile .alphaPicker-vertical { + right: 0 !important; +} + +.alphaPicker { + justify-content: center; +} + +.alphaPickerButton-tv { + transition: transform 0.2s; +} + +.alphaPickerButton-tv:focus { + background-color: var(--highlightOutlineColor); + transform: scale(1.75); +} + +.padded-right { + padding-right: var(--sidePadding) !important; +} + +[dir="ltr"] .detailPageContent, +.content-primary { + padding-left: var(--sidePadding) !important; + padding-right: var(--sidePadding) !important; +} + +/* this prevents double padding on Jellyfin pre-10.11.0 */ +[dir="ltr"] .detailPageContent > .detailPagePrimaryContent { + padding-left: 0 !important; + padding-right: 0 !important; +} + +/* this removes right padding from cast page sections to place cards evenly*/ +#itemDetailPage .verticalSection .itemsContainer.padded-right { + padding-right: 0 !important; +} + +.vertical-list > .listGroupHeader { + padding-left: 0.5ch; +} + +.listPaging > span { + padding: 0 0.5em; +} + +.layout-mobile #myPreferencesMenuPage { + padding-top: var(--appBarHeight) !important; +} + +.headerUserButton { + width: 2em; + height: 2em; + margin-inline-end: 1em; + border: var(--defaultBorder); +} + +.MuiAvatar-circular { + width: 1.5em; + height: 1.5em; + border: var(--defaultBorder); +} + +.dashboardDocument .content-primary { + padding-top: 4.25rem; +} + +.editorNode { + display: flex; + align-items: center; +} + +.metadataSidebarIcon { + color: #6c7bab; +} + +.jstree-default .jstree-wholerow-clicked { + background: var(--selectorBackgroundColor) !important; +} + +.verticalSection:not(:empty) { + margin-top: 0.5em; + margin-bottom: 1em; +} + +.sectionTitleTextButton { + padding: 0 0.5em; +} + +.sectionTitleTextButton:hover { + background: transparent !important; +} + +.sectionTitleTextButton:active { + color: var(--fullContrastColor) !important; +} + +.sectionTitleContainer-cards { + padding-top: 0; + padding-bottom: 0.2em; +} + +.sectionTitleTextButton > * { + text-align: left; + /* the !important are needed for proper alignment on phones */ + padding: 0.3em 0 !important; + margin: 0 0 !important; + /* this prevents long library names from breaking into another line */ + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + max-width: 88vw; +} + +.dashboardSection .sectionTitleTextButton > .material-icons, +.sectionTitleTextButton > .material-icons, +.dashboardSection .sectionTitleTextButton > .material-icons.material-icons { + font-size: unset; +} + +.sectionTitleTextButton > .chevron_right { + --fill: 0; + --opsz: 48; + font-size: 1.5rem; +} + +.sectionTitleTextButton > .chevron_right::before { + content: "arrow_circle_right"; +} + +.toast { + border-radius: var(--smallRadius); +} + +.upNextContainer { + border-radius: var(--largeRadius); + color: var(--textColor); +} + +[dir="ltr"] .upNextContainer { + margin: 2em; + box-sizing: border-box; + max-width: 80vw; +} + +.upNextDialog-title { + white-space: pre-wrap; + width: unset; +} + +.upNextDialog-buttons { + width: unset; + flex-wrap: wrap; +} + +.upNextContainer .upNextDialog-countdownText { + color: var(--fullContrastColor); +} + +.skip-button-container { + bottom: 9rem; +} + +.skip-button { + background-color: var(--textColor); + box-shadow: var(--shadow); + margin-right: var(--sidePadding); + border-radius: 3em; + color: var(--zeroContrastColor); +} + +/* this allows the skip button get focused correctly on TVs using remote navigation; needs 10.10.7*/ +.layout-tv .skip-button { + margin-right: auto; + margin-left: var(--sidePadding); +} + +.skip-button:hover { + background-color: var(--fullContrastColor); +} + +.skip-button:active { + background-color: rgba(245, 245, 245, 0.7); + box-shadow: none; +} + +.toast, +.upNextContainer { + color: var(--textColor); + background: var(--headerColor) !important; + border: var(--defaultBorder) !important; + backdrop-filter: var(--blurDefault); +} + +.activeSession { + width: 98% !important; +} + +@media (hover: hover) and (pointer: fine) { + .paper-icon-button-light:hover:not(:disabled) { + color: var(--zeroContrastColor); + text-shadow: none !important; + background-color: var(--hoverBackgroundColor); + } + + .emby-select-withcolor:hover:not(.emby-select[disabled], :focus), + .emby-input:hover:not(:focus), + .emby-textarea:hover:not(:focus) { + border-color: var(--dimTextColor) !important; + } + + .checkboxContainer:hover .checkboxOutline:not(.multiSelectCheckboxOutline) { + border-color: var(--checkboxCheckedBgColor); + border-width: var(--borderWidthDouble); + } + + .button-flat:hover { + background-color: rgba(255, 255, 255, 0.2); + color: var(--fullContrastColor); + } + + .btnPlay.detailButton:hover { + background-color: var(--btnPlayColor); + filter: brightness(1.1); + color: var(--zeroContrastColor); + } + + .alphaPickerButton:hover { + color: var(--fullContrastColor); + } + + .listItem-largeImage:hover { + backdrop-filter: var(--blurLargest); + } + + .listItem:not(.actionSheetMenuItem:has(.check)):hover { + color: var(--hoverTextColor) !important; + background: var(--activeBackgroundColor) !important; + } + + .listItem:hover .listItemBodyText, + .listItem:hover .secondary { + color: var(--hoverTextColor) !important; + } + + .navMenuOption:not(.navMenuOption-selected):hover { + color: var(--hoverTextColor) !important; + background: var(--activeBackgroundColor) !important; + } + + .actionSheetMenuItem:has(.listItemIcon.check[style*="hidden"]):hover { + color: var(--hoverTextColor) !important; + background: var(--activeBackgroundColor) !important; + } + + .searchfields-icon:hover, + .inputContainer .emby-input-iconbutton:hover { + color: rgba(255, 255, 255, 0.8); + } + + #scenesContent .cardScalable:hover { + border-color: var(--dimTextColor) !important; + } + + .sectionTitleTextButton:hover { + background: transparent !important; + color: var(--fullContrastColor) !important; + } + + .button-link:hover { + color: var(--textColor) !important; + text-decoration: none; + } + + .sectionTabs .emby-tab-button:hover { + color: var(--zeroContrastColor); + background-color: var(--hoverTabBackgroundColor); + } +} + +.paper-icon-button-light:active:not(:disabled) { + color: var(--zeroContrastColor); + text-shadow: none !important; + background-color: var(--hoverBackgroundColor); +} + +.layout-mobile .cardOverlayButton-br:active > .cardOverlayButtonIcon { + color: var(--zeroContrastColor); + text-shadow: none; +} + +.emby-textarea { + font-family: consolas, monaco, monospace; +} + +.customCssContainer textarea { + max-height: 40vh; + overflow-y: auto !important; +} + +.emby-select-withcolor, +.emby-select, +.emby-input, +.emby-textarea { + background-color: var(--selectorBackgroundColor); + border: var(--defaultLighterBorder); + border-radius: var(--smallRadius); + padding: 0.5em !important; +} + +.inputLabelFocused, +.selectLabelFocused, +.textareaLabelFocused { + color: var(--fullContrastColor); +} + +.emby-select-withcolor:focus, +.emby-input:focus, +.emby-textarea:focus { + border-color: var(--highlightOutlineColor) !important; + outline: none !important; +} + +@supports (display: revert) { + .emby-select-withcolor:focus, + .emby-input:focus, + .emby-textarea:focus { + border-color: var(--highlightOutlineColor) !important; + outline: thin solid var(--highlightOutlineColor) !important; + background-color: var(--textareaBackgroundColor); + } +} + +.emby-select-withcolor > option { + color: inherit; + background-color: var(--selectorBackgroundColor); +} + +.inputContainer .emby-input-iconbutton { + color: rgba(255, 255, 255, 0.5); + margin-left: -2.5em; + background-color: transparent !important; +} + +.searchfields-txtSearch { + padding: 0.75em 1.5em !important; + border-radius: 4em; +} + +.searchfields-icon { + padding: 0.25em; + margin-left: -1.75em; + margin-bottom: 0; + border-radius: var(--largeRadius); + color: rgba(255, 255, 255, 0.5); +} + +.searchfields-icon:active, +.inputContainer .emby-input-iconbutton:active { + color: rgba(255, 255, 255, 0.8); +} + +.searchFields > .searchFieldsInner { + flex-direction: row-reverse; +} + +.nameContainer > h3, +.nameContainer > h1 { + word-break: break-word; + overflow: hidden; +} + +.nameContainer > h1.itemName, +.nameContainer > h1.parentName { + font-size: 4em; + white-space: pre-wrap; + padding-bottom: 0.5ch; + color: var(--fullContrastColor); +} + +.nameContainer > h1.itemName, +.nameContainer > h1.parentName, +.nameContainer > h1.itemName a, +.nameContainer > h1.parentName a { + font-weight: 200; +} + +.nameContainer > h1.itemName bdi, +.nameContainer > h1.parentName bdi, +.nameContainer > h1.itemName a, +.nameContainer > h1.parentName a { + overflow: hidden; + display: -webkit-box !important; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; +} + +.layout-mobile .nameContainer > h1.itemName, +.layout-mobile .nameContainer > h1.parentName, +.layout-mobile .nameContainer > h1.parentNameLast { + font-size: 2em; + word-wrap: break-word; + padding-bottom: 0ch; +} + +.subtitle { + font-size: 2em; + padding-bottom: 1em; +} + +.layout-mobile .subtitle { + font-size: 1.5em; + padding-bottom: 0.5em; +} + +.itemName.originalTitle { + padding-top: 0.25em; + padding-bottom: 0.25em; + color: var(--dimTextColor); + display: var(--itemOriginalTitleVisibility); +} + +.channelPrograms, +.programCell { + border-color: transparent; + /* this disables the 'color coded backgrounds' */ + background-color: transparent !important; + border-radius: var(--smallRadius); + height: 4.42em; +} + +.guideProgramName { + background-color: rgba(255, 255, 255, 0.05); + height: calc(100% - 0.7em); + margin: 0.35em 0 0.35em 0.7em; + border-radius: var(--smallerRadius); +} + +.guide-programNameCaret { + display: none; +} + +.programCell-active .guideProgramName { + background-color: var(--semiTransparentAccentColor); +} + +.guideVerticalScroller { + padding: 0; +} + +.layout-mobile .guideChannelImage { + background-position: center; + width: calc(100% - var(--sidePadding)); + right: 0; +} + +.guide-channelHeaderCell { + background-color: var(--semiTransparentAccentColor); + margin: 0.35em 0.7em 0.7em 0.7em; + width: auto; + height: calc(4.42em - 0.7em); + border-radius: var(--smallRadius); +} + +.guideChannelNumber { + font-size: 1em; +} + +#guideTab { + padding-top: 3em !important; +} + +.guide-channelHeaderCell:focus { + background-color: var(--highlightOutlineColor) !important; +} + +.programCell:focus { + background-color: transparent !important; +} + +.programCell:focus > .guideProgramName { + background-color: var(--highlightOutlineColor); +} + +.emby-select-iconbutton { + background-color: var(--selectorBackgroundColor); + border: var(--defaultLighterBorder); + border-radius: var(--smallRadius); + margin-inline-start: 1em; +} + +.subtitleappearance-preview { + border-radius: var(--smallRadius); +} + +.infoBanner { + display: flex; + place-content: center; + background-color: var(--headerColor) !important; + border-radius: var(--largeRadius) !important; + border: var(--defaultBorder) !important; +} + +fieldset { + border-radius: var(--smallRadius); + border: var(--defaultBorder); +} + +table:not(.MuiTable-root.MuiTable-stickyHeader) { + border-color: var(--borderColor) !important; + border-radius: var(--smallRadius); + border-spacing: 1px; + border: var(--defaultBorder); + background: var(--tableBodyColor); + border-collapse: separate; + overflow: hidden; +} + +.detailTableHeaderCell { + vertical-align: middle; +} + +#serverActivityPage .MuiPaper-elevation2 { + border: var(--defaultBorder) !important; + box-shadow: unset !important; +} + +#serverActivityPage .MuiPaper-elevation2, +#serverActivityPage .MuiPaper-elevation2 > .MuiBox-root, +#serverActivityPage .MuiTableRow-root.MuiTableRow-head { + background-color: var(--tableBodyColor); +} + +.detailTableBodyRow-shaded:nth-child(odd), +#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(odd) { + background: var(--darkerGradientPointAlpha) !important; +} + +.detailTableBodyRow-shaded:nth-child(even), +#serverActivityPage .MuiTableBody-root .MuiTableRow-root:nth-child(even) { + background: var(--lighterGradientPointAlpha) !important; +} + +.MuiList-root.MuiMenu-list { + background-color: var(--drawerColor); + padding: 0.375em; +} + +ul.MuiList-root.MuiMenu-list.MuiList-dense > div:first-child { + /* Don't change these units. They are rem because that is standard for MUI */ + gap: 0.5rem; +} + +.playerStats, +.iconOsd { + border-radius: var(--largeRadius); + background-color: rgba(69, 69, 69, 0.69); + backdrop-filter: var(--blurDefault); +} + +.playerStats-stats { + max-height: 50vh; + flex-wrap: wrap; + overflow-x: auto; + padding: 1em !important; +} + +#scenesContent .cardScalable:active { + border-color: var(--dimTextColor) !important; +} + +.progressring-spiner { + border-color: var(--accentColor); +} + +.skinHeader.focuscontainer-x.skinHeader-withBackground.skinHeader-blurred.semiTransparent.noHeaderRight { + display: none; +} + +#loginPage { + display: flex; + justify-content: center; + align-items: center; + min-height: 100vh; + padding: 1em; + overflow-y: auto; + background: + linear-gradient(to bottom, var(--darkerGradientPointAlpha), var(--lighterGradientPoint)), var(--loginPageBgUrl); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + box-sizing: border-box; +} + +#loginPage .padded-left.padded-right.padded-bottom-page { + width: 28em; + background: rgba(30, 40, 54, 0.7); + padding: 2em 2em 1em 2em !important; + border-radius: var(--largerRadius); + backdrop-filter: var(--blurDefault); + box-sizing: border-box; + transform: translateY(3em); +} + +.manualLoginForm .sectionTitle, +.visualLoginForm > h1 { + display: none; +} + +#loginPage .padded-left.padded-right.padded-bottom-page:has(.visualLoginForm:not(.hide)) { + width: 40em; +} + +#divUsers .squareCard { + width: 30% !important; +} + +.layout-mobile #divUsers .squareCard { + width: 45% !important; +} + +.manualLoginForm::before, +.visualLoginForm::before { + content: var(--loginPageText); + position: relative; + display: block; + top: -3.5em; + margin-bottom: -1em; + font-size: 1.875em; + font-weight: 800; + color: var(--fullContrastColor); + text-align: center; +} + +.manualLoginForm, +.visualLoginForm { + position: relative; +} + +#quickConnectPreferencesPage .padded-left.padded-right.padded-bottom-page { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} + +#txtLoginDisclaimer { + resize: none; +} + +.startTimeText, +.endTimeText, +.positionTime, +.runtime { + width: 4.5em; + box-sizing: border-box; + font-variant-numeric: tabular-nums; +} + +.startTimeText { + margin: 0 !important; +} + +.endTimeText { + justify-content: right; + padding-inline-end: 0.8em; + margin: 0 0 0 0.75em !important; +} + +.startTimeText, +.endTimeText { + padding-top: 0.25em; +} + +.startTimeText, +.positionTime { + text-align: start; + justify-content: left; +} + +.endTimeText, +.runtime { + text-align: end; + justify-content: right; +} + +.filterIndicator { + background: var(--accentColor); +} + +/* this :not() is needed to prevent affecting the mixed media libraries on the home page */ +/* #homeTab .overflowBackdropCard[data-isfolder="true"]:not(.groupedCard) .cardPadder-overflowBackdrop { + padding-bottom: 50%; +} + +#homeTab .overflowBackdropCard[data-isfolder="true"]:not(.groupedCard) .cardText-first, +#homeTab .overflowBackdropCard[data-isfolder="true"]:not(.groupedCard) .cardText.cardTextCentered { + display: var(--libraryLabelVisibility); +} */ + +.overflowBackdropCard[data-type="CollectionFolder"] .cardPadder-overflowBackdrop, +.overflowBackdropCard[data-type="UserView"] .cardPadder-overflowBackdrop { + padding-bottom: 50%; +} + +.overflowBackdropCard[data-type="CollectionFolder"] .cardText-first, +.overflowBackdropCard[data-type="UserView"] .cardText-first { + display: var(--libraryLabelVisibility); +} + +.nowPlayingButtonsContainer { + margin-top: 1em; +} + +.nowPlayingPageImageContainerNoAlbum { + border: var(--defaultBorder); + border-radius: var(--smallRadius); + overflow: hidden; +} + +.nowPlayingPageImageContainerNoAlbum .defaultCardBackground { + background: repeating-radial-gradient(#000, transparent 10em); +} + +.nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon { + color: var(--borderColor); +} + +.layout-mobile .playlistSection .playlist { + padding: 4.3em 0; + top: 0; + bottom: 4.3em; + background: var(--headerColor); + backdrop-filter: var(--blurLargest); + z-index: 0; +} + +.layout-mobile .playlistSectionButton { + background: var(--drawerColor); + border-top: var(--defaultBorder); + backdrop-filter: var(--blurSmallest); + color: var(--textColor); + z-index: 1; +} + +.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent { + background: transparent; + border-top: var(--defaultBorder); + border-color: transparent; + color: var(--textColor); +} + +.layout-desktop .nowPlayingInfoContainer { + position: -webkit-sticky; + position: sticky; + top: 5em; + padding: 1em; + margin-bottom: 2em; + backdrop-filter: var(--blurLargest); + border: var(--defaultLighterBorder); + z-index: 2; + background-color: var(--headerColor); + box-shadow: var(--shadow); + border-radius: var(--largerRadius); + box-sizing: border-box; +} + +.layout-desktop .nowPlayingInfoControls { + margin: 0em 2em; +} + +.nowPlayingPageImage { + box-shadow: var(--shadow); + border-radius: var(--smallRadius); + object-fit: cover; + aspect-ratio: 1 / 1; +} + +.nowPlayingBar .playPauseButton { + font-size: 2em; +} + +.nowPlayingInfoContainer .btnPlayPause { + font-size: 3em; +} + +.nowPlayingBar .nowPlayingImage { + background-size: cover; + border-radius: var(--smallerRadius); + height: 3.5em; + margin: 0.25em; + width: 3.5em; +} + +.nowPlayingBarPositionContainer { + top: -0.7em; +} + +@media (orientation: portrait) and (max-width: 43em) { + .nowPlayingPageImageContainerNoAlbum .cardImageContainer .cardImageIcon { + font-size: 8em !important; + } + + .nowPlayingInfoContainer { + height: calc(95% - 4.2em); + } +} + +.nowPlayingSongName.nowPlayingEpisode { + margin-bottom: 1em; + font-size: 1.25em; + color: var(--textColor); +} + +.nowPlayingAlbum.nowPlayingSeason { + color: var(--dimTextColor); + margin-bottom: 0.5em; +} + +.nowPlayingArtist.nowPlayingSerie { + margin-bottom: 0.5em; +} + +.playlistIndexIndicatorImage { + background-blend-mode: difference; + background-color: var(--textColor); + background-size: contain !important; +} + +.playlistIndexIndicatorImage.defaultCardBackground .audiotrack { + display: none; +} + +#dialogToc { + background-color: rgba(0, 0, 0, 0.5); + max-height: unset; + max-width: unset; +} + +#dialogToc .toc li { + font-size: unset; + font-weight: 600; + list-style-type: circle; + margin-bottom: 0.5em; + font-family: "Math", serif; +} + +.MuiTabs-indicator { + display: none; +} + +.MuiTabs-root > .MuiTabs-scroller { + align-content: center; +} + +.MuiTabs-flexContainer > .MuiButtonBase-root { + border-radius: var(--largeRadius); + min-height: 40px; + min-width: 72px; +} + +.MuiTabs-flexContainer > .MuiButtonBase-root.Mui-selected { + color: var(--fullContrastColor); + background-color: transparent !important; +} + +.MuiToggleButtonGroup-grouped.Mui-selected { + color: var(--fullContrastColor); +} + +.MuiButtonBase-root.MuiIconButton-root:hover { + color: var(--fullContrastColor); + background-color: transparent; +} + +#viewPanel .ui-panel-inner { + margin-top: 4em; +} + +.videoOsdBottom.videoOsdBottom-maincontrols { + background: var(--bottomOSDGradient); +} + +.skinHeader-withBackground.osdHeader { + background: var(--topOSDGradient); +} + +.headroom { + transition: transform 0.5s; +} + +/* this is the default seamless header, visible in home and libraries */ +/* var(--solid, --seamless) */ +.skinHeader-blurred:not(.osdHeader):not(.semiTransparent) { + backdrop-filter: var(--appBarBlurStrength, none); + background-color: transparent; + background: var(--appBarColor, var(--headerBackground)); + border: var(--appBarBorder, none); + border-width: 0 0 var(--borderWidth) 0; +} + +.skinHeader-blurred:not(.osdHeader):not(.semiTransparent)::after { + content: var(--appBarSeamlessBlur, ""); + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + backdrop-filter: var(--blurLargest); + -webkit-mask: var(--headerBlurMask); + mask: var(--headerBlurMask); + z-index: -1; +} + +.layout-mobile .skinHeader-blurred:not(.osdHeader), +.layout-mobile .withSectionTabs .headerTop { + padding: 0; +} + +.sectionTabs { + display: inline-grid; + height: var(--appBarHeight); + padding-bottom: var(--appBarTabsPadding, 1.5em); +} + +.layout-mobile .sectionTabs { + align-content: center; +} + +/* this is the transparent header, visible in main media page */ +.skinHeader-withBackground.semiTransparent { + --headerBackground: none; + backdrop-filter: none; + background-color: transparent; + border: none; +} + +.skinHeader.headroom:not(.osdHeader, .noHomeButtonHeader):has(.pageTitle:empty)::after, +.skinHeader.headroom:not(.osdHeader, .noHomeButtonHeader):has(.pageTitle:empty) { + --headerBackground: none; + backdrop-filter: none; + background-color: transparent; + border: none; +} + +.skinHeader-withBackground.semiTransparent .headerButton:not(:hover), +.skinHeader.headroom:not(.osdHeader, .noHomeButtonHeader):has(.pageTitle:empty) .headerButton:not(:hover) { + text-shadow: var(--iconShadow); + color: #fff; +} + +/* this keeps the header elements aligned when its height is modified */ +.headerTop { + -webkit-align-items: center; + align-items: center; + /* this removes different padding set on different layouts in various media queries */ + padding: 0; + height: var(--appBarHeight); +} + +.osdHeader .headerTop { + max-height: var(--appBarHeight); +} + +.layout-desktop .headerTop { + padding: 0 1em; +} + +.layout-tv .headerTop { + padding: 0 0.5em; +} + +/* this prevents the section tabs from hiding all the way up on phones (not-tablets)*/ +.headroom--unpinned { + -webkit-transform: translateY(calc(-1 * var(--appBarHeight) - var(--borderWidth))); + transform: translateY(calc(-1 * var(--appBarHeight) - var(--borderWidth))); +} + +.noHomeButtonHeader .emby-tab-button[data-index="1"]:before { + content: "favorite"; +} + +.noHomeButtonHeader .emby-tab-button[data-index="0"]:before { + content: "home"; +} + +.noHomeButtonHeader .emby-tab-button:before { + --fill: 0; + font-family: + var(--iconPack), + Material Icons; + font-feature-settings: "liga"; + /* padding-inline-end: 0.5ch; */ + font-size: 1.2em; + font-variation-settings: + "FILL" var(--fill), + "wght" var(--wght), + "GRAD" var(--grad), + "opsz" var(--opsz); + transition: font-variation-settings 0.25s; +} + +.layout-tv .sectionTabs .emby-tabs.smoothScrollX { + overflow: visible !important; +} + +.sectionTabs .emby-tab-button { + display: inline-flex; + margin: 0.25em 0.5em; + padding: 0 1.25em; + height: 2.5em; + color: var(--textColor); + font-weight: 400; + border-radius: var(--largeRadius); + background-color: var(--darkerGradientPointAlpha); +} + +.sectionTabs .emby-tab-button-active { + margin: 0.25em 0.5em; + color: var(--zeroContrastColor); + background-color: var(--btnPlayColor); +} + +/* this increases page top padding when section tabs are expanded */ +.libraryPage:not(.noSecondaryNavPage) { + padding-top: calc(var(--appBarHeight) * 2 + 0.5em) !important; +} + +@media (min-width: 75em) { + .sectionTabs { + -webkit-align-items: center; + align-items: center; + -webkit-align-self: center; + align-self: center; + -webkit-justify-content: center; + justify-content: center; + /* this collapses the section tabs expanded earlier than the default 100em max-width */ + margin-top: calc(-1 * var(--appBarHeight)); + position: relative; + width: auto; + } + + /* this reduces page top padding when section tabs are collapsed */ + .libraryPage:not(.noSecondaryNavPage) { + padding-top: calc(var(--appBarHeight) + 0.5em) !important; + } + + /* this fixes the header like on desktop on larger tablet screens */ + .headroom--unpinned { + -webkit-transform: translateY(0); + transform: translateY(0); + } +} + +@media (min-width: 100em) { + /* this reduces top padding when section tabs are collapsed on TVs */ + .layout-tv .libraryPage:not(.noSecondaryNavPage) { + padding-top: calc(var(--appBarHeight) + 0.5em) !important; + } +} + +@media (max-width: 100em) { + /* this makes the font size consistent */ + .sectionTabs { + font-size: 100%; + } + + /* this keeps the section tabs expanded on TVs under 100em width */ + .layout-tv .sectionTabs { + margin-top: unset; + } + + /* this increases page top padding when section tabs are expanded on TVs*/ + .layout-tv .libraryPage:not(.noSecondaryNavPage) { + padding-top: calc(var(--appBarHeight) * 2 + 0.5em) !important; + } +} + +@media (max-width: 75em) { + /* these margins are applied only on phones, not tablets*/ + .layout-mobile .sectionTabs .emby-tab-button:first-child { + margin-left: var(--sidePadding); + } + + .layout-mobile .sectionTabs .emby-tab-button:last-child { + margin-right: var(--sidePadding); + } +} + +.layout-tv .headerLeft { + overflow: unset; + margin: 0em 0.6em; +} + +.skinHeader { + /* this is for testing a fix for iOS */ + padding-top: max(env(safe-area-inset-top), var(--safe-area-inset-top)) !important; + color: var(--textColor); +} + +.nowPlayingPage { + background: linear-gradient(var(--darkerGradientPointAlpha), transparent); +} + +.remoteControlContent { + padding: 0 var(--sidePadding) !important; + background: linear-gradient(transparent, var(--darkerGradientPointAlpha) 20em); +} + +/* performance improvements for low-end TVs - start */ + +/* .layout-tv *, +.layout-tv *::before, +.layout-tv *::after { + transition-duration: .1s; + backdrop-filter: none !important; + -webkit-backdrop-filter: none !important; + box-shadow: none; + text-shadow: none; + filter: none !important; + -webkit-filter: none !important; +} */ + +/* .layout-tv .show-focus:not(.card):focus, +.layout-tv .show-animation:not(.card):focus { + transform: none !important; +} */ + +/* .layout-tv .blurhash-canvas { + display: none !important; +} */ + +/* .layout-tv .emby-checkbox:focus + span + .checkboxOutline { + transform: scale(1.75); +} */ + +.layout-tv .show-focus:focus, +.layout-tv .show-animation:focus, +.emby-select-focusscale:focus { + transform: none !important; +} + +.layout-tv .focuscontainer, +.layout-tv .backdropImage { + animation-duration: 0s !important; + backdrop-filter: none; +} + +.card.show-animation .cardBox { + transition: transform 0.05s ease-out; +} + +/* performance improvements fot low-end TVs - end */ + +/* basic styling for the Media Bar Plugin - start +for extended styling, use the add-on */ + +#slides-container { + top: calc(-0.5 * var(--appBarHeight)); +} + +.backdrop-overlay { + background: linear-gradient( + var(--lighterGradientPoint), + var(--gradientPointAlpha), + 60%, + var(--darkerGradientPointAlpha) + ); +} + +.plot { + color: var(--textColor); + text-shadow: 1px 1px var(--lighterGradientPointAlpha); +} + +.button-container { + align-items: center; +} + +.favorite-button { + background: none; + color: var(--textColor); +} + +.detail-button:hover, +.favorite-button:hover { + background: var(--dimTextColor); + color: var(--zeroContrastColor); +} + +/* basic styling for the Media Bar Plugin - end */ diff --git a/Theme/assets/add-ons/custom-media-covers-latest-min.css b/Theme/assets/add-ons/custom-media-covers-latest-min.css index e9ffa39..a9b92c1 100644 --- a/Theme/assets/add-ons/custom-media-covers-latest-min.css +++ b/Theme/assets/add-ons/custom-media-covers-latest-min.css @@ -1 +1 @@ -/*! Add-on: Custom Media Covers v26.06.06 for the ElegantFin Theme for Jellyfin by lscambo13 */:root{--colorOverlayAnimeCover:#bdcb63;--colorOverlayBooksCover:#a64446;--colorOverlayBoxsetsCover:#dbb435;--colorOverlayFoldersCover:#ad3c71;--colorOverlayHomevideosCover:#275ab9;--colorOverlayLivetvCover:#11629f;--colorOverlayMixedCover:#c23a3a;--colorOverlayMoviesCover:#c16768;--colorOverlayMusicCover:#0b5d48;--colorOverlayPlaylistsCover:#763dd8;--colorOverlayRecordedmoviesCover:#343434;--colorOverlayRecordedtvCover:#78641c;--colorOverlaySportsCover:#e97e3c;--colorOverlayTvshowsCover:#8c952b;--urlAnimeCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/anime.webp);--urlBooksCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/books.webp);--urlBoxsetsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/boxsets.webp);--urlFoldersCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/folders.webp);--urlHomevideosCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/homevideos.webp);--urlLivetvCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/livetv.webp);--urlMixedCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/mixed.webp);--urlMoviesCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/movies.webp);--urlMusicCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/music.webp);--urlPlaylistsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/playlists.webp);--urlRecordedmoviesCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedmovies.webp);--urlRecordedtvCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedtv.webp);--urlSportsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/sports.webp);--urlTvshowsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/tvshows.webp)}[data-type=CollectionFolder] .cardContent,[data-type=CollectionFolder] .defaultCardBackground,[data-type=UserView] .cardContent,[data-type=UserView] .defaultCardBackground{background-blend-mode:multiply;background-position:50%!important;background-size:cover!important;filter:contrast(.85)}.layout-tv [data-type=CollectionFolder]:before,.layout-tv [data-type=UserView]:before,[data-type=CollectionFolder] .cardContent:before,[data-type=UserView] .cardContent:before{color:#fff;content:attr(aria-label);font-family:Noto Sans;font-size:clamp(1em,max(2.5vh,2vw),2em);font-weight:800;position:absolute;text-align:center;white-space:normal;width:94%}.layout-tv [data-type=CollectionFolder]:before,.layout-tv [data-type=UserView]:before{align-content:center;bottom:0;display:grid;top:0;z-index:1}[data-type=CollectionFolder] .cardImageIcon:not(.quiz):before,[data-type=UserView] .cardImageIcon:not(.quiz):before{display:none}[data-collectiontype=movies] .cardContent{background-color:var(--colorOverlayMoviesCover)!important;background-image:var(--urlMoviesCover)!important}[data-collectiontype=tvshows] .cardContent{background-color:var(--colorOverlayTvshowsCover)!important;background-image:var(--urlTvshowsCover)!important}[data-collectiontype=livetv] .cardContent{background-color:var(--colorOverlayLivetvCover)!important;background-image:var(--urlLivetvCover)!important}[data-collectiontype=music] .cardContent{background-color:var(--colorOverlayMusicCover)!important;background-image:var(--urlMusicCover)!important}[data-collectiontype=homevideos] .cardContent{background-color:var(--colorOverlayHomevideosCover)!important;background-image:var(--urlHomevideosCover)!important}[data-collectiontype=books] .cardContent{background-color:var(--colorOverlayBooksCover)!important;background-image:var(--urlBooksCover)!important}[data-collectiontype=boxsets] .cardContent{background-color:var(--colorOverlayBoxsetsCover)!important;background-image:var(--urlBoxsetsCover)!important}[data-collectiontype=folders] .cardContent{background-color:var(--colorOverlayFoldersCover)!important;background-image:var(--urlFoldersCover)!important}[data-collectiontype=playlists] .cardContent{background-color:var(--colorOverlayPlaylistsCover)!important;background-image:var(--urlPlaylistsCover)!important}[data-type=CollectionFolder][data-prefix=MIX] .cardContent{background-color:var(--colorOverlayMixedCover)!important;background-image:var(--urlMixedCover)!important}[data-collectiontype=movies][data-prefix=REC] .cardContent{background-color:var(--colorOverlayRecordedmoviesCover)!important;background-image:var(--urlRecordedmoviesCover)!important}[data-type=CollectionFolder][data-prefix=REC] .cardContent{background-color:var(--colorOverlayRecordedtvCover)!important;background-image:var(--urlRecordedtvCover)!important}[data-type=CollectionFolder][data-prefix=ANI] .cardContent{background-color:var(--colorOverlayAnimeCover)!important;background-image:var(--urlAnimeCover)!important}[data-type=CollectionFolder][data-prefix=SPO] .cardContent{background-color:var(--colorOverlaySportsCover)!important;background-image:var(--urlSportsCover)!important} \ No newline at end of file +/*! Add-on: Custom Media Covers v26.09.05 for the ElegantFin Theme for Jellyfin by lscambo13 */:root{--colorOverlayMoviesCover:#c16768;--colorOverlayTvshowsCover:#8c952b;--colorOverlayLivetvCover:#11629f;--colorOverlayPlaylistsCover:#763dd8;--colorOverlayBoxsetsCover:#dbb435;--colorOverlayMusicCover:#0b5d48;--colorOverlayHomevideosCover:#275ab9;--colorOverlayBooksCover:#a64446;--colorOverlayFoldersCover:#ad3c71;--colorOverlayMixedCover:#c23a3a;--colorOverlayRecordedmoviesCover:#343434;--colorOverlayRecordedtvCover:#78641c;--colorOverlayAnimeCover:#bdcb63;--colorOverlaySportsCover:#e97e3c;--urlMoviesCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/movies.webp);--urlTvshowsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/tvshows.webp);--urlLivetvCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/livetv.webp);--urlPlaylistsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/playlists.webp);--urlBoxsetsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/boxsets.webp);--urlMusicCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/music.webp);--urlHomevideosCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/homevideos.webp);--urlBooksCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/books.webp);--urlFoldersCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/folders.webp);--urlMixedCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/mixed.webp);--urlRecordedmoviesCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedmovies.webp);--urlRecordedtvCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedtv.webp);--urlAnimeCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/anime.webp);--urlSportsCover:url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/sports.webp)}[data-type=CollectionFolder] .cardContent,[data-type=CollectionFolder] .defaultCardBackground,[data-type=UserView] .cardContent,[data-type=UserView] .defaultCardBackground{background-blend-mode:multiply;background-position:50%!important;background-size:cover!important;filter:contrast(.85)}.layout-tv [data-type=CollectionFolder]:before,.layout-tv [data-type=UserView]:before,[data-type=CollectionFolder] .cardContent:before,[data-type=UserView] .cardContent:before{color:#fff;content:attr(aria-label);font-family:Noto Sans;font-size:clamp(1em,max(2.5vh,2vw),2em);font-weight:800;position:absolute;text-align:center;white-space:normal;width:94%}.layout-tv [data-type=CollectionFolder]:before,.layout-tv [data-type=UserView]:before{align-content:center;bottom:0;display:grid;top:0;z-index:1}[data-type=CollectionFolder] .cardImageIcon:not(.quiz):before,[data-type=UserView] .cardImageIcon:not(.quiz):before{display:none}[data-collectiontype=movies] .cardContent{background-color:var(--colorOverlayMoviesCover)!important;background-image:var(--urlMoviesCover)!important}[data-collectiontype=tvshows] .cardContent{background-color:var(--colorOverlayTvshowsCover)!important;background-image:var(--urlTvshowsCover)!important}[data-collectiontype=livetv] .cardContent{background-color:var(--colorOverlayLivetvCover)!important;background-image:var(--urlLivetvCover)!important}[data-collectiontype=music] .cardContent{background-color:var(--colorOverlayMusicCover)!important;background-image:var(--urlMusicCover)!important}[data-collectiontype=homevideos] .cardContent{background-color:var(--colorOverlayHomevideosCover)!important;background-image:var(--urlHomevideosCover)!important}[data-collectiontype=books] .cardContent{background-color:var(--colorOverlayBooksCover)!important;background-image:var(--urlBooksCover)!important}[data-collectiontype=boxsets] .cardContent{background-color:var(--colorOverlayBoxsetsCover)!important;background-image:var(--urlBoxsetsCover)!important}[data-collectiontype=folders] .cardContent{background-color:var(--colorOverlayFoldersCover)!important;background-image:var(--urlFoldersCover)!important}[data-collectiontype=playlists] .cardContent{background-color:var(--colorOverlayPlaylistsCover)!important;background-image:var(--urlPlaylistsCover)!important}[data-type=CollectionFolder][data-prefix=MIX] .cardContent{background-color:var(--colorOverlayMixedCover)!important;background-image:var(--urlMixedCover)!important}[data-collectiontype=movies][data-prefix=REC] .cardContent{background-color:var(--colorOverlayRecordedmoviesCover)!important;background-image:var(--urlRecordedmoviesCover)!important}[data-type=CollectionFolder][data-prefix=REC] .cardContent{background-color:var(--colorOverlayRecordedtvCover)!important;background-image:var(--urlRecordedtvCover)!important}[data-type=CollectionFolder][data-prefix=ANI] .cardContent{background-color:var(--colorOverlayAnimeCover)!important;background-image:var(--urlAnimeCover)!important}[data-type=CollectionFolder][data-prefix=SPO] .cardContent{background-color:var(--colorOverlaySportsCover)!important;background-image:var(--urlSportsCover)!important} \ No newline at end of file diff --git a/Theme/assets/add-ons/custom-media-covers-v26.09.05.css b/Theme/assets/add-ons/custom-media-covers-v26.09.05.css new file mode 100644 index 0000000..7d6b759 --- /dev/null +++ b/Theme/assets/add-ons/custom-media-covers-v26.09.05.css @@ -0,0 +1,149 @@ +/*! Add-on: Custom Media Covers v26.09.05 for the ElegantFin Theme for Jellyfin by lscambo13 */ + +:root { + /* my media library default covers customizations */ + --colorOverlayMoviesCover: rgb(193, 103, 104); + --colorOverlayTvshowsCover: rgb(140, 149, 43); + --colorOverlayLivetvCover: rgb(17, 98, 159); + --colorOverlayPlaylistsCover: rgb(118, 61, 216); + --colorOverlayBoxsetsCover: rgb(219, 180, 53); + --colorOverlayMusicCover: rgb(11, 93, 72); + --colorOverlayHomevideosCover: rgb(39, 90, 185); + --colorOverlayBooksCover: rgb(166, 68, 70); + --colorOverlayFoldersCover: rgb(173, 60, 113); + --colorOverlayMixedCover: rgb(194, 58, 58); + --colorOverlayRecordedmoviesCover: rgb(52, 52, 52); + --colorOverlayRecordedtvCover: rgb(120, 100, 28); + --colorOverlayAnimeCover: rgb(189, 203, 99); + --colorOverlaySportsCover: rgb(233, 126, 60); + --urlMoviesCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/movies.webp); + --urlTvshowsCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/tvshows.webp); + --urlLivetvCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/livetv.webp); + --urlPlaylistsCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/playlists.webp); + --urlBoxsetsCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/boxsets.webp); + --urlMusicCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/music.webp); + --urlHomevideosCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/homevideos.webp); + --urlBooksCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/books.webp); + --urlFoldersCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/folders.webp); + --urlMixedCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/mixed.webp); + --urlRecordedmoviesCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedmovies.webp); + --urlRecordedtvCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/recordedtv.webp); + --urlAnimeCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/anime.webp); + --urlSportsCover: url(https://raw.githubusercontent.com/lscambo13/ElegantFin/refs/heads/main/Theme/assets/img/library-covers/sports.webp); +} + +[data-type="CollectionFolder"] .defaultCardBackground, +[data-type="UserView"] .defaultCardBackground, +[data-type="CollectionFolder"] .cardContent, +[data-type="UserView"] .cardContent { + filter: contrast(0.85); + background-size: cover !important; + background-position: 50% !important; + background-blend-mode: multiply; +} + +[data-type="CollectionFolder"] .cardContent::before, +[data-type="UserView"] .cardContent::before { + content: attr(aria-label); + position: absolute; + font-size: clamp(1em, max(2.5vh, 2vw), 2em); + font-weight: 800; + color: white; + font-family: "Noto Sans"; + text-align: center; + width: 94%; + white-space: normal; +} + +.layout-tv [data-type="CollectionFolder"]::before, +.layout-tv [data-type="UserView"]::before { + content: attr(aria-label); + position: absolute; + display: grid; + align-content: center; + top: 0; + bottom: 0; + font-size: clamp(1em, max(2.5vh, 2vw), 2em); + font-weight: 800; + color: white; + font-family: "Noto Sans"; + text-align: center; + width: 94%; + white-space: normal; + z-index: 1; +} + +[data-type="CollectionFolder"] .cardImageIcon:not(.quiz)::before, +[data-type="UserView"] .cardImageIcon:not(.quiz)::before { + display: none; +} + +[data-collectiontype="movies"] .cardContent { + background-color: var(--colorOverlayMoviesCover) !important; + background-image: var(--urlMoviesCover) !important; +} + +[data-collectiontype="tvshows"] .cardContent { + background-color: var(--colorOverlayTvshowsCover) !important; + background-image: var(--urlTvshowsCover) !important; +} + +[data-collectiontype="livetv"] .cardContent { + background-color: var(--colorOverlayLivetvCover) !important; + background-image: var(--urlLivetvCover) !important; +} + +[data-collectiontype="music"] .cardContent { + background-color: var(--colorOverlayMusicCover) !important; + background-image: var(--urlMusicCover) !important; +} + +[data-collectiontype="homevideos"] .cardContent { + background-color: var(--colorOverlayHomevideosCover) !important; + background-image: var(--urlHomevideosCover) !important; +} + +[data-collectiontype="books"] .cardContent { + background-color: var(--colorOverlayBooksCover) !important; + background-image: var(--urlBooksCover) !important; +} + +[data-collectiontype="boxsets"] .cardContent { + background-color: var(--colorOverlayBoxsetsCover) !important; + background-image: var(--urlBoxsetsCover) !important; +} + +[data-collectiontype="folders"] .cardContent { + background-color: var(--colorOverlayFoldersCover) !important; + background-image: var(--urlFoldersCover) !important; +} + +[data-collectiontype="playlists"] .cardContent { + background-color: var(--colorOverlayPlaylistsCover) !important; + background-image: var(--urlPlaylistsCover) !important; +} + +[data-type="CollectionFolder"][data-prefix="MIX"] .cardContent { + background-color: var(--colorOverlayMixedCover) !important; + background-image: var(--urlMixedCover) !important; +} + +[data-collectiontype="movies"][data-prefix="REC"] .cardContent { + background-color: var(--colorOverlayRecordedmoviesCover) !important; + background-image: var(--urlRecordedmoviesCover) !important; +} + +[data-type="CollectionFolder"][data-prefix="REC"] .cardContent { + background-color: var(--colorOverlayRecordedtvCover) !important; + background-image: var(--urlRecordedtvCover) !important; +} + +[data-type="CollectionFolder"][data-prefix="ANI"] .cardContent { + background-color: var(--colorOverlayAnimeCover) !important; + background-image: var(--urlAnimeCover) !important; +} + +[data-type="CollectionFolder"][data-prefix="SPO"] .cardContent { + background-color: var(--colorOverlaySportsCover) !important; + background-image: var(--urlSportsCover) !important; +} diff --git a/Theme/assets/add-ons/media-bar-plugin-support-latest-min.css b/Theme/assets/add-ons/media-bar-plugin-support-latest-min.css index f5324e4..c9e118f 100644 --- a/Theme/assets/add-ons/media-bar-plugin-support-latest-min.css +++ b/Theme/assets/add-ons/media-bar-plugin-support-latest-min.css @@ -1 +1 @@ -/*! Add-on: Media Bar Plugin Support v26.06.06 for the ElegantFin Theme for Jellyfin by lscambo13 */.detail-button:before,.favorite-button.favorited:before,.favorite-button:before,.play-button:before{font-weight:400}.play-button{font-family:Inter;font-size:1em;font-weight:500;order:1}.detail-button,.favorite-button{order:2}.backdrop,.backdrop-container,.backdrop-overlay{background-color:transparent;mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,transparent);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,transparent)}.backdrop{transform-origin:center left}.rating-value{flex-wrap:wrap;justify-content:center}.age-rating{color:unset;font-family:Archivo Narrow,sans-serif;font-size:.8em}#slides-container{height:62%;left:var(--sidePadding);overflow:visible;position:absolute;top:calc(var(--appBarHeight)*2 + 1.25em);user-select:none;width:calc(100vw - var(--sidePadding)*2)}.slide{border:var(--defaultBorder);border-radius:var(--largerRadius);overflow:hidden;transition:border 0s}.logo-container{top:10vh}.backdrop,.backdrop-container,.backdrop-overlay{mask-image:none;-webkit-mask-image:none}.backdrop-overlay{background:linear-gradient(0deg,rgba(0,0,0,.85),40%,transparent)}.pause-button,.volume-toggle{top:1em!important}.separator-icon{color:var(--dimTextColor);font-size:5px}.dot{background-color:var(--textColor)!important;border-radius:.25em;height:.375em;opacity:.5;transition:width .5s;width:.375em}.dot.active{transform:none;width:2em}@media only screen and (orientation:landscape){.button-container,.dots-container,.genre,.info-container,.plot-container{top:unset}.button-container{bottom:3em}.dots-container{bottom:4.5em}.plot-container{bottom:7em;height:4em}.genre{bottom:12em}.info-container{bottom:14em}.logo-container{align-items:flex-end;max-width:35vw;top:3%}.gradient-overlay{background:linear-gradient(37deg,rgba(0,0,0,.2) 32%,rgb(29 29 29/7%) 47%,rgba(29,29,29,0));mask:none;-webkit-mask:none}}@media only screen and (max-width:767px) and (orientation:portrait){.button-container{bottom:3em}.genre,.tomato-rating{display:none}.dots-container{bottom:6em}.info-container{bottom:5em}.logo-container{top:calc(100% - 15em)}.backdrop{transform-origin:center}.left-arrow,.right-arrow{display:none!important}.play-button{order:2}}@media (min-width:75em){#slides-container{top:calc(var(--appBarHeight) + 1.25em)}.layout-tv #slides-container{top:calc(var(--appBarHeight)*2 + 1.25em)}}@media (min-width:100em){.layout-tv #slides-container{top:calc(var(--appBarHeight) + 1.25em)}}@media only screen and (max-height:767px) and (orientation:landscape){#slides-container{height:57%}.logo-container{top:3%}} \ No newline at end of file +/*! Add-on: Media Bar Plugin Support v26.09.05 for the ElegantFin Theme for Jellyfin by lscambo13 */.detail-button:before,.favorite-button.favorited:before,.favorite-button:before,.play-button:before{font-weight:400}.play-button{font-family:Inter;font-size:1em;font-weight:500;order:1}.detail-button,.favorite-button{order:2}.backdrop-container,.backdrop-overlay,.backdrop:not(.tmla-mask){background-color:transparent;mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,transparent);-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,transparent)}.backdrop:not(.tmla-mask){transform-origin:center left}.rating-value{flex-wrap:wrap;justify-content:center}.age-rating{color:unset;font-family:Archivo Narrow,sans-serif;font-size:.8em}#slides-container{height:62%;left:var(--sidePadding);overflow:visible;position:absolute;top:calc(var(--appBarHeight)*2 + 1.25em);user-select:none;width:calc(100vw - var(--sidePadding)*2)}.slide{border:var(--defaultBorder);border-radius:var(--largerRadius);overflow:hidden;transition:border 0s}.logo-container{top:10vh}.backdrop-container,.backdrop-overlay,.backdrop:not(.tmla-mask){mask-image:none;-webkit-mask-image:none}.backdrop-overlay{background:linear-gradient(0deg,rgba(0,0,0,.85),40%,transparent)}.pause-button,.volume-toggle{top:1em!important}.separator-icon{color:var(--dimTextColor);font-size:5px}.dot{background-color:var(--textColor)!important;border-radius:.25em;height:.375em;opacity:.5;transition:width .5s;width:.375em}.dot.active{transform:none;width:2em}@media only screen and (orientation:landscape){.button-container,.dots-container,.genre,.info-container,.plot-container{top:unset}.button-container{bottom:3em}.dots-container{bottom:4.5em}.plot-container{bottom:7em;height:4em}.genre{bottom:12em}.info-container{bottom:14em}.logo-container{align-items:flex-end;max-width:35vw;top:3%}.gradient-overlay{background:linear-gradient(37deg,rgba(0,0,0,.2) 32%,rgb(29 29 29/7%) 47%,rgba(29,29,29,0));mask:none;-webkit-mask:none}}@media only screen and (max-width:767px) and (orientation:portrait){.button-container{bottom:3em}.genre,.tomato-rating{display:none}.dots-container{bottom:6em}.info-container{bottom:5em}.logo-container{top:calc(100% - 15em)}.backdrop:not(.tmla-mask){transform-origin:center}.left-arrow,.right-arrow{display:none!important}.play-button{order:2}}@media (min-width:75em){#slides-container{top:calc(var(--appBarHeight) + 1.25em)}.layout-tv #slides-container{top:calc(var(--appBarHeight)*2 + 1.25em)}}@media (min-width:100em){.layout-tv #slides-container{top:calc(var(--appBarHeight) + 1.25em)}}@media only screen and (max-height:767px) and (orientation:landscape){#slides-container{height:57%}.logo-container{top:3%}} \ No newline at end of file diff --git a/Theme/assets/add-ons/media-bar-plugin-support-v26.09.05.css b/Theme/assets/add-ons/media-bar-plugin-support-v26.09.05.css new file mode 100644 index 0000000..e203adb --- /dev/null +++ b/Theme/assets/add-ons/media-bar-plugin-support-v26.09.05.css @@ -0,0 +1,206 @@ +/*! Add-on: Media Bar Plugin Support v26.09.05 for the ElegantFin Theme for Jellyfin by lscambo13 */ +/* this styles the media bar plugin - start */ +.play-button::before, +.detail-button::before, +.favorite-button::before, +.favorite-button.favorited::before { + font-weight: 400; +} + +.play-button { + font-family: "Inter"; + font-size: 1em; + font-weight: 500; + order: 1; +} + +.detail-button, +.favorite-button { + order: 2; +} + +.backdrop:not(.tmla-mask), +.backdrop-container, +.backdrop-overlay { + mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85), 70%, rgba(0, 0, 0, 0)); + -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.85), 70%, rgba(0, 0, 0, 0)); + background-color: transparent; +} + +.backdrop:not(.tmla-mask) { + transform-origin: center left; +} + +.rating-value { + flex-wrap: wrap; + justify-content: center; +} + +.age-rating { + font-size: 0.8em; + font-family: "Archivo Narrow", sans-serif; + color: unset; +} + +#slides-container { + width: calc(100vw - (2 * var(--sidePadding))); + height: 62%; + top: calc(var(--appBarHeight) * 2 + 1.25em); + user-select: none; + position: absolute; + left: var(--sidePadding); + overflow: visible; +} + +.slide { + border: var(--defaultBorder); + border-radius: var(--largerRadius); + overflow: hidden; + transition: border 0s; +} + +.logo-container { + top: 10vh; +} + +.backdrop:not(.tmla-mask), +.backdrop-container, +.backdrop-overlay { + mask-image: none; + -webkit-mask-image: none; +} + +.backdrop-overlay { + background: linear-gradient(0deg, rgba(0, 0, 0, 0.85), 40%, transparent); +} + +.pause-button, +.volume-toggle { + top: 1em !important; +} + +.separator-icon { + font-size: 5px; + color: var(--dimTextColor); +} + +.dot { + border-radius: 0.25em; + width: 0.375em; + height: 0.375em; + transition: width 0.5s; + opacity: 0.5; + background-color: var(--textColor) !important; +} + +.dot.active { + width: 2em; + transform: none; +} + +@media only screen and (orientation: landscape) { + .button-container, + .dots-container, + .plot-container, + .genre, + .info-container { + top: unset; + } + + .button-container { + bottom: 3em; + } + + .dots-container { + bottom: 4.5em; + } + + .plot-container { + height: 4em; + bottom: 7em; + } + + .genre { + bottom: 12em; + } + + .info-container { + bottom: 14em; + } + + .logo-container { + top: 3%; + align-items: flex-end; + max-width: 35vw; + } + + .gradient-overlay { + mask: none; + -webkit-mask: none; + background: linear-gradient(37deg, rgb(0 0 0 / 20%) 32%, rgb(29 29 29 / 7%) 47%, rgb(29 29 29 / 0%) 100%); + } +} + +@media only screen and (max-width: 767px) and (orientation: portrait) { + .button-container { + bottom: 3em; + } + + .tomato-rating, + .genre { + display: none; + } + + .dots-container { + bottom: 6em; + } + + .info-container { + bottom: 5em; + } + + .logo-container { + top: calc(100% - 15em); + } + + .backdrop:not(.tmla-mask) { + transform-origin: center; + } + + .left-arrow, + .right-arrow { + display: none !important; + } + + .play-button { + order: 2; + } +} + +@media (min-width: 75em) { + #slides-container { + top: calc(var(--appBarHeight) + 1.25em); + } + + .layout-tv #slides-container { + top: calc(var(--appBarHeight) * 2 + 1.25em); + } +} + +@media (min-width: 100em) { + .layout-tv #slides-container { + top: calc(var(--appBarHeight) + 1.25em); + } +} + +@media only screen and (max-height: 767px) and (orientation: landscape) { + #slides-container { + height: 57%; + } + + .logo-container { + top: 3%; + } +} + +/* this styles the media bar plugin - end */