/* css styles */

/* 1. Forzar que el botón de menú sea visible siempre, incluso en PC */
.quarto-sidebar-toggle {
  display: flex !important;
  visibility: visible !important;
  position: fixed;
  left: 20px;
  top: 75px; /* Ajusta esto para que quede debajo de tu Navbar */
  z-index: 2000;
  background-color: #ffffff;
  border: 2px solid #333;
  border-radius: 50%; /* Botón circular */
  width: 45px;
  height: 45px;
  justify-content: center;
  align-items: center;
  box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* 2. Crear las tres rayas (Hamburguesa) con CSS puro */
.quarto-sidebar-toggle::before {
  content: "☰"; /* Icono de hamburguesa estándar */
  font-size: 24px;
  color: #333;
}

/* 3. Evitar que el menú tape el botón cuando se abre */
#quarto-sidebar {
  padding-top: 60px;
}