From a9aaf0382c502bb7ca2333abec84eee19a45e0ce Mon Sep 17 00:00:00 2001 From: lscambo13 Date: Thu, 7 Aug 2025 12:50:12 -0700 Subject: [PATCH] RELEASE: ElegantFin v25.08.08 --- ...n-jellyfin-theme-build-latest-minified.css | 4 +- Theme/ElegantFin-theme-v25.08.08.css | 3619 +++++++++++++++++ .../custom-media-covers-latest-min.css | 4 +- .../add-ons/custom-media-covers-v25.08.08.css | 2 + .../media-bar-plugin-support-latest-min.css | 4 +- .../media-bar-plugin-support-v25.08.08.css | 109 + 6 files changed, 3736 insertions(+), 6 deletions(-) create mode 100644 Theme/ElegantFin-theme-v25.08.08.css create mode 100644 Theme/assets/add-ons/custom-media-covers-v25.08.08.css create mode 100644 Theme/assets/add-ons/media-bar-plugin-support-v25.08.08.css diff --git a/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css b/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css index fa15bfd..e7d2da7 100644 --- a/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css +++ b/Theme/ElegantFin-jellyfin-theme-build-latest-minified.css @@ -1,2 +1,2 @@ -/* ElegantFin Theme v25.08.02 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{--elegantFinFooterText:"ElegantFin v25.08.02";color-scheme:dark;--darkerGradientPoint:#111827;--darkerGradientPointAlpha:rgba(17,24,39,.85);--lighterGradientPoint:#1d2635;--lighterGradientPointAlpha:rgba(29,38,53,.85);--headerColor:rgba(30,40,54,.8);--drawerColor:rgba(30,40,54,.9);--borderColor:hsl(214,13%,32%);--darkerBorderColor:hsl(214,13%,22%);--lighterBorderColor:hsla(0,0%,100%,.2);--selectorBackgroundColor:rgb(55,65,81);--selectorBackgroundColorAlpha:rgba(55,65,81,.5);--activeColorAlpha:rgba(119,91,244,.9);--activeColor:rgb(119,91,244);--osdSeekBarPlayedColor:var(--textColor);--osdSeekBarBufferedColorAlpha:rgba(128,128,128,.5);--osdSeekBarThumbColor:white;--tableBodyColor:rgb(31 41 55 / 1);--uiAccentColor:rgb(117 111 226);--btnMiniPlayColor:rgb(41 154 93);--btnMiniPlayBorderColor:rgb(50,167,105);--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);--defaultBorder:var(--borderWidth) solid var(--borderColor);--defaultLighterBorder:var(--borderWidth) solid var(--lighterBorderColor);--textColor:rgb(209,213,219);--dimTextColor:rgb(156,163,175);--backgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint) 35%,var(--lighterGradientPoint));--cardBackgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint),25%,var(--lighterGradientPoint));--headerColorGradient:linear-gradient(180deg,rgba(30,40,54,.95) 30%,55%,transparent 90%);--headerColorGradientAlt:linear-gradient(180deg,rgba(30,40,54,.95),70%,transparent);--headerBlurMask:linear-gradient(180deg,white 50%,85%,transparent);--cardFooterGradient:linear-gradient(0deg,rgb(0 0 0 / 90%),40%,transparent);--topOSDGradient:linear-gradient(180deg,hsla(0,0%,0%,.8),45%,hsla(0,0%,0%,0));--bottomOSDGradient:linear-gradient(0deg,hsla(0,0%,0%,.8),45%,hsla(0,0%,0%,0));--hoverGradientV:linear-gradient(0deg,transparent,rgb(255 255 255 / 100%) 45%,rgb(255 255 255 / 100%) 55%,transparent);--hoverGradientH:linear-gradient(90deg,transparent,rgb(255 255 255 / 100%) 45%,rgb(255 255 255 / 100%) 55%,transparent);--itemBackdropMask:linear-gradient(180deg,rgba(0,0,0,.8),75%,transparent);--largerRadius:1.25em;--largeRadius:1em;--smallRadius:.5em;--smallerRadius:.375em;--borderWidth:.06em;--borderWidthDouble:.12em;--sidePadding:3.3%;--itemColumnGap:1em;--primaryItemPageNegativeSpace:15vh;--secondaryItemPageNegativeSpace:35vh;--blurSmallest:blur(2px);--blurDefault:blur(5px);--blurLarge:blur(10px);--blurLargest:blur(20px);--shadow:.1em .1em .15em hsla(0,0%,0%,.3);--headerBlurLayerVisibility:"";--headerBackground:var(--headerColorGradient);--loginPageBgUrl:url("");--loginPageText:"Sign in to continue";--overlayPlayButtonPosition:2.8em;--iconPack:'Material Icons Round',Material Icons;--extraCardButtonsVisibility:none;--libraryLabelVisibility:none;--cardHoverEffect:""}html{font-family:"Inter",serif;font-optical-sizing:auto;font-weight:425;font-style:normal;-webkit-tap-highlight-color:transparent!important}.layout-mobile{--itemColumnGap:0;--sidePadding:5%}@font-face{font-family:'Material Icons Round';font-style:normal;font-weight:100 700;font-display:swap;src:url(https://fonts.gstatic.com/s/materialsymbolsrounded/v267/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format('woff2')}.material-icons{font-family:var(--iconPack)!important;font-weight:normal;font-style:normal;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;line-height:1;vertical-align:middle;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 48}.material-icons.info_outline:before{font-family:Material Icons}.dashboardFooter{font-family:"Noto Sans",serif;transition:transform 50ms}.dashboardFooter::after{content:var(--elegantFinFooterText);font-size:.8em;color:#4e4e60}::selection{background:var(--activeColorAlpha)}.cardImageIcon{color:var(--borderColor)}.card{padding:.375em;transition:width .5s}.card:focus .cardBox:not(.visualCardBox) .cardScalable{border-color:white!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(--uiAccentColor);color:var(--uiAccentColor)}.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:#fff!important}.emby-tabs .emby-button.show-focus:focus{outline:none!important}.card.show-animation:focus>.cardBox{-webkit-transform:scale(1.125);transform:scale(1.125)}[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}}.vertical-wrap:not(.centered){justify-content:flex-start!important}.countIndicator,.fullSyncIndicator,.mediaSourceIndicator{background:rgb(31,80,189);border:var(--defaultLighterBorder)}.cardScalable{border-radius:var(--largeRadius);border:var(--darkerBorderColor) solid var(--borderWidthDouble)!important;overflow:hidden!important;box-shadow:0 0 .25em 0 rgba(0,0,0,.4);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 .375s}.card.squareCard[data-type="TvChannel"] .cardImageContainer.cardContent{background-color:rgba(255,255,255,.2)}.cardImageContainer>.cardDefaultText{font-size:2em;padding-top:1.5em;color:transparent;white-space:pre}.cardImageContainer>.cardDefaultText::before{content:"?\A";color:var(--borderColor)}.card.card-hoverable:hover .cardScalable,.card.card-hoverable:hover .visualCardBox{border-color:white!important}.card.card-hoverable:hover .visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important}.card.card-hoverable:hover .cardImageContainer{transform:scale(1.025)}.card.card-hoverable .itemSelectionPanel{transition:transform .125s}.card.card-hoverable:hover .cardScalable,.card.card-hoverable:hover .itemSelectionPanel{transform:scale(1.02)}.card.card-hoverable .cardScalable:active{transition:transform .075s;transform:scale(1)}.cardScalable:has(.cardOverlayButton:hover)>.cardImageContainer{transform:scale(1)}.cardOverlayContainer{transition:.5s;background:rgba(255,255,255,.05)}.card.card-hoverable .cardOverlayContainer:after{content:var(--cardHoverEffect);transition:.5s;position:absolute;top:0;bottom:0;left:0;right:0;transform:translateY(-50%) translateX(0);background:var(--hoverGradientV)}.card.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(50%) translateX(0);opacity:0}.backdropCard.card-hoverable .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable .cardOverlayContainer:after{transform:translateY(0) translateX(-50%);background:var(--hoverGradientH)}.backdropCard.card-hoverable:hover .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(0) translateX(50%);opacity:0}.cardBox:not(.visualCardBox) .cardPadder{background-color:var(--lighterGradientPoint)}.cardOverlayContainer>.cardOverlayFab-primary{left:unset;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:white;border:var(--defaultLighterBorder);border-color:var(--btnMiniPlayBorderColor);font-size:75%;box-shadow:var(--shadow);z-index:2}.cardOverlayContainer>.cardOverlayFab-primary:hover,.listItemImageButton:hover{color:white}.layout-desktop .cardOverlayButton-br button[data-action="menu"],.layout-desktop .listItemButton[data-action="menu"]{display:none}.layout-desktop .cardOverlayButton-br,[dir=ltr].layout-desktop .cardOverlayButton-br{bottom:.75em;right:.5em;display:var(--extraCardButtonsVisibility);z-index:1}.layout-desktop .cardOverlayButton-br button{color:white;text-shadow:var(--shadow)}.layout-mobile .cardOverlayButton{padding:1em;font-size:60%}.layout-mobile .cardOverlayButton-br,[dir=ltr] .layout-mobile .cardOverlayButton-br{bottom:.25em;right:.25em}.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;color:white;border:none;text-shadow:1px 1px .1em black;color:white}.cardOverlayContainer:has(.cardOverlayButton:hover){backdrop-filter:var(--blurDefault)}.listViewUserDataButtons{font-size:small}.layout-mobile .listViewUserDataButtons{flex-direction:column;font-size:x-small}.listItem-largeImage[data-type="Episode"] .listViewUserDataButtons{flex-direction:column;font-size:small}.portraitCard{min-width:5em}.bannerCard{--cardCount:2}@media (min-width:220em){.portraitCard,.squareCard{--cardCount:25}.overflowPortraitCard,.overflowSquareCard{--cardCount:24}.squareCard:has(.cardFooter){--cardCount:22}.backdropCard{--cardCount:22}.overflowBackdropCard{--cardCount:21}}@media (max-width:220em){.portraitCard,.squareCard{--cardCount:21}.overflowPortraitCard,.overflowSquareCard{--cardCount:20}.squareCard:has(.cardFooter){--cardCount:18}.backdropCard{--cardCount:18}.overflowBackdropCard{--cardCount:17}}@media (max-width:200em){.portraitCard,.squareCard{--cardCount:17}.overflowPortraitCard,.overflowSquareCard{--cardCount:16}.squareCard:has(.cardFooter){--cardCount:14}.backdropCard{--cardCount:14}.overflowBackdropCard{--cardCount:13}}@media (max-width:170em){.portraitCard,.squareCard{--cardCount:14}.overflowPortraitCard,.overflowSquareCard{--cardCount:13}.squareCard:has(.cardFooter){--cardCount:10}.backdropCard{--cardCount:10}.overflowBackdropCard{--cardCount:9}}@media (max-width:150em){.portraitCard,.squareCard{--cardCount:10}.overflowPortraitCard,.overflowSquareCard{--cardCount:9}.squareCard:has(.cardFooter){--cardCount:8}.backdropCard{--cardCount:8}.overflowBackdropCard{--cardCount:7}}@media (max-width:120em){.portraitCard,.squareCard{--cardCount:8}.overflowPortraitCard,.overflowSquareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard{--cardCount:6}.overflowBackdropCard{--cardCount:5}}@media (max-width:100em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard,.squareCard:has(.cardFooter),.backdropCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard{--cardCount:6}.overflowBackdropCard{--cardCount:5}}@media (max-width:80em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:6}.squareCard:has(.cardFooter){--cardCount:5}.overflowBackdropCard,.backdropCard{--cardCount:5}}@media (max-width:62em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:5}.squareCard:has(.cardFooter){--cardCount:4}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:48.125em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:4}.squareCard:has(.cardFooter){--cardCount:3}.backdropCard,.overflowBackdropCard{--cardCount:3}}@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}}.card{--effectiveWidth:calc((99vw - (var(--sidePadding) * 2)));--cardWidth:calc(var(--effectiveWidth) / var(--cardCount) - var(--itemColumnGap));box-sizing:border-box;width:var(--cardWidth)!important}.layout-mobile .card{--cardWidth:calc(var(--effectiveWidth) / var(--cardCount))}@media (orientation:landscape) and (max-height:40em){.layout-mobile .card{--effectiveWidth:calc((65vw - (var(--sidePadding) * 2)))}}.detailPageWrapperContainer{padding-top:unset;margin-top:unset}.layout-desktop .detailPageWrapperContainer{background:transparent;min-height:46vh;background:linear-gradient(0deg,var(--darkerGradientPointAlpha) 70%,85%,transparent)}.layout-tv .detailPageWrapperContainer{padding-left:30vw;background:transparent;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;align-items:center;text-align:center;margin-bottom:-1.5em}.layout-mobile .detailPagePrimaryContainer{padding:.5em var(--sidePadding)}[dir=ltr] .detailPagePrimaryContent{padding-right:0}.layout-desktop .detailPagePrimaryContainer{background:transparent}.layout-desktop .detailPageSecondaryContainer{background-color:transparent}.detailPageSecondaryContainer{padding-top:0}.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>.material-icons{font-size:1.25em}.verticalSection.emby-scroller-container>h2.sectionTitle.sectionTitle-cards{padding-top:1.25em!important}#itemDetailPage .emby-scroller-container,#itemDetailPage .emby-scroller,#itemDetailPage .scrollX{margin:0 calc(-1 * var(--sidePadding));padding:0 var(--sidePadding)}.layout-desktop .emby-scroller-container,.layout-desktop .emby-scroller,.layout-desktop .scrollX{--itemColumnGap:.5em}.itemsContainer{column-gap:var(--itemColumnGap)}.layout-desktop .sectionTitle,.layout-tv .sectionTitle{font-size:1.5rem!important}.sectionTitleContainer-cards{padding-top:0}.sectionTitleContainer+.emby-scrollbuttons{padding-top:0}.layout-mobile:not(.sectionTitleContainer-cards)>.sectionTitle-cards{text-align:left}.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:.5em}.mediaInfoOfficialRating{background:transparent!important;font-size:.75em;font-family:'Noto Sans',sans-serif;line-height:1.5em;transform:translateY(-.15em);font-weight:600;border:var(--defaultBorder)}.starIcon{background:linear-gradient(to right,#90cea1,#01b4e4);-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:"%"}.layout-desktop .detailRibbon{height:32vh!important;margin-top:unset!important}.layout-desktop [dir=ltr] .detailPagePrimaryContainer,.layout-tv [dir=ltr] .detailPagePrimaryContainer{padding-left:var(--sidePadding)}@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:.3}}@keyframes animMoveUp{from{transform:translateY(-90%);opacity:0}to{transform:translateY(-100%);opacity:1}}.detailLogo{display:none}@supports (aspect-ratio:1 / 1){.detailLogo{display:block;top:calc(100vh - 10em - var(--primaryItemPageNegativeSpace));left:0;width:40%;transform:translateY(-100%);margin:auto 30%;height:25vh;background-position:bottom}.layout-tv .detailLogo{display:block}}.layout-mobile .detailLogo{display:block;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}.itemBackdrop{display:block!important}.layout-desktop .itemBackdrop{height:calc(100vh - 32vh - var(--primaryItemPageNegativeSpace))!important}.layout-mobile .itemBackdrop{margin-top:0;position:sticky;top:-30%;-webkit-mask:var(--itemBackdropMask);mask:var(--itemBackdropMask);animation:animMoveDown 1s ease-out forwards;height:45vh}.layout-mobile #itemDetailPage:has(.detailLogo.hide) .itemBackdrop{margin-bottom:-10vh}.layout-tv .detailLogo{height:20vh;top:39vh;left:30vw;width:60vw;margin:auto 5vw}.layout-tv .itemBackdrop{height:33vh}.detailImageContainer.padded-left{padding-left:0}.layout-tv .detailImageContainer.padded-left{padding-left:0;height:0;position:fixed}.layout-desktop .detailImageContainer .card{top:unset!important;width:22vh!important}.detailImageContainer .card.backdropCard{width:40vh!important;max-width:50vw;margin-bottom:1em}.detailImageContainer .card{display:none}.layout-tv .detailImageContainer .card{width:23vw!important;display:block!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 [dir=ltr] .infoWrapper,.layout-mobile .infoWrapper{padding-left:0}.infoWrapper{align-content:end;place-items:center;display:grid}.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:.5em}.detailLogo:not(.hide)~.detailPageWrapperContainer .nameContainer h1,#itemDetailPage:has(.detailImageContainer .card.backdropCard) .detailLogo,#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .detailLogo,#itemDetailPage:has(.detailImageContainer .cardImageIcon.person) .detailLogo,.detailImageContainer .card:not(.portraitCard):has(.cardImageIcon.person){z-index:2;display:none}.detailLogo.hide~.detailPageWrapperContainer .nameContainer h1{display:block!important}.detailImageContainer:has(.backdropCard,.squareCard)~.nameContainer h1,.detailImageContainer:has(.cardImageIcon.person)~.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"]){border:var(--defaultBorder);border-radius:var(--largeRadius);padding:.5em;background-color:var(--lighterGradientPointAlpha)}.detailImageContainer .card:has(.book,.person,.album),.detailImageContainer .card.backdropCard:has(.tv),.detailImageContainer .card.backdropCard:has(.live_tv){display:block}#itemDetailPage:has(.detailImageContainer .cardImageIcon.person,.detailImageContainer .cardImageIcon.book) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .backdropCard .cardImageIcon.tv) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .cardImageIcon.live_tv) .itemBackdrop{height:calc(100vh - 32vh - var(--secondaryItemPageNegativeSpace))!important}#itemDetailPage:has(.detailImageContainer .card.backdropCard),#itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album){background:linear-gradient(180deg,var(--darkerGradientPointAlpha) 80%,transparent)}.layout-mobile #itemDetailPage:has(.detailImageContainer .card.backdropCard) .itemBackdrop,.layout-mobile #itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album) .itemBackdrop{animation:animMoveDownSecondaryPage 1s ease-out forwards}.layout-mobile .cardImageIcon{font-size:3.5em}@media (max-width:50em){.homeLibraryButton{width:45.6%!important}}.homeLibraryButton{padding-inline-start:.25em;min-width:15%}@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{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: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 .25s}.backdropImage:before{transform:scale(1.1);filter:var(--blurLargest)}.backgroundContainer.withBackdrop{opacity:.9;background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.25))}.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop{opacity:.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:scale(1) translateY(-2.5%);opacity:0;filter:var(--blurLarge)}to{transform:scale(1) translateY(0%);opacity:1;filter:blur(0)}}.backdropImageFadeIn{transform-origin:bottom center;animation:animScaleUp 1s ease-out forwards}.appfooter{background-color:var(--headerColor)!important;backdrop-filter:var(--blurLargest)!important}.lyricPage{padding:0 var(--sidePadding)}.lyricsLine{font-size:2em;color:var(--textColor);text-align:center;align-self:center;font-weight:600;transition:transform .125s}.pastLyric,.futureLyric{transform:scale(.85);font-weight:400;text-align:center}.pastLyric{opacity:.45}.buttonActive{color:var(--uiAccentColor)!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:.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(--dimTextColor)}.backgroundProgress>div,.backgroundProgress{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}progress,::-webkit-progress-bar{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{border-radius:var(--smallRadius);height:.4em;margin-top:-.2em;background:var(--osdSeekBarBufferedColorAlpha);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);width:4px!important;height:.4em!important;border-radius:0}.sliderContainer:hover .mdl-slider::-webkit-slider-thumb{width:.2em!important;height:.8em!important;border-radius:.2em;transform:scale(1)}.sliderContainer:active .mdl-slider::-webkit-slider-thumb,.mdl-slider.show-focus:focus::-webkit-slider-thumb{width:.2em!important;height:.8em!important;border-radius:.2em;transform:scale(1) scaleY(1.25)}.mdl-slider::-moz-range-thumb{background:var(--osdSeekBarThumbColor)}.sliderMarkerContainer{margin:0 .1em}.sliderMarker.watched{background-color:var(--osdSeekBarPlayedColor)}.sliderMarker{height:4px;border-radius:2px}.iconOsdProgressInner{background:var(--osdSeekBarPlayedColor)}.selectLabel{max-height:2em}.button-link{color:rgb(200,200,200)}.button-link:hover{color:unset!important;text-decoration:none}.button-link:active{color:rgb(243,243,243)!important;text-decoration:none}.mainDrawer,.drawer-open{background-color:var(--drawerColor);border-right:var(--defaultBorder);backdrop-filter:var(--blurLarge)}.mainDrawer-scrollContainer{padding-bottom:5vh}.btnHeaderSave.button-flat{color:var(--uiAccentColor)!important;gap:.3em;border-radius:var(--smallRadius)}.button-flat:hover{color:unset}.button-flat:active{color:unset;background-color:rgba(255,255,255,.2)}.playstatebutton-icon-played{color:rgb(34,197,94)}.videoOsdBottom.videoOsdBottom-maincontrols .btnPause{font-size:2em}.nowPlayingBar .playPauseButton{font-size:2em}.nowPlayingInfoContainer .btnPlayPause{font-size:3em}.osdControls{display:flex;flex-direction:column-reverse}.itemDetailsGroup{outline:none;overflow:hidden;margin-top:1em;border:var(--defaultBorder);border-radius:var(--smallRadius);background-color:var(--lighterGradientPointAlpha)}@supports(display:revert){.itemDetailsGroup{outline:var(--defaultBorder);outline-offset:calc(-1 * var(--borderWidth));border:none}.layout-mobile .itemDetailsGroup{outline-offset:calc(-1 * var(--borderWidthDouble))}}.itemDetailsGroup>div:not(:last-child){border-bottom:var(--defaultBorder)}.detailsGroupItem{margin:0!important;justify-content:space-between;padding:.5em .9em;align-items:baseline}.detailsGroupItem>.label{font-weight:600;flex-basis:6em}.detailsGroupItem>.content>a{font-weight:400;text-align:end}.detailsGroupItem>.content{text-align:end;color:var(--dimTextColor)}.detailsGroupItem>.label{color:var(--textColor)}.itemExternalLinks{color:var(--textColor)}.itemExternalLinks.focuscontainer-x{color:transparent}.itemExternalLinks.focuscontainer-x>.button-link{color:var(--textColor);background-color:var(--selectorBackgroundColor);padding:.125em .5em;border-radius:var(--smallerRadius);margin-bottom:.5em}.layout-mobile .itemExternalLinks.focuscontainer-x>.button-link:hover:not(:active){color:var(--textColor)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a:hover,.itemExternalLinks.focuscontainer-x>a:active{background-color:var(--activeColor)!important;color:white!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:active{background-color:rgb(26,183,216)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:active{background-color:rgb(226,182,22)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:active{background-color:rgb(108,213,145)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:active{background-color:rgb(171,58,173)!important;color:var(--textColor)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:active{background-color:rgb(99,153,204)!important;color:rgb(15,22,28)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:active{background-color:rgb(186,71,143)!important;color:var(--textColor)!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;-webkit-line-clamp:2}.detail-clamp-text p{margin-top:.25em;margin-bottom:.25em}.layout-mobile .detail-clamp-text{-webkit-line-clamp:4}.overview-expand.emby-button{padding:0;margin-top:1.4em;margin-bottom:1.4em;color:transparent}.overview-expand.emby-button:after{content:"\e313";font-family:'Material Icons';background:var(--selectorBackgroundColor);border-radius:50%;width:1.5em;height:1.5em;align-content:center;line-height:1.6ch;transition:transform .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:.5em}.itemMiscInfo{align-items:flex-end!important;justify-content:center}.innerCardFooter,.chapterThumbTextContainer{background:var(--cardFooterGradient);text-shadow:.1em .1em 0 black;width:-webkit-fill-available;height:-webkit-fill-available;padding:0 2em 2em 2em;align-content:end;display:grid}.chapterCardImageContainer{background-size:135%}.chapterCardImageContainer+.innerCardFooter{padding:0 1em 1em 1em;height:auto}.layout-mobile .innerCardFooter{padding:5em 1.5em 1.5em 1.5em}.layout-mobile .chapterCardImageContainer+.innerCardFooter{padding:0 .5em .5em .5em}.centerMessage{width:unset}.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:.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 .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)}.selectionCommandsPanel>h1{font-size:large}.itemSelectionPanel{border:unset;background-color:transparent}.emby-checkbox:checked+span+.checkboxOutline{border-radius:var(--smallerRadius)!important;box-shadow:inset 0 7em 10em 20px rgba(0,0,0,.8);background:transparent;border-color:white;border-style:solid;border-width:var(--borderWidthDouble);outline:none}@supports(display:revert){.emby-checkbox:checked+span+.checkboxOutline{outline:solid var(--borderWidth) white}}.checkboxOutline{top:unset;height:1.3em;width:1.3em;border-radius:var(--smallerRadius)}.itemSelectionPanel .material-icons.check:before{font-size:4em;color:#ffffff;padding:.25em}.cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 1.75em)}.overflowBackdropCard .cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 0)}.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:calc(100% - 0)}.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius);border-width:0;width:100%;height:100%}.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon{font-size:.9em;font-weight:900}.checkboxOutline:not(.multiSelectCheckboxOutline){border:solid gray var(--borderWidth);background-color:white;transition:all .125s}.emby-checkbox:checked+span+.checkboxOutline:not(.multiSelectCheckboxOutline){box-shadow:none;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:not(:checked)+span+.checkboxOutline{outline:var(--borderWidth) solid gray;outline-offset:calc(-2.5*var(--borderWidth))}.emby-checkbox:focus+span+.checkboxOutline{border-color:white!important;outline:var(--borderWidth) solid var(--highlightOutlineColor)}}.layout-tv .emby-checkbox:focus+span+.checkboxOutline{transform:scale(1.75)}.cardIndicators{-webkit-align-items:center;align-items:center;top:.5em}[dir=ltr] .cardIndicators{right:.5em}.layout-mobile .cardIndicators{top:.2em;right:.2em}.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:.5em;transform:scale(.85);border:var(--defaultLighterBorder);font-size:.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:"\f1c6";font-size:85%}div[data-type="Photo"] .play_arrow:before{content:"\e5d0"}div[data-type="PhotoAlbum"] .play_arrow:before{content:"\e8eb"}.emby-button.block,.button-alt,.raised,#btnDeleteImage,.manageRecordingButton,.dashboardActionsContainer>.emby-button{color:#fff;border-radius:var(--smallRadius);background:var(--lighterGradientPoint);border:var(--defaultBorder);transition:all .125s}.editItemMetadataForm>.metadataFormFields div:has(.formDialogFooterItem){display:flex;justify-content:center}.btnBrowse>.folder{margin-inline-end:.5em}.fab{color:#fff;background:var(--lighterGradientPoint);border:var(--defaultBorder)}.fab:focus{background:var(--lighterGradientPoint)!important;filter:brightness(1.2)}.raised:focus{background:inherit;filter:brightness(1.2)}.raised:active,.fab:active,.emby-button:active{filter:brightness(1.2)!important;transform:scale(.98)}.detailButton{border:var(--defaultLighterBorder);padding:.5em .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){color:var(--textColor);backdrop-filter:none;border-color:transparent;margin:.5em!important;border-radius:50%;padding:.6em!important;background:transparent}.layout-desktop .detailButton:not(.btnPlay):hover{color:black;background:var(--dimTextColor)}.detailButton:active{color:black;background:var(--textColor)}.btnPlay.detailButton{background-color:var(--textColor);color:black;border-radius:3em;border-color:var(--borderColor);height:3em;width:10em;margin-right:.5em!important}.btnPlay>.detailButton-content{-webkit-align-items:unset;align-items:unset;display:-webkit-flex;display:flex;-webkit-flex-direction:unset;flex-direction:unset;-webkit-justify-content:unset;align-content:unset;justify-content:flex-start}.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay[title="Play"]>.detailButton-content::after{content:"Read"}.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay .material-icons.play_arrow:before{content:"\f1c6";padding-inline-end:1ch}.btnPlay[title="Play"]>.detailButton-content::after{content:"Play"}.btnPlay[title="Resume"]>.detailButton-content::after{content:"Resume"}.btnPlay>.detailButton-content::after{padding:0 1ch;place-content:center}.mainDetailButtons{justify-content:center;margin:0 0 1em 0}.layout-mobile [dir=ltr] .mainDetailButtons{flex-wrap:wrap;padding:0 1.25em}@media (min-width:100em){.mainDetailButtons{font-size:unset;margin:0 0 1em 0}}.localnav>.emby-button{background:var(--lighterGradientPoint)!important;color:#fff;padding:.8em .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:white}#btnDeleteImage,.button-delete,.btnRevoke,#btnShutdown{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){background-color:var(--headerColor);backdrop-filter:var(--blurDefault)}.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.notifications:not(.listItemIcon-transparent),.listItemIcon.schedule:not(.listItemIcon-transparent),.listItemIcon.person:not(.listItemIcon-transparent),.listItemIcon.live_tv:not(.listItemIcon-transparent){background-color:rgb(41,49,83)!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:.25em}.listItemImage{border-radius:var(--smallRadius);margin-right:.75em!important;border:var(--defaultBorder)}[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"]{padding:.375em;margin-bottom:.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:white;font-weight:600}.listItem[data-type="Audio"]:has(.playlistIndexIndicatorImage):not(:hover){background-color:rgba(255,255,255,.07)}[dir="ltr"] .listItem:not(.actionSheetMenuItem)[data-type="Episode"] .listItemBodyText:not(.secondary){font-size:1.17em;font-weight:600}.listItemBody>.listItemBodyText:not(.secondary){display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:var(--textColor)}.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:.75em;margin-bottom:0}.listItem,.navMenuOption{border-radius:.7em}.listItem:hover,.navMenuOption:hover{background:unset;border-radius:.7em}.listItem:focus{background:var(--highlightOutlineColor)}.listItem:active,.navMenuOption:active{background:rgba(255,255,255,.125)}.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:.7em;margin:.25 .5em!important}.Mui-selected{background-color:var(--activeColor)!important}.actionsheetDivider{height:2px;background:rgb(255,255,255,.05)}.actionsheet-xlargeFont{line-height:normal}.actionSheetContent{padding:.4em!important}.actionSheetContent>h1{font-size:unset}[dir=ltr] .actionsheetMenuItemIcon.check{margin:0 .45em 0 .45em!important}.actionSheetMenuItem:has(.listItemIcon.check){background-color:var(--activeColor)}.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText{color:white}.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:rgba(255,255,255,.125)}.navMenuOption{border-radius:var(--smallRadius)!important;margin:0 1em!important}[dir=ltr] .navMenuOption{padding:.75em 1em!important;margin-bottom:unset}#myPreferencesMenuPage .listItemIcon{margin-left:.5em;margin-right:.25em}.navMenuOption-selected{background-color:var(--activeColor)!important}#itemDetailPage .detailSection{display:grid;row-gap:1em;column-gap:3em;max-width:unset!important;grid-template-columns:1fr 1fr}.layout-mobile .detailSection{grid-template-columns:1fr}.detailPageContent{gap:1em}.detailImageContainer .card{position:inherit!important}.trackSelections{order:3;max-width:unset!important;margin-top:1em;border:var(--defaultBorder);border-radius:var(--smallRadius);padding:1em;grid-column:2;background-color:var(--lighterGradientPointAlpha)}.recordingFields{order:4}.detailsGroupItem,.trackSelections .selectContainer{max-width:unset!important;align-items:baseline}.selectArrowContainer{top:0;opacity:.5}.trackSelectionFieldContainer>.selectArrowContainer{top:.5em}.trackSelectionFieldContainer>label{max-width:2.75em;background-repeat:no-repeat;color:transparent;transform:scale(.9)}.selectVideoContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectAudioContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectSubtitlesContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectSourceContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.detailSectionContent{order:1;grid-column:1 / -1}.detailSectionContent a:not(.overview-expand){text-align:start}.layout-desktop .detailSectionContent{align-content:end;min-height:15vh}.itemDetailsGroup{order:2;grid-column:1}.trackSelections.hide~.recordingFields.hide~.itemDetailsGroup{grid-column:1 / -1}.layout-mobile .trackSelections,.layout-mobile .detailSectionContent,.layout-mobile .itemDetailsGroup,.layout-tv .trackSelections,.layout-tv .detailSectionContent,.layout-tv .itemDetailsGroup{grid-column:1 / -1}.sliderBubble{border-radius:var(--largeRadius);border:var(--defaultBorder);overflow:hidden;z-index:3}.alphaPickerButton{font-family:monospace;margin:.15em;color:rgba(255,255,255,.25)}.alphaPickerButton-selected{color:rgba(255,255,255,1)}.alphaPicker-vertical{height:70%}.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}.paddded-left{padding-left:var(--sidePadding)!important}.layout-mobile .padded-right-withalphapicker{padding-left:3.5%;padding-right:6.5%}.detailPagePrimaryContent.padded-right{padding-right:0!important}[dir=ltr] .detailPageContent,.content-primary{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}#itemDetailPage .verticalSection .itemsContainer.padded-right{padding-right:0!important}.listPaging>span{padding:0 .5em}.layout-mobile #myPreferencesMenuPage{padding-top:3.75em!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}.sectionTitleTextButton{padding:0 .5em}.sectionTitleTextButton:hover{background:transparent!important}.sectionTitleTextButton:active{color:white!important}.sectionTitleTextButton>*{padding:.3em 0!important;margin:0 0!important}.dashboardSection .sectionTitleTextButton>.material-icons,.sectionTitleTextButton>.material-icons,.dashboardSection .sectionTitleTextButton>.material-icons.material-icons{font-size:unset}.sectionTitleTextButton>.material-icons::before{display:none}.sectionTitleTextButton>.material-icons.chevron_right{margin-left:.5rem!important;height:1.5rem;width:1.5rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23D1D5DB' aria-hidden='true'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12.75 15l3-3m0 0l-3-3m3 3h-7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;background-size:contain}.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}.upNextContainer .btnStartNow{background-color:var(--btnSubmitColor);border-color:var(--btnSubmitBorderColor)}.upNextDialog-title{white-space:wrap;width:unset}.upNextDialog-buttons{width:unset;flex-wrap:wrap}.upNextContainer .upNextDialog-countdownText{color:white}.skip-button{background-color:whitesmoke;box-shadow:var(--shadow)}.skip-button:hover{background-color:white}.skip-button:active{background-color:rgba(245,245,245,.7);box-shadow:none}.toast,.upNextContainer{background:var(--headerColor)!important;border:var(--defaultBorder)!important;backdrop-filter:var(--blurDefault)}.activeSession{width:98%!important}.emby-tab-button:hover{color:whitesmoke}@media (hover:hover) and (pointer:fine){.paper-icon-button-light:hover:not(:disabled){color:#fff;background-color:rgb(255 255 255 / 5%)}.actionSheetMenuItem.emby-button:has(.listItemIcon.material-icons.check[style*="hidden"]):hover{background-color:rgba(255,255,255,.125)}.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,.2);color:white}.btnPlay.detailButton:hover{background-color:var(--textColor);color:black}.alphaPickerButton:hover{color:rgba(255,255,255,1)}.listItem:hover{background:rgba(255,255,255,.125);backdrop-filter:var(--blurLargest)}.navMenuOption:hover{background:rgba(255,255,255,.125)}.searchfields-icon:hover,.inputContainer .emby-input-iconbutton:hover{color:rgba(255,255,255,.8)}#scenesContent .cardScalable:hover{border-color:var(--dimTextColor)!important}.sectionTitleTextButton:hover{background:transparent!important;color:white!important}.button-link:hover{color:rgb(243,243,243)!important;text-decoration:none}}.paper-icon-button-light:active:not(:disabled){color:#fff;background-color:rgb(255 255 255 / 5%)}.emby-textarea{font-family:consolas}.emby-select-withcolor,.emby-select,.emby-input,.emby-textarea{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);border-radius:var(--smallRadius);padding:.5em!important}.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused{color:#fff}.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}}.emby-select-withcolor>option{color:inherit;background-color:var(--selectorBackgroundColor)}.inputContainer .emby-input-iconbutton{color:rgba(255,255,255,.5);margin-left:-2.5em;background-color:transparent!important}.searchfields-txtSearch{padding:.75em 1.5em!important;border-radius:4em}.searchfields-icon{padding:.25em;margin-left:-1.75em;margin-bottom:0;border-radius:var(--largeRadius);color:rgba(255,255,255,.5)}.searchfields-icon:active,.inputContainer .emby-input-iconbutton:active{color:rgba(255,255,255,.8)}.searchFields>.searchFieldsInner{flex-direction:row-reverse}.infoWrapper h1.itemName,.infoWrapper h1.parentName{font-size:4em;white-space:pre-wrap;padding-bottom:.5ch;color:white}.infoWrapper h1.itemName,.infoWrapper h1.parentName,.infoWrapper h1.itemName a,.infoWrapper h1.parentName a{font-weight:200}.infoWrapper h1.itemName bdi,.infoWrapper h1.parentName bdi,.infoWrapper h1.itemName a,.infoWrapper h1.parentName a{display:-webkit-box!important;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical}.layout-mobile .infoWrapper h1.itemName,.layout-mobile .infoWrapper h1.parentName,.layout-mobile .infoWrapper h1.parentNameLast{font-size:2em;word-wrap:break-word;padding-bottom:0}.itemName.originalTitle{padding-top:.25em;padding-bottom:.25em;color:var(--dimTextColor)}.channelPrograms+.channelPrograms,.guide-channelHeaderCell+.guide-channelHeaderCell{margin-top:0}.channelPrograms,.guide-channelHeaderCell,.programCell{border-color:transparent;background-color:transparent!important;border-radius:var(--smallRadius)}.guideProgramName{background-color:rgba(255,255,255,.05);height:-webkit-fill-available;margin:.35em 0 .35em .7em;border-radius:var(--smallerRadius)}.guide-programNameCaret{display:none}.programCell-active .guideProgramName{background-color:rgba(255,255,255,.125)}.guideVerticalScroller{padding:0}.guideChannelImage{background-color:rgba(255,255,255,.05);bottom:.35em;right:.35em;top:.35em;width:calc(100% - .7em);border-radius:var(--smallerRadius)}#guideTab{padding-top:3em!important}.guide-channelHeaderCell:focus,.programCell:focus{background-color:var(--highlightOutlineColor)!important}.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}.sliderBubbleText{font-size:1.5em}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)}ul.MuiList-root.MuiMenu-list.MuiList-dense>div:first-child{gap:.5rem}.playerStats,.iconOsd{border-radius:var(--largeRadius);background-color:rgba(69,69,69,.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(--uiAccentColor)}.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,.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:white;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}.startTimeText{margin:0!important}.endTimeText{justify-content:right;padding-inline-end:.8em;margin:0 0 0 .75em!important}.startTimeText,.endTimeText{padding-top:.25em}.startTimeText,.positionTime{text-align:start;justify-content:left}.endTimeText,.runtime{text-align:end;justify-content:right}.filterIndicator{background:var(--activeColor)}#homeTab .overflowBackdropCard[data-isfolder="true"] .cardPadder-overflowBackdrop{padding-bottom:50%}#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText-first,#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText.cardTextCentered{display:var(--libraryLabelVisibility)}.nowPlayingButtonsContainer{margin-top:1em}.nowPlayingPageImageContainerNoAlbum{border:var(--defaultBorder);border-radius:var(--smallRadius);overflow:hidden}.nowPlayingPageImageContainerNoAlbum .defaultCardBackground{background:repeating-radial-gradient(black,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);z-index:1}.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent{background:transparent;border-top:var(--defaultBorder);border-color:transparent}.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:0 2em}.nowPlayingPageImage{box-shadow:var(--shadow);border-radius:var(--smallRadius);object-fit:cover;aspect-ratio:1 / 1}.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{margin-bottom:1em;font-size:1.25em;color:var(--textColor)}.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-size:unset;font-weight:600;list-style-type:circle;margin-bottom:.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:white;background-color:transparent!important}.MuiToggleButtonGroup-grouped.Mui-selected{color:white}.MuiButtonBase-root.MuiIconButton-root:hover{color:white;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 .5s}.skinHeader-blurred:not(.osdHeader){backdrop-filter:none;background-color:transparent;border:none;border-width:0 0 var(--borderWidth) 0;background:var(--headerBackground);padding-top:.75em}.layout-mobile .skinHeader-blurred:not(.osdHeader){padding-top:.25em}.layout-mobile .withSectionTabs .headerTop{padding-bottom:1.45em}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent)::after{content:var(--headerBlurLayerVisibility);position:absolute;top:0;bottom:0;left:0;right:0;backdrop-filter:var(--blurLargest);-webkit-mask:var(--headerBlurMask);mask:var(--headerBlurMask);z-index:-1}.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,.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty) .headerButton{text-shadow:1px 1px 0 #00000080}.headerTop{-webkit-align-items:flex-end;align-items:flex-end}.headroom--unpinned{-webkit-transform:translateY(-3.7em);transform:translateY(-3.7em)}.noHomeButtonHeader .emby-tab-button[data-index="1"]:before{content:"\e87d"}.noHomeButtonHeader .emby-tab-button[data-index="0"]:before{content:"\e88a"}.noHomeButtonHeader .emby-tab-button:before{font-family:'Material Icons Round';padding-inline-end:.5ch;font-size:1.2em;font-variation-settings:'FILL' 0}.headerTabs.sectionTabs{margin:0;height:6em}.layout-tv .sectionTabs .emby-tabs.smoothScrollX{overflow:visible!important}.layout-tv .sectionTabs{width:100%}.headerTabs.sectionTabs .emby-tab-button{display:inline-flex;margin:.25em .5em;padding:0 1.25em;height:2.5em;color:var(--textColor);font-weight:400;border-radius:var(--largeRadius);background-color:var(--darkerGradientPointAlpha)}.headerTabs.sectionTabs .emby-tab-button-active{margin:.25em .5em;color:black;background-color:var(--textColor)}.layout-mobile .headerTabs.sectionTabs .emby-tab-button:first-child{margin-left:var(--sidePadding)}.layout-mobile .headerTabs.sectionTabs .emby-tab-button:last-child{margin-right:var(--sidePadding)}@media (min-width:75em){.sectionTabs:not(.layout-tv .sectionTabs){-webkit-align-items:center;align-items:center;-webkit-align-self:center;align-self:center;-webkit-justify-content:center;justify-content:center;margin-top:-3em;position:relative;width:auto}.libraryPage:not(.noSecondaryNavPage):not(.layout-tv .libraryPage){padding-top:6.8em!important}}@media (max-width:100em){.sectionTabs{font-size:100%}}.libraryPage:not(.noSecondaryNavPage){padding-top:9.5em!important}.layout-tv .headerLeft{overflow:unset;margin:.25em .5em}.remoteControlContent{padding:0 var(--sidePadding)!important} \ No newline at end of file +/* ElegantFin Theme v25.08.08 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{--elegantFinFooterText:"ElegantFin v25.08.08";color-scheme:dark;--darkerGradientPoint:#111827;--darkerGradientPointAlpha:rgba(17,24,39,.85);--lighterGradientPoint:#1d2635;--lighterGradientPointAlpha:rgba(29,38,53,.85);--headerColor:rgba(30,40,54,.8);--drawerColor:rgba(30,40,54,.9);--borderColor:hsl(214,13%,32%);--darkerBorderColor:hsl(214,13%,22%);--lighterBorderColor:hsla(0,0%,100%,.2);--selectorBackgroundColor:rgb(55,65,81);--selectorBackgroundColorAlpha:rgba(55,65,81,.5);--activeColorAlpha:rgba(119,91,244,.9);--activeColor:rgb(119,91,244);--osdSeekBarPlayedColor:var(--textColor);--osdSeekBarBufferedColorAlpha:rgba(128,128,128,.5);--osdSeekBarThumbColor:white;--tableBodyColor:rgb(31 41 55 / 1);--uiAccentColor:rgb(117 111 226);--btnMiniPlayColor:rgb(41 154 93);--btnMiniPlayBorderColor:rgb(50,167,105);--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);--defaultBorder:var(--borderWidth) solid var(--borderColor);--defaultLighterBorder:var(--borderWidth) solid var(--lighterBorderColor);--textColor:rgb(209,213,219);--dimTextColor:rgb(156,163,175);--backgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint) 35%,var(--lighterGradientPoint));--cardBackgroundGradient:linear-gradient(0deg,var(--darkerGradientPoint),25%,var(--lighterGradientPoint));--headerColorGradient:linear-gradient(180deg,rgba(30,40,54,.95) 30%,55%,transparent 90%);--headerColorGradientAlt:linear-gradient(180deg,rgba(30,40,54,.95),70%,transparent);--headerBlurMask:linear-gradient(180deg,white 50%,85%,transparent);--cardFooterGradient:linear-gradient(0deg,rgb(0 0 0 / 90%),40%,transparent);--topOSDGradient:linear-gradient(180deg,hsla(0,0%,0%,.8),45%,hsla(0,0%,0%,0));--bottomOSDGradient:linear-gradient(0deg,hsla(0,0%,0%,.8),45%,hsla(0,0%,0%,0));--hoverGradientV:linear-gradient(0deg,transparent,rgb(255 255 255 / 100%) 45%,rgb(255 255 255 / 100%) 55%,transparent);--hoverGradientH:linear-gradient(90deg,transparent,rgb(255 255 255 / 100%) 45%,rgb(255 255 255 / 100%) 55%,transparent);--itemBackdropMask:linear-gradient(180deg,rgba(0,0,0,.8),75%,transparent);--largerRadius:1.25em;--largeRadius:1em;--smallRadius:.5em;--smallerRadius:.375em;--borderWidth:.06em;--borderWidthDouble:.12em;--sidePadding:3.3%;--itemColumnGap:1em;--primaryItemPageNegativeSpace:15vh;--secondaryItemPageNegativeSpace:35vh;--blurSmallest:blur(2px);--blurDefault:blur(5px);--blurLarge:blur(10px);--blurLargest:blur(20px);--shadow:.1em .1em .15em hsla(0,0%,0%,.3);--headerBlurLayerVisibility:"";--headerBackground:var(--headerColorGradient);--loginPageBgUrl:url("");--loginPageText:"Sign in to continue";--overlayPlayButtonPosition:2.8em;--iconPack:'Material Icons Round',Material Icons;--extraCardButtonsVisibility:none;--libraryLabelVisibility:none;--cardHoverEffect:""}html{font-family:"Inter",serif;font-optical-sizing:auto;font-weight:425;font-style:normal;-webkit-tap-highlight-color:transparent!important}.layout-mobile{--itemColumnGap:0;--sidePadding:5%}@font-face{font-family:'Material Icons Round';font-style:normal;font-weight:100 700;font-display:swap;src:url(https://fonts.gstatic.com/s/materialsymbolsrounded/v267/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format('woff2')}.material-icons{font-family:var(--iconPack)!important;font-weight:normal;font-style:normal;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;line-height:1;vertical-align:middle;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;font-feature-settings:'liga';font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0,'opsz' 48}.material-icons.info_outline:before{font-family:Material Icons}.dashboardFooter{font-family:"Noto Sans",serif;transition:transform 50ms}.dashboardFooter::after{content:var(--elegantFinFooterText);font-size:.8em;color:#4e4e60}::selection{background:var(--activeColorAlpha)}.cardImageIcon{color:var(--borderColor)}.card{padding:.375em;transition:width .5s}.card:focus .cardBox:not(.visualCardBox) .cardScalable{border-color:white!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(--uiAccentColor);color:var(--uiAccentColor)}.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:#fff!important}.emby-tabs .emby-button.show-focus:focus{outline:none!important}.card.show-animation:focus>.cardBox{-webkit-transform:scale(1.125);transform:scale(1.125)}[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}}.vertical-wrap:not(.centered){justify-content:flex-start!important}.countIndicator,.fullSyncIndicator,.mediaSourceIndicator{background:rgb(31,80,189);border:var(--defaultLighterBorder)}.cardScalable{border-radius:var(--largeRadius);border:var(--darkerBorderColor) solid var(--borderWidthDouble)!important;overflow:hidden!important;box-shadow:0 0 .25em 0 rgba(0,0,0,.4);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 .375s}.card.squareCard[data-type="TvChannel"] .cardImageContainer.cardContent{background-color:rgba(255,255,255,.2)}.cardImageContainer>.cardDefaultText{font-size:2em;padding-top:1.5em;color:transparent;white-space:pre}.cardImageContainer>.cardDefaultText::before{content:"?\A";color:var(--borderColor)}.card.card-hoverable:hover .cardScalable,.card.card-hoverable:hover .visualCardBox{border-color:white!important}.card.card-hoverable:hover .visualCardBox .cardScalable{border-color:var(--darkerBorderColor)!important}.card.card-hoverable:hover .cardImageContainer{transform:scale(1.025)}.card.card-hoverable .itemSelectionPanel{transition:transform .125s}.card.card-hoverable:hover .cardScalable,.card.card-hoverable:hover .itemSelectionPanel{transform:scale(1.02)}.card.card-hoverable .cardScalable:active{transition:transform .075s;transform:scale(1)}.cardScalable:has(.cardOverlayButton:hover)>.cardImageContainer{transform:scale(1)}.cardOverlayContainer{transition:.5s;background:rgba(255,255,255,.05)}.card.card-hoverable .cardOverlayContainer:after{content:var(--cardHoverEffect);transition:.5s;position:absolute;top:0;bottom:0;left:0;right:0;transform:translateY(-50%) translateX(0);background:var(--hoverGradientV)}.card.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(50%) translateX(0);opacity:0}.backdropCard.card-hoverable .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable .cardOverlayContainer:after{transform:translateY(0) translateX(-50%);background:var(--hoverGradientH)}.backdropCard.card-hoverable:hover .cardOverlayContainer:after,.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after{transform:translateY(0) translateX(50%);opacity:0}.cardBox:not(.visualCardBox) .cardPadder{background-color:var(--lighterGradientPoint)}.cardOverlayContainer>.cardOverlayFab-primary{left:unset;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:white;border:var(--defaultLighterBorder);border-color:var(--btnMiniPlayBorderColor);font-size:75%;box-shadow:var(--shadow);z-index:2}.cardOverlayContainer>.cardOverlayFab-primary:hover,.listItemImageButton:hover{color:white}.layout-desktop .cardOverlayButton-br button[data-action="menu"],.layout-desktop .listItemButton[data-action="menu"]{display:none}.layout-desktop .cardOverlayButton-br,[dir=ltr].layout-desktop .cardOverlayButton-br{bottom:.75em;right:.5em;display:var(--extraCardButtonsVisibility);z-index:1}.layout-desktop .cardOverlayButton-br button{color:white;text-shadow:var(--shadow)}.layout-mobile .cardOverlayButton{padding:1em;font-size:60%}.layout-mobile .cardOverlayButton-br,[dir=ltr] .layout-mobile .cardOverlayButton-br{bottom:.25em;right:.25em}.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;color:white;border:none;text-shadow:1px 1px .1em black;color:white}.cardOverlayContainer:has(.cardOverlayButton:hover){backdrop-filter:var(--blurDefault)}.listViewUserDataButtons{font-size:small}.layout-mobile .listViewUserDataButtons{flex-direction:column;font-size:x-small}.listItem-largeImage[data-type="Episode"] .listViewUserDataButtons{flex-direction:column;font-size:small}.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{--cardCount:9}.overflowBackdropCard{--cardCount:8}}@media (max-width:200em){.portraitCard,.squareCard{--cardCount:11}.overflowPortraitCard,.overflowSquareCard{--cardCount:10}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard{--cardCount:9}.overflowBackdropCard{--cardCount:8}}@media (max-width:170em){.portraitCard,.squareCard{--cardCount:10}.overflowPortraitCard,.overflowSquareCard{--cardCount:9}.squareCard:has(.cardFooter){--cardCount:9}.backdropCard{--cardCount:8}.overflowBackdropCard{--cardCount:7}}@media (max-width:140em){.portraitCard,.squareCard{--cardCount:9}.overflowPortraitCard,.overflowSquareCard{--cardCount:8}.squareCard:has(.cardFooter){--cardCount:7}.backdropCard{--cardCount:7}.overflowBackdropCard{--cardCount:6}}@media (max-width:120em){.portraitCard,.squareCard{--cardCount:8}.overflowPortraitCard,.overflowSquareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard{--cardCount:6}.overflowBackdropCard{--cardCount:5}}@media (max-width:100em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:7}.squareCard:has(.cardFooter){--cardCount:6}.backdropCard{--cardCount:6}.overflowBackdropCard{--cardCount:5}}@media (max-width:80em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:6}.squareCard:has(.cardFooter){--cardCount:5}.overflowBackdropCard,.backdropCard{--cardCount:4}}@media (max-width:62em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:5}.squareCard:has(.cardFooter){--cardCount:4}.backdropCard,.overflowBackdropCard{--cardCount:4}}@media (max-width:48.125em){.portraitCard,.squareCard,.overflowPortraitCard,.overflowSquareCard{--cardCount:4}.squareCard:has(.cardFooter){--cardCount:3}.backdropCard,.overflowBackdropCard{--cardCount:3}}@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}}.card{--effectiveWidth:calc((99vw - (var(--sidePadding) * 2)));--cardWidth:calc(var(--effectiveWidth) / var(--cardCount) - var(--itemColumnGap));box-sizing:border-box;width:var(--cardWidth)!important}.layout-mobile .card{--cardWidth:calc(var(--effectiveWidth) / var(--cardCount))}@media (orientation:landscape) and (max-height:40em){.layout-mobile .card{--effectiveWidth:calc((65vw - (var(--sidePadding) * 2)))}}.detailPageWrapperContainer{padding-top:unset;margin-top:unset}.layout-desktop .detailPageWrapperContainer{background:transparent;min-height:46vh;background:linear-gradient(0deg,var(--darkerGradientPointAlpha) 70%,85%,transparent)}.layout-tv .detailPageWrapperContainer{padding-left:30vw;background:transparent;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;align-items:center;text-align:center;margin-bottom:-1.5em}.layout-mobile .detailPagePrimaryContainer{padding:.5em var(--sidePadding)}[dir=ltr] .detailPagePrimaryContent{padding-right:0}.layout-desktop .detailPagePrimaryContainer{background:transparent}.layout-desktop .detailPageSecondaryContainer{background-color:transparent}.detailPageSecondaryContainer{padding-top:0}.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>.material-icons{font-size:1.25em}.verticalSection.emby-scroller-container>h2.sectionTitle.sectionTitle-cards{padding-top:1.25em!important}#itemDetailPage .emby-scroller-container,#itemDetailPage .emby-scroller,#itemDetailPage .scrollX{margin:0 calc(-1 * var(--sidePadding));padding:0 var(--sidePadding)}.layout-desktop .emby-scroller-container,.layout-desktop .emby-scroller,.layout-desktop .scrollX{--itemColumnGap:.5em}.itemsContainer{column-gap:var(--itemColumnGap)}.layout-desktop .sectionTitle,.layout-tv .sectionTitle{font-size:1.5rem!important}.sectionTitleContainer-cards{padding-top:0}.sectionTitleContainer+.emby-scrollbuttons{padding-top:0}.layout-mobile:not(.sectionTitleContainer-cards)>.sectionTitle-cards{text-align:left}.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:.5em}.mediaInfoOfficialRating{background:transparent!important;font-size:.75em;font-family:'Noto Sans',sans-serif;line-height:1.5em;transform:translateY(-.15em);font-weight:600;border:var(--defaultBorder)}.starIcon{background:linear-gradient(to right,#90cea1,#01b4e4);-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:"%"}.layout-desktop .detailRibbon{height:32vh!important;margin-top:unset!important}.layout-desktop [dir=ltr] .detailPagePrimaryContainer,.layout-tv [dir=ltr] .detailPagePrimaryContainer{padding-left:var(--sidePadding)}@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:.3}}@keyframes animMoveUp{from{transform:translateY(-90%);opacity:0}to{transform:translateY(-100%);opacity:1}}.detailLogo{display:none}@supports (aspect-ratio:1 / 1){.detailLogo{display:block;top:calc(100vh - 10em - var(--primaryItemPageNegativeSpace));left:0;width:40%;transform:translateY(-100%);margin:auto 30%;height:25vh;background-position:bottom}.layout-tv .detailLogo{display:block}}.layout-mobile .detailLogo{display:block;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}.itemBackdrop{display:block!important}.layout-desktop .itemBackdrop{height:calc(100vh - 32vh - var(--primaryItemPageNegativeSpace))!important}.layout-mobile .itemBackdrop{margin-top:0;position:sticky;top:-30%;-webkit-mask:var(--itemBackdropMask);mask:var(--itemBackdropMask);animation:animMoveDown .5s ease-out forwards;height:45vh}.layout-mobile #itemDetailPage:has(.detailLogo.hide) .itemBackdrop{margin-bottom:-10vh}.layout-tv .detailLogo{height:20vh;top:39vh;left:30vw;width:60vw;margin:auto 5vw}.layout-tv .itemBackdrop{height:33vh}.detailImageContainer.padded-left{padding-left:0}.layout-tv .detailImageContainer.padded-left{padding-left:0;height:0;position:fixed}.layout-desktop .detailImageContainer .card{top:unset!important;width:22vh!important}.detailImageContainer .card.backdropCard{width:40vh!important;max-width:50vw;margin-bottom:1em}.detailImageContainer .card{display:none}.layout-tv .detailImageContainer .card{width:23vw!important;display:block!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 [dir=ltr] .infoWrapper,.layout-mobile .infoWrapper{padding-left:0}.infoWrapper{align-content:end;place-items:center;display:grid}.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:.5em}.detailLogo:not(.hide)~.detailPageWrapperContainer .nameContainer h1,#itemDetailPage:has(.detailImageContainer .card.backdropCard) .detailLogo,#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .detailLogo,#itemDetailPage:has(.detailImageContainer .cardImageIcon.person) .detailLogo,.detailImageContainer .card:not(.portraitCard):has(.cardImageIcon.person){z-index:2;display:none}.detailLogo.hide~.detailPageWrapperContainer .nameContainer h1{display:block!important}.detailImageContainer:has(.backdropCard,.squareCard)~.nameContainer h1,.detailImageContainer:has(.cardImageIcon.person)~.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"]){border:var(--defaultBorder);border-radius:var(--largeRadius);padding:.5em;background-color:var(--lighterGradientPointAlpha)}.detailImageContainer .card:has(.book,.person,.album),.detailImageContainer .card.backdropCard:has(.tv),.detailImageContainer .card.backdropCard:has(.live_tv){display:block}#itemDetailPage:has(.detailImageContainer .cardImageIcon.person,.detailImageContainer .cardImageIcon.book) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .backdropCard .cardImageIcon.tv) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop,#itemDetailPage:has(.detailImageContainer .cardImageIcon.live_tv) .itemBackdrop{height:calc(100vh - 32vh - var(--secondaryItemPageNegativeSpace))!important}#itemDetailPage:has(.detailImageContainer .card.backdropCard),#itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album){background:linear-gradient(180deg,var(--darkerGradientPointAlpha) 80%,transparent)}.layout-mobile #itemDetailPage:has(.detailImageContainer .card.backdropCard) .itemBackdrop,.layout-mobile #itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album) .itemBackdrop{animation:animMoveDownSecondaryPage .5s ease-out forwards}.layout-mobile .cardImageIcon{font-size:3.5em}@media (max-width:50em){.homeLibraryButton{width:45.6%!important}}.homeLibraryButton{padding-inline-start:.25em;min-width:15%}@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{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: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 .25s}.backdropImage:before{transform:scale(1.1);filter:var(--blurLargest)}.backgroundContainer.withBackdrop{opacity:.9;background:linear-gradient(0deg,var(--darkerGradientPoint),45%,rgba(17,24,39,.25))}.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop{opacity:.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 .5s ease-out forwards}.appfooter{background-color:var(--headerColor)!important;backdrop-filter:var(--blurLargest)!important}.lyricPage{padding:0 var(--sidePadding)}.lyricsLine{font-size:2em;color:var(--textColor);text-align:center;align-self:center;font-weight:600;transition:transform .125s}.pastLyric,.futureLyric{transform:scale(.85);font-weight:400;text-align:center}.pastLyric{opacity:.45}.buttonActive{color:var(--uiAccentColor)!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:.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(--dimTextColor)}.backgroundProgress>div,.backgroundProgress{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}progress,::-webkit-progress-bar{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{border-radius:var(--smallRadius);height:.4em;margin-top:-.2em;background:var(--osdSeekBarBufferedColorAlpha);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);width:4px!important;height:.4em!important;border-radius:0}.sliderContainer:hover .mdl-slider::-webkit-slider-thumb{width:.2em!important;height:.8em!important;border-radius:.2em;transform:scale(1)}.sliderContainer:active .mdl-slider::-webkit-slider-thumb,.mdl-slider.show-focus:focus::-webkit-slider-thumb{width:.2em!important;height:.8em!important;border-radius:.2em;transform:scale(1) scaleY(1.25)}.mdl-slider::-moz-range-thumb{background:var(--osdSeekBarThumbColor)}.sliderMarkerContainer{margin:0 .1em}.sliderMarker.watched{background-color:var(--osdSeekBarPlayedColor)}.sliderMarker{height:4px;border-radius:2px}.iconOsdProgressInner{background:var(--osdSeekBarPlayedColor)}.selectLabel{max-height:2em}.button-link{color:rgb(200,200,200)}.button-link:hover{color:unset!important;text-decoration:none}.button-link:active{color:rgb(243,243,243)!important;text-decoration:none}.mainDrawer,.drawer-open{background-color:var(--drawerColor);border-right:var(--defaultBorder);backdrop-filter:var(--blurLarge)}.mainDrawer-scrollContainer{padding-bottom:5vh}.btnHeaderSave.button-flat{color:var(--uiAccentColor)!important;gap:.3em;border-radius:var(--smallRadius)}.button-flat:hover{color:unset}.button-flat:active{color:unset;background-color:rgba(255,255,255,.2)}.playstatebutton-icon-played{color:rgb(34,197,94)}.videoOsdBottom.videoOsdBottom-maincontrols .btnPause{font-size:2em}.nowPlayingBar .playPauseButton{font-size:2em}.nowPlayingInfoContainer .btnPlayPause{font-size:3em}.osdControls{display:flex;flex-direction:column-reverse}.itemDetailsGroup{outline:none;overflow:hidden;margin-top:1em;border:var(--defaultBorder);border-radius:var(--smallRadius);background-color:var(--lighterGradientPointAlpha)}@supports(display:revert){.itemDetailsGroup{outline:var(--defaultBorder);outline-offset:calc(-1 * var(--borderWidth));border:none}.layout-mobile .itemDetailsGroup{outline-offset:calc(-1 * var(--borderWidthDouble))}}.itemDetailsGroup>div:not(:last-child){border-bottom:var(--defaultBorder)}.detailsGroupItem{margin:0!important;justify-content:space-between;padding:.5em .9em;align-items:baseline}.detailsGroupItem>.label{font-weight:600;flex-basis:6em}.detailsGroupItem>.content>a{font-weight:400;text-align:end}.detailsGroupItem>.content{text-align:end;color:var(--dimTextColor)}.detailsGroupItem>.label{color:var(--textColor)}.itemExternalLinks{color:var(--textColor)}.itemExternalLinks.focuscontainer-x{color:transparent}.itemExternalLinks.focuscontainer-x>.button-link{color:var(--textColor);background-color:var(--selectorBackgroundColor);padding:.125em .5em;border-radius:var(--smallerRadius);margin-bottom:.5em}.layout-mobile .itemExternalLinks.focuscontainer-x>.button-link:hover:not(:active){color:var(--textColor)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a:hover,.itemExternalLinks.focuscontainer-x>a:active{background-color:var(--activeColor)!important;color:white!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:active{background-color:rgb(26,183,216)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:active{background-color:rgb(226,182,22)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:active{background-color:rgb(108,213,145)!important;color:black!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:active{background-color:rgb(171,58,173)!important;color:var(--textColor)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:active{background-color:rgb(99,153,204)!important;color:rgb(15,22,28)!important}.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:hover,.itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:active{background-color:rgb(186,71,143)!important;color:var(--textColor)!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;-webkit-line-clamp:2}.detail-clamp-text p{margin-top:.25em;margin-bottom:.25em}.layout-mobile .detail-clamp-text{-webkit-line-clamp:4}.overview-expand.emby-button{padding:0;margin-top:1.4em;margin-bottom:1.4em;color:transparent}.overview-expand.emby-button:after{content:"\e313";font-family:'Material Icons';background:var(--selectorBackgroundColor);border-radius:50%;width:1.5em;height:1.5em;align-content:center;line-height:1.6ch;transition:transform .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:.5em}.itemMiscInfo{align-items:flex-end!important;justify-content:center}.innerCardFooter,.chapterThumbTextContainer{background:var(--cardFooterGradient);text-shadow:.1em .1em 0 black;width:-webkit-fill-available;height:-webkit-fill-available;padding:0 2em 2em 2em;align-content:end;display:grid}.chapterCardImageContainer{background-size:135%}.chapterCardImageContainer+.innerCardFooter{padding:0 1em 1em 1em;height:auto}.layout-mobile .innerCardFooter{padding:5em 1.5em 1.5em 1.5em}.layout-mobile .chapterCardImageContainer+.innerCardFooter{padding:0 .5em .5em .5em}.centerMessage{width:unset}.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:.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 .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)}.selectionCommandsPanel>h1{font-size:large}.itemSelectionPanel{border:unset;background-color:transparent}.emby-checkbox:checked+span+.checkboxOutline{border-radius:var(--smallerRadius)!important;box-shadow:inset 0 7em 10em 20px rgba(0,0,0,.8);background:transparent;border-color:white;border-style:solid;border-width:var(--borderWidthDouble);outline:none}@supports(display:revert){.emby-checkbox:checked+span+.checkboxOutline{outline:solid var(--borderWidth) white}}.checkboxOutline{top:unset;height:1.3em;width:1.3em;border-radius:var(--smallerRadius)}.itemSelectionPanel .material-icons.check:before{font-size:4em;color:#ffffff;padding:.25em}.cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 1.75em)}.overflowBackdropCard .cardText-first+.itemSelectionPanel>.checkboxContainer{height:calc(100% - 0)}.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:calc(100% - 0)}.checkboxOutline.multiSelectCheckboxOutline{border-radius:var(--largeRadius);border-width:0;width:100%;height:100%}.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon{font-size:.9em;font-weight:900}.checkboxOutline:not(.multiSelectCheckboxOutline){border:solid gray var(--borderWidth);background-color:white;transition:all .125s}.emby-checkbox:checked+span+.checkboxOutline:not(.multiSelectCheckboxOutline){box-shadow:none;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:not(:checked)+span+.checkboxOutline{outline:var(--borderWidth) solid gray;outline-offset:calc(-2.5*var(--borderWidth))}.emby-checkbox:focus+span+.checkboxOutline{border-color:white!important;outline:var(--borderWidth) solid var(--highlightOutlineColor)}}.layout-tv .emby-checkbox:focus+span+.checkboxOutline{transform:scale(1.75)}.cardIndicators{-webkit-align-items:center;align-items:center;top:.5em}[dir=ltr] .cardIndicators{right:.5em}.layout-mobile .cardIndicators{top:.2em;right:.2em}.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:.5em;transform:scale(.85);border:var(--defaultLighterBorder);font-size:.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:"\f1c6";font-size:85%}div[data-type="Photo"] .play_arrow:before{content:"\e5d0"}div[data-type="PhotoAlbum"] .play_arrow:before{content:"\e8eb"}.emby-button.block,.button-alt,.raised,#btnDeleteImage,.manageRecordingButton,.dashboardActionsContainer>.emby-button{color:#fff;border-radius:var(--smallRadius);background:var(--lighterGradientPoint);border:var(--defaultBorder);transition:all .125s}.editItemMetadataForm>.metadataFormFields div:has(.formDialogFooterItem){display:flex;justify-content:center}.btnBrowse>.folder{margin-inline-end:.5em}.fab{color:#fff;background:var(--lighterGradientPoint);border:var(--defaultBorder)}.fab:focus{background:var(--lighterGradientPoint)!important;filter:brightness(1.2)}.raised:focus{background:inherit;filter:brightness(1.2)}.raised:active,.fab:active,.emby-button:active{filter:brightness(1.2)!important;transform:scale(.98)}.detailButton{border:var(--defaultLighterBorder);padding:.5em .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){color:var(--textColor);backdrop-filter:none;border-color:transparent;margin:.5em!important;border-radius:50%;padding:.6em!important;background:transparent}.layout-desktop .detailButton:not(.btnPlay):hover{color:black;background:var(--dimTextColor)}.detailButton:active{color:black;background:var(--textColor)}.btnPlay.detailButton{background-color:var(--textColor);color:black;border-radius:3em;border-color:var(--borderColor);height:3em;min-width:10em;margin-right:.5em!important}.btnPlay>.detailButton-content{-webkit-align-items:unset;align-items:unset;display:-webkit-flex;display:flex;-webkit-flex-direction:unset;flex-direction:unset;-webkit-justify-content:unset;align-content:unset;justify-content:flex-start}.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay[title="Play"]>.detailButton-content::after{content:"Read"}.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay .material-icons.play_arrow:before{content:"\f1c6";padding-inline-end:1ch}.btnPlay[title="Play"]>.detailButton-content::after{content:"Play"}.btnPlay[title="Resume"]>.detailButton-content::after{content:"Resume"}.btnPlay>.detailButton-content::after{padding:0 1ch;place-content:center}.mainDetailButtons{justify-content:center;margin:0 0 1em 0}.layout-mobile [dir=ltr] .mainDetailButtons{flex-wrap:wrap;padding:0 1.25em}@media (min-width:100em){.mainDetailButtons{font-size:unset;margin:0 0 1em 0}}.localnav>.emby-button{background:var(--lighterGradientPoint)!important;color:#fff;padding:.8em .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:white}#btnDeleteImage,.button-delete,.btnRevoke,#btnShutdown{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){background-color:var(--headerColor);backdrop-filter:var(--blurDefault)}.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.notifications:not(.listItemIcon-transparent),.listItemIcon.schedule:not(.listItemIcon-transparent),.listItemIcon.person:not(.listItemIcon-transparent),.listItemIcon.live_tv:not(.listItemIcon-transparent){background-color:rgb(41,49,83)!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:.25em}.listItemImage{border-radius:var(--smallRadius);margin-right:.75em!important;border:var(--defaultBorder)}[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"]{padding:.375em;margin-bottom:.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:white;font-weight:600}.listItem[data-type="Audio"]:has(.playlistIndexIndicatorImage):not(:hover){background-color:rgba(255,255,255,.07)}[dir="ltr"] .listItem:not(.actionSheetMenuItem)[data-type="Episode"] .listItemBodyText:not(.secondary){font-size:1.17em;font-weight:600}.listItemBody>.listItemBodyText:not(.secondary){display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:var(--textColor)}.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:.75em;margin-bottom:0}.listItem,.navMenuOption{border-radius:.7em}.listItem:hover,.navMenuOption:hover{background:unset;border-radius:.7em}.listItem:focus{background:var(--highlightOutlineColor)}.listItem:active,.navMenuOption:active{background:rgba(255,255,255,.125)}.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:.7em;margin:.25 .5em!important}.Mui-selected{background-color:var(--activeColor)!important}.actionsheetDivider{height:2px;background:rgb(255,255,255,.05)}.actionsheet-xlargeFont{line-height:normal}.actionSheetContent{padding:.4em!important}.actionSheetContent>h1{font-size:unset}[dir=ltr] .actionsheetMenuItemIcon.check{margin:0 .45em 0 .45em!important}.actionSheetMenuItem:has(.listItemIcon.check){background-color:var(--activeColor)}.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText{color:white}.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:rgba(255,255,255,.125)}.navMenuOption{border-radius:var(--smallRadius)!important;margin:0 1em!important}[dir=ltr] .navMenuOption{padding:.75em 1em!important;margin-bottom:unset}#myPreferencesMenuPage .listItemIcon{margin-left:.5em;margin-right:.25em}.navMenuOption-selected{background-color:var(--activeColor)!important}#itemDetailPage .detailSection{display:grid;row-gap:1em;column-gap:3em;max-width:unset!important;grid-template-columns:1fr 1fr}.layout-mobile .detailSection{grid-template-columns:1fr}.detailPageContent{gap:1em}.detailImageContainer .card{position:inherit!important}.trackSelections{order:3;max-width:unset!important;margin-top:1em;border:var(--defaultBorder);border-radius:var(--smallRadius);padding:1em;grid-column:2;background-color:var(--lighterGradientPointAlpha)}.recordingFields{order:4}.detailsGroupItem,.trackSelections .selectContainer{max-width:unset!important;align-items:baseline}.selectArrowContainer{top:0;opacity:.5}.trackSelectionFieldContainer>.selectArrowContainer{top:.5em}.trackSelectionFieldContainer>label{max-width:2.75em;background-repeat:no-repeat;color:transparent;transform:scale(.9)}.selectVideoContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectAudioContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectSubtitlesContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.selectSourceContainer.trackSelectionFieldContainer>label{background-image:url('data:image/svg+xml,')}.detailSectionContent{order:1;grid-column:1 / -1}.detailSectionContent a:not(.overview-expand){text-align:start}.layout-desktop .detailSectionContent{align-content:end;min-height:15vh}.itemDetailsGroup{order:2;grid-column:1}.trackSelections.hide~.recordingFields.hide~.itemDetailsGroup{grid-column:1 / -1}.layout-mobile .trackSelections,.layout-mobile .detailSectionContent,.layout-mobile .itemDetailsGroup,.layout-tv .trackSelections,.layout-tv .detailSectionContent,.layout-tv .itemDetailsGroup{grid-column:1 / -1}.sliderBubble{border-radius:var(--largeRadius);border:var(--defaultBorder);overflow:hidden;z-index:3}.alphaPickerButton{font-family:monospace;margin:.15em;color:rgba(255,255,255,.25)}.alphaPickerButton-selected{color:rgba(255,255,255,1)}.alphaPicker-vertical{height:70%}.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}.paddded-left{padding-left:var(--sidePadding)!important}.layout-mobile .padded-right-withalphapicker{padding-left:4.5%;padding-right:6.5%}.detailPagePrimaryContent.padded-right{padding-right:0!important}[dir=ltr] .detailPageContent,.content-primary{padding-left:var(--sidePadding)!important;padding-right:var(--sidePadding)!important}#itemDetailPage .verticalSection .itemsContainer.padded-right{padding-right:0!important}.listPaging>span{padding:0 .5em}.layout-mobile #myPreferencesMenuPage{padding-top:3.75em!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}.sectionTitleTextButton{padding:0 .5em}.sectionTitleTextButton:hover{background:transparent!important}.sectionTitleTextButton:active{color:white!important}.sectionTitleTextButton>*{padding:.3em 0!important;margin:0 0!important}.dashboardSection .sectionTitleTextButton>.material-icons,.sectionTitleTextButton>.material-icons,.dashboardSection .sectionTitleTextButton>.material-icons.material-icons{font-size:unset}.sectionTitleTextButton>.material-icons::before{display:none}.sectionTitleTextButton>.material-icons.chevron_right{margin-left:.5rem!important;height:1.5rem;width:1.5rem;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23D1D5DB' aria-hidden='true'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12.75 15l3-3m0 0l-3-3m3 3h-7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;background-size:contain}.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}.upNextContainer .btnStartNow{background-color:var(--btnSubmitColor);border-color:var(--btnSubmitBorderColor)}.upNextDialog-title{white-space:pre-wrap;width:unset}.upNextDialog-buttons{width:unset;flex-wrap:wrap}.upNextContainer .upNextDialog-countdownText{color:white}.skip-button{background-color:whitesmoke;box-shadow:var(--shadow);bottom:25%;right:var(--sidePadding)}.layout-tv .skip-button{right:unset;left:var(--sidePadding)}.skip-button:hover{background-color:white}.skip-button:active{background-color:rgba(245,245,245,.7);box-shadow:none}.toast,.upNextContainer{background:var(--headerColor)!important;border:var(--defaultBorder)!important;backdrop-filter:var(--blurDefault)}.activeSession{width:98%!important}.emby-tab-button:hover{color:whitesmoke}@media (hover:hover) and (pointer:fine){.paper-icon-button-light:hover:not(:disabled){color:#fff;background-color:rgb(255 255 255 / 5%)}.actionSheetMenuItem.emby-button:has(.listItemIcon.material-icons.check[style*="hidden"]):hover{background-color:rgba(255,255,255,.125)}.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,.2);color:white}.btnPlay.detailButton:hover{background-color:var(--textColor);color:black}.alphaPickerButton:hover{color:rgba(255,255,255,1)}.listItem:hover{background:rgba(255,255,255,.125);backdrop-filter:var(--blurLargest)}.navMenuOption:hover{background:rgba(255,255,255,.125)}.searchfields-icon:hover,.inputContainer .emby-input-iconbutton:hover{color:rgba(255,255,255,.8)}#scenesContent .cardScalable:hover{border-color:var(--dimTextColor)!important}.sectionTitleTextButton:hover{background:transparent!important;color:white!important}.button-link:hover{color:rgb(243,243,243)!important;text-decoration:none}}.paper-icon-button-light:active:not(:disabled){color:#fff;background-color:rgb(255 255 255 / 5%)}.emby-textarea{font-family:consolas,monaco,monospace}.emby-select-withcolor,.emby-select,.emby-input,.emby-textarea{background-color:var(--selectorBackgroundColor);border:var(--defaultLighterBorder);border-radius:var(--smallRadius);padding:.5em!important}.inputLabelFocused,.selectLabelFocused,.textareaLabelFocused{color:#fff}.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}}.emby-select-withcolor>option{color:inherit;background-color:var(--selectorBackgroundColor)}.inputContainer .emby-input-iconbutton{color:rgba(255,255,255,.5);margin-left:-2.5em;background-color:transparent!important}.searchfields-txtSearch{padding:.75em 1.5em!important;border-radius:4em}.searchfields-icon{padding:.25em;margin-left:-1.75em;margin-bottom:0;border-radius:var(--largeRadius);color:rgba(255,255,255,.5)}.searchfields-icon:active,.inputContainer .emby-input-iconbutton:active{color:rgba(255,255,255,.8)}.searchFields>.searchFieldsInner{flex-direction:row-reverse}.infoWrapper h1.itemName,.infoWrapper h1.parentName{font-size:4em;white-space:pre-wrap;padding-bottom:.5ch;color:white}.infoWrapper h1.itemName,.infoWrapper h1.parentName,.infoWrapper h1.itemName a,.infoWrapper h1.parentName a{font-weight:200}.infoWrapper h1.itemName bdi,.infoWrapper h1.parentName bdi,.infoWrapper h1.itemName a,.infoWrapper h1.parentName a{display:-webkit-box!important;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical}.layout-mobile .infoWrapper h1.itemName,.layout-mobile .infoWrapper h1.parentName,.layout-mobile .infoWrapper h1.parentNameLast{font-size:2em;word-wrap:break-word;padding-bottom:0}.itemName.originalTitle{padding-top:.25em;padding-bottom:.25em;color:var(--dimTextColor)}.channelPrograms+.channelPrograms,.guide-channelHeaderCell+.guide-channelHeaderCell{margin-top:0}.channelPrograms,.guide-channelHeaderCell,.programCell{border-color:transparent;background-color:transparent!important;border-radius:var(--smallRadius)}.guideProgramName{background-color:rgba(255,255,255,.05);height:-webkit-fill-available;margin:.35em 0 .35em .7em;border-radius:var(--smallerRadius)}.guide-programNameCaret{display:none}.programCell-active .guideProgramName{background-color:rgba(255,255,255,.125)}.guideVerticalScroller{padding:0}.guideChannelImage{background-color:rgba(255,255,255,.05);bottom:.35em;right:.35em;top:.35em;width:calc(100% - .7em);border-radius:var(--smallerRadius)}#guideTab{padding-top:3em!important}.guide-channelHeaderCell:focus,.programCell:focus{background-color:var(--highlightOutlineColor)!important}.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}.sliderBubbleText{font-size:1.5em}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)}ul.MuiList-root.MuiMenu-list.MuiList-dense>div:first-child{gap:.5rem}.playerStats,.iconOsd{border-radius:var(--largeRadius);background-color:rgba(69,69,69,.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(--uiAccentColor)}.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,.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:white;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}.startTimeText{margin:0!important}.endTimeText{justify-content:right;padding-inline-end:.8em;margin:0 0 0 .75em!important}.startTimeText,.endTimeText{padding-top:.25em}.startTimeText,.positionTime{text-align:start;justify-content:left}.endTimeText,.runtime{text-align:end;justify-content:right}.filterIndicator{background:var(--activeColor)}#homeTab .overflowBackdropCard[data-isfolder="true"] .cardPadder-overflowBackdrop{padding-bottom:50%}#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText-first,#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText.cardTextCentered{display:var(--libraryLabelVisibility)}.nowPlayingButtonsContainer{margin-top:1em}.nowPlayingPageImageContainerNoAlbum{border:var(--defaultBorder);border-radius:var(--smallRadius);overflow:hidden}.nowPlayingPageImageContainerNoAlbum .defaultCardBackground{background:repeating-radial-gradient(black,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);z-index:1}.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent{background:transparent;border-top:var(--defaultBorder);border-color:transparent}.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:0 2em}.nowPlayingPageImage{box-shadow:var(--shadow);border-radius:var(--smallRadius);object-fit:cover;aspect-ratio:1 / 1}.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{margin-bottom:1em;font-size:1.25em;color:var(--textColor)}.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-size:unset;font-weight:600;list-style-type:circle;margin-bottom:.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:white;background-color:transparent!important}.MuiToggleButtonGroup-grouped.Mui-selected{color:white}.MuiButtonBase-root.MuiIconButton-root:hover{color:white;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 .5s}.skinHeader-blurred:not(.osdHeader){backdrop-filter:none;background-color:transparent;border:none;background:var(--headerBackground);padding-top:.75em}.layout-mobile .skinHeader-blurred:not(.osdHeader){padding-top:.25em}.layout-mobile .withSectionTabs .headerTop{padding-bottom:1.45em}.skinHeader-blurred:not(.osdHeader):not(.semiTransparent)::after{content:var(--headerBlurLayerVisibility);position:absolute;top:0;bottom:0;left:0;right:0;backdrop-filter:var(--blurLargest);-webkit-mask:var(--headerBlurMask);mask:var(--headerBlurMask);z-index:-1}.headerTabs.sectionTabs{margin:0;height:6em}.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,.skinHeader.headroom:not(.osdHeader,.noHomeButtonHeader):has(.pageTitle:empty) .headerButton{text-shadow:1px 1px 0 #00000080}.headerTop{-webkit-align-items:flex-end;align-items:flex-end}.headroom--unpinned{-webkit-transform:translateY(-3.7em);transform:translateY(-3.7em)}.noHomeButtonHeader .emby-tab-button[data-index="1"]:before{content:"\e87d"}.noHomeButtonHeader .emby-tab-button[data-index="0"]:before{content:"\e88a"}.noHomeButtonHeader .emby-tab-button:before{font-family:'Material Icons Round';padding-inline-end:.5ch;font-size:1.2em;font-variation-settings:'FILL' 0}.layout-tv .sectionTabs .emby-tabs.smoothScrollX{overflow:visible!important}.layout-tv .sectionTabs{width:100%}.headerTabs.sectionTabs .emby-tab-button{display:inline-flex;margin:.25em .5em;padding:0 1.25em;height:2.5em;color:var(--textColor);font-weight:400;border-radius:var(--largeRadius);background-color:var(--darkerGradientPointAlpha)}.headerTabs.sectionTabs .emby-tab-button-active{margin:.25em .5em;color:black;background-color:var(--textColor)}.layout-mobile .headerTabs.sectionTabs .emby-tab-button:first-child{margin-left:var(--sidePadding)}.layout-mobile .headerTabs.sectionTabs .emby-tab-button:last-child{margin-right:var(--sidePadding)}@media (min-width:75em){.layout-desktop .sectionTabs,.layout-mobile .sectionTabs{-webkit-align-items:center;align-items:center;-webkit-align-self:center;align-self:center;-webkit-justify-content:center;justify-content:center;margin-top:-3em;position:relative;width:auto}.libraryPage:not(.noSecondaryNavPage):not(.layout-tv .libraryPage){padding-top:6.8em!important}}@media (max-width:100em){.sectionTabs{font-size:100%}}.libraryPage:not(.noSecondaryNavPage){padding-top:9.5em!important}.layout-tv .headerLeft{overflow:unset;margin:.25em .5em}.remoteControlContent{padding:0 var(--sidePadding)!important} \ No newline at end of file diff --git a/Theme/ElegantFin-theme-v25.08.08.css b/Theme/ElegantFin-theme-v25.08.08.css new file mode 100644 index 0000000..13fce75 --- /dev/null +++ b/Theme/ElegantFin-theme-v25.08.08.css @@ -0,0 +1,3619 @@ +/* ElegantFin Theme for Jellyfin by lscambo13 */ + +/* Add-ons: Uncomment to enable */ +/* @import url(./assets/add-ons/extras-media-bar-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'); + +:root { + --elegantFinFooterText: "ElegantFin v25.08.08"; + + /* Base theme colors */ + color-scheme: dark; + --darkerGradientPoint: #111827; + --darkerGradientPointAlpha: rgba(17, 24, 39, .85); + --lighterGradientPoint: #1d2635; + --lighterGradientPointAlpha: rgba(29, 38, 53, .85); + --headerColor: rgba(30, 40, 54, .8); + --drawerColor: rgba(30, 40, 54, .9); + + --borderColor: hsl(214, 13%, 32%); + --darkerBorderColor: hsl(214, 13%, 22%); + --lighterBorderColor: hsla(0, 0%, 100%, .2); + + --selectorBackgroundColor: rgb(55, 65, 81); + --selectorBackgroundColorAlpha: rgba(55, 65, 81, .5); + + --activeColorAlpha: rgba(119, 91, 244, .9); + --activeColor: rgb(119, 91, 244); + --osdSeekBarPlayedColor: var(--textColor); + --osdSeekBarBufferedColorAlpha: rgba(128, 128, 128, .5); + --osdSeekBarThumbColor: white; + --tableBodyColor: rgb(31 41 55 / 1); + --uiAccentColor: rgb(117 111 226); + --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); + + --defaultBorder: var(--borderWidth) solid var(--borderColor); + --defaultLighterBorder: var(--borderWidth) solid var(--lighterBorderColor); + + /* dark theme based text colors */ + --textColor: rgb(209, 213, 219); + --dimTextColor: rgb(156, 163, 175); + + /* textures */ + --backgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint) 35%, var(--lighterGradientPoint)); + --cardBackgroundGradient: linear-gradient(0deg, var(--darkerGradientPoint), 25%, var(--lighterGradientPoint)); + --headerColorGradient: linear-gradient(180deg, rgba(30, 40, 54, .95) 30%, 55%, transparent 90%); + --headerColorGradientAlt: linear-gradient(180deg, rgba(30, 40, 54, .95), 70%, transparent); + --headerBlurMask: linear-gradient(180deg, white 50%, 85%, transparent); + + --cardFooterGradient: linear-gradient(0deg, rgb(0 0 0 / 90%), 40%, transparent); + --topOSDGradient: linear-gradient(180deg, hsla(0, 0%, 0%, .8), 45%, hsla(0, 0%, 0%, 0)); + --bottomOSDGradient: linear-gradient(0deg, hsla(0, 0%, 0%, .8), 45%, hsla(0, 0%, 0%, 0)); + + --hoverGradientV: linear-gradient(0deg, transparent, rgb(255 255 255 / 100%) 45%, rgb(255 255 255 / 100%) 55%, transparent); + --hoverGradientH: linear-gradient(90deg, transparent, rgb(255 255 255 / 100%) 45%, rgb(255 255 255 / 100%) 55%, transparent); + + --itemBackdropMask: linear-gradient(180deg, rgba(0, 0, 0, .8), 75%, transparent); + /* --themeVideoPlayerMask: linear-gradient(180deg, rgba(0, 0, 0, 1), 85%, transparent); */ + + /* standard component sizes */ + --largerRadius: 1.25em; + --largeRadius: 1em; + --smallRadius: .5em; + --smallerRadius: .375em; + --borderWidth: .06em; + --borderWidthDouble: .12em; + + --sidePadding: 3.3%; + --itemColumnGap: 1em; + --primaryItemPageNegativeSpace: 15vh; + --secondaryItemPageNegativeSpace: 35vh; + + --blurSmallest: blur(2px); + --blurDefault: blur(5px); + --blurLarge: blur(10px); + --blurLargest: blur(20px); + + --shadow: .1em .1em .15em hsla(0, 0%, 0%, .3); + + /* use "" to enable a fancy blur behind the app header / top bar [default]; + use none (without quotes) to disable it */ + --headerBlurLayerVisibility: ""; + + /* 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 Icons Round' for the new icons [default]; + use 'Material Icons' to revert to old icons */ + --iconPack: 'Material Icons Round', Material Icons; + + /* none: hides the watched and mark favorite buttons on hover [default]; + block: makes them visible use block */ + --extraCardButtonsVisibility: none; + + /* none: hides the media library card labels [default]; + block: makes them visible */ + --libraryLabelVisibility: none; + + /* use "" to enable the card hover effect [default]; + use none (without quotes) to disable it */ + --cardHoverEffect: ""; +} + +html { + font-family: "Inter", serif; + font-optical-sizing: auto; + font-weight: 425; + font-style: normal; + -webkit-tap-highlight-color: transparent !important; +} + +.layout-mobile { + --itemColumnGap: 0; + --sidePadding: 5%; +} + +/* Material Icons Round */ +/* 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 Icons Round'; + font-style: normal; + font-weight: 100 700; + font-display: swap; + src: url(https://fonts.gstatic.com/s/materialsymbolsrounded/v267/sykg-zNym6YjUruM-QrEh7-nyTnjDwKNJ_190Fjzag.woff2) format('woff2'); +} + +.material-icons { + font-family: var(--iconPack) !important; + font-weight: normal; + font-style: normal; + display: inline-block; + line-height: 1; + text-transform: none; + letter-spacing: normal; + word-wrap: normal; + white-space: nowrap; + direction: ltr; + line-height: 1; + vertical-align: middle; + -webkit-font-smoothing: antialiased; + text-rendering: optimizeLegibility; + -moz-osx-font-smoothing: grayscale; + font-feature-settings: 'liga'; + font-variation-settings: + 'FILL' 1, + 'wght' 400, + 'GRAD' 0, + 'opsz' 48; +} + +.material-icons.info_outline:before { + font-family: Material Icons; +} + +.dashboardFooter { + font-family: "Noto Sans", serif; + transition: transform 50ms; +} + +.dashboardFooter::after { + content: var(--elegantFinFooterText); + font-size: .8em; + color: #4e4e60; +} + +::selection { + background: var(--activeColorAlpha); +} + +.cardImageIcon { + color: var(--borderColor); +} + +.card { + padding: .375em; + transition: width .5s; +} + +.card:focus .cardBox:not(.visualCardBox) .cardScalable { + border-color: white !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(--uiAccentColor); + color: var(--uiAccentColor); +} + +.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: #fff !important; +} + +.emby-tabs .emby-button.show-focus:focus { + outline: none !important; +} + +.card.show-animation:focus>.cardBox { + -webkit-transform: scale(1.125); + transform: scale(1.125); +} + +[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; + } +} + +.vertical-wrap:not(.centered) { + justify-content: flex-start !important; +} + +.countIndicator, +.fullSyncIndicator, +.mediaSourceIndicator { + background: rgb(31, 80, 189); + border: var(--defaultLighterBorder); +} + +.cardScalable { + border-radius: var(--largeRadius); + border: var(--darkerBorderColor) solid var(--borderWidthDouble) !important; + overflow: hidden !important; + box-shadow: 0 0 .25em 0 rgba(0, 0, 0, .4); + 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 .375s; +} + +.card.squareCard[data-type="TvChannel"] .cardImageContainer.cardContent { + background-color: rgba(255, 255, 255, .2); +} + +.cardImageContainer>.cardDefaultText { + font-size: 2em; + padding-top: 1.5em; + color: transparent; + white-space: pre; +} + +.cardImageContainer>.cardDefaultText::before { + content: "?\A"; + color: var(--borderColor); +} + +.card.card-hoverable:hover .cardScalable, +.card.card-hoverable:hover .visualCardBox { + border-color: white !important; +} + +.card.card-hoverable:hover .visualCardBox .cardScalable { + border-color: var(--darkerBorderColor) !important; +} + +.card.card-hoverable:hover .cardImageContainer { + transform: scale(1.025); +} + +.card.card-hoverable .itemSelectionPanel { + transition: transform .125s; +} + +.card.card-hoverable:hover .cardScalable, +.card.card-hoverable:hover .itemSelectionPanel { + transform: scale(1.02); +} + +.card.card-hoverable .cardScalable:active { + transition: transform .075s; + transform: scale(1); +} + +.cardScalable:has(.cardOverlayButton:hover)>.cardImageContainer { + transform: scale(1); +} + +.cardOverlayContainer { + transition: .5s; + background: rgba(255, 255, 255, .05); +} + +.card.card-hoverable .cardOverlayContainer:after { + content: var(--cardHoverEffect); + transition: .5s; + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + transform: translateY(-50%) translateX(0); + background: var(--hoverGradientV); +} + +.card.card-hoverable:hover .cardOverlayContainer:after { + transform: translateY(50%) translateX(0); + opacity: 0; +} + +.backdropCard.card-hoverable .cardOverlayContainer:after, +.overflowBackdropCard.card-hoverable .cardOverlayContainer:after { + transform: translateY(0) translateX(-50%); + background: var(--hoverGradientH); +} + +.backdropCard.card-hoverable:hover .cardOverlayContainer:after, +.overflowBackdropCard.card-hoverable:hover .cardOverlayContainer:after { + transform: translateY(0) translateX(50%); + opacity: 0; +} + +.cardBox:not(.visualCardBox) .cardPadder { + background-color: var(--lighterGradientPoint); +} + +.cardOverlayContainer>.cardOverlayFab-primary { + left: unset; + 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: white; + border: var(--defaultLighterBorder); + border-color: var(--btnMiniPlayBorderColor); + font-size: 75%; + box-shadow: var(--shadow); + z-index: 2; +} + +.cardOverlayContainer>.cardOverlayFab-primary:hover, +.listItemImageButton:hover { + color: white; +} + +.layout-desktop .cardOverlayButton-br button[data-action="menu"], +.layout-desktop .listItemButton[data-action="menu"] { + display: none; +} + +.layout-desktop .cardOverlayButton-br, +[dir=ltr].layout-desktop .cardOverlayButton-br { + bottom: .75em; + right: .5em; + display: var(--extraCardButtonsVisibility); + z-index: 1; +} + +.layout-desktop .cardOverlayButton-br button { + color: white; + text-shadow: var(--shadow); +} + +.layout-mobile .cardOverlayButton { + padding: 1em; + font-size: 60%; +} + +.layout-mobile .cardOverlayButton-br, +[dir=ltr] .layout-mobile .cardOverlayButton-br { + bottom: .25em; + right: .25em; +} + +.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; + color: white; + border: none; + text-shadow: 1px 1px .1em black; + color: white; +} + +.cardOverlayContainer:has(.cardOverlayButton:hover) { + backdrop-filter: var(--blurDefault); +} + +.listViewUserDataButtons { + font-size: small; +} + +.layout-mobile .listViewUserDataButtons { + flex-direction: column; + font-size: x-small; +} + +.listItem-largeImage[data-type="Episode"] .listViewUserDataButtons { + flex-direction: column; + font-size: small; +} + +.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, 4K*/ +@media (max-width: 220em) { + + .portraitCard, + .squareCard { + --cardCount: 12; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 11; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + .backdropCard { + --cardCount: 9; + } + + .overflowBackdropCard { + --cardCount: 8; + } +} + +/* 11 posters, 9 thumbs */ +@media (max-width: 200em) { + + .portraitCard, + .squareCard { + --cardCount: 11; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 10; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + .backdropCard { + --cardCount: 9; + } + + .overflowBackdropCard { + --cardCount: 8; + } +} + +/* 10 posters, 8 thumbs */ +@media (max-width: 170em) { + + .portraitCard, + .squareCard { + --cardCount: 10; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 9; + } + + .squareCard:has(.cardFooter) { + --cardCount: 9; + } + + .backdropCard { + --cardCount: 8; + } + + .overflowBackdropCard { + --cardCount: 7; + } +} + +/* 9 posters, 7 thumbs */ +@media (max-width: 140em) { + + .portraitCard, + .squareCard { + --cardCount: 9; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 8; + } + + .squareCard:has(.cardFooter) { + --cardCount: 7; + } + + .backdropCard { + --cardCount: 7; + } + + .overflowBackdropCard { + --cardCount: 6; + } +} + +/* 8 posters, 7 thumbs, 1080p */ +@media (max-width: 120em) { + + .portraitCard, + .squareCard { + --cardCount: 8; + } + + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 7; + } + + .squareCard:has(.cardFooter) { + --cardCount: 6; + } + + .backdropCard { + --cardCount: 6; + } + + .overflowBackdropCard { + --cardCount: 5; + } +} + +/* 7 posters, 6 thumbs */ +@media (max-width: 100em) { + + .portraitCard, + .squareCard, + .overflowPortraitCard, + .overflowSquareCard { + --cardCount: 7; + } + + .squareCard:has(.cardFooter) { + --cardCount: 6; + } + + .backdropCard { + --cardCount: 6; + } + + .overflowBackdropCard { + --cardCount: 5; + } +} + +/* 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; + } +} + +.card { + --effectiveWidth: calc((99vw - (var(--sidePadding) * 2))); + --cardWidth: calc(var(--effectiveWidth) / var(--cardCount) - var(--itemColumnGap)); + box-sizing: border-box; + width: var(--cardWidth) !important; +} + +.layout-mobile .card { + --cardWidth: calc(var(--effectiveWidth) / var(--cardCount)); +} + +/* 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))); + } +} + +.detailPageWrapperContainer { + padding-top: unset; + margin-top: unset; +} + +.layout-desktop .detailPageWrapperContainer { + background: transparent; + min-height: 46vh; + background: linear-gradient(0deg, var(--darkerGradientPointAlpha) 70%, 85%, transparent); +} + +.layout-tv .detailPageWrapperContainer { + padding-left: 30vw; + background: transparent; + 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; + text-align: center; + margin-bottom: -1.5em; +} + +.layout-mobile .detailPagePrimaryContainer { + padding: .5em var(--sidePadding); +} + +[dir=ltr] .detailPagePrimaryContent { + padding-right: 0; +} + +.layout-desktop .detailPagePrimaryContainer { + background: transparent; +} + +.layout-desktop .detailPageSecondaryContainer { + background-color: transparent; +} + +.detailPageSecondaryContainer { + padding-top: 0; +} + +/* 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>.material-icons { + font-size: 1.25em; +} + +.verticalSection.emby-scroller-container>h2.sectionTitle.sectionTitle-cards { + padding-top: 1.25em !important; +} + +#itemDetailPage .emby-scroller-container, +#itemDetailPage .emby-scroller, +#itemDetailPage .scrollX { + margin: 0 calc(-1 * var(--sidePadding)); + padding: 0 var(--sidePadding); +} + +.layout-desktop .emby-scroller-container, +.layout-desktop .emby-scroller, +.layout-desktop .scrollX { + --itemColumnGap: 0.5em; +} + +.itemsContainer { + column-gap: var(--itemColumnGap); +} + +.layout-desktop .sectionTitle, +.layout-tv .sectionTitle { + font-size: 1.5rem !important; +} + +.sectionTitleContainer-cards { + padding-top: 0; +} + +.sectionTitleContainer+.emby-scrollbuttons { + padding-top: 0; +} + +.layout-mobile :not(.sectionTitleContainer-cards)>.sectionTitle-cards { + text-align: left; +} + +.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: .5em; +} + +.mediaInfoOfficialRating { + background: transparent !important; + font-size: .75em; + font-family: 'Noto Sans', sans-serif; + line-height: 1.5em; + transform: translateY(-.15em); + font-weight: 600; + border: var(--defaultBorder); +} + +.starIcon { + background: linear-gradient(to right, #90cea1, #01b4e4); + -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: "%"; +} + +.layout-desktop .detailRibbon { + height: 32vh !important; + margin-top: unset !important; +} + +.layout-desktop [dir=ltr] .detailPagePrimaryContainer, +.layout-tv [dir=ltr] .detailPagePrimaryContainer { + padding-left: var(--sidePadding); +} + +@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: .3; + } +} + +@keyframes animMoveUp { + from { + transform: translateY(-90%); + opacity: 0; + } + + to { + transform: translateY(-100%); + opacity: 1; + } +} + +.detailLogo { + /* this hides the detail logo by default to make it only show up on modern browsers */ + display: none; +} + +@supports (aspect-ratio: 1 / 1) { + /* this shows the detail logo on modern browsers */ + + .detailLogo { + display: block; + top: calc(100vh - 10em - var(--primaryItemPageNegativeSpace)); + left: 0; + width: 40%; + transform: translateY(-100%); + margin: auto 30%; + height: 25vh; + background-position: bottom; + } + + .layout-tv .detailLogo { + display: block; + } +} + +.layout-mobile .detailLogo { + display: block; + 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; +} + +.itemBackdrop { + display: block !important; +} + +/* Theme video styling rolled back because jellyfin does not differentiate between the main video player and theme video playback nicely*/ +/* .videoPlayerContainer { + position: relative !important; + -webkit-mask: var(--themeVideoPlayerMask); + mask: var(--themeVideoPlayerMask); + height: 90vh; +} + +.layout-mobile .videoPlayerContainer { + z-index: 1; + height: 35vh; +} + +.videoPlayerContainer>.htmlvideoplayer { + width: -webkit-fill-available; + object-fit: cover; +} */ + +.layout-desktop .itemBackdrop { + height: calc(100vh - 32vh - var(--primaryItemPageNegativeSpace)) !important; +} + +.layout-mobile .itemBackdrop { + margin-top: 0; + position: sticky; + top: -30%; + -webkit-mask: var(--itemBackdropMask); + mask: var(--itemBackdropMask); + animation: animMoveDown .5s ease-out forwards; + height: 45vh; +} + +.layout-mobile #itemDetailPage:has(.detailLogo.hide) .itemBackdrop { + margin-bottom: -10vh; +} + +.layout-tv .detailLogo { + height: 20vh; + top: 39vh; + left: 30vw; + width: 60vw; + margin: auto 5vw; +} + +.layout-tv .itemBackdrop { + height: 33vh; +} + +.detailImageContainer.padded-left { + padding-left: 0; +} + +.layout-tv .detailImageContainer.padded-left { + padding-left: 0; + height: 0; + position: fixed; +} + +.layout-desktop .detailImageContainer .card { + top: unset !important; + width: 22vh !important; +} + +.detailImageContainer .card.backdropCard { + width: 40vh !important; + max-width: 50vw; + margin-bottom: 1em; +} + +.detailImageContainer .card { + display: none; +} + +.layout-tv .detailImageContainer .card { + width: 23vw !important; + display: block !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)); +} + +/* 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; +} + +/* 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: .5em; +} + +/* this hides the main media title when the clear logo is available*/ +.detailLogo:not(.hide)~.detailPageWrapperContainer .nameContainer h1, +#itemDetailPage:has(.detailImageContainer .card.backdropCard) .detailLogo, +#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .detailLogo, +#itemDetailPage:has(.detailImageContainer .cardImageIcon.person) .detailLogo, +.detailImageContainer .card:not(.portraitCard):has(.cardImageIcon.person) { + z-index: 2; + display: none; +} + +/* 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, .squareCard)~.nameContainer h1, +.detailImageContainer:has(.cardImageIcon.person)~.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"]) { + border: var(--defaultBorder); + border-radius: var(--largeRadius); + padding: .5em; + background-color: var(--lighterGradientPointAlpha); +} + +/* this shows the poster in the cast, book and music pages */ +.detailImageContainer .card:has(.book, .person, .album), +.detailImageContainer .card.backdropCard:has(.tv), +.detailImageContainer .card.backdropCard:has(.live_tv) { + display: block; +} + +/* This reduces the top padding in the cast, live tv, episode, song, album and artist pages i.e. shifts up page content */ +#itemDetailPage:has(.detailImageContainer .cardImageIcon.person, .detailImageContainer .cardImageIcon.book) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .cardImageIcon.album) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .backdropCard .cardImageIcon.tv) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .squareCard) .itemBackdrop, +#itemDetailPage:has(.detailImageContainer .cardImageIcon.live_tv) .itemBackdrop { + height: calc(100vh - 32vh - var(--secondaryItemPageNegativeSpace)) !important; +} + +#itemDetailPage:has(.detailImageContainer .card.backdropCard), +#itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album) { + background: linear-gradient(180deg, var(--darkerGradientPointAlpha) 80%, transparent) +} + +.layout-mobile #itemDetailPage:has(.detailImageContainer .card.backdropCard) .itemBackdrop, +.layout-mobile #itemDetailPage:has(.detailImageContainer .card .cardImageIcon.album) .itemBackdrop { + animation: animMoveDownSecondaryPage .5s ease-out forwards; +} + +.layout-mobile .cardImageIcon { + font-size: 3.5em; +} + +@media (max-width: 50em) { + .homeLibraryButton { + width: 45.6% !important; + } +} + +.homeLibraryButton { + padding-inline-start: .25em; + min-width: 15%; +} + +@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: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 .25s; +} + +.backdropImage:before { + transform: scale(1.1); + filter: var(--blurLargest); +} + +.backgroundContainer.withBackdrop { + opacity: .9; + background: linear-gradient(0deg, var(--darkerGradientPoint), 45%, rgba(17, 24, 39, .25)); +} + +.layout-mobile .withSectionTabs .backgroundContainer.withBackdrop { + opacity: .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 .5s ease-out forwards; +} + +.appfooter { + background-color: var(--headerColor) !important; + backdrop-filter: var(--blurLargest) !important; +} + +.lyricPage { + padding: 0 var(--sidePadding); +} + +.lyricsLine { + font-size: 2em; + color: var(--textColor); + text-align: center; + align-self: center; + font-weight: 600; + transition: transform .125s; +} + +.pastLyric, +.futureLyric { + transform: scale(.85); + font-weight: 400; + text-align: center; +} + +.pastLyric { + opacity: .45; +} + +.buttonActive { + color: var(--uiAccentColor) !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: .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(--dimTextColor); +} + +.backgroundProgress>div, +.backgroundProgress { + 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; +} + +progress, +::-webkit-progress-bar { + 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; +} + +/* this is the osd player slider */ +.mdl-slider-background-flex { + border-radius: var(--smallRadius); + height: .4em; + margin-top: -.2em; + background: var(--osdSeekBarBufferedColorAlpha); + 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); + width: 4px !important; + height: .4em !important; + border-radius: 0em; +} + +.sliderContainer:hover .mdl-slider::-webkit-slider-thumb { + width: .2em !important; + height: .8em !important; + border-radius: .2em; + transform: scale(1); +} + +.sliderContainer:active .mdl-slider::-webkit-slider-thumb, +.mdl-slider.show-focus:focus::-webkit-slider-thumb { + width: .2em !important; + height: .8em !important; + border-radius: .2em; + transform: scale(1) scaleY(1.25); +} + +.mdl-slider::-moz-range-thumb { + background: var(--osdSeekBarThumbColor); +} + +.sliderMarkerContainer { + margin: 0 .1em; +} + +.sliderMarker.watched { + background-color: var(--osdSeekBarPlayedColor); +} + +.sliderMarker { + height: 4px; + border-radius: 2px; +} + +.iconOsdProgressInner { + background: var(--osdSeekBarPlayedColor); +} + +.selectLabel { + max-height: 2em; +} + +.button-link { + color: rgb(200, 200, 200); +} + +.button-link:hover { + color: unset !important; + text-decoration: none; +} + +.button-link:active { + color: rgb(243, 243, 243) !important; + text-decoration: none; +} + +.mainDrawer, +.drawer-open { + background-color: var(--drawerColor); + border-right: var(--defaultBorder); + backdrop-filter: var(--blurLarge); +} + +.mainDrawer-scrollContainer { + padding-bottom: 5vh; +} + +.btnHeaderSave.button-flat { + color: var(--uiAccentColor) !important; + gap: .3em; + border-radius: var(--smallRadius); +} + +.button-flat:hover { + color: unset; +} + +.button-flat:active { + color: unset; + background-color: rgba(255, 255, 255, .2); +} + +.playstatebutton-icon-played { + color: rgb(34, 197, 94); +} + +.videoOsdBottom.videoOsdBottom-maincontrols .btnPause { + font-size: 2em; +} + +.nowPlayingBar .playPauseButton { + font-size: 2em; +} + +.nowPlayingInfoContainer .btnPlayPause { + font-size: 3em; +} + +.osdControls { + display: flex; + flex-direction: column-reverse; +} + +.itemDetailsGroup { + outline: none; + overflow: hidden; + margin-top: 1em; + border: var(--defaultBorder); + border-radius: var(--smallRadius); + background-color: var(--lighterGradientPointAlpha); +} + +@supports(display:revert) { + .itemDetailsGroup { + outline: var(--defaultBorder); + outline-offset: calc(-1 * var(--borderWidth)); + border: none; + } + + /* this somehow fixes border overflow on mobile */ + .layout-mobile .itemDetailsGroup { + outline-offset: calc(-1 * var(--borderWidthDouble)); + } +} + +.itemDetailsGroup>div:not(:last-child) { + border-bottom: var(--defaultBorder); +} + +.detailsGroupItem { + margin: 0 !important; + justify-content: space-between; + padding: .5em .9em; + align-items: baseline; +} + +.detailsGroupItem>.label { + font-weight: 600; + flex-basis: 6em; +} + +.detailsGroupItem>.content>a { + font-weight: 400; + text-align: end; +} + +.detailsGroupItem>.content { + text-align: end; + color: var(--dimTextColor); +} + +.detailsGroupItem>.label { + color: var(--textColor); +} + +.itemExternalLinks { + color: var(--textColor); +} + +.itemExternalLinks.focuscontainer-x { + color: transparent; +} + +.itemExternalLinks.focuscontainer-x>.button-link { + color: var(--textColor); + background-color: var(--selectorBackgroundColor); + padding: .125em .5em; + border-radius: var(--smallerRadius); + margin-bottom: .5em; +} + +.layout-mobile .itemExternalLinks.focuscontainer-x>.button-link:hover:not(:active) { + color: var(--textColor) !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a:hover, +.itemExternalLinks.focuscontainer-x>a:active { + background-color: var(--activeColor) !important; + color: white !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="themoviedb.org"]:active { + background-color: rgb(26, 183, 216) !important; + color: black !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="imdb.com"]:active { + background-color: rgb(226, 182, 22) !important; + color: black !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="thetvdb.com"]:active { + background-color: rgb(108, 213, 145) !important; + color: black !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="trakt.tv"]:active { + background-color: rgb(171, 58, 173) !important; + color: var(--textColor) !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="theaudiodb.com"]:active { + background-color: rgb(99, 153, 204) !important; + color: rgb(15, 22, 28) !important; +} + +.layout-desktop .itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:hover, +.itemExternalLinks.focuscontainer-x>a[href*="musicbrainz.org"]:active { + background-color: rgb(186, 71, 143) !important; + color: var(--textColor) !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; + -webkit-line-clamp: 2; +} + +.detail-clamp-text p { + margin-top: .25em; + margin-bottom: .25em; +} + +.layout-mobile .detail-clamp-text { + -webkit-line-clamp: 4; +} + +.overview-expand.emby-button { + padding: 0; + margin-top: 1.4em; + margin-bottom: 1.4em; + color: transparent; +} + +.overview-expand.emby-button:after { + content: "\e313"; + font-family: 'Material Icons'; + background: var(--selectorBackgroundColor); + border-radius: 50%; + width: 1.5em; + height: 1.5em; + align-content: center; + line-height: 1.6ch; + transition: transform .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: .5em; +} + +.itemMiscInfo { + align-items: flex-end !important; + justify-content: center; +} + +.innerCardFooter, +.chapterThumbTextContainer { + background: var(--cardFooterGradient); + text-shadow: .1em .1em 0px black; + width: -webkit-fill-available; + height: -webkit-fill-available; + padding: 0em 2em 2em 2em; + align-content: end; + display: grid; +} + +.chapterCardImageContainer { + background-size: 135%; +} + +.chapterCardImageContainer+.innerCardFooter { + padding: 0em 1em 1em 1em; + height: auto; +} + +.layout-mobile .innerCardFooter { + padding: 5em 1.5em 1.5em 1.5em; +} + +.layout-mobile .chapterCardImageContainer+.innerCardFooter { + padding: 0em .5em .5em .5em; +} + +.centerMessage { + width: unset; +} + +.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: .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 .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); +} + +.selectionCommandsPanel>h1 { + font-size: large; +} + +.itemSelectionPanel { + border: unset; + background-color: transparent; +} + +.emby-checkbox:checked+span+.checkboxOutline { + border-radius: var(--smallerRadius) !important; + box-shadow: inset 0em 7em 10em 20px rgba(0, 0, 0, .8); + background: transparent; + border-color: white; + border-style: solid; + border-width: var(--borderWidthDouble); + outline: none; +} + +@supports(display:revert) { + .emby-checkbox:checked+span+.checkboxOutline { + outline: solid var(--borderWidth) white; + } +} + +.checkboxOutline { + top: unset; + height: 1.3em; + width: 1.3em; + border-radius: var(--smallerRadius); +} + +.itemSelectionPanel .material-icons.check:before { + font-size: 4em; + color: #ffffff; + padding: .25em; +} + +.cardText-first+.itemSelectionPanel>.checkboxContainer { + height: calc(100% - 1.75em); +} + +.overflowBackdropCard .cardText-first+.itemSelectionPanel>.checkboxContainer { + height: calc(100% - 0em); +} + +.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: calc(100% - 0em); +} + +.checkboxOutline.multiSelectCheckboxOutline { + border-radius: var(--largeRadius); + border-width: 0; + width: 100%; + height: 100%; +} + +.checkboxOutline:not(.multiSelectCheckboxOutline) .checkboxIcon { + font-size: .9em; + font-weight: 900; +} + +.checkboxOutline:not(.multiSelectCheckboxOutline) { + border: solid gray var(--borderWidth); + background-color: white; + transition: all .125s; +} + +.emby-checkbox:checked+span+.checkboxOutline:not(.multiSelectCheckboxOutline) { + box-shadow: none; + 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:not(:checked)+span+.checkboxOutline { + outline: var(--borderWidth) solid gray; + outline-offset: calc(-2.5*var(--borderWidth)); + } + + .emby-checkbox:focus+span+.checkboxOutline { + border-color: white !important; + outline: var(--borderWidth) solid var(--highlightOutlineColor); + } +} + +.layout-tv .emby-checkbox:focus+span+.checkboxOutline { + transform: scale(1.75); +} + +.cardIndicators { + -webkit-align-items: center; + align-items: center; + top: .5em; +} + +[dir=ltr] .cardIndicators { + right: .5em; +} + +.layout-mobile .cardIndicators { + top: .2em; + right: .2em; +} + +.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: .5em; + transform: scale(.85); + border: var(--defaultLighterBorder); + font-size: .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: "\f1c6"; + font-size: 85%; +} + +div[data-type="Photo"] .play_arrow:before { + content: "\e5d0"; +} + +div[data-type="PhotoAlbum"] .play_arrow:before { + content: "\e8eb"; +} + +.emby-button.block, +.button-alt, +.raised, +#btnDeleteImage, +.manageRecordingButton, +.dashboardActionsContainer>.emby-button { + color: #fff; + border-radius: var(--smallRadius); + background: var(--lighterGradientPoint); + border: var(--defaultBorder); + transition: all .125s; +} + +.editItemMetadataForm>.metadataFormFields div:has(.formDialogFooterItem) { + display: flex; + justify-content: center; +} + +.btnBrowse>.folder { + margin-inline-end: .5em; +} + +.fab { + color: #fff; + background: var(--lighterGradientPoint); + border: var(--defaultBorder); +} + +.fab:focus { + background: var(--lighterGradientPoint) !important; + filter: brightness(1.2); +} + +.raised:focus { + background: inherit; + filter: brightness(1.2); +} + +.raised:active, +.fab:active, +.emby-button:active { + filter: brightness(1.2) !important; + transform: scale(0.98); +} + +.detailButton { + border: var(--defaultLighterBorder); + padding: .5em .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) { + color: var(--textColor); + backdrop-filter: none; + border-color: transparent; + margin: .5em !important; + border-radius: 50%; + padding: .6em !important; + background: transparent; +} + +.layout-desktop .detailButton:not(.btnPlay):hover { + color: black; + background: var(--dimTextColor); +} + +.detailButton:active { + color: black; + background: var(--textColor); +} + +.btnPlay.detailButton { + background-color: var(--textColor); + color: black; + border-radius: 3em; + border-color: var(--borderColor); + height: 3em; + min-width: 10em; + margin-right: .5em !important; +} + +.btnPlay>.detailButton-content { + -webkit-align-items: unset; + align-items: unset; + display: -webkit-flex; + display: flex; + -webkit-flex-direction: unset; + flex-direction: unset; + -webkit-justify-content: unset; + align-content: unset; + justify-content: flex-start; +} + +.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay[title="Play"]>.detailButton-content::after { + content: "Read"; +} + +.mainDetailButtons:has(.detailButton[data-type="Book"]) .btnPlay .material-icons.play_arrow:before { + content: "\f1c6"; + padding-inline-end: 1ch; +} + +.btnPlay[title="Play"]>.detailButton-content::after { + content: "Play"; +} + +.btnPlay[title="Resume"]>.detailButton-content::after { + content: "Resume"; +} + +.btnPlay>.detailButton-content::after { + padding: 0 1ch; + place-content: center; +} + +.mainDetailButtons { + justify-content: center; + margin: 0 0 1em 0; +} + +.layout-mobile [dir=ltr] .mainDetailButtons { + flex-wrap: wrap; + padding: 0 1.25em; +} + +@media (min-width: 100em) { + .mainDetailButtons { + font-size: unset; + margin: 0 0 1em 0; + } +} + +.localnav>.emby-button { + background: var(--lighterGradientPoint) !important; + color: #fff; + padding: .8em .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: white; +} + +#btnDeleteImage, +.button-delete, +.btnRevoke, +#btnShutdown { + 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) { + background-color: var(--headerColor); + backdrop-filter: var(--blurDefault); +} + +.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.notifications:not(.listItemIcon-transparent), +.listItemIcon.schedule:not(.listItemIcon-transparent), +.listItemIcon.person:not(.listItemIcon-transparent), +.listItemIcon.live_tv:not(.listItemIcon-transparent) { + background-color: rgb(41, 49, 83) !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: .25em; +} + +.listItemImage { + border-radius: var(--smallRadius); + margin-right: .75em !important; + border: var(--defaultBorder); +} + +[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"] { + padding: .375em; + margin-bottom: .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: white; + font-weight: 600; +} + +.listItem[data-type="Audio"]:has(.playlistIndexIndicatorImage):not(:hover) { + background-color: rgba(255, 255, 255, .07); +} + +[dir="ltr"] .listItem:not(.actionSheetMenuItem)[data-type="Episode"] .listItemBodyText:not(.secondary) { + font-size: 1.17em; + font-weight: 600; +} + +.listItemBody>.listItemBodyText:not(.secondary) { + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; + color: var(--textColor); +} + +.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: .75em; + margin-bottom: 0em; +} + +.listItem, +.navMenuOption { + border-radius: .7em; +} + +.listItem:hover, +.navMenuOption:hover { + background: unset; + border-radius: .7em; +} + +.listItem:focus { + background: var(--highlightOutlineColor); +} + +.listItem:active, +.navMenuOption:active { + background: rgba(255, 255, 255, .125); +} + +.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: .7em; + margin: .25 .5em !important; +} + +.Mui-selected { + background-color: var(--activeColor) !important; +} + +.actionsheetDivider { + height: 2px; + background: rgb(255, 255, 255, 0.05); +} + +.actionsheet-xlargeFont { + line-height: normal; +} + +.actionSheetContent { + padding: .4em !important; +} + +.actionSheetContent>h1 { + font-size: unset; +} + +[dir=ltr] .actionsheetMenuItemIcon.check { + margin: 0 .45em 0 .45em !important; +} + +.actionSheetMenuItem:has(.listItemIcon.check) { + background-color: var(--activeColor); +} + +.actionSheetMenuItem:has(.listItemIcon.check) .listItemBodyText { + color: white; +} + +.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: rgba(255, 255, 255, .125); +} + +.navMenuOption { + border-radius: var(--smallRadius) !important; + margin: 0em 1em !important; +} + +[dir=ltr] .navMenuOption { + padding: .75em 1em !important; + margin-bottom: unset; +} + +#myPreferencesMenuPage .listItemIcon { + margin-left: .5em; + margin-right: .25em; +} + +.navMenuOption-selected { + background-color: var(--activeColor) !important; +} + +#itemDetailPage .detailSection { + display: grid; + row-gap: 1em; + column-gap: 3em; + max-width: unset !important; + grid-template-columns: 1fr 1fr; +} + +.layout-mobile .detailSection { + grid-template-columns: 1fr; +} + +.detailPageContent { + gap: 1em; +} + +.detailImageContainer .card { + position: inherit !important; +} + +.trackSelections { + order: 3; + max-width: unset !important; + margin-top: 1em; + border: var(--defaultBorder); + border-radius: var(--smallRadius); + padding: 1em; + grid-column: 2; + background-color: var(--lighterGradientPointAlpha); +} + +.recordingFields { + order: 4; +} + +.detailsGroupItem, +.trackSelections .selectContainer { + max-width: unset !important; + align-items: baseline; +} + +.selectArrowContainer { + top: 0em; + opacity: .5; +} + +.trackSelectionFieldContainer>.selectArrowContainer { + top: .5em; +} + +.trackSelectionFieldContainer>label { + max-width: 2.75em; + background-repeat: no-repeat; + color: transparent; + transform: scale(.9); +} + +.selectVideoContainer.trackSelectionFieldContainer>label { + background-image: url('data:image/svg+xml,'); +} + +.selectAudioContainer.trackSelectionFieldContainer>label { + background-image: url('data:image/svg+xml,'); +} + +.selectSubtitlesContainer.trackSelectionFieldContainer>label { + background-image: url('data:image/svg+xml,') +} + +.selectSourceContainer.trackSelectionFieldContainer>label { + background-image: url('data:image/svg+xml,'); +} + +.detailSectionContent { + order: 1; + grid-column: 1 / -1; +} + +.detailSectionContent a:not(.overview-expand) { + text-align: start; +} + +.layout-desktop .detailSectionContent { + align-content: end; + min-height: 15vh; +} + +.itemDetailsGroup { + order: 2; + grid-column: 1; +} + +.trackSelections.hide~.recordingFields.hide~.itemDetailsGroup { + grid-column: 1 / -1; +} + +.layout-mobile .trackSelections, +.layout-mobile .detailSectionContent, +.layout-mobile .itemDetailsGroup, +.layout-tv .trackSelections, +.layout-tv .detailSectionContent, +.layout-tv .itemDetailsGroup { + grid-column: 1 / -1; +} + +.sliderBubble { + border-radius: var(--largeRadius); + border: var(--defaultBorder); + overflow: hidden; + z-index: 3; +} + +.alphaPickerButton { + font-family: monospace; + margin: .15em; + color: rgba(255, 255, 255, .25); +} + +.alphaPickerButton-selected { + color: rgba(255, 255, 255, 1); +} + +.alphaPicker-vertical { + height: 70%; +} + +.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; +} + +.paddded-left { + padding-left: var(--sidePadding) !important; +} + +.layout-mobile .padded-right-withalphapicker { + padding-left: 4.5%; + padding-right: 6.5%; +} + +.detailPagePrimaryContent.padded-right { + padding-right: 0 !important; +} + +[dir=ltr] .detailPageContent, +.content-primary { + padding-left: var(--sidePadding) !important; + padding-right: var(--sidePadding) !important; +} + +/* this removes right padding from cast page sections to place cards evenly*/ +#itemDetailPage .verticalSection .itemsContainer.padded-right { + padding-right: 0 !important; +} + +.listPaging>span { + padding: 0 .5em; +} + +.layout-mobile #myPreferencesMenuPage { + padding-top: 3.75em !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; +} + +.sectionTitleTextButton { + padding: 0 .5em; +} + +.sectionTitleTextButton:hover { + background: transparent !important; +} + +.sectionTitleTextButton:active { + color: white !important; +} + +.sectionTitleTextButton>* { + padding: .3em 0 !important; + margin: 0 0 !important; +} + +.dashboardSection .sectionTitleTextButton>.material-icons, +.sectionTitleTextButton>.material-icons, +.dashboardSection .sectionTitleTextButton>.material-icons.material-icons { + font-size: unset; +} + +.sectionTitleTextButton>.material-icons::before { + display: none; +} + +.sectionTitleTextButton>.material-icons.chevron_right { + margin-left: .5rem !important; + height: 1.5rem; + width: 1.5rem; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23D1D5DB' aria-hidden='true'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12.75 15l3-3m0 0l-3-3m3 3h-7.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat center center; + background-size: contain; + /* Stops miscalculating the size on hover effect */ +} + +.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; +} + +.upNextContainer .btnStartNow { + background-color: var(--btnSubmitColor); + border-color: var(--btnSubmitBorderColor); +} + +.upNextDialog-title { + white-space: pre-wrap; + width: unset; +} + +.upNextDialog-buttons { + width: unset; + flex-wrap: wrap; +} + +.upNextContainer .upNextDialog-countdownText { + color: white; +} + +.skip-button { + background-color: whitesmoke; + box-shadow: var(--shadow); + bottom: 25%; + right: var(--sidePadding); +} + +/* this workaround allows the skip button get focused correctly on TVs using remote navigation*/ +/* issue: back button can no longer be focused correctly when this button is focused, +but that is a non-issue because users can use the back button on their remotes */ +.layout-tv .skip-button { + right: unset; + left: var(--sidePadding); +} + +.skip-button:hover { + background-color: white; +} + +.skip-button:active { + background-color: rgba(245, 245, 245, .7); + box-shadow: none; +} + +.toast, +.upNextContainer { + background: var(--headerColor) !important; + border: var(--defaultBorder) !important; + backdrop-filter: var(--blurDefault); +} + +.activeSession { + width: 98% !important; +} + +.emby-tab-button:hover { + color: whitesmoke; + +} + +@media (hover: hover) and (pointer: fine) { + .paper-icon-button-light:hover:not(:disabled) { + color: #fff; + background-color: rgb(255 255 255 / 5%); + } + + .actionSheetMenuItem.emby-button:has(.listItemIcon.material-icons.check[style*="hidden"]):hover { + background-color: rgba(255, 255, 255, .125); + } + + .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, .2); + color: white; + } + + .btnPlay.detailButton:hover { + background-color: var(--textColor); + color: black; + } + + .alphaPickerButton:hover { + color: rgba(255, 255, 255, 1); + } + + .listItem:hover { + background: rgba(255, 255, 255, .125); + backdrop-filter: var(--blurLargest); + } + + .navMenuOption:hover { + background: rgba(255, 255, 255, .125); + } + + .searchfields-icon:hover, + .inputContainer .emby-input-iconbutton:hover { + color: rgba(255, 255, 255, .8); + } + + #scenesContent .cardScalable:hover { + border-color: var(--dimTextColor) !important; + } + + .sectionTitleTextButton:hover { + background: transparent !important; + color: white !important; + } + + .button-link:hover { + color: rgb(243, 243, 243) !important; + text-decoration: none; + } +} + +.paper-icon-button-light:active:not(:disabled) { + color: #fff; + background-color: rgb(255 255 255 / 5%); +} + +.emby-textarea { + font-family: consolas, monaco, monospace; +} + +.emby-select-withcolor, +.emby-select, +.emby-input, +.emby-textarea { + background-color: var(--selectorBackgroundColor); + border: var(--defaultLighterBorder); + border-radius: var(--smallRadius); + padding: .5em !important; +} + +.inputLabelFocused, +.selectLabelFocused, +.textareaLabelFocused { + color: #fff; +} + +.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; + } +} + +.emby-select-withcolor>option { + color: inherit; + background-color: var(--selectorBackgroundColor); +} + +.inputContainer .emby-input-iconbutton { + color: rgba(255, 255, 255, .5); + margin-left: -2.5em; + background-color: transparent !important; +} + +.searchfields-txtSearch { + padding: .75em 1.5em !important; + border-radius: 4em; +} + +.searchfields-icon { + padding: .25em; + margin-left: -1.75em; + margin-bottom: 0; + border-radius: var(--largeRadius); + color: rgba(255, 255, 255, .5); +} + +.searchfields-icon:active, +.inputContainer .emby-input-iconbutton:active { + color: rgba(255, 255, 255, .8); +} + +.searchFields>.searchFieldsInner { + flex-direction: row-reverse; +} + +.infoWrapper h1.itemName, +.infoWrapper h1.parentName { + font-size: 4em; + white-space: pre-wrap; + padding-bottom: .5ch; + color: white; +} + +.infoWrapper h1.itemName, +.infoWrapper h1.parentName, +.infoWrapper h1.itemName a, +.infoWrapper h1.parentName a { + font-weight: 200; +} + +.infoWrapper h1.itemName bdi, +.infoWrapper h1.parentName bdi, +.infoWrapper h1.itemName a, +.infoWrapper h1.parentName a { + /* overflow: hidden; */ + display: -webkit-box !important; + -webkit-line-clamp: 3; + line-clamp: 3; + -webkit-box-orient: vertical; +} + +.layout-mobile .infoWrapper h1.itemName, +.layout-mobile .infoWrapper h1.parentName, +.layout-mobile .infoWrapper h1.parentNameLast { + font-size: 2em; + word-wrap: break-word; + padding-bottom: 0ch; +} + +.itemName.originalTitle { + padding-top: .25em; + padding-bottom: .25em; + color: var(--dimTextColor); +} + +.channelPrograms+.channelPrograms, +.guide-channelHeaderCell+.guide-channelHeaderCell { + margin-top: 0; +} + +.channelPrograms, +.guide-channelHeaderCell, +.programCell { + border-color: transparent; + /* this disables the 'color coded backgrounds' */ + background-color: transparent !important; + border-radius: var(--smallRadius); +} + +.guideProgramName { + background-color: rgba(255, 255, 255, .05); + height: -webkit-fill-available; + margin: .35em 0 .35em .7em; + border-radius: var(--smallerRadius); +} + +.guide-programNameCaret { + display: none; +} + +.programCell-active .guideProgramName { + background-color: rgba(255, 255, 255, .125); +} + +.guideVerticalScroller { + padding: 0; +} + +.guideChannelImage { + background-color: rgba(255, 255, 255, .05); + bottom: .35em; + right: .35em; + top: .35em; + width: calc(100% - .7em); + border-radius: var(--smallerRadius); +} + +#guideTab { + padding-top: 3em !important; +} + +.guide-channelHeaderCell:focus, +.programCell:focus { + background-color: var(--highlightOutlineColor) !important; +} + +.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; +} + +.sliderBubbleText { + font-size: 1.5em; +} + +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); +} + +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: .5rem; +} + +.playerStats, +.iconOsd { + border-radius: var(--largeRadius); + background-color: rgba(69, 69, 69, .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(--uiAccentColor); +} + +.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, .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: white; + 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; +} + +.startTimeText { + margin: 0 !important; +} + +.endTimeText { + justify-content: right; + padding-inline-end: .8em; + margin: 0 0 0 .75em !important; +} + +.startTimeText, +.endTimeText { + padding-top: .25em; +} + +.startTimeText, +.positionTime { + text-align: start; + justify-content: left; +} + +.endTimeText, +.runtime { + text-align: end; + justify-content: right; +} + +.filterIndicator { + background: var(--activeColor); +} + +#homeTab .overflowBackdropCard[data-isfolder="true"] .cardPadder-overflowBackdrop { + padding-bottom: 50%; +} + +#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText-first, +#homeTab .overflowBackdropCard[data-isfolder="true"] .cardText.cardTextCentered { + display: var(--libraryLabelVisibility); +} + +.nowPlayingButtonsContainer { + margin-top: 1em; +} + +.nowPlayingPageImageContainerNoAlbum { + border: var(--defaultBorder); + border-radius: var(--smallRadius); + overflow: hidden; +} + +.nowPlayingPageImageContainerNoAlbum .defaultCardBackground { + background: repeating-radial-gradient(black, 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); + z-index: 1; +} + +.layout-mobile .playlistSectionButton.playlistSectionButtonTransparent { + background: transparent; + border-top: var(--defaultBorder); + border-color: transparent; +} + +.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 .nowPlayingImage { + background-size: cover; + border-radius: var(--smallerRadius); + height: 3.5em; + margin: .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: .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-size: unset; + font-weight: 600; + list-style-type: circle; + margin-bottom: .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: white; + background-color: transparent !important; +} + +.MuiToggleButtonGroup-grouped.Mui-selected { + color: white; +} + +.MuiButtonBase-root.MuiIconButton-root:hover { + color: white; + 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 .5s; +} + +/* this is the default header, visible in home and libraries */ +.skinHeader-blurred:not(.osdHeader) { + backdrop-filter: none; + background-color: transparent; + border: none; + background: var(--headerBackground); + padding-top: .75em; +} + +.layout-mobile .skinHeader-blurred:not(.osdHeader) { + padding-top: .25em; +} + +.layout-mobile .withSectionTabs .headerTop { + padding-bottom: 1.45em; +} + +.skinHeader-blurred:not(.osdHeader):not(.semiTransparent)::after { + content: var(--headerBlurLayerVisibility); + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + backdrop-filter: var(--blurLargest); + -webkit-mask: var(--headerBlurMask); + mask: var(--headerBlurMask); + z-index: -1; +} + +.headerTabs.sectionTabs { + margin: 0; + height: 6em; +} + +/* 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, +.skinHeader.headroom:not(.osdHeader, .noHomeButtonHeader):has(.pageTitle:empty) .headerButton { + text-shadow: 1px 1px 0 #00000080; +} + +/* this keeps the header elements aligned when its height is modified */ +.headerTop { + -webkit-align-items: flex-end; + align-items: flex-end; +} + +/* this prevents the section tabs from hiding all the way up */ +.headroom--unpinned { + -webkit-transform: translateY(-3.7em); + transform: translateY(-3.7em); +} + +.noHomeButtonHeader .emby-tab-button[data-index="1"]:before { + content: "\e87d"; +} + +.noHomeButtonHeader .emby-tab-button[data-index="0"]:before { + content: "\e88a"; +} + +.noHomeButtonHeader .emby-tab-button:before { + font-family: 'Material Icons Round'; + padding-inline-end: .5ch; + font-size: 1.2em; + font-variation-settings: 'FILL' 0; +} + +.layout-tv .sectionTabs .emby-tabs.smoothScrollX { + overflow: visible !important; +} + +.layout-tv .sectionTabs { + /* this prevents the section tabs from being off-center in the music library + after I set the overflow to visible to fix visual glitches */ + width: 100%; +} + +.headerTabs.sectionTabs .emby-tab-button { + display: inline-flex; + margin: .25em .5em; + padding: 0 1.25em; + height: 2.5em; + color: var(--textColor); + font-weight: 400; + border-radius: var(--largeRadius); + background-color: var(--darkerGradientPointAlpha); +} + +.headerTabs.sectionTabs .emby-tab-button-active { + margin: .25em .5em; + color: black; + background-color: var(--textColor); +} + +.layout-mobile .headerTabs.sectionTabs .emby-tab-button:first-child { + margin-left: var(--sidePadding); +} + +.layout-mobile .headerTabs.sectionTabs .emby-tab-button:last-child { + margin-right: var(--sidePadding); +} + +@media (min-width: 75em) { + + .layout-desktop .sectionTabs, + .layout-mobile .sectionTabs { + -webkit-align-items: center; + align-items: center; + -webkit-align-self: center; + align-self: center; + -webkit-justify-content: center; + justify-content: center; + margin-top: -3em; + position: relative; + width: auto; + } + + .libraryPage:not(.noSecondaryNavPage):not(.layout-tv .libraryPage) { + padding-top: 6.8em !important; + } +} + +@media (max-width: 100em) { + .sectionTabs { + font-size: 100%; + } +} + +.libraryPage:not(.noSecondaryNavPage) { + padding-top: 9.5em !important; +} + +.layout-tv .headerLeft { + overflow: unset; + margin: .25em .5em; +} + +.remoteControlContent { + padding: 0 var(--sidePadding) !important; +} + +/* Uncomment this to bring back the original ElegantFin header design - start */ + +/* .skinHeader-blurred:not(.osdHeader):not(.semiTransparent) { + backdrop-filter: var(--blurLarge); + background: var(--headerColor); + border: var(--defaultBorder); + border-width: 0 0 var(--borderWidth) 0; +} + +.skinHeader-blurred:not(.osdHeader):not(.semiTransparent)::after { + content: none; +} + +.headerTabs.sectionTabs { + height: 4em; +} */ + +/* Uncomment this to bring back the original ElegantFin header design - end */ \ No newline at end of file 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 80c66fb..5462207 100644 --- a/Theme/assets/add-ons/custom-media-covers-latest-min.css +++ b/Theme/assets/add-ons/custom-media-covers-latest-min.css @@ -1,2 +1,2 @@ -/* Add-on: Custom media covers v25.08.02 for the ElegantFin Theme for Jellyfin by lscambo13 */ -:root{--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);--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)}.card-withuserdata[data-isfolder="true"] .cardImageContainer.defaultCardBackground{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"],[data-type="Season"],[data-type="Playlist"]) .cardImageContainer.cardContent::before{position:absolute;font-size:3.5vh;margin-bottom:.175em;font-weight:800;color:white;font-family:'Noto Sans';text-align:center}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"]) .cardImageIcon.material-icons:not(.quiz)::before{display:none}div[data-collectiontype="movies"] .cardImageContainer.cardContent{background:var(--colorOverlayMoviesCover)!important;background-image:var(--urlMoviesCover)!important}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent{background:var(--colorOverlayTvshowsCover)!important;background-image:var(--urlTvshowsCover)!important}div[data-collectiontype="livetv"] .cardImageContainer.cardContent{background:var(--colorOverlayLivetvCover)!important;background-image:var(--urlLivetvCover)!important}div[data-collectiontype="music"] .cardImageContainer.cardContent{background:var(--colorOverlayMusicCover)!important;background-image:var(--urlMusicCover)!important}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent{background:var(--colorOverlayHomevideosCover)!important;background-image:var(--urlHomevideosCover)!important}div[data-collectiontype="books"] .cardImageContainer.cardContent{background:var(--colorOverlayBooksCover)!important;background-image:var(--urlBooksCover)!important}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent{background:var(--colorOverlayBoxsetsCover)!important;background-image:var(--urlBoxsetsCover)!important}div[data-collectiontype="folders"] .cardImageContainer.cardContent{background:var(--colorOverlayFoldersCover)!important;background-image:var(--urlFoldersCover)!important}div[data-collectiontype="playlists"] .cardImageContainer.cardContent{background:var(--colorOverlayPlaylistsCover)!important;background-image:var(--urlPlaylistsCover)!important}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}div[data-collectiontype="movies"] .cardImageContainer.cardContent::before{content:"Movies"}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent::before{content:"TV Shows"}div[data-collectiontype="livetv"] .cardImageContainer.cardContent::before{content:"Live TV"}div[data-collectiontype="music"] .cardImageContainer.cardContent::before{content:"Music"}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent::before{content:"Home Videos"}div[data-collectiontype="books"] .cardImageContainer.cardContent::before{content:"Books"}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent::before{content:"Collections"}div[data-collectiontype="folders"] .cardImageContainer.cardContent::before{content:"Folders"}div[data-collectiontype="playlists"] .cardImageContainer.cardContent::before{content:"Playlists"}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply} \ No newline at end of file +/* Add-on: Custom media covers v25.08.08 for the ElegantFin Theme for Jellyfin by lscambo13 */ +:root{--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);--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)}.card-withuserdata[data-isfolder="true"] .cardImageContainer.defaultCardBackground{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"],[data-type="Season"],[data-type="Playlist"]) .cardImageContainer.cardContent::before{position:absolute;font-size:clamp(1em,max(2.5vh,2vw),2.5em);margin-bottom:.175em;font-weight:800;color:white;font-family:'Noto Sans';text-align:center}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"]) .cardImageIcon.material-icons:not(.quiz)::before{display:none}div[data-collectiontype="movies"] .cardImageContainer.cardContent{background:var(--colorOverlayMoviesCover)!important;background-image:var(--urlMoviesCover)!important}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent{background:var(--colorOverlayTvshowsCover)!important;background-image:var(--urlTvshowsCover)!important}div[data-collectiontype="livetv"] .cardImageContainer.cardContent{background:var(--colorOverlayLivetvCover)!important;background-image:var(--urlLivetvCover)!important}div[data-collectiontype="music"] .cardImageContainer.cardContent{background:var(--colorOverlayMusicCover)!important;background-image:var(--urlMusicCover)!important}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent{background:var(--colorOverlayHomevideosCover)!important;background-image:var(--urlHomevideosCover)!important}div[data-collectiontype="books"] .cardImageContainer.cardContent{background:var(--colorOverlayBooksCover)!important;background-image:var(--urlBooksCover)!important}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent{background:var(--colorOverlayBoxsetsCover)!important;background-image:var(--urlBoxsetsCover)!important}div[data-collectiontype="folders"] .cardImageContainer.cardContent{background:var(--colorOverlayFoldersCover)!important;background-image:var(--urlFoldersCover)!important}div[data-collectiontype="playlists"] .cardImageContainer.cardContent{background:var(--colorOverlayPlaylistsCover)!important;background-image:var(--urlPlaylistsCover)!important}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}div[data-collectiontype="movies"] .cardImageContainer.cardContent::before{content:"Movies"}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent::before{content:"TV Shows"}div[data-collectiontype="livetv"] .cardImageContainer.cardContent::before{content:"Live TV"}div[data-collectiontype="music"] .cardImageContainer.cardContent::before{content:"Music"}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent::before{content:"Home Videos"}div[data-collectiontype="books"] .cardImageContainer.cardContent::before{content:"Books"}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent::before{content:"Collections"}div[data-collectiontype="folders"] .cardImageContainer.cardContent::before{content:"Folders"}div[data-collectiontype="playlists"] .cardImageContainer.cardContent::before{content:"Playlists"}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply} \ No newline at end of file diff --git a/Theme/assets/add-ons/custom-media-covers-v25.08.08.css b/Theme/assets/add-ons/custom-media-covers-v25.08.08.css new file mode 100644 index 0000000..5462207 --- /dev/null +++ b/Theme/assets/add-ons/custom-media-covers-v25.08.08.css @@ -0,0 +1,2 @@ +/* Add-on: Custom media covers v25.08.08 for the ElegantFin Theme for Jellyfin by lscambo13 */ +:root{--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);--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)}.card-withuserdata[data-isfolder="true"] .cardImageContainer.defaultCardBackground{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"],[data-type="Season"],[data-type="Playlist"]) .cardImageContainer.cardContent::before{position:absolute;font-size:clamp(1em,max(2.5vh,2vw),2.5em);margin-bottom:.175em;font-weight:800;color:white;font-family:'Noto Sans';text-align:center}.card-withuserdata[data-isfolder="true"]:not([data-type="PhotoAlbum"],[data-type="Series"],[data-type="Folder"]) .cardImageIcon.material-icons:not(.quiz)::before{display:none}div[data-collectiontype="movies"] .cardImageContainer.cardContent{background:var(--colorOverlayMoviesCover)!important;background-image:var(--urlMoviesCover)!important}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent{background:var(--colorOverlayTvshowsCover)!important;background-image:var(--urlTvshowsCover)!important}div[data-collectiontype="livetv"] .cardImageContainer.cardContent{background:var(--colorOverlayLivetvCover)!important;background-image:var(--urlLivetvCover)!important}div[data-collectiontype="music"] .cardImageContainer.cardContent{background:var(--colorOverlayMusicCover)!important;background-image:var(--urlMusicCover)!important}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent{background:var(--colorOverlayHomevideosCover)!important;background-image:var(--urlHomevideosCover)!important}div[data-collectiontype="books"] .cardImageContainer.cardContent{background:var(--colorOverlayBooksCover)!important;background-image:var(--urlBooksCover)!important}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent{background:var(--colorOverlayBoxsetsCover)!important;background-image:var(--urlBoxsetsCover)!important}div[data-collectiontype="folders"] .cardImageContainer.cardContent{background:var(--colorOverlayFoldersCover)!important;background-image:var(--urlFoldersCover)!important}div[data-collectiontype="playlists"] .cardImageContainer.cardContent{background:var(--colorOverlayPlaylistsCover)!important;background-image:var(--urlPlaylistsCover)!important}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply}div[data-collectiontype="movies"] .cardImageContainer.cardContent::before{content:"Movies"}div[data-collectiontype="tvshows"] .cardImageContainer.cardContent::before{content:"TV Shows"}div[data-collectiontype="livetv"] .cardImageContainer.cardContent::before{content:"Live TV"}div[data-collectiontype="music"] .cardImageContainer.cardContent::before{content:"Music"}div[data-collectiontype="homevideos"] .cardImageContainer.cardContent::before{content:"Home Videos"}div[data-collectiontype="books"] .cardImageContainer.cardContent::before{content:"Books"}div[data-collectiontype="boxsets"] .cardImageContainer.cardContent::before{content:"Collections"}div[data-collectiontype="folders"] .cardImageContainer.cardContent::before{content:"Folders"}div[data-collectiontype="playlists"] .cardImageContainer.cardContent::before{content:"Playlists"}.card-withuserdata[data-isfolder="true"] .cardImageContainer.cardContent{filter:contrast(.85);background-size:cover!important;background-position:50%!important;background-blend-mode:multiply} \ No newline at end of file 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 62f4ba4..f7abcba 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,2 +1,2 @@ -/* Add-on: Media Bar plugin support v25.08.02 for the ElegantFin Theme for Jellyfin by lscambo13 */ -.button-container{align-items:center;}.favorite-button{background:none;color:var(--textColor);}.detail-button:hover,.favorite-button:hover{background:var(--dimTextColor);color:black;}.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;}.backdrop,.backdrop-container,.backdrop-overlay{mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,rgba(0,0,0,0));-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,rgba(0,0,0,0));background-color:transparent;}.backdrop{transform-origin:center left;}.layout-desktop #slides-container{width:calc(100vw - (2 * var(--sidePadding)));height:60%;top:8em;border:var(--defaultBorder);border-radius:var(--largerRadius);transition:all .125s,border 0s;user-select:none;}.layout-desktop .logo-container{top:10vh;}.layout-desktop .backdrop,.layout-desktop .backdrop-container,.layout-desktop .backdrop-overlay{mask-image:none;-webkit-mask-image:none;}.layout-desktop .backdrop-overlay{background:linear-gradient(0deg,rgba(0,0,0,.85),40%,transparent);} \ No newline at end of file +/* Add-on: Media Bar plugin support v25.08.08 for the ElegantFin Theme for Jellyfin by lscambo13 */ + .button-container{align-items:center}.favorite-button{background:none;color:var(--textColor)}.detail-button:hover,.favorite-button:hover{background:var(--dimTextColor);color:black}.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}.backdrop,.backdrop-container,.backdrop-overlay{mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,rgba(0,0,0,0));-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.85),70%,rgba(0,0,0,0));background-color:transparent}.backdrop{transform-origin:center left}.rating-value{flex-wrap:wrap;justify-content:center}.age-rating{font-size:.8em}#slides-container{width:calc(100vw - (2 * var(--sidePadding)));height:60%;top:8em;border:var(--defaultBorder);border-radius:var(--largerRadius);transition:all .125s,border 0s;user-select:none}.layout-tv #slides-container{top:0}.layout-mobile #slides-container{top:10em}.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)}@media only screen and (max-width:767px) and (orientation:portrait){.button-container{top:calc(50% + 20vh);transform:translateX(-50%) scale(.8)}.info-container{}.tomato-rating{display:none}.dots-container{top:calc(50% + 19vh)}.backdrop{transform-origin:center}} \ No newline at end of file diff --git a/Theme/assets/add-ons/media-bar-plugin-support-v25.08.08.css b/Theme/assets/add-ons/media-bar-plugin-support-v25.08.08.css new file mode 100644 index 0000000..800943d --- /dev/null +++ b/Theme/assets/add-ons/media-bar-plugin-support-v25.08.08.css @@ -0,0 +1,109 @@ +/* Add-on: Media Bar plugin support v25.08.08 for the ElegantFin Theme for Jellyfin by lscambo13 */ +/* this styles the media bar plugin - start */ +.button-container { + align-items: center; +} + +.favorite-button { + background: none; + color: var(--textColor); +} + +.detail-button:hover, +.favorite-button:hover { + background: var(--dimTextColor); + color: black; +} + +.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; +} + +.backdrop, +.backdrop-container, +.backdrop-overlay { + mask-image: linear-gradient(180deg, rgba(0, 0, 0, .85), 70%, rgba(0, 0, 0, 0)); + -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .85), 70%, rgba(0, 0, 0, 0)); + background-color: transparent; +} + +.backdrop { + transform-origin: center left; +} + +/* this is my own take */ +.rating-value { + flex-wrap: wrap; + justify-content: center; +} + +.age-rating { + font-size: 0.8em; +} + +#slides-container { + width: calc(100vw - (2 * var(--sidePadding))); + height: 60%; + top: 8em; + border: var(--defaultBorder); + border-radius: var(--largerRadius); + transition: all .125s, border 0s; + user-select: none; +} + +.layout-tv #slides-container { + top: 0em; +} + +.layout-mobile #slides-container { + top: 10em; +} + +.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); +} + +@media only screen and (max-width: 767px) and (orientation: portrait) { + .button-container { + top: calc(50% + 20vh); + transform: translateX(-50%) scale(0.8); + } + + .info-container { + /* top: calc(50% + 6vh); */ + } + + .tomato-rating { + display: none; + } + + .dots-container { + top: calc(50% + 19vh); + } + + .backdrop { + transform-origin: center; + } +} + +/* this styles the media bar plugin - end */ \ No newline at end of file