/* V15.30.9 — Desktop/Laptop layout containment hotfix
   Scope: PC/laptop only. Absolutely no rule in this file applies below 992px.
   Purpose: keep the real layout inside the viewport, keep the sidebar in the grid,
   and confine wide data to its own table area instead of widening the page. */

@media screen and (min-width: 992px) {
  /* ---------- Shared desktop containment ---------- */
  html,
  body {
    inline-size: 100%;
    max-inline-size: 100%;
    min-inline-size: 0;
  }

  *, *::before, *::after { box-sizing: border-box; }

  :where(
    main, section, article, header, footer, nav, form, fieldset,
    .card, .card-body, .card-header, .card-footer,
    .page-head, .page-title, .public-page-head,
    .premium-main, .premium-content, .rg3d-main, .rg3d-content,
    .public-main, .ref-public-main, .ref-container,
    .wizard-shell, .wizard-step-panel,
    .parent-portal-stage, .parent-color-layout,
    .tp-shell, .tp-main, .tp-card, .tp-hero,
    .hv-shell, .hv-grid, .hv-card,
    .staff-apply, .staff-apply-card,
    .school-timetable-workspace, .school-timetable-panel, .tt-section,
    .sca, .scr, .scc, .sca-card, .scr-card, .scc-card
  ) {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  :where(
    .form-grid, .grid-two, .detail-grid, .stats-grid, .kpi-grid,
    .staff-export-grid, .staff-export-checks,
    .cd-grid, .cd-form-grid, .cd-metric-grid, .cd-flow,
    .tp-kpis, .tp-academic-grid, .tp-actions,
    .parent-honors-hero, .parent-honor-list,
    .hv-grid, .hv-stats,
    .staff-apply-grid, .staff-choice-grid, .staff-birth-grid
  ) > * {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  :where(input, select, textarea, button, .form-control, .form-select, .btn) {
    min-inline-size: 0;
    max-inline-size: 100%;
  }

  /* Preserve Arabic names naturally: wrap at word boundaries, never split letters. */
  :where(
    .staff-person-cell b, .sca-person b,
    .student-name, .teacher-name, .employee-name, .person-name, .full-name,
    .rg3d-user-card b, .tp-profile h1, .tp-profile h2
  ) {
    word-break: normal !important;
    overflow-wrap: normal !important;
    white-space: normal !important;
  }

  /* ---------- Admin shell: sidebar + content form one bounded desktop grid ---------- */
  body.reference-master-admin.rg3d-admin .premium-app-shell.rg3d-shell,
  body.reference-master-admin .premium-app-shell.app {
    display: grid !important;
    grid-template-columns: clamp(228px, 18.5vw, 286px) minmax(0, 1fr) !important;
    inline-size: 100% !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    margin: 0 !important;
  }

  body.reference-master-admin.rg3d-admin .premium-sidebar.rg3d-sidebar,
  body.reference-master-admin .premium-app-shell.app > .premium-sidebar {
    position: sticky !important;
    inset: auto !important;
    top: 0 !important;
    align-self: start !important;
    inline-size: 100% !important;
    width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    max-inline-size: none !important;
    max-width: none !important;
    block-size: 100vh !important;
    height: 100vh !important;
    transform: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body.reference-master-admin .premium-sidebar-overlay,
  body.reference-master-admin .sidebar-toggle,
  body.reference-master-admin.rg3d-admin .rg3d-mobile-menu {
    display: none !important;
  }

  body.reference-master-admin.rg3d-admin .premium-main.rg3d-main,
  body.reference-master-admin .premium-app-shell.app > .premium-main {
    inline-size: 100% !important;
    width: 100% !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  body.reference-master-admin.rg3d-admin .premium-content.rg3d-content,
  body.reference-master-admin .premium-content.content {
    inline-size: 100% !important;
    width: 100% !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    padding-inline: clamp(14px, 1.8vw, 28px) !important;
  }

  body.reference-master-admin.rg3d-admin .rg3d-content > *,
  body.reference-master-admin .premium-content.content > * {
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
  }

  /* On 1024–1199 laptops the top bar uses two rows instead of widening the page. */
  @media screen and (min-width: 992px) and (max-width: 1199px) {
    body.reference-master-admin.rg3d-admin .rg3d-topbar {
      grid-template-columns: minmax(0, 1fr) auto auto !important;
      grid-template-areas:
        "meta bell user"
        "search search search" !important;
      height: auto !important;
      min-height: 84px !important;
      gap: 7px 10px !important;
      padding: 7px 12px !important;
    }
    body.reference-master-admin.rg3d-admin .rg3d-topbar-meta {
      grid-area: meta !important;
      min-width: 0 !important;
      flex-wrap: wrap !important;
    }
    body.reference-master-admin.rg3d-admin .rg3d-search {
      grid-area: search !important;
      justify-self: stretch !important;
      width: 100% !important;
      max-width: none !important;
      min-width: 0 !important;
    }
    body.reference-master-admin.rg3d-admin .rg3d-bell { grid-area: bell !important; }
    body.reference-master-admin.rg3d-admin .rg3d-user-card {
      grid-area: user !important;
      min-width: 0 !important;
      width: min(185px, 100%) !important;
      max-width: 185px !important;
    }
    body.reference-master-admin.rg3d-admin .rg3d-date,
    body.reference-master-admin.rg3d-admin .rg3d-time {
      min-width: 0 !important;
      padding-inline: 9px !important;
      white-space: normal !important;
      line-height: 1.35 !important;
    }
  }

  /* ---------- Wide tables: scroll only inside their own frame ---------- */
  :where(
    .global-table-scroll, .table-wrap, .table-responsive, .responsive-table-wrap,
    [class*="table-wrap"], [class*="table-scroll"], .tp-schedule-wrap,
    .hv-table-wrap, .sca-table-wrap, .scr-table-wrap
  ) {
    display: block !important;
    inline-size: 100% !important;
    width: 100% !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    min-inline-size: 0 !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overscroll-behavior-inline: contain !important;
    -webkit-overflow-scrolling: touch;
  }

  :where(.global-table-scroll, .table-wrap, .table-responsive, .responsive-table-wrap) > table {
    margin-inline: 0 !important;
  }

  :where(table, .table) th,
  :where(table, .table) td {
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

  /* Search/action rows may wrap; they must never increase the document width. */
  :where(.search-bar, .actions, .global-action-fields, .staff-export-actions, .staff-export-check-actions) {
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    flex-wrap: wrap !important;
  }
  :where(.search-bar, .global-action-fields) > * {
    min-inline-size: 0 !important;
  }

  /* ---------- Dialogs / popups stay inside desktop viewport ---------- */
  :where([role="dialog"], .modal-dialog) {
    max-inline-size: calc(100vw - 48px) !important;
    max-block-size: calc(100vh - 48px) !important;
    box-sizing: border-box !important;
  }
  :where([role="dialog"], .modal-dialog) > :where(.modal-content, .dialog-content, .card) {
    max-block-size: calc(100vh - 48px) !important;
    overflow-y: auto !important;
    max-inline-size: 100% !important;
  }

  /* Known full-screen review dialog already centers itself; remove 100vw as a layout source. */
  .division-review-overlay {
    width: 100% !important;
    max-width: 100% !important;
  }
  .division-review-card {
    width: min(620px, calc(100% - 36px)) !important;
    max-width: calc(100% - 36px) !important;
  }

  /* ---------- Public site / external portals ---------- */
  body.reference-master-public .ref-site-header {
    inline-size: 100% !important;
    width: 100% !important;
    max-inline-size: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
  }

  body.reference-master-public .ref-header-inner,
  body.reference-master-public .ref-public-main.public-main,
  body.reference-master-public .ref-footer-top,
  body.reference-master-public .ref-footer-bottom {
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
  }

  body.reference-master-public .ref-header-brand,
  body.reference-master-public .ref-header-nav,
  body.reference-master-public .ref-header-tools,
  body.reference-master-public .ref-header-brand > * {
    min-inline-size: 0 !important;
  }

  body.reference-master-public .ref-header-nav {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 6px !important;
  }

  body.reference-master-public .ref-header-nav a {
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
    padding-inline: clamp(9px, .9vw, 15px) !important;
    font-size: clamp(12px, 1vw, 17px) !important;
  }

  @media screen and (min-width: 992px) and (max-width: 1180px) {
    body.reference-master-public .ref-header-inner {
      width: min(calc(100% - 24px), 1460px) !important;
      grid-template-columns: minmax(245px, .9fr) minmax(0, 1.7fr) auto !important;
      gap: 9px !important;
      min-height: 96px !important;
    }
    body.reference-master-public .ref-header-brand strong.arabic-handwriting-hero {
      max-width: 100% !important;
      font-size: clamp(22px, 2.5vw, 28px) !important;
    }
    body.reference-master-public .ref-header-nav a {
      height: 42px !important;
      min-height: 42px !important;
      padding-inline: 9px !important;
      font-size: 12.5px !important;
    }
  }

  body.reference-master-public .ref-public-main.public-main,
  body.reference-master-public .public-main,
  body.reference-master-public .staff-apply,
  body.reference-master-public .tp-shell,
  body.reference-master-public .parent-portal-stage {
    inline-size: min(100%, 1460px) !important;
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
    box-sizing: border-box !important;
  }

  body.reference-master-public .staff-apply {
    width: min(1120px, 100%) !important;
    margin-inline: auto !important;
  }

  /* External form / portal grids can shrink inside the available page width. */
  body.reference-master-public :where(
    .staff-apply-grid, .staff-choice-grid, .staff-birth-grid,
    .tp-shell, .tp-kpis, .tp-academic-grid,
    .parent-color-layout, .parent-honors-hero, .parent-honor-list
  ) > * {
    min-inline-size: 0 !important;
    max-inline-size: 100% !important;
  }

  /* Public floating login remains anchored but cannot escape the viewport. */
  body.reference-master-public .admin-floating-login-card-panel {
    max-width: calc(100vw - 32px) !important;
    box-sizing: border-box !important;
  }
}
