.emby-button { position: relative; display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; box-sizing: border-box; margin: 0 0.29em; font-size: inherit; font-family: inherit; color: inherit; z-index: 0; padding: 0.66em 2ch; vertical-align: middle; border: 0; vertical-align: middle; border-radius: 0.6em; position: relative; font-weight: 600 !important; -webkit-tap-highlight-color: transparent; text-decoration: none; line-height: inherit; outline: 0 !important; letter-spacing: inherit; } .emby-button:not([disabled]) { cursor: pointer; } .emby-button[disabled] { opacity: 0.4; } .emby-button::-moz-focus-inner { border: 0; } .emby-button:hover { background-color: #FFFFFF33; } .emby-button:active { background-color: hsla(var(--theme-primary-color-hue), var(--theme-primary-color-saturation), var(--theme-primary-color-lightness),0.5); } .button-link { background: 0 0; margin: 0; padding: 0; border: 0; vertical-align: initial; outline: 0 !important; text-shadow: inherit; -webkit-user-select: inherit; user-select: inherit; position: relative; } .button-link:focus { text-shadow: none; } .button-link:not([disabled]) { cursor: pointer; } .button-inherit-color { color: inherit !important; } .button-link.button-link-no-focus-bg:focus::before { background: 0 0 !important; box-shadow: none !important; } .raised, .fab { -webkit-user-select: none; user-select: none; } .raised { text-align: center; } .raised-mini { padding-top: 0.6em; padding-bottom: 0.6em; border-radius: 100em; } .raised > span { -webkit-flex-shrink: 0; flex-shrink: 0; } @media (hover: hover) and (pointer: fine) { } .button-link:not(.emby-button-tv):not([disabled]):active { text-decoration: underline; } .emby-button-focusscale { transition: -webkit-transform 0.2s ease-out !important; transition: transform 0.2s ease-out !important; -webkit-transform-origin: center center; transform-origin: center center; } .button-link:focus-visible::before { position: absolute; top: 0; left: -0.35em; right: -0.35em; bottom: 0; content: " "; z-index: -1; border-radius: inherit; box-shadow: 0 0.25em 0.4375em rgba(0, 0, 0, 0.25); contain: strict; } .button-link.emby-button-tv:focus::before { position: absolute; top: 0; left: -0.35em; right: -0.35em; bottom: 0; content: " "; z-index: -1; border-radius: inherit; box-shadow: 0 0.25em 0.4375em rgba(0, 0, 0, 0.25); contain: strict; } .emby-button-focusscale:focus { -webkit-transform: scale(1.1); transform: scale(1.1); z-index: 1; } .button-icon, .fab > i { font-size: 1.59em; } .button-icon-left { -webkit-margin-end: 0.25em; margin-inline-end: 0.25em; -webkit-margin-start: -0.1em; margin-inline-start: -0.1em; } .button-icon-right { -webkit-margin-start: 0.25em; margin-inline-start: 0.25em; -webkit-margin-end: -0.1em; margin-inline-end: -0.1em; } .fab { display: -webkit-inline-flex; display: inline-flex; border-radius: 50%; padding: 0.66em; box-sizing: border-box; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-align: center; } .emby-button.block { display: block; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; margin: 0.25em 0; width: 100%; } .paper-icon-button-light { position: relative; display: -webkit-inline-flex; display: inline-flex; -webkit-align-items: center; align-items: center; box-sizing: border-box; margin: 0 0.29em; background: 0 0; text-align: center; font-size: inherit; font-family: inherit; color: inherit; -webkit-user-select: none; user-select: none; z-index: 0; min-width: initial; min-height: initial; width: auto; height: auto; padding: 0.556em; vertical-align: middle; border: 0; vertical-align: middle; position: relative; overflow: hidden; border-radius: 50%; -webkit-tap-highlight-color: transparent; -webkit-justify-content: center; justify-content: center; outline: 0 !important; text-shadow: inherit; } .paper-icon-button-light:enabled { cursor: pointer; } .paper-icon-button-light::-moz-focus-inner { border: 0; } .paper-icon-button-light[disabled] { opacity: 0.3; } .paper-icon-button-light > i { font-size: 1.66956521739130434em; position: relative; z-index: 1; vertical-align: middle; } .paper-icon-button-light:hover { background: hsla( var(--theme-text-color-hue), var(--theme-text-color-saturation), var(--theme-text-color-lightness), 0.2); } .paper-icon-button-light.md-icon { font-size: 1.66956521739130434em; margin: 0 0.17em; padding: 0.333em; } .paper-icon-button-light:focus { text-shadow: none; } .paper-icon-button-img { width: 1.72em; height: 1.72em; object-fit: cover; object-position: center; max-height: 100%; position: relative; z-index: 1; vertical-align: middle; } .icon-button-focusscale { transition: -webkit-transform 0.2s ease-out !important; transition: transform 0.2s ease-out !important; -webkit-transform-origin: center center; transform-origin: center center; } .icon-button-focusscale:focus { -webkit-transform: scale(1.14); transform: scale(1.14); z-index: 1; } .btnFilterWithBubble { position: relative; } .nobackdropfilter { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; } .toggleButtonIcon { border-radius: 0.3em; } .toggleButtonIcon-backdropfilter.toggleButtonIcon-active { -webkit-backdrop-filter: saturate(1.8) blur(1.5em); backdrop-filter: saturate(1.8) blur(1.5em); } @property --angle { syntax: ""; inherits: false; initial-value: 0deg; } @-webkit-keyframes focusbordergradient { 0% { --angle: 0deg; } 100% { --angle: 360deg; } } @keyframes focusbordergradient { 0% { --angle: 0deg; } 100% { --angle: 360deg; } } @supports (-webkit-mask-composite: xor) { .emby-button-outline:focus { overflow: visible; } .emby-button-outline:focus::after { content: " "; position: absolute; top: -0.22em; bottom: -0.22em; left: -0.22em; right: -0.22em; border: 0.1em solid transparent !important; border-radius: inherit; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; } .emby-button-outline.paper-icon-button-light:focus::after { top: -0.18rem; left: -0.18rem; right: -0.18rem; bottom: -0.18rem; border: 0.1rem solid transparent !important; } .emby-button-outline.button-link:focus::after { top: -0.2em; bottom: -0.2em; left: -0.54em; right: -0.54em; border-radius: 0.8em; } .emby-button-outline.raised:focus::after, .emby-button-outline.emby-tab-button:focus::after { border-radius: 0.8em; } .emby-button-outline.raised-mini:focus::after { border-radius: inherit; } }