/* Purple Theme Override - Force all purple elements to use #9d00ff */

/* Main theme variables override */
[data-theme=purple], [data-theme=darkpurple] {
  --primary-color: #9d00ff !important;
  --secondary-color: #7d00cc !important;
  --third-color: #b333ff !important;
  --fourth-color: #9d00ff !important;
}

/* Force override any hardcoded old purple colors */
.dt li.dt-purple {
  background: #9d00ff !important;
}

/* Watch later button override */
.watch_later_wrap.active,
.watch_later_wrap:hover,
.watch_later_holder.active,
.watch_later_holder:hover {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
}

/* Sign in/Sign up buttons override - ONLY when purple theme is active */
[data-theme=purple] .search-button.form-button,
[data-theme=purple] .top-signin,
[data-theme=purple] .left-nav-signin .search-button,
[data-theme=purple] .save-entry-button,
[data-theme=darkpurple] .search-button.form-button,
[data-theme=darkpurple] .top-signin,
[data-theme=darkpurple] .left-nav-signin .search-button,
[data-theme=darkpurple] .save-entry-button {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
  color: #fff !important;
}

/* Specific overrides for exact button classes - ONLY when purple theme is active */
[data-theme=purple] .sb-search-submit,
[data-theme=purple] .search-button.top-signin,
[data-theme=purple] .save-entry-button.button-grey.search-button.top-signin,
[data-theme=purple] button.save-entry-button,
[data-theme=purple] button.top-signin,
[data-theme=darkpurple] .sb-search-submit,
[data-theme=darkpurple] .search-button.top-signin,
[data-theme=darkpurple] .save-entry-button.button-grey.search-button.top-signin,
[data-theme=darkpurple] button.save-entry-button,
[data-theme=darkpurple] button.top-signin {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
  color: #fff !important;
}

/* Ensure icon-user button is purple - ONLY when purple theme is active */
[data-theme=purple] .icon-user,
[data-theme=purple] button .icon-user,
[data-theme=purple] .search-button .icon-user,
[data-theme=purple] .top-signin .icon-user,
[data-theme=purple] .left-nav-signin .icon-user,
[data-theme=purple] .save-entry-button .icon-user,
[data-theme=darkpurple] .icon-user,
[data-theme=darkpurple] button .icon-user,
[data-theme=darkpurple] .search-button .icon-user,
[data-theme=darkpurple] .top-signin .icon-user,
[data-theme=darkpurple] .left-nav-signin .icon-user,
[data-theme=darkpurple] .save-entry-button .icon-user {
  color: #fff !important;
}

/* Force override grey button class - ONLY when purple theme is active */
[data-theme=purple] .button-grey.search-button,
[data-theme=purple] .button-grey.top-signin,
[data-theme=purple] button.button-grey,
[data-theme=darkpurple] .button-grey.search-button,
[data-theme=darkpurple] .button-grey.top-signin,
[data-theme=darkpurple] button.button-grey {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
}

/* Hover states - ONLY when purple theme is active */
[data-theme=purple] .search-button.form-button:hover,
[data-theme=purple] .top-signin:hover,
[data-theme=purple] .left-nav-signin .search-button:hover,
[data-theme=purple] .save-entry-button:hover,
[data-theme=darkpurple] .search-button.form-button:hover,
[data-theme=darkpurple] .top-signin:hover,
[data-theme=darkpurple] .left-nav-signin .search-button:hover,
[data-theme=darkpurple] .save-entry-button:hover {
  background-color: #7d00cc !important;
  border-color: #7d00cc !important;
}

/* Main menu active state override */
.accordion li.active,
.accordion li.active a,
.left-nav li.active,
.left-nav li.active a {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
  color: #fff !important;
}

/* Any other elements that might use old purple */
[class*="purple"],
[class*="dt-purple"],
[id*="purple"] {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
  color: #fff !important;
}

/* VideoJS purple theme override */
.vjs-skin-colors-purple {
  color: #9d00ff !important;
}

.vjs-skin-colors-purple .vjs-load-progress {
  background-color: #9d00ff !important;
  background-color: rgba(157, 0, 255, 0.5) !important;
}

.vjs-skin-colors-purple .vjs-play-progress {
  background-color: #9d00ff !important;
}

.vjs-skin-colors-purple .vjs-slider {
  background-color: #9d00ff !important;
  background-color: rgba(157, 0, 255, 0.4) !important;
}

.vjs-skin-colors-purple .vjs-volume-level {
  background-color: #9d00ff !important;
}

.vjs-skin-colors-purple .vjs-big-play-button,
.vjs-skin-colors-purple .vjs-big-play-button:focus,
.vjs-skin-colors-purple:hover .vjs-big-play-button {
  border-color: #9d00ff !important;
}

.vjs-skin-colors-purple .vjs-menu-button ul li.vjs-selected:focus,
.vjs-skin-colors-purple .vjs-menu-button ul li.vjs-selected:hover {
  background-color: #9d00ff !important;
  background-color: rgba(157, 0, 255, 0.75) !important;
}

/* Force override any remaining old purple color codes */
*[style*="#b25c8b"],
*[style*="#924c72"],
*[style*="#c079a0"],
*[style*="#b96a95"] {
  background-color: #9d00ff !important;
  border-color: #9d00ff !important;
  color: #9d00ff !important;
}
