/* v27.8 — Οριστική διόρθωση οριζόντιας μετατόπισης σε κινητά.
   Αιτία: το grid track 1fr κρατούσε το intrinsic minimum πλάτος των εσωτερικών στοιχείων,
   με αποτέλεσμα όλη η reading-layout να γίνεται πλατύτερη από το viewport και να κεντράρεται εκτός οθόνης. */

@media (max-width: 900px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }

  .reading-layout {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: stretch !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .reading-layout > *,
  .reading-rail,
  .reading-content,
  .lesson-content {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    transform: none !important;
  }

  .reading-rail {
    box-sizing: border-box !important;
  }

  .reading-content :where(img, svg, video, canvas, iframe, table),
  .lesson-content :where(img, svg, video, canvas, iframe, table) {
    max-width: 100% !important;
  }
}

@media (max-width: 620px) {
  .reading-layout.section-pad {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .reading-rail {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  .reading-rail > span,
  .reading-rail > a {
    max-width: 100% !important;
  }
}