:root {
  --primary-color: #aaff8a;
  --secondary-color: #aaff8a;
  --background-color: #111;
  --text-color: #fff;
  --text-muted: rgba(255, 255, 255, .75);
  --box-shadow-light: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);
  --box-shadow-dark: 0 20px 25px -5px rgba(0, 0, 0, .3), 0 10px 10px -5px rgba(0, 0, 0, .6);
  --border-color-light: rgba(255, 255, 255, .15);
  --border-color-dark: rgb(158 158 161);
  --background-muted: rgba(255, 255, 255, .1);
  --box-shadow-extra-light: 0 1px 3px 0 rgba(0, 0, 0, .1), 0 1px 2px 0 rgba(0, 0, 0, .06);
  --button-hover-scale: 1.2;
  --button-disabled-opacity: .5;
  --tooltip-background: #000;
  --tooltip-text-color: #fff;
  --border-color-hover: rgba(0, 0, 0, .35);
  --launch-background: rgba(255, 255, 255, .1);
  --tooltip-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  --box-shadow-launch: 0 0 10px rgba(0, 0, 0, .1);
  --button-scale-small: .5;
  --button-translate-y: 25%;
  --tooltip-triangle-color: #000;
  --autofill-box-shadow: 0 0 0px 1000px rgba(0, 0, 0, 0) inset;
  --shortcuts-box-shadow: 0 -1px 3px 0 rgba(0, 0, 0, .1), 0 -1px 2px 0 rgba(0, 0, 0, .06);
  --link-color: #667eea;
}

/* basic text */
body {
  background-color: var(--background-color);
  color: var(--text-color);
}

h1, h2, h3, h4, h5, h6, 
nav a, 
footer,
input, select, textarea,
#search input,
#form.form-v2 input {
  color: var(--text-color);
}

/* sign up */
.user-avatar.sign-up {
  color: var(--background-color);
}

.user-avatar.sign-up.signed-in::before,
.user-avatar.sign-up.signed-in:hover::before,
.user-avatar.user-credits.loaded:hover::before {
  border-color: transparent transparent #888 transparent;
}

.user-avatar.sign-up.signed-in::after,
.user-avatar.sign-up.signed-in:hover::after,
.user-avatar.user-credits.loaded:hover::after {
  background-color: #888;
  z-index: 2;
}

.signup {
  background-color: #888 !important;
  background-image: none !important;
}

/* search */
#search,
#search-button {
  background-color: var(--background-muted);
}

/* edit */
#player-editor-toggle {
  background-color: var(--text-color);
}

#image-selector-upload img,
#image-selector-search img,
.ai-add-options img {
  filter: invert(1);
}

.email-preview button img,
#video-player-sharing-create-preview img {
  filter: invert(1);
}

.user-credits {
  color: var(--background-color);
}

.user-credits img,
.user-icon {
  filter: invert(0);
}

.shortcut img {
  filter: invert(1);
}

/* messages */
#video-player-messages img {
  filter: invert(1);
}

/* launch */
.launch input,
.launch .InputContainer .InputElement,
.launch #card-element {
  background: var(--background-muted);
  color: var(--text-color);
}

body.launch-open .checkout {
  background-image: none;
}

/* nav */
.logo img {
  opacity: 0;
}

.logo {
  background-image: url('/assets/channel4/logo.svg');
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transform: translate(0, 0) !important;
  height: 45px;
}

/* .reachtv-faq {
  display: inline-flex;
} */

.streamr-insights {
  display: none;
}

#video-player-placeholder {
  filter: none !important;
  animation: none !important;
}

/* checkout */
/* #download {
  display: none;
}

.checkout-area.checkout-launch #launch {
  transform: translateX(0) !important;
} */

/* my ads */
body .tv-ad {
  border: 1px solid var(--launch-background);
}

body .tv-ad-image {
  background: #000;
}

.tv-ads-main {
  background: var(--launch-background);
}

.tv-ad-more-info *,
.targeting-data-content * {
  color: var(--text-color);
}

.variant-close {
  filter: invert(1);
}

.targeting-data-content .user-avatar {
  color: var(--background-color);
}

#player-draft-toggle {
  border: 1px solid var(--text-color);
  color: var(--background-color);
}

#player-draft-toggle:hover {
  border: none;
}

#player-share-toggle {
  border: 1px solid var(--text-color);
  color: var(--background-color);
}

#player-editor-toggle {
  color: var(--background-color);
}

#video-player-drafts-items h4 {
  color: var(--text-color);
  background: var(--background-color);
}

.video-player-drafts-modal {
  background: var(--launch-background);
}

#player-draft-toggle:hover {
  background-position: 173px center;
}

.video-player-draft {
  border: 2px solid var(--launch-background);
}

button#video-player-drafts-close {
  background: var(--background-color);
  color: var(--text-color);
  border: 3px solid var(--text-color);
}

button#video-player-drafts-close:hover {
  background: var(--text-color);
  color: var(--background-color);
}

.logo-picker-img-wrapper {
  background: rgba(255, 255, 255, .5);
}

.video-selector-add-with-ai h3 img {
  filter: invert(1);
}

#card-element-channel4 {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--background-color);
  color: rgba(74, 85, 104, 1);
  box-shadow: var(--box-shadow-extra-light);
  padding: 14px;
  border-radius: 5px;
  font-size: 14px;
  margin: 0 0 10px 0;
}

#card-element-channel4 {
  margin-top: 20px;
}

/* my ads pro res unlock */
.is-admin .tv-ad.tv-ad-editable.tv-ad-download .tv-ad-actions .step-button.download-prores {
  display: inline-block !important;
  color: var(--alternate-color);
  border-color: var(--alternate-color);
}

.is-admin .tv-ad.tv-ad-editable.tv-ad-download .tv-ad-actions .step-button.download-prores:hover {
  background: var(--alternate-color);
  color: #fff;
  border-color: var(--alternate-color);
}

/* my ads bcap pdf unlock */
.is-admin .tv-ad.tv-ad-editable.tv-ad-download .tv-ad-actions .step-button.download-bcap {
  display: inline-block !important;
  color: var(--alternate-color);
  border-color: var(--alternate-color);
}

.is-admin .tv-ad.tv-ad-editable.tv-ad-download .tv-ad-actions .step-button.download-bcap:hover {
  background: var(--alternate-color);
  color: #fff;
  border-color: var(--alternate-color);
}

.channel4-checkout {
  display: none !important;
}

.checkout-ready .channel4-checkout {
  display: block !important;
}

option[value="92a49edb-4c43-4579-b277-f0375a6e7667"] {
  display: block;
}

#player-upload-toggle {
  display: none !important;
}

/* temp: until we enable more options */
#player-templates-toggle,
#template-selector-container {
  display: none !important;
}

.purchase-btn {
  color: var(--background-color) !important;
}