/* SIAPIYA_TEACHING_CONTINUITY_HANDOFF_V37064
   Teaching Workspace UX Wave 3 — Teaching Continuity & Smart Handoff.
   Visualizes current -> next -> post-session continuity from existing agenda/session state. */

#mainContent .siapiya-teaching-continuity{
  display:grid;
  gap:.58rem;
  padding:.7rem;
  border:1px solid var(--bs-border-color);
  border-radius:.72rem;
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 16%,var(--bs-body-bg));
}

#mainContent .siapiya-teaching-continuity-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:.65rem;
}

#mainContent .siapiya-teaching-continuity-head > div{
  display:grid;
  gap:.05rem;
  min-width:0;
}

#mainContent .siapiya-teaching-continuity-head b{
  font-size:.79rem;
  font-weight:850;
}

#mainContent .siapiya-teaching-continuity-head small{
  max-width:72ch;
  color:var(--bs-secondary-color);
  font-size:.61rem;
  line-height:1.35;
}

#mainContent .siapiya-teaching-continuity-head > span{
  flex:0 0 auto;
  padding:.22rem .45rem;
  border:1px solid var(--bs-border-color);
  border-radius:999px;
  background:var(--bs-body-bg);
  color:var(--bs-secondary-color);
  font-size:.57rem;
  font-weight:800;
  white-space:nowrap;
}

#mainContent .siapiya-teaching-continuity-head > span[data-continuity-state="attention"]{
  border-color:color-mix(in srgb,var(--bs-danger) 38%,var(--bs-border-color));
  color:var(--bs-danger-text-emphasis);
}

#mainContent .siapiya-teaching-continuity-head > span[data-continuity-state="clear"]{
  border-color:color-mix(in srgb,var(--bs-success) 38%,var(--bs-border-color));
  color:var(--bs-success-text-emphasis);
}

#mainContent .siapiya-teaching-continuity-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.42rem;
}

#mainContent .siapiya-teaching-continuity-step{
  display:grid;
  align-content:start;
  gap:.42rem;
  min-width:0;
  padding:.58rem;
  border:1px solid var(--bs-border-color);
  border-radius:.64rem;
  background:var(--bs-body-bg);
}

#mainContent .siapiya-teaching-continuity-step[data-continuity-step="now"]{
  border-inline-start:3px solid var(--bs-primary);
}

#mainContent .siapiya-teaching-continuity-step[data-continuity-step="next"]{
  border-inline-start:3px solid var(--bs-info);
}

#mainContent .siapiya-teaching-continuity-step[data-continuity-step="after"]{
  border-inline-start:3px solid var(--bs-warning);
}

#mainContent .siapiya-teaching-continuity-step-head{
  display:flex;
  align-items:center;
  gap:.38rem;
}

#mainContent .siapiya-teaching-continuity-step-head > span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.45rem;
  height:1.45rem;
  border-radius:999px;
  background:var(--bs-tertiary-bg);
  color:var(--bs-primary);
  font-size:.59rem;
  font-weight:850;
}

#mainContent .siapiya-teaching-continuity-step-head b{
  font-size:.65rem;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.035em;
}

#mainContent .siapiya-teaching-continuity-session,
#mainContent .siapiya-teaching-continuity-empty{
  display:grid;
  gap:.05rem;
  min-width:0;
}

#mainContent .siapiya-teaching-continuity-session strong,
#mainContent .siapiya-teaching-continuity-empty strong{
  overflow:hidden;
  font-size:.72rem;
  line-height:1.3;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#mainContent .siapiya-teaching-continuity-session small,
#mainContent .siapiya-teaching-continuity-empty small{
  color:var(--bs-secondary-color);
  font-size:.59rem;
  line-height:1.35;
}

#mainContent .siapiya-teaching-continuity-session em{
  margin-top:.12rem;
  color:var(--bs-primary);
  font-size:.57rem;
  font-style:normal;
  font-weight:750;
}

#mainContent .siapiya-teaching-continuity-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.3rem;
  min-height:2.55rem;
  margin-top:auto;
  padding:.34rem .54rem;
  border:1px solid var(--bs-primary);
  border-radius:.56rem;
  background:var(--bs-primary);
  color:var(--bs-white);
  font-size:.62rem;
  font-weight:800;
}

#mainContent .siapiya-teaching-session-next > em{
  display:block;
  margin-top:.16rem;
  color:var(--bs-primary);
  font-size:.56rem;
  font-style:normal;
  font-weight:700;
  line-height:1.35;
}

#mainContent :is(
  .siapiya-teaching-continuity-action
):focus-visible{
  outline:3px solid color-mix(in srgb,var(--bs-primary) 60%,transparent);
  outline-offset:2px;
  box-shadow:none!important;
}

@media (max-width:991.98px){
  #mainContent .siapiya-teaching-continuity-grid{
    grid-template-columns:1fr 1fr;
  }

  #mainContent .siapiya-teaching-continuity-step[data-continuity-step="after"]{
    grid-column:1/-1;
  }
}

@media (max-width:767.98px){
  #mainContent .siapiya-teaching-continuity{
    padding:.62rem;
  }

  #mainContent .siapiya-teaching-continuity-head{
    flex-direction:column;
  }

  #mainContent .siapiya-teaching-continuity-grid{
    grid-template-columns:1fr;
  }

  #mainContent .siapiya-teaching-continuity-step[data-continuity-step="after"]{
    grid-column:auto;
  }

  #mainContent .siapiya-teaching-continuity-action{
    min-height:2.8rem;
    width:100%;
  }
}

@media (max-width:420px){
  #mainContent .siapiya-teaching-continuity{
    gap:.48rem;
  }

  #mainContent .siapiya-teaching-continuity-step{
    padding:.52rem;
  }

  #mainContent .siapiya-teaching-continuity-session strong,
  #mainContent .siapiya-teaching-continuity-empty strong{
    white-space:normal;
  }
}

[data-bs-theme="dark"] #mainContent .siapiya-teaching-continuity{
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 10%,var(--bs-body-bg));
}

@media (forced-colors:active){
  #mainContent .siapiya-teaching-continuity,
  #mainContent .siapiya-teaching-continuity-step,
  #mainContent .siapiya-teaching-continuity-action{
    border-color:CanvasText;
  }

  #mainContent .siapiya-teaching-continuity-action{
    background:ButtonFace;
    color:ButtonText;
  }

  #mainContent .siapiya-teaching-continuity-action:focus-visible{
    outline:3px solid Highlight;
  }
}

@media (prefers-reduced-motion:reduce){
  #mainContent .siapiya-teaching-continuity-action{
    transition:none!important;
    animation:none!important;
  }
}