/* Approved activity layout A. Presentation only: preserve the existing text,
   numbering, newlines, typography and editor/save behavior. Each compact card
   has four detail rows: activity is subject row 3 and class row 4. Keep the
   selectors here in sync with the summary renderers; browser tests assert it.
   Wide/tablet editable cards are deliberately outside these selectors. */
@layer peLocalTypography {
  @media (max-width: 768px) {
    html.pe-local-app[data-pe-local-phone="true"] body :is(#mobileSubjectPlanHost, #mobileClassProgressHost)
    :is(.mobileSubjectPlanCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(3),
        .mobileClassProgressCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(4)) {
      display: flex !important;
      flex-direction: column;
      align-items: stretch !important;
      gap: 4px;
      margin-top: 7px;
      margin-bottom: 7px;
      white-space: normal !important;
      text-align: left !important;
    }
    html.pe-local-app[data-pe-local-phone="true"] body :is(#mobileSubjectPlanHost, #mobileClassProgressHost)
    :is(.mobileSubjectPlanCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(3),
        .mobileClassProgressCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(4))
    > :is(.pePlanClassLabel, .pePlanClassValue) {
      display: block !important;
      text-align: left !important;
    }
  }
}
@layer peClassPlan12289 {
  @media (max-width: 768px) {
    html.pe-class-plan-enabled:not([data-pe-fold-wide="true"]):not([data-pe-ipados="true"]) body :is(#mobileSubjectPlanHost, #mobileClassProgressHost)
    :is(.mobileSubjectPlanCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(3),
        .mobileClassProgressCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(4)) {
      display: flex !important;
      flex-direction: column;
      align-items: stretch !important;
      gap: 4px;
      margin-top: 7px;
      margin-bottom: 7px;
      white-space: normal !important;
      text-align: left !important;
    }
    html.pe-class-plan-enabled:not([data-pe-fold-wide="true"]):not([data-pe-ipados="true"]) body :is(#mobileSubjectPlanHost, #mobileClassProgressHost)
    :is(.mobileSubjectPlanCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(3),
        .mobileClassProgressCard.pePlanCompact .pePlanSummary > .pePlanClassDetail:nth-child(4))
    > :is(.pePlanClassLabel, .pePlanClassValue) {
      display: block !important;
      text-align: left !important;
    }
  }
}
