/* Custom theme variables for v4 */
.theme-toggle {
  cursor: pointer;
  font-size: 24px;
}
:root {
  --color-bg: #ffffff;
  --color-text: #1f2937;
  --color-border: #dddddd;
  --blur-backdrop: rgba(255, 255, 255, 0.8);
}

.dark {
  --color-bg: oklch(27.9% 0.041 260.031);
  --color-text: #f9fafb;
  --color-border: #666;
  --blur-backdrop: rgba(32, 32, 32, 0.8);
}
body {
  font-family: "Tiro Bangla", serif;
  background-color: var(--color-bg);
  color: var(--color-text);
  transition: background-color 0.3s, color 0.3s;
  min-height: 100vh;
  margin: 0;
  padding: 0;
}
div {
  border-color: var(--color-border);
}
article {
  border-color: var(--color-border);
}
header {
  background-color: var(--color-bg);
  color: var(--color-text);
  border-color: var(--color-border);
  transition: background-color 0.3s, color 0.3s;
}

/* Custom styles for the sticky behavior */
.sticky-menu {
  transition: all 0.3s ease-in-out;
  position: relative;
  z-index: 40;
}

.sticky-menu.sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 50;
  background-color: var(--color-bg);
  backdrop-filter: var(--blur-backdrop);
  animation: slideDown 0.3s ease;
}

/* Mobile Menu */
.mobile-menu {
  background-color: var(--color-bg);
  color: var(--color-text);
}