/* Ngăn kéo sổ tay ở trang bài học (bước B12) */
.notebook__toggle {
  position: fixed;
  left: var(--space-4);
  bottom: var(--space-4);
  z-index: 20;
  width: 52px;
  height: 52px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--color-primary);
  box-shadow: var(--shadow-lift);
  font-size: 24px;
  cursor: pointer;
}

.notebook__panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  width: min(360px, 100vw);
  padding: var(--space-4);
  overflow-y: auto;
  border-left: 2px solid var(--color-border);
  background: var(--color-surface);
  box-shadow: var(--shadow-lift);
}

.notebook__panel[hidden] {
  display: none;
}

.notebook__title {
  margin-top: 0;
  font-family: var(--font-heading);
  font-size: var(--font-size-lg);
}

.notebook__list {
  display: grid;
  gap: var(--space-2);
  padding: 0;
  list-style: none;
}

.notebook__item {
  position: relative;
  padding: var(--space-2) var(--space-6) var(--space-2) var(--space-3);
  border-radius: var(--radius-sm);
  background: var(--color-surface-muted);
  overflow-wrap: anywhere;
}

.notebook__remove {
  position: absolute;
  top: var(--space-1);
  right: var(--space-1);
  border: 0;
  background: none;
  color: var(--color-text-muted);
  cursor: pointer;
}
