/* Phone-only lesson dialog presentation. Original event/data owners, control
 * grids, keyboard/scroll geometry, calendar cells and status badges stay intact.
 * Use the first important layer, not global dialog/p/button rules. */
@layer peV2SoftBlue20261018n {
  @media (max-width:768px) {
    /* Exact dialog surfaces: no backdrop, native picker or calendar selector. */
    html.peV2PhoneRenderGuard #peHomeTodayDetail12335 > .peTodayDetailPanel12335,
    html.peV2PhoneRenderGuard #peV2CalendarDay > .peV2DayPanel,
    html.peV2PhoneRenderGuard #homeUpcomingEditor > .homeUpcomingDialog,
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal > .calendarAddDialog,
    html.peV2PhoneRenderGuard #calendarModal.calendarDetailModal > .calendarDetailDialog,
    html.peV2PhoneRenderGuard #peClassPlanDialog12289 > .pePlanPanel,
    html.peV2PhoneRenderGuard #progressActivityModal > .progressActivityModalDialog,
    html.peV2PhoneRenderGuard #progressMemoModal11620 > .progressMemoDialog11620,
    html.peV2PhoneRenderGuard #subjectPlanReorder12271 > .peReorderDialog12271,
    html.peV2PhoneRenderGuard #v2gp-management > .v2gp-menu,
    html.peV2PhoneRenderGuard #classroomLauncherModal > .classroomLauncher,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 > .classroomToolsDialog12307,
    html.peV2PhoneRenderGuard #classroomFinishModal > section,
    html.peV2PhoneRenderGuard [data-work-memo-modal] > .workMemoDialog {
      background:#fff!important;
      border:1px solid #d4d4d4!important;
      box-shadow:none!important;
    }

    /* All structural headings use the same white surface and simple divider.
     * Select each real owner explicitly; nested lesson data headers are not
     * swept up by a generic header selector. */
    html.peV2PhoneRenderGuard #peHomeTodayDetail12335 .peTodayDetailHeader12335,
    html.peV2PhoneRenderGuard #peV2CalendarDay .peV2DayHeader,
    html.peV2PhoneRenderGuard #homeUpcomingEditor .homeUpcomingHeader,
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal .calendarAddHeader,
    html.peV2PhoneRenderGuard #calendarModal.calendarDetailModal .calendarDetailHeader,
    html.peV2PhoneRenderGuard #peClassPlanDialog12289 .pePlanModalHead,
    html.peV2PhoneRenderGuard #progressActivityModal > .progressActivityModalDialog > header,
    html.peV2PhoneRenderGuard #progressMemoModal11620 .progressMemoHead11620,
    html.peV2PhoneRenderGuard #subjectPlanReorder12271 .peReorderHead12271,
    html.peV2PhoneRenderGuard #v2gp-management > .v2gp-menu > header,
    html.peV2PhoneRenderGuard #classroomLauncherModal .classroomLauncherHead,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 .classroomFlowHead,
    html.peV2PhoneRenderGuard #classroomFinishModal > section > header,
    html.peV2PhoneRenderGuard [data-work-memo-modal] .workMemoDialogHead {
      background:#fff!important;
      border-bottom:1px solid #e0e4e8!important;
      box-shadow:none!important;
    }

    html.peV2PhoneRenderGuard #peHomeTodayDetailTitle12335,
    html.peV2PhoneRenderGuard #peV2DayTitle,
    html.peV2PhoneRenderGuard #homeUpcomingTitle,
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal .calendarAddHeading h3,
    html.peV2PhoneRenderGuard #calendarModal.calendarDetailModal .calendarDetailHeader h3,
    html.peV2PhoneRenderGuard #pePlanDialogTitle,
    html.peV2PhoneRenderGuard #progressActivityModalTitle,
    html.peV2PhoneRenderGuard #progressMemoTitle11620,
    html.peV2PhoneRenderGuard #peReorderTitle12271,
    html.peV2PhoneRenderGuard #v2gp-title,
    html.peV2PhoneRenderGuard #classroomLauncherTitle,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 .classroomFlowHead h1,
    html.peV2PhoneRenderGuard #classroomFinishTitle,
    html.peV2PhoneRenderGuard [data-work-memo-modal] .workMemoDialogHead h3 {
      color:#263b4a!important;
      text-shadow:none!important;
    }

    html.peV2PhoneRenderGuard #peV2CalendarDay .peV2DayFooter,
    html.peV2PhoneRenderGuard #homeUpcomingEditor .homeUpcomingFooter,
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal .calendarAddActions,
    html.peV2PhoneRenderGuard #peClassPlanDialog12289 .pePlanModalFoot,
    html.peV2PhoneRenderGuard #progressActivityModal > .progressActivityModalDialog > footer,
    html.peV2PhoneRenderGuard #progressMemoModal11620 .progressMemoFoot11620,
    html.peV2PhoneRenderGuard #subjectPlanReorder12271 .peReorderFooter12271,
    html.peV2PhoneRenderGuard #v2gp-management > .v2gp-menu > footer,
    html.peV2PhoneRenderGuard #classroomFinishModal > section > footer,
    html.peV2PhoneRenderGuard [data-work-memo-modal] .workMemoDialogActions {
      background:#fff!important;
      border-top:1px solid #e0e4e8!important;
      box-shadow:none!important;
    }

    /* Interior cards retain their original arrangement, spacing and inputs. */
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal .calendarAddSection,
    html.peV2PhoneRenderGuard #peV2CalendarDay:not(.peV2SingleLesson) .peV2DayLesson,
    html.peV2PhoneRenderGuard #classroomLauncherModal .classroomLauncherSection,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 .classroomFlow[data-classroom-view="catchup"] > .classroomPanel,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 .classroomFlow[data-classroom-view="history"] > .classroomPanel,
    html.peV2PhoneRenderGuard #classroomToolsModal12307 .classroomRecordQueryCard,
    html.peV2PhoneRenderGuard #classroomFinishModal .classroomFinishChecks > label,
    html.peV2PhoneRenderGuard #subjectPlanReorder12271 .peReorderItem12271:not(.dropTarget),
    html.peV2PhoneRenderGuard [data-work-memo-modal] .workMemoConfirmName {
      background:#fff!important;
      border-color:#d4d4d4!important;
      box-shadow:none!important;
    }

    /* Preserve calendar class-colour identity on the left edge. */
    html.peV2PhoneRenderGuard #calendarModal.calendarDetailModal .calDetailItem,
    html.peV2PhoneRenderGuard #homeUpcomingEditor .calDetailItem {
      background:#fff!important;
      border-top-color:#d4d4d4!important;
      border-right-color:#d4d4d4!important;
      border-bottom-color:#d4d4d4!important;
      box-shadow:none!important;
    }
    html.peV2PhoneRenderGuard #subjectPlanReorder12271 .peReorderItemHead12271 {
      background:#fff!important;
      border-bottom-color:#e0e4e8!important;
    }

    /* Do not recolour SVG strokes; existing restrained icon accents remain. */
    html.peV2PhoneRenderGuard #calendarModal.calendarAddModal .calendarAddIcon,
    html.peV2PhoneRenderGuard #classroomLauncherModal .classroomLauncherShortcutGrid > button > span {
      background:transparent!important;
      box-shadow:none!important;
    }

    /* Static, redundant instructions only. The audited owners populate these
     * exact nodes with the listed prose; errors, data and safety copy have
     * separate selectors and remain visible. */
    html.peV2PhoneRenderGuard #progressActivityModal .progressActivityModalStatus > p,
    html.peV2PhoneRenderGuard #progressMemoModal11620 .progressMemoBody11620 > p,
    html.peV2PhoneRenderGuard #classroomFinishModal > section > header > div > small {
      display:none!important;
    }
  }
}