.top-bar {
  transition: transform 0.1s ease, opacity 0.3s ease;
  /* Visible by default */
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
  /* Make it stick to the top */
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: white;
  /* Add background so content doesn't show through */ }

.top-bar.top-bar-hidden {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none; }

.toggle-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5em 0.5em;
  font-weight: bold;
  font-size: 1em;
  color: inherit;
  border-radius: 6px;
  transition: background 0.2s, color 0.2s;
  display: flex;
  align-items: center;
  min-width: 2.6em;
  min-height: 2.6em;
  justify-content: center;
  text-align: center;
  user-select: none; }
  .toggle-btn:hover {
    background: #e0e0e066; }

body.dark-theme .toggle-btn {
  background: none; }
  body.dark-theme .toggle-btn:hover {
    background: #44474a55; }

.theme-toggle-btn .icon {
  display: none;
  color: #e6b916;
  width: 1.5em;
  height: 1.5em; }
.theme-toggle-btn .icon-moon {
  color: #8ab4f8; }

body:not(.dark-theme) .icon-sun {
  display: inline; }

body:not(.dark-theme) .icon-moon {
  display: none; }

body.dark-theme .icon-sun {
  display: none; }

body.dark-theme .icon-moon {
  display: inline; }

/* dark-theme.css */
body.dark-theme {
  background: #181a1b;
  color: #e0e0e0; }
  body.dark-theme pre,
  body.dark-theme code,
  body.dark-theme pre code {
    background: #23272a !important;
    color: #e0e0e0 !important; }
    body.dark-theme pre::-webkit-scrollbar,
    body.dark-theme code::-webkit-scrollbar,
    body.dark-theme pre code::-webkit-scrollbar {
      background: #23272a; }
    body.dark-theme pre::-webkit-scrollbar-thumb,
    body.dark-theme code::-webkit-scrollbar-thumb,
    body.dark-theme pre code::-webkit-scrollbar-thumb {
      background: #44474a; }
    body.dark-theme pre::-webkit-scrollbar-thumb:hover,
    body.dark-theme code::-webkit-scrollbar-thumb:hover,
    body.dark-theme pre code::-webkit-scrollbar-thumb:hover {
      background: #66696c; }
  body.dark-theme pre,
  body.dark-theme code,
  body.dark-theme pre code {
    scrollbar-color: #44474a #23272a;
    scrollbar-width: thin; }
  body.dark-theme .notices {
    background: #23272a !important;
    color: #e0e0e0 !important; }
  body.dark-theme table, body.dark-theme thead, body.dark-theme tbody,
  body.dark-theme tfoot, body.dark-theme tr, body.dark-theme th, body.dark-theme td {
    border: none !important; }
  body.dark-theme th, body.dark-theme td {
    background: #23272a;
    color: #e0e0e0; }
  body.dark-theme tr:nth-child(even) td,
  body.dark-theme tr:nth-child(even) th {
    background: #282c2f; }

body.dark-theme .top-bar {
  background: #23272a;
  color: #e0e0e0; }

body.dark-theme .menu {
  background: #23272a; }
  body.dark-theme .menu a {
    color: #888a8b !important; }
  body.dark-theme .menu .active > a,
  body.dark-theme .menu a.active {
    color: #e0e0e0 !important; }
  body.dark-theme .menu a:hover {
    color: #e0e0e0 !important; }

.top-bar {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 1em;
  min-height: 2.8em; }

.top-bar-left,
.top-bar-right {
  float: none !important; }

.top-bar-left {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 30%; }

.toggle-btn.lang-toggle-btn {
  position: absolute;
  left: 20em;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2; }

.toggle-btn.theme-toggle-btn {
  position: absolute;
  right: 20em;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2; }

pre::-webkit-scrollbar,
code::-webkit-scrollbar,
pre code::-webkit-scrollbar {
  height: 8px;
  width: 8px; }
pre::-webkit-scrollbar-thumb,
code::-webkit-scrollbar-thumb,
pre code::-webkit-scrollbar-thumb {
  border-radius: 4px; }

pre,
code,
pre code {
  scrollbar-width: thin; }

p code,
li code {
  padding: 0.2em 0.4em;
  font-size: 0.95em; }

.menu-text.is-hidden {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important; }

.menu {
  margin: 0 auto; }

[dir="rtl"] {
  text-align: right; }
  [dir="rtl"] .top-bar, [dir="rtl"] .top-bar-left {
    flex-direction: row-reverse; }

/*# sourceMappingURL=main.css.map */