/* 
  1. Hides the built-in MathLive hamburger menu and keyboard toggle
  2. Hides the inline suggestion popover (the \ menu)
*/
math-field::part(virtual-keyboard-toggle),
math-field::part(menu-toggle),
math-field::part(suggestion-popover) {
  display: none !important;
}

math-field {
  --placeholder-color: #3b82f6;
  --placeholder-opacity: 0.1;
  --placeholder-active-background: #eff6ff;
}

.dark math-field {
  --placeholder-color: #60a5fa;
  --placeholder-active-background: rgba(59, 130, 246, 0.2);
}

.slide-up-enter-active,
.slide-up-leave-active {
  transition: transform 0.25s ease-out;
}

.slide-up-enter-from,
.slide-up-leave-to {
  transform: translateY(100%);
}

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
  scrollbar-width: thin;
  scrollbar-color: #bbf7d0 transparent;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0.5rem;
  height: 0.5rem;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  background-color: #bbf7d0;
  border-radius: 0.25rem;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: transparent;
}

:deep(.function-plot .x.origin),
:deep(.function-plot .y.origin) {
  stroke: #222222 !important;
  /* Make the central lines dark */
  stroke-width: 2px !important;
  /* Make them stand out from the grid lines */
  stroke-opacity: 1 !important;
  /* Make them fully opaque */
}

/* Optional: If you find the default bottom/left border ticks redundant, 
   you can hide the outer bounding box paths */
:deep(.function-plot .axis path.domain) {
  stroke-opacity: 0.3;
}

/* Make the Desmos bottom-left logo a bit more subtle */
.dcg-container .dcg-desmos-logo {
  opacity: 0.1;
}