.flexible_svg_container svg {
	width: 100%;
  	height: auto;
  	display: block;
}


.is-svg-container svg {
	max-height:100%;
	max-width:100%;
}


.svg-lock {
  position: relative;
  flex: 1 1 auto;   /* let the figure fill the column */
  width: 100%;
  height: 100%;
  overflow: hidden; /* no spillover */
  margin: 0;
  min-height: 0;
}
/* take the inline SVG out of flow and make it fill the figure */
.svg-lock > svg {
  position: absolute;
  inset: 0;         /* top/right/bottom/left: 0 */
  width: 100%;
  height: 100%;
  display: block;
}


.is-admin {
  background-color: transparent;
  text-decoration-line: underline;
  text-decoration-color: magenta;
  text-decoration-style: dashed;
}

/* Beta badge */
.is-beta {
  position: relative; /* ensure the badge anchors to this box */
}

/* the badge itself */
.is-beta::after {
  content: "BETA";
  position: absolute;
  left: -0.375rem;      /* tweak as needed */
  bottom: -0.375rem;     /* tweak as needed */
  display: inline-block;
  padding: 5px 10px;
  font: 700 14px/1 system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: #fff;
  background: #7c3aed;  /* violet-ish */
  border-radius: 9999px; /* pill */
  box-shadow: 0 1px 2px rgba(0,0,0,.25);
  pointer-events: none;  /* don't intercept clicks inside the box */
  transform-origin: center;
  transition: transform .2s ease;
}

/* pulse on hover */
.is-beta:hover::after {
  animation: beta-pulse 1s ease-in-out infinite;
}

/* optional: a tiny "pop" on hover start */
.is-beta:hover::after {
  transform: scale(1.03);
}

@keyframes beta-pulse {
  0%   { transform: scale(1.03); box-shadow: 0 1px 2px rgba(0,0,0,.25), 0 0 0 0 rgba(124,58,237,.5); }
  70%  { transform: scale(1.12); box-shadow: 0 1px 2px rgba(0,0,0,.25), 0 0 0 8px rgba(124,58,237,0); }
  100% { transform: scale(1.03); box-shadow: 0 1px 2px rgba(0,0,0,.25), 0 0 0 0 rgba(124,58,237,0); }
}

/* respect users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  .is-beta:hover::after { animation: none; transform: none; }
}