@import url("/css/defaults/placeholders.css"); @import url("/css/defaults/transparent.css"); body, #root, html { 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; color: var(--text); } /* TEXT */ [class$="-label"]:not([class$="-Button-label"]) { color: var(--text-hover) !important; } .mantine-Text-root[class*="bazarr-"]:not(.mantine-Badge-light span div):not(.mantine-Progress-bar div):not(a) { color: var(--text); } a, .mantine-Text-root.mantine-Anchor-root[class*="bazarr-"] { color: var(--link-color); } a:hover, .mantine-Text-root.mantine-Anchor-root[class*="bazarr-"]:hover { color: var(--link-color-hover); } h1, h1 div, h2, h3, h4, h5, h6 { color: var(--text-hover) !important; } /* HEADER */ .mantine-Header-root[class*="bazarr-"] { background: var(--main-bg-color); border-bottom: 1px solid var(--transparency-light-15); } /* SUBHEADER */ /* .mantine-Container-root[class*="bazarr-"] .mantine-Group-root[class*="bazarr-"]:not(td>*):not(.mantine-Card-root div), */ #root>div>div>main>div>div.mantine-Group-root[class*="bazarr-"], #root>div>div>main>div>div>div.mantine-Group-root[class*="bazarr-"], #root>div>div>main>form>div.mantine-Group-root[class*="bazarr-"] { background: var(--transparency-dark-25); } .mantine-Button-icon.mantine-Button-leftIcon[class*="bazarr-"] { color: var(--text) } /* SIDEMENU */ .mantine-Navbar-root.mantine-Navbar-hidden[class*="bazarr-"] { background: var(--transparency-dark-25); border-right: 1px solid var(--transparency-light-15); } .mantine-Divider-root .mantine-Divider-horizontal[class*="bazarr-"] { border-top-color: var(--transparency-light-10); } .mantine-Navbar-root.mantine-Navbar-hidden[class*="bazarr-"] .mantine-Stack-root[class*="bazarr-"] a[aria-current="page"] { background: var(--transparency-dark-15) !important; border-left: 2px solid rgb(var(--accent-color)); } .mantine-Navbar-root.mantine-Navbar-hidden[class*="bazarr-"] .mantine-Stack-root[class*="bazarr-"] a { border-left: 2px solid var(--transparency-light-10); } .mantine-Navbar-root.mantine-Navbar-hidden[class*="bazarr-"] .mantine-Stack-root a [class*="bazarr-"]:hover:not(.mantine-Badge-light):not(.mantine-Badge-inner), .mantine-Navbar-root.mantine-Navbar-hidden[class*="bazarr-"] .mantine-Stack-root [class*="bazarr-"]:hover:not(.mantine-Badge-light):not(.mantine-Badge-inner) { color: rgb(var(--accent-color)); background: transparent; } .mantine-Navbar-root[class*="bazarr-"] { background: var(--main-bg-color); } /* TABLE */ [class*="bazarr-"] tbody tr { color: var(--text); } [class*="bazarr-"] tbody tr td { border-bottom: 1px solid var(--transparency-light-10) !important; } [class*="bazarr-"] thead tr th { border-bottom: 1px solid var(--transparency-light-20) !important; } [class*="bazarr-"].__mantine-ref-striped tbody tr:nth-of-type(2n+1) { background: var(--transparency-dark-15) !important; } .mantine-Table-root .__mantine-ref-striped .mantine-Table-striped[class*="bazarr-"] { color: var(--text) } [class*="bazarr-"] thead tr th, [class*="bazarr-"] tfoot tr th { color: var(--text-hover) !important; } .mantine-Skeleton-root.mantine-Skeleton-visible[class*="bazarr-"]::after { background: var(--transparency-light-10); } .mantine-Skeleton-root.mantine-Skeleton-visible[class*="bazarr-"]::before { background: var(--transparency-dark-25); } /* BUTTONS */ .mantine-Button-filled.mantine-Button-root.mantine-Group-child[class*="bazarr-"] { color: var(--button-text); background: var(--button-color); } .mantine-Button-filled.mantine-Button-root.mantine-Group-child[class*="bazarr-"]:hover { color: var(--button-text-hover); background: var(--button-color-hover); } .mantine-Button-subtle.mantine-Button-root.mantine-Group-child[class*="bazarr-"]:hover { background: var(--transparency-dark-15); } .mantine-Button-subtle.mantine-Button-root.mantine-Group-child[class*="bazarr-"]:not(.__mantine-ref-loading):disabled { background: transparent; opacity: .5; } .mantine-ActionIcon-hover.mantine-ActionIcon-root[class*="bazarr-"]:hover { background: var(--transparency-dark-15); } .mantine-Button-filled.mantine-Button-root[class*="bazarr-"] { color: var(--button-text); background: var(--button-color); } .mantine-Button-filled.mantine-Button-root[class*="bazarr-"]:hover { color: var(--button-text-hover); background: var(--button-color-hover); } [class*="bazarr-"].mantine-Switch-input:checked { background-color: rgb(var(--accent-color)); border-color: rgb(var(--accent-color)); } [class*="bazarr-"].mantine-Switch-input:checked::before { border-color: var(--label-text-color); background: var(--label-text-color); } [class*="bazarr-"].mantine-Switch-input:checked::after { color: var(--label-text-color); } [class*="bazarr-"].mantine-Switch-label { color: var(--text-hover); } [class*="bazarr-"].mantine-Switch-input { background: var(--transparency-dark-15); border: 1px solid var(--transparency-light-10); } .mantine-UnstyledButton-root.__mantine-ref-control.mantine-Accordion-control[class*="bazarr-"]:hover { background: var(--transparency-dark-15); } .mantine-Accordion-item[class*="bazarr-"] { border-bottom: var(--transparency-light-10) 1px solid; } .__mantine-ref-icon.mantine-Accordion-icon[class*="bazarr-"] { color: rgb(var(--accent-color)) } .mantine-ActionIcon-transparent.mantine-ActionIcon-root[class*="bazarr-"] { color: rgb(var(--accent-color)) } .mantine-UnstyledButton-root[class*="bazarr-"] { color: var(--text) } .mantine-UnstyledButton-root[class*="bazarr-"]:hover { box-shadow: rgb(0 0 0 / 5%) 0px 1px 3px, rgb(0 0 0 / 5%) 0px 20px 25px -5px, rgb(0 0 0 / 4%) 0px 10px 10px -5px; border: 1px solid rgb(var(--accent-color)); } .mantine-Slider-bar[class*="bazarr-"] { background: rgb(var(--accent-color)); } .mantine-Slider-thumb[class*="bazarr-"] { border: 4px solid rgb(var(--accent-color)); color: var(--label-text-color); background: var(--label-text-color); } .mantine-Slider-mark.mantine-Slider-markFilled[class*="bazarr-"] { border: 2px solid var(--label-text-color); background: var(--label-text-color); } [class*="bazarr-"].mantine-Slider-track::before { background: var(--transparency-dark-15); } [class*="bazarr-"].mantine-Slider-mark { border: 2px solid rgb(var(--accent-color)); background-color: rgb(var(--accent-color)) } /* ACTION BUTTON */ .mantine-ActionIcon-light.mantine-ActionIcon-root[class*="bazarr-"] { background: var(--button-color); color: var(--button-text); border: 1px solid var(--button-color) } .mantine-ActionIcon-light.mantine-ActionIcon-root[class*="bazarr-"]:hover { background: var(--button-color-hover); color: var(--button-text-hover); border: 1px solid var(--button-color-hover) } .mantine-ActionIcon-hover.mantine-ActionIcon-root.mantine-Group-child[class*="bazarr-"] { color: var(--text); } /* BADGES/PROGRESSBARS */ .mantine-Progress-root[class*="bazarr-"] { background: var(--transparency-dark-15); } .mantine-Badge-light.mantine-Badge-root[class*="bazarr-"] { background-color: rgb(var(--accent-color)); color: var(--label-text-color) } [class*="mantine-MultiSelect-"].mantine-MultiSelect-value[class*="bazarr-"], .mantine-ActionIcon-transparent.mantine-ActionIcon-root.mantine-MultiSelect-defaultValueRemove[class*="bazarr-"] { background: rgb(var(--accent-color)); color: var(--label-text-color) } /* INPUT */ [class*="mantine-Autocomplete-"].mantine-Autocomplete-input.mantine-Autocomplete-withIcon[class*="bazarr-"], [class*="mantine-TextInput-"].mantine-TextInput-input[class*="bazarr-"], [class*="mantine-NumberInput-"].mantine-NumberInput-input[class*="bazarr-"], [class*="mantine-PasswordInput-"].mantine-PasswordInput-input.mantine-PasswordInput-input[class*="bazarr-"] { background: var(--transparency-dark-25); border: 1px solid var(--transparency-light-10); color: var(--text); } [class*="mantine-Autocomplete-"].mantine-Autocomplete-input.mantine-Autocomplete-withIcon[class*="bazarr-"]:focus, [class*="mantine-Autocomplete-"].mantine-Autocomplete-input.mantine-Autocomplete-withIcon[class*="bazarr-"]:focus-within, [class*="mantine-TextInput-"].mantine-TextInput-input[class*="bazarr-"]:focus, [class*="mantine-TextInput-"].mantine-TextInput-input[class*="bazarr-"]:focus-within, [class*="mantine-NumberInput-"].mantine-NumberInput-input[class*="bazarr-"]:focus, [class*="mantine-NumberInput-"].mantine-NumberInput-input[class*="bazarr-"]:focus-within, ยจ [class*="mantine-PasswordInput-"].mantine-PasswordInput-input.mantine-PasswordInput-input[class*="bazarr-"]:focus, [class*="mantine-PasswordInput-"].mantine-PasswordInput-input.mantine-PasswordInput-input[class*="bazarr-"]:focus-within { outline: none; border-color: rgb(var(--accent-color)) !important; color: var(--text-hover) } .mantine-NumberInput-control.mantine-NumberInput-controlUp[class*="bazarr-"] { border-bottom-color: var(--transparency-light-10); border-left-color: var(--transparency-light-10); } .mantine-NumberInput-control.mantine-NumberInput-controlDown[class*="bazarr-"] { border-left-color: var(--transparency-light-10); } .mantine-NumberInput-control.mantine-NumberInput-controlUp[class*="bazarr-"]::after { border-color: transparent transparent var(--text); } .mantine-NumberInput-control.mantine-NumberInput-controlDown[class*="bazarr-"]::after { border-color: var(--text) transparent transparent; } [class*="bazarr-"].mantine-Checkbox-inner input { background: var(--transparency-dark-15); border: 1px solid var(--transparency-light-10); } [class*="bazarr-"].mantine-Checkbox-input:checked { background-color: rgb(var(--accent-color)); border-color: rgb(var(--accent-color)); } .__mantine-ref-icon[class*="bazarr-"].mantine-Checkbox-icon { color: var(--label-text-color) } [class*="mantine-TextInput-"].mantine-TextInput-input[class*="bazarr-"], [class*="mantine-Autocomplete-"].mantine-Autocomplete-input.mantine-Autocomplete-withIcon[class*="bazarr-"] { color: var(--text); } textarea, [class*="mantine-Textarea-"].mantine-Textarea-input[class*="bazarr-"] { background: var(--transparency-dark-15); } textarea:focus, [class*="mantine-Textarea-"].mantine-Textarea-input[class*="bazarr-"]:focus, textarea:focus-within, [class*="mantine-Textarea-"].mantine-Textarea-input[class*="bazarr-"]:focus-within { border-color: rgb(var(--accent-color)) !important; } /* SELECT */ .mantine-Select-wrapper[class*="bazarr-"] input, [class*="mantine-MultiSelect-"].mantine-MultiSelect-input[class*="bazarr-"] { background-color: var(--transparency-dark-15); color: var(--text); border: 1px solid var(--transparency-light-10); } [class*="mantine-MultiSelect-"].mantine-MultiSelect-input[class*="bazarr-"]:focus, [class*="mantine-MultiSelect-"].mantine-MultiSelect-input[class*="bazarr-"]:focus-within { border-color: rgb(var(--accent-color)) !important; } .mantine-Select-wrapper[class*="bazarr-"] input:focus, .mantine-Select-wrapper[class*="bazarr-"] input:focus-within { outline: none; border-color: rgb(var(--accent-color)) !important; } /* DROPDOWNS */ .mantine-Paper-root.mantine-Menu-body[class*="bazarr-"] { border: 1px solid var(--transparency-light-10); background: var(--drop-down-menu-bg); } [class*="bazarr-"].mantine-Menu-itemInner { color: var(--text); } .mantine-Menu-item.mantine-Menu-itemHovered[class*="bazarr-"] { background-color: var(--transparency-light-10); color: var(--text-hover); } .mantine-Menu-item[class*="bazarr-"]:hover { color: var(--text-hover); } .mantine-ScrollArea-root.mantine-Paper-root.mantine-Select-dropdown[class*="bazarr-"] { background: var(--drop-down-menu-bg); border: 1px solid var(--drop-down-menu-bg); } .mantine-Select-item.mantine-Select-selected[class*="bazarr-"] { background: var(--transparency-light-10); } [class*="bazarr-"].mantine-Select-item:hover { background: var(--transparency-dark-15) } .mantine-ScrollArea-root.mantine-Paper-root.mantine-Autocomplete-dropdown[class*="bazarr-"] { background: var(--drop-down-menu-bg); color: var(--text); border: 1px solid var(--drop-down-menu-bg); } /* MODAL */ .mantine-Paper-root.mantine-Modal-modal[class*="bazarr-"] { color: var(--text); box-shadow: rgb(0 0 0 / 5%) 0px 1px 3px, rgb(0 0 0 / 5%) 0px 28px 23px -7px, rgb(0 0 0 / 4%) 0px 12px 12px -7px; background: var(--modal-bg-color); } .mantine-Divider-root.mantine-Divider-horizontal[class*="bazarr-"] { border-top-color: var(--transparency-light-10); } .mantine-ActionIcon-hover.mantine-ActionIcon-root.mantine-Modal-close[class*="bazarr-"]:hover { background: var(--transparency-dark-15); } .mantine-ActionIcon-hover.mantine-ActionIcon-root.mantine-Modal-close[class*="bazarr-"] { color: var(--text); } .mantine-ActionIcon-hover.mantine-ActionIcon-root[class*="bazarr-"] { color: var(--text); } /* RELEASES */ .mantine-Paper-root.mantine-Card-root[class*="bazarr-"] { background: var(--transparency-dark-15); } .mantine-List-item[class*="bazarr-"] { color: var(--text); } /* ALERTS */ .mantine-Alert-root.mantine-Alert-light[class*="bazarr-"] { background: var(--transparency-dark-15); } [class*="bazarr-"].mantine-Alert-message { color: var(--text); } [class*="bazarr-"].mantine-Alert-label { color: var(--text-hover) } /* RECHARTS */ .recharts-default-tooltip { background: var(--drop-down-menu-bg) !important; border: transparent !important; } .recharts-rectangle.recharts-tooltip-cursor { fill: var(--transparency-light-15) !important; } text { stroke: none; fill: var(--text-hover); text-anchor: end; } line { stroke: var(--text); fill: none; } /* NOTIFICATIONS */ .mantine-Notification-root.mantine-Notification-withIcon[class*="bazarr-"] { background: var(--drop-down-menu-bg); } code, .mantine-Code-root[class*="bazarr-"] { background: rgb(var(--accent-color)); color: var(--label-text-color); } /* SPINNER */ .mantine-Notification-root.mantine-Notification-withIcon[class*="bazarr-"] svg { stroke: rgb(var(--accent-color)); } /* PROGRESSBAR */ [class*="bazarr-"].mantine-Progress-bar[style="width: 100%;"] { background: rgb(var(--accent-color)); } [class*="bazarr-"].mantine-Progress-bar[style="width: 100%;"] .mantine-Text-root.mantine-Progress-label[class*="bazarr-"] { color: var(--label-text-color); }