/* https://github.com/stashapp/stash/wiki/Custom-CSS-snippets */
:root {
    --main-bg-color                  : url("https://css.vengefulsyndicate.com/theme.park/Resources/blur-noise.png"), #191919 center center/cover no-repeat fixed;
    --modal-bg-color                 : url("https://css.vengefulsyndicate.com/theme.park/Resources/blur-noise.png"), #191919 center center/cover no-repeat fixed;
    --button-color                   : hsla(0, 0%, 100%, .15);
    --button-color-hover             : hsla(0, 0%, 100%, .30);
    --button-text                    : #eee;
    --button-text-hover              : #FFF;
    --accent-color                   : rgba(255, 255, 255, 0.25);
    --accent-color-hover             : rgba(255, 255, 255, 0.45);
    --queue-color                    : #6b5;
    --link-color                     : #ddd;
    --link-color-hover               : #fff;
    --text                           : #eee;
    --text-hover                     : #fff;
    --text-muted                     : #999;
    --darkreader-neutral-background  : #131313;
    --darkreader-neutral-text        : #efefef;
    --darkreader-selection-background: #600000;
    --darkreader-selection-text      : #efefef;
}
/*
StashApp Plex Theme - Fidelio 2020 v1.0.3

!CHANGE PATH FOR BACKGROUND in Body and Root in case it does not load!
You can put image files into .stash folder or upload it on imgur, or upload it to your gallery and then link it.


# TODO:
fix blue borders
*/
/* --- The Home button in the top left corner of each page. Remove the last 3 lines if you don't like the logo --- */
button.minimal.brand-link.d-none.d-md-inline-block.btn.btn-primary {
    text-transform   : uppercase;
    font-weight      : bold;
    margin-left      : 1px;
    background-image : url("./favicon.ico");
    padding-left     : 40px;
    background-repeat: no-repeat;
}
/* --- The space between the Navigation Bar and the rest of the page --- */

.main {
    margin-top: 0;
}

.top-nav {
    padding: 0.13rem 1rem;
}

body {
    background: url("https://css.vengefulsyndicate.com/theme.park/Resources/blur-noise.png"), #191919 center center/cover no-repeat fixed;
    width     : 100%;
    height    : 100%;
}

#root {
    background: rgba(0, 0, 0, 0) url("https://user-images.githubusercontent.com/63812189/79506696-4c28b600-7feb-11ea-8176-12a46454d87a.png") repeat scroll 0 0;
    position  : absolute;
    width     : 100%;
    height    : 100%;
    z-index   : 2;
}
/* * {
	scrollbar-color: hsla(0, 0%, 100%, .2) transparent;
} */
body ::-webkit-scrollbar-thumb {
    background: rgba(92,0,0,0.5);
}

body ::-webkit-scrollbar-track {
    background: rgba(0,0,0,.25);
}
/* --- Makes the background of the Navigation Bar at the Top half-transparent --- */

.bg-dark {
    background: rgba(20, 20, 20, 0.9)!important;
}

.form-group .bg-dark {
    background: rgba(20, 20, 20, 0.9)!important;
}

.card {
    background-color: rgba(16, 16, 16, 0.5);
    border-radius   : 3px;
    box-shadow      : 0 0 0 1px rgba(16, 16, 16, .4), 0 0 0 rgba(16, 16, 16, 0), 0 0 0 rgba(16, 16, 16, 0);
    padding         : 20px;
    background-color: rgba(0, 0, 0, .3);
}

.bg-secondary {
    background-color: rgb(46, 46, 46) !important;
}

.text-white {
    color: #eee !important;
}

.border-secondary {
    border-color: #900000 !important;
}

.btn-secondary.filter-item.col-1.d-none.d-sm-inline.form-control {
    background-color: rgba(0, 0, 0, .15);
}

.btn-secondary {
    color           : #eee;
    background-color: rgba(0, 0, 0, .15);
}

.btn-secondary.focus,
.btn-secondary:focus,
.btn-secondary:hover {
    color           : #fff;
    background-color: #900000;
    border-color    : #600000;
}

a {
    color: hsla(0, 0%, 100%, .45);
}

.btn.active {
    background-color: #900000;
    color           : #f5f8fa;
}

minimal.w-100.active.btn.btn-primary {
    background-color: #900000;
    color           : #f5f8fa;
}

.btn-primary {
    color           : #fff;
    background-color: #1f2326;
    border-color    : #374242;
}

.nav-tabs .nav-link.active {
    color: #eee;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color           : #fff;
    background-color: #900000;
    border-color    : #000 #000 #000;
}

.nav-tabs .nav-link.active:hover {
    border-bottom-color: #eee;
    outline            : 0;
}

.nav-tabs .nav-link {
    outline: 0;
}

.input-control,
.input-control:focus {
    background-color: rgba(16, 22, 26, .3);
}

#performer-page .image-container .performer {
    background-color: rgba(0, 0, 0, .45);
    box-shadow      : 0 0 2px rgba(0, 0, 0, .35);
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
    color       : #fff;
    border-color: #eee;
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: #1f2326;
}

.btn-primary.focus,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: none;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
    color           : #fff;
    background-color: #900000;
    border-color    : #eee;
}

input[type="range"]::-moz-range-track {
    background: hsla(0, 0%, 100%, .25);
}

input[type="range"]::-moz-range-thumb {
    background: #bcbcbc;
}

div.react-select__control {
    background-color: hsla(0, 0%, 39.2%, .4);
    color           : #fff;
    border-color    : #303030;
    cursor          : pointer;
}

.scene-wall-item-text-container {
    background: radial-gradient(farthest-corner at 50% 50%, rgba(50, 50, 50, .5) 50%, #323232 100%);
    color     : #eee;
}

.filter-container,
.operation-container {
    background-color: rgba(0, 0, 0, .15);
    box-shadow      : none;
    margin-top      : -10px;
    padding         : 10px;
}

.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl {
    width       : 100%;
    margin-right: 0;
    margin-left : 0;
}

.btn-link {
    font-weight    : 500;
    color          : #eee;
    text-decoration: none;
}

button.minimal.brand-link.d-none.d-md-inline-block.btn.btn-primary {
    text-transform: uppercase;
    font-weight   : bold;
}

a:hover {
    color: hsla(0, 0%, 100%, .7);
}

option {
    background-color: #303030;
    color           : #fff;
}

option:hover {
    background-color: #900000;
    color           : #fff;
    filter: grayscale(1);
}

.folder-list .btn-link {
    color: #fff;
}

#performer-scraper-popover {
    z-index: 10;
}

.popover {
    background-color: rgba(0,0,0,0.75);
    border          : 1px solid rgba(0,0,0,.2);
    backdrop-filter: blur(2px);
}

#queue-viewer .current {
    background-color: #600000;
}

.nav-tabs {
    border: none;
    margin: auto;
}

#scene-edit-details .edit-buttons-container {
    background-color: transparent;
    position: sticky;
    top: 0;
    z-index: 3;
}


.toast-container {
    position : fixed;
    right    : 2%;
    top      : auto;
    bottom   : 2%;
    left     : auto;
    max-width: 350px;
    z-index  : 9999;
}

.toast-container .toast-header {
    background-color: initial;
    border          : none;
    color           : #f5f8fa;
    backdrop-filter: brightness(0.5);
    border-bottom   : 1px solid black;
}
/* =============================================================================== */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color           : rgb(232, 230, 227);
    background-color: rgb(128, 0, 0)!important;
}

.nav-link:focus,
.nav-link:hover {
    /* background-color: #303030; */
    color: #fff;
}

a,
a:hover {
    color: rgb(128, 0, 0);
}

.input-control,
.input-control:disabled,
.input-control:focus {
    background-color: rgb(64, 64, 64);
}

.input-control,
.text-input {
    border    : 1px solid black;
    box-shadow: 0 0 0 0 rgb(19 19 19 / 0%), 0 0 0 0 rgb(19 19 19 / 0%), 0 0 0 0 rgb(19 19 19 / 0%), inset 0 0 0 1px rgb(16 16 16 / 30%), inset 0 1px 1px rgb(16 16 16 / 40%);
    color     : #f5f8fa;
}

.input-control:focus,
.text-input:focus {
    border    : 0;
    box-shadow: 0 0 0 1px #600000, 0 0 0 1px #600000, 0 0 0 3px rgb(0 0 0 / 30%), inset 0 0 0 1px rgb(0 0 0 / 30%), inset 0 1px 1px rgb(0 0 0 / 40%);
    color     : #f5f8fa;
}

.text-input,
.text-input:disabled,
.text-input:focus,
.text-input[readonly] {
    background-color: rgba(16,16,16,.75);
}

.btn-primary {
    color           : rgb(232, 230, 227);
    background-color: rgb(128, 0, 0);
    border-color    : rgb(128, 0, 0);
}

.btn-secondary {
    color           : rgb(232, 230, 227);
    background-color: rgb(92, 0, 0);
    border-color    : rgb(0, 0, 0);
}

.btn-secondary.disabled,
.btn-secondary:disabled {
    color           : rgb(232, 230, 227);
    background-color: rgb(46, 46, 46);
    border-color    : rgb(0, 0, 0);
}

.pagination .btn {
    border-left      : 1px solid #000000;
    border-right     : 1px solid #000000;
    -webkit-flex-grow: 0;
    flex-grow        : 0;
    padding-left     : 15px;
    padding-right    : 15px;
    transition       : none;
}

.pagination .btn {
    border-left-color : rgb(0, 0, 0);
    border-right-color: rgb(0, 0, 0);
}

.card-header {
    background-color   : rgba(0, 0, 0, 0.25);
    border-bottom-color: rgba(0, 0, 0, 0.13);
}

.btn-primary.disabled,
.btn-primary:disabled {
    color           : rgb(232, 230, 227);
    background-color: rgb(151, 0, 0);
    border-color    : rgb(0, 0, 0);
}

div.react-select__control {
    background-color: rgb(46, 46, 46);
    border-color    : rgb(95, 95, 95);
    color           : #ffffff;
}

.btn-primary.focus,
.btn-primary:focus,
.btn-primary:hover {
    color           : rgb(232, 230, 227);
    background-color: rgb(160, 0, 0);
    border-color    : rgb(0, 0, 0);
}

.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle {
    color           : #fff;
    background-color: #900000;
    border-color    : #000000;
}

input[type=checkbox],
input[type=radio] {
    filter: invert(100%) hue-rotate(325deg) brightness(0.9);
}

.progress-bar {
    background-color: #900000;
}

input[type=range].zoom-slider {
    filter: grayscale(1);
}

.btn-danger {
    color           : #fff;
    background-color: #db3737;
    border-color    : #db3737;
}

.btn-danger.focus,
.btn-danger:focus,
.btn-danger:hover {
    color           : #fff;
    background-color: #c80000;
    border-color    : #bd0000;
}

.form-control:focus {
    color           : #ffffff;
    background-color: #202020;
    border-color    : #900000;
    /* box-shadow: 0 0 0 0.2rem rgb(0 0 0 / 25%); */
}

.modal {
    background: rgba(0,0,0,0.5);
    backdrop-filter: blur(1px);
}

.modal-body {
    background-color: #202020;
    color           : #f5f8fa;
}

.modal-footer,
.modal-header {
    background: url("https://css.vengefulsyndicate.com/theme.park/Resources/blur-noise.png"), #191919 center center/cover no-repeat fixed;
    color     : #f5f8fa;
}

.tag-item {
    background-color: #600000;
    color           : #ffffff;
}

.tag-item .btn {
    color: #ffffff;
}

div.dropdown-menu,
div.react-select__menu {
    background-color: #202020;
}

.css-12jo7m5 {
    color: revert;
}

div.react-select__control .react-select__multi-value {
    background-color: #900000;
    color           : #ffffff !important;
}

.popover-body {
    color     : #f5f8fa;
    background: #131313;
}

.popover-body .btn {
    color     : #ffffff;
    background: #900000;
}

#performer-page {
    -webkit-flex-direction: row;
    flex-direction        : row;
    /* margin: 10px auto; */
    overflow              : hidden;
}

#performer-page .performer-head {
    display       : inline-block;
    margin-bottom : 2rem;
    vertical-align: top;
    left          : 32px;
    margin-top    : 6px;
    position      : fixed;
    /* background: rgba(0,0,0,0.5); */
    max-width     : 30.6%;
    text-shadow   : black 0 0 10px;
    text-shadow   : 0 0 3px #000, 0 0 5px #000;
    text-shadow   : 1px 1px 2px black, 0 0 25px black, 0 0 5px black;
}

#performer-edit > div:last-child {
    position: fixed;
    top     : 50px;
    right   : 50px;
}

#performer-page .performer-head .name-icons .not-favorite,
#performer-page > div.col-md-8 > div.row > div > h2 > span.name-icons > button:nth-child(2),
#performer-page > div.col-md-8 > div.row > div > h2 > span.name-icons > button:nth-child(3),
#performer-page > div.col-md-8 > div.row > div > h2 > span.name-icons > button:nth-child(4) {
    color     : rgba(191,204,214,.5);
    background: rgba(18,18,18,0.5);
}

.scraper-table tr:nth-child(2n) {
    background-color: rgba(18,18,18,0.5);
}

.search-item {
    background-color: rgba(0,0,0,0.25);
    border-radius   : 3px;
    padding         : 1rem;
    border          : 1px solid black;
}

.search-result:hover {
    background-color: rgba(0,0,0,0.25);
    cursor          : pointer;
}

.selected-result {
    background-color: rgba(0,0,0,0.25);
    border-radius   : 3px;
    border          : 1px solid black;
}

.performer-select-active .react-select__control,
.studio-select-active .react-select__control {
    background-color: #131313;
}

.css-1pahdxg-control:hover {
    border-color: rgb(132, 0, 0);
}
/* === Performer Detail Editor ================================ */
@media (min-width: 1200px) {}

.col-xl-2 {
    -webkit-flex: 0 0 10%;
    flex        : 0 0 10%;
    max-width   : 10%;
    color       : #900000;
    font-weight : bold;
    text-shadow : 0 0 3px #000, 0 0 5px #000;
}

.col-xl-7 {
    -webkit-flex: 0 0 88%;
    flex        : 0 0 88%;
    max-width   : 88%;
}
/* === Performer Scraper Detail Editor Popup ================================ */
@media (min-width: 992px) {}

.modal-lg,
.modal-xl {
    max-width: 50%;
}
/* body > div.fade.modal.show > div > div > div.modal-body > div > form > div:nth-child(2) > label */

.col-lg-3 {
    -webkit-flex: 0 0 15%;
    flex        : 0 0 15%;
    max-width   : 15%;
}
/* body > div.fade.modal.show > div > div > div.modal-body > div > form > div:nth-child(2) > div */

.col-lg-9 {
    -webkit-flex: 0 0 85%;
    flex        : 0 0 85%;
    max-width   : 85%;
}

.col-6 {
    padding-left : 2px;
    padding-right: 0;
}
/* ===  ================================ */
::selection {
    background-color: #900000;
    color           : #000;
}

.search-result {
    background-color: rgba(62,0,0,0.25);
    border: 1px solid black;
}

.btn-toolbar {
    position: sticky !important;
    top: 50px;
    z-index: 10;
}

/* Settings > Tasks > Task Queue */
#tasks-panel .tasks-panel-queue {
    background-color: transparent;
}

.job-table.card {
    background-color: rgba(16, 16, 16, 0.9);
    backdrop-filter: blur(2px);
}

.custom-control-input:checked~.custom-control-label:before {
    color: #fff;
    border-color: black;
    background-color: rgb(128, 0, 0);
}

#settings-container .tab-content {
    max-width: 90%;
}

#configuration-tabs-tabpane-logs > div.logs > div {
    margin: 0;
}