/* Dark mode toggle: extreme right of header, 10–15px from edge, user-friendly icon */
.vorsha-dark-mode-wrap {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  margin-right: 12px;
  flex-shrink: 0;
}

.vorsha-dark-mode-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  min-height: 44px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.06);
  color: inherit;
  border: 1px solid rgba(0, 0, 0, 0.08);
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
  text-decoration: none;
}

.vorsha-dark-mode-toggle:hover {
  background: rgba(0, 0, 0, 0.1);
  color: inherit;
  border-color: rgba(0, 0, 0, 0.12);
  transform: scale(1.06);
}

.vorsha-dark-mode-toggle:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.15);
}

.vorsha-dark-mode-toggle:active {
  transform: scale(0.98);
}

.st-night-mode .vorsha-dark-mode-toggle {
  background: rgba(255, 255, 255, 0.08);
  color: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.12);
}

.st-night-mode .vorsha-dark-mode-toggle:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.2);
}

.st-night-mode .vorsha-dark-mode-toggle:focus {
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.25);
}

.vorsha-dark-mode-toggle i {
  font-size: 1.125rem;
  line-height: 1;
}

.vorsha-dark-mode-toggle .vorsha-dark-mode-icon,
.vorsha-dark-mode-toggle .vorsha-light-mode-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

body.st-night-mode .vorsha-dark-mode-toggle .vorsha-dark-mode-icon {
  display: none;
}

body.st-night-mode .vorsha-dark-mode-toggle .vorsha-light-mode-icon {
  display: inline-flex !important;
}

body:not(.st-night-mode) .vorsha-dark-mode-toggle .vorsha-light-mode-icon {
  display: none !important;
}

/* Mobile: keep toggle visible and spaced when nav is open */
@media screen and (max-width: 991px) {
  .vorsha-dark-mode-wrap {
    margin-right: 15px;
    margin-left: auto;
  }

  .vorsha-dark-mode-toggle {
    min-width: 42px;
    min-height: 42px;
    width: 42px;
    height: 42px;
  }
}
