/* https://theme-park.dev/css/base/filebrowser/organizr.css */

:root {
    --main-bg-color: #1f1f1f;
  
    --modal-bg-color: #333;
    --modal-header-color: #232323;
    --modal-footer-color: #232323;
  
    --drop-down-menu-bg: #1b1b1b;
  
    --button-color: #2cabe3;
    --button-color-hover: #298fbc;
    --button-text: #eee;
    --button-text-hover: #fff;
  
    --accent-color:  44, 171, 227;
    --accent-color-hover: rgb(var(--accent-color),.8);
    --link-color: #2cabe3;
    --link-color-hover: #3cc5ff;
    --label-text-color: #fff;
      
    --text:#96a2b4;
    --text-hover: #fff;
    --text-muted: #999;
  
    /*Specials*/
    --arr-queue-color: #2cabe3; /* Servarr apps + Bazarr*/
    --plex-poster-unwatched: #2cabe3;
    --petio-spinner: invert(65%) sepia(83%) saturate(2026%) hue-rotate(167deg) brightness(90%) contrast(97%);/* Made with https://codepen.io/jsm91/embed/ZEEawyZ */
    --gitea-color-primary-dark-4: 44, 171, 227;
    --overseerr-gradient: linear-gradient(180deg, rgba(31, 31, 31, 0.17) 0%, rgba(31, 31, 31) 100%);
}
::-webkit-input-placeholder{
    color:var(--text-muted)!important
}
:focus::-webkit-input-placeholder{
    color:var(--text-hover)!important
}
:-moz-placeholder{
    color:var(--text-muted)!important
}
:focus:-moz-placeholder{
    color:var(--text-hover)!important
}
::-moz-placeholder{
    color:var(--text-muted)!important
}
:focus::-moz-placeholder{
    color:var(--text-hover)!important
}
:-ms-input-placeholder{
    color:var(--text-muted)!important
}
:focus:-ms-input-placeholder{
    color:var(--text-hover)!important
}
:root{
    --transparency-dark-05:rgba(0, 0, 0, .05);
    --transparency-dark-10:rgba(0, 0, 0, .10);
    --transparency-dark-15:rgba(0, 0, 0, .15);
    --transparency-dark-25:rgba(0, 0, 0, .25);
    --transparency-dark-35:rgba(0, 0, 0, .35);
    --transparency-dark-40:rgba(0, 0, 0, .40);
    --transparency-dark-45:rgba(0, 0, 0, .45);
    --transparency-dark-50:rgba(0, 0, 0, .50);
    --transparency-dark-55:rgba(0, 0, 0, .55);
    --transparency-dark-60:rgba(0, 0, 0, .60);
    --transparency-dark-65:rgba(0, 0, 0, .65);
    --transparency-dark-70:rgba(0, 0, 0, .70);
    --transparency-dark-75:rgba(0, 0, 0, .75);
    --transparency-dark-80:rgba(0, 0, 0, .80);
    --transparency-dark-85:rgba(0, 0, 0, .85);
    --transparency-dark-90:rgba(0, 0, 0, .90);
    --transparency-light-05:rgba(255, 255, 255, .05);
    --transparency-light-10:rgba(255, 255, 255, .10);
    --transparency-light-15:rgba(255, 255, 255, .15);
    --transparency-light-20:rgba(255, 255, 255, .20);
    --transparency-light-25:rgba(255, 255, 255, .25);
    --transparency-light-30:rgba(255, 255, 255, .30);
    --transparency-light-35:rgba(255, 255, 255, .35);
    --transparency-light-45:rgba(255, 255, 255, .45);
    --transparency-light-50:rgba(255, 255, 255, .50);
    --transparency-light-55:rgba(255, 255, 255, .55);
    --transparency-light-95:rgba(255, 255, 255, .95)
}
.message{
    color:var(--text-hover)
}
#login{
    min-height:100%;
    height:auto;
    background:var(--main-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
body{
    color:var(--text);
    font-family:Open Sans Bold,Helvetica Neue,Helvetica,Arial,sans-serif
}
h1,h2,h3,h4,h5,h6,th{
    color:var(--text-hover)!important
}
#login input[type=password],#login input[type=text]{
    color:var(--text-hover)!important;
    background:var(--transparency-dark-15)!important;
    border:none
}
#loading{
    background:var(--main-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
#loading .spinner *{
    background-color:#fff!important
}
html{
    min-height:100%;
    background:var(--main-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
body{
    background:var(--main-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
@media (max-width:736px){
    nav,nav.active{
        background:var(--modal-bg-color)!important
    }
    #dropdown.active{
        background:var(--drop-down-menu-bg)!important
    }
}
nav{
    background:var(--transparency-dark-45);
    height:100%;
    top:64px;
    width:240px
}
.overlay:not(nav){
    background-color:transparent
}
nav .action{
    color:var(--text);
    font-size:13px;
    font-family:Open Sans Semibold,Helvetica Neue,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    padding-top:0;
    padding-bottom:0
}
nav .action:hover{
    background:var(--transparency-light-05);
    color:rgb(var(--accent-color))
}
nav>div{
    border-top:none
}
header{
    background:var(--transparency-dark-25);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover;
    border-bottom:transparent;
    box-shadow:0 3px 6px 0 rgba(0,0,0,.15)
}
header>div:first-child{
    height:60px
}
body{
    padding-top:60px
}
.shell{
    background:var(--modal-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover;
    color:rgb(var(--accent-color))
}
.shell__prompt i{
    color:rgb(var(--accent-color))
}
.action{
    color:var(--text-hover)
}
#listing.list .item{
    background:var(--transparency-dark-15);
    color:var(--text);
    border:none
}
#listing.list .item:hover{
    background:var(--transparency-light-10);
    color:var(--text-hover);
    border:none;
    transition:.4s
}
#listing.list .item.header{
    background:var(--transparency-dark-45);
    color:var(--text-hover);
    border-bottom:none;
    right:auto
}
.material-icons,.prompt .file-list ul li:before{
    color:rgb(var(--accent-color))
}
.action:hover{
    background-color:rgba(var(--accent-color),.1)
}
.action .counter{
    background:rgb(var(--accent-color));
    color:var(--label-text-color);
    border:2px solid var(--label-text-color)
}
.share__box{
    background:0 0
}
.share__box__info{
    background:var(--transparency-dark-25)
}
.share__box__download{
    background:rgb(var(--accent-color));
    color:var(--text-hover);
    border-bottom:1px solid rgb(var(--accent-color))
}
.share__box__element{
    border-top:1px solid rgb(255 255 255 / 10%)
}
svg{
    fill:rgb(var(--accent-color))!important
}
#listing.list .item div:first-of-type i{
    color:rgb(var(--accent-color))
}
#listing .item i{
    color:rgb(var(--accent-color))
}
#listing.mosaic:hover .item:hover i:hover{
    color:var(--accent-color-hover)
}
#listing .item[aria-selected=true]{
    background-color:rgba(255,255,255,.2)!important;
    color:var(--text-hover)!important
}
#listing h2{
    color:var(--text-hover)
}
#listing #multiple-selection{
    background:var(--modal-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
#breadcrumbs span a{
    color:var(--text-hover)
}
#breadcrumbs{
    border-bottom:1px solid rgb(var(--accent-color))
}
#listing .item{
    background:var(--transparency-dark-15);
    color:var(--text);
    border:none
}
.input{
    background:var(--transparency-dark-25);
    color:var(--text-hover)
}
select>option{
    background:var(--drop-down-menu-bg)
}
#search #input{
    background:#fff;
    display:flex;
    padding:10px
}
#search #result{
    background:var(--modal-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover;
    color:var(--text-hover)
}
#search .boxes{
    background:var(--transparency-dark-15);
    padding:15px
}
#search .boxes h3{
    color:var(--text-hover)
}
#search .boxes>div>div{
    background:var(--transparency-dark-10)
}
#search .boxes>div>div:hover{
    background-color:var(--transparency-light-10)
}
#search.active #input{
    background:var(--main-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover;
    height:60px;
    color:#000
}
#search.active i,#search.active input{
    color:var(--text-hover)
}
#search #result>div>:first-child{
    margin-top:10px
}
.card{
    background:var(--transparency-dark-15)
}
.card h3{
    color:var(--text-hover)
}
.card#share ul li a{
    color:rgb(var(--accent-color))
}
select{
    color:var(--text-hover)
}
.card#share .input-group *{
    border:none;
    background:0 0
}
button,input,select,textarea{
    color:var(--text-hover)
}
.collapsible>label *{
    color:var(--text-hover)
}
.breadcrumbs,.breadcrumbs span,.breadcrumbs span a,.link,a{
    color:var(--link-color)
}
.breadcrumbs span a:hover,.link:hover,a:hover{
    color:var(--link-color-hover)
}
table th{
    color:var(--text-hover)
}
.card.floating{
    background:var(--modal-bg-color);
    background-repeat:repeat,no-repeat;
    background-attachment:fixed,fixed;
    background-position:center center,center center;
    background-size:auto,cover;
    -webkit-background-size:auto,cover;
    -moz-background-size:auto,cover;
    -o-background-size:auto,cover
}
#search #input{
    background:var(--transparency-light-10)
}
#listing.mosaic .item{
    box-shadow:none!important
}
#listing.mosaic .item:hover{
    box-shadow:none!important;
    background:var(--transparency-light-10)
}
.dashboard p label{
    color:var(--text-hover)
}
.dashboard #nav li.active{
    border-color:rgb(var(--accent-color))
}
.dashboard #nav ul li.active{
    border-color:rgb(var(--accent-color));
    color:rgb(var(--accent-color))
}
.dashboard #nav ul li.active:before{
    background:rgb(var(--accent-color));
    opacity:.08
}
.dashboard #nav ul li:hover{
    background:rgb(var(--accent-color),.15);
    color:rgb(var(--accent-color))
}
.dashboard #nav .wrapper{
    border-bottom:2px solid var(--accent-color-hover)
}
@media (min-width:1024px){
    main{
        margin-left:270px
    }
}
@media (max-width:1024px){
    nav{
        width:175px
    }
}
.button:not(.button--flat.button--red){
    background:var(--button-color);
    color:var(--button-text)
}
.button:active:not(.button--flat.button--red),.button:focus:not(.button--flat.button--red),.button:hover:not(.button--flat.button--red){
    background:var(--button-color-hover);
    color:var(--button-text-hover)
}
button:hover:not(.action),input[type=submit]:hover{
    color:var(--button-text-hover)
}
.button--flat{
    margin-left:5px
}
.button--flat:hover{
    background:var(--dark-red);
    color:var(--text-hover);
    margin-left:5px
}
#editor-container{
    background:var(--modal-bg-color)
}
.ace-chrome .ace_gutter{
    background:#282a36!important;
    color:#909194!important
}
.ace-chrome .ace_print-margin{
    width:1px;
    background:#44475a
}
.ace-chrome{
    background-color:#282a36;
    color:#f8f8f2
}
.ace-chrome .ace_cursor{
    color:#f8f8f0
}
.ace-chrome .ace_marker-layer .ace_selection{
    background:#44475a
}
.ace-chrome.ace_multiselect .ace_selection.ace_start{
    box-shadow:0 0 3px 0 #282a36;
    border-radius:2px
}
.ace-chrome .ace_marker-layer .ace_step{
    background:#c6dbae
}
.ace-chrome .ace_marker-layer .ace_bracket{
    margin:-1px 0 0 -1px;
    border:1px solid #a29709
}
.ace-chrome .ace_marker-layer .ace_active-line{
    background:#44475a
}
.ace-chrome .ace_gutter-active-line{
    background-color:#44475a
}
.ace-chrome .ace_marker-layer .ace_selected-word{
    box-shadow:0 0 0 1px #a29709;
    border-radius:3px
}
.ace-chrome .ace_fold{
    background-color:#50fa7b;
    border-color:#f8f8f2
}
.ace-chrome .ace_keyword{
    color:#ff79c6
}
.ace-chrome .ace_constant.ace_language{
    color:#bd93f9
}
.ace-chrome .ace_constant.ace_numeric{
    color:#bd93f9
}
.ace-chrome .ace_constant.ace_character{
    color:#bd93f9
}
.ace-chrome .ace_constant.ace_character.ace_escape{
    color:#ff79c6
}
.ace-chrome .ace_constant.ace_other{
    color:#bd93f9
}
.ace-chrome .ace_support.ace_function{
    color:#8be9fd
}
.ace-chrome .ace_support.ace_constant{
    color:#6be5fd
}
.ace-chrome .ace_support.ace_class{
    font-style:italic;
    color:#66d9ef
}
.ace-chrome .ace_support.ace_type{
    font-style:italic;
    color:#66d9ef
}
.ace-chrome .ace_storage{
    color:#ff79c6
}
.ace-chrome .ace_storage.ace_type{
    font-style:italic;
    color:#8be9fd
}
.ace-chrome .ace_invalid{
    color:#f8f8f0;
    background-color:#ff79c6
}
.ace-chrome .ace_invalid.ace_deprecated{
    color:#f8f8f0;
    background-color:#bd93f9
}
.ace-chrome .ace_string{
    color:#f1fa8c
}
.ace-chrome .ace_comment{
    color:#6272a4
}
.ace-chrome .ace_variable{
    color:#50fa7b
}
.ace-chrome .ace_variable.ace_parameter{
    font-style:italic;
    color:#ffb86c
}
.ace-chrome .ace_entity.ace_other.ace_attribute-name{
    color:#50fa7b
}
.ace-chrome .ace_entity.ace_name.ace_function{
    color:#50fa7b
}
.ace-chrome .ace_entity.ace_name.ace_tag{
    color:#ff79c6
}
.ace-chrome .ace_invisible{
    color:#626680
}
.ace-chrome .ace_indent-guide{
    background:url(data:image/png;
    base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYHB3d/8PAAOIAdULw8qMAAAAAElFTkSuQmCC) right repeat-y
}
.credits{
    color:var(--text-muted)
}