:root {
  --control-bg: var(--button-bg);
  --control-bg-hover: var(--button-hover);
  --control-text: var(--accent-primary);
  --control-text-strong: var(--text-primary);
  --control-border: var(--border-color);
  --control-primary-bg: var(--text-primary);
  --control-primary-text: var(--bg-primary);
  --control-surface: var(--surface);
}

button,
[role="button"],
input[type="button"],
input[type="submit"],
input[type="reset"] {
  -webkit-tap-highlight-color: transparent;
}

.submit-btn,
#submitBtn,
.create-acc,
.Sign-In,
.theme-toggle,
.lang-toggle,
.close-btn,
.back,
.modal-btn-primary,
.modal-btn-secondary,
.secondary-action-btn,
.remove-picture-btn,
.skeleton-button {
  color: var(--control-text) !important;
  border-color: var(--control-border) !important;
  background-color: var(--control-bg) !important;
  background-image: none;
}

.submit-btn:hover,
#submitBtn:hover,
.create-acc:hover,
.Sign-In:hover,
.theme-toggle:hover,
.lang-toggle:hover,
.close-btn:hover,
.back:hover,
.modal-btn-secondary:hover,
.secondary-action-btn:hover,
.remove-picture-btn:hover:not(:disabled) {
  color: var(--control-text-strong) !important;
  background-color: var(--control-bg-hover) !important;
  border-color: var(--accent-primary) !important;
}

.create-acc::after {
  background: var(--control-primary-bg) !important;
}
.create-acc:hover span {
  color: var(--control-primary-text) !important;
}

.modal-btn-primary {
  background: var(--control-primary-bg) !important;
  color: var(--control-primary-text) !important;
  border-color: var(--control-primary-bg) !important;
}
.modal-btn-primary:hover {
  background: var(--accent-primary) !important;
  color: var(--bg-primary) !important;
}

.chebox,
#usernm {
  background: var(--control-surface) !important;
  border-color: var(--control-border) !important;
  color: var(--control-text) !important;
}
#usernm:focus {
  background: var(--surface) !important;
  border-color: var(--control-text-strong) !important;
}

.option input:checked ~ .chebox {
  background: var(--control-bg-hover) !important;
  border-color: var(--control-text-strong) !important;
}


.discord-btn,
.dis,
.discord-btn-link {
  filter: none;
}


@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .select,
  .bpa-card,
  .close-btn,
  #usernm,
  #submitBtn {
    background-color: var(--bg-secondary) !important;
  }
}