/* Locked lessons in the curriculum.

   Deliberately still readable: the point is that the student sees the whole
   syllabus and knows what is waiting, so the row is dimmed rather than hidden
   and the title stays legible. */
.ala-locked{
  position:relative;
  opacity:.62;
  cursor:not-allowed;
  text-decoration:none;
}
.ala-locked:hover{opacity:.75}

.ala-lock-tag{
  display:inline-flex;align-items:center;gap:5px;
  margin-inline-start:8px;padding:2px 9px;
  border-radius:999px;
  background:rgba(120,110,150,.16);
  color:#4B2C77;
  font-size:.74rem;font-weight:700;line-height:1.6;
  vertical-align:middle;white-space:nowrap;
}
.ala-lock-tag::before{
  content:"";
  width:9px;height:11px;flex:0 0 auto;
  background:currentColor;
  /* A padlock drawn in CSS, so the plugin ships no image file and the icon
     inherits the colour of whatever theme it lands in. */
  -webkit-mask:no-repeat center/contain url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath d='M3 6V4a3 3 0 0 1 6 0v2h.5A1.5 1.5 0 0 1 11 7.5v5A1.5 1.5 0 0 1 9.5 14h-7A1.5 1.5 0 0 1 1 12.5v-5A1.5 1.5 0 0 1 2.5 6H3zm1.5 0h3V4a1.5 1.5 0 0 0-3 0v2z'/%3E%3C/svg%3E");
  mask:no-repeat center/contain url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 14'%3E%3Cpath d='M3 6V4a3 3 0 0 1 6 0v2h.5A1.5 1.5 0 0 1 11 7.5v5A1.5 1.5 0 0 1 9.5 14h-7A1.5 1.5 0 0 1 1 12.5v-5A1.5 1.5 0 0 1 2.5 6H3zm1.5 0h3V4a1.5 1.5 0 0 0-3 0v2z'/%3E%3C/svg%3E");
}