/* BT-172 — adaptation aux dimensions réelles.
   Layout only. No new color, no new surface, no new component. */

/* Compact role rail when a 280px column would crush the work surface.
   The same links stay reachable. Anonymous pages have no rail. */
@media (max-width: 1199px) {
  html[data-pp-role-rail="on"] .pp-role-rail-167.pp-shell {
    display: block !important;
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: 36rem;
    margin: 0 !important;
    overflow: auto !important;
    z-index: 25;
  }

  html[data-pp-role-rail="on"] .pp-role-rail-167 .pp-shell-sidebar {
    display: block !important;
    width: 100% !important;
    min-height: 0 !important;
  }

  html[data-pp-role-rail="on"] .pp-shell-sidebar__nav {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center;
    justify-content: flex-start;
    gap: 0.35rem 0.75rem;
    padding: 0.5rem 0.75rem 0.65rem;
  }

  html[data-pp-role-rail="on"] .pp-shell-sidebar__group {
    display: contents;
  }

  html[data-pp-role-rail="on"] .pp-shell-sidebar__group-title {
    flex: 1 0 100%;
    margin: 0.35rem 0 0;
  }

  html[data-pp-role-rail="on"] .pp-shell-sidebar__link {
    flex: 0 1 auto;
    min-height: 2.25rem;
  }

  html[data-pp-role-rail="on"]:not([data-pp-nav-dock="side"]) #root > main {
    margin-left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* Public header already folds under 1100px. Keep that fold through
   portrait monitors, where the full item row no longer fits. */
@media (max-width: 1199px) {
  html[data-theme][data-pp-scheme] .pp-header.pp-header--public-wow .pp-header-actions {
    display: none !important;
  }
  html[data-theme][data-pp-scheme] .pp-header.pp-header--public-wow .pp-burger {
    display: flex !important;
    min-width: var(--pp171-control-height);
    min-height: var(--pp171-control-height);
    align-items: center;
    justify-content: center;
  }
  html[data-theme][data-pp-scheme] .pp-header.pp-header--public-wow .pp-nav {
    display: none !important;
  }
  html[data-theme][data-pp-scheme] body.pp-nav-open .pp-header.pp-header--public-wow .pp-nav {
    display: flex !important;
    flex: 1 0 100% !important;
    width: 100%;
    flex-direction: column !important;
    order: 10;
    margin: 0 !important;
  }
  html[data-theme][data-pp-scheme] body.pp-nav-open .pp-header.pp-header--public-wow .pp-nav-flat-panel {
    display: flex !important;
    width: 100%;
    flex-direction: column !important;
    align-items: stretch;
    gap: 0.5rem;
  }
  html[data-theme][data-pp-scheme] body.pp-nav-open .pp-header.pp-header--public-wow .pp-header-actions {
    display: flex !important;
    width: 100%;
    flex: 1 0 100% !important;
    order: 11;
    justify-content: flex-start;
    flex-wrap: wrap;
    padding-bottom: 0.75rem;
  }
  html[data-theme][data-pp-scheme] body.pp-nav-open .pp-header.pp-header--public-wow .pp-header-acct-mobile {
    display: none !important;
  }
}

/* Mega panels stay inside the window. */
html[data-theme][data-pp-scheme] .pp-lux-mega {
  max-width: calc(100vw - 1rem);
  box-sizing: border-box;
}

/* Work overlays stay inside the window and scroll internally. */
html[data-theme][data-pp-scheme] :is([role="dialog"], .pp-live-work-modal, .pp-soiree-close-027__card) {
  max-width: min(100%, calc(100vw - 1.5rem));
  max-height: calc(100dvh - 2rem);
  overflow: auto;
  box-sizing: border-box;
}

/* Shared data tables scroll inside the work surface. */
html[data-theme][data-pp-scheme] :is(.pp-rankings-table-wrap, .pp-table-wrap, .pp-data-table-wrap, .pp-main, .pp-public-site-shell__content) {
  min-width: 0;
  max-width: 100%;
}
html[data-theme][data-pp-scheme] :is(.pp-rankings-table-wrap, .pp-table-wrap, .pp-data-table-wrap) {
  overflow-x: auto;
}

/* Public calendar: the side detail is a viewport rule at 960px.
   Measure the calendar itself, after the role rail has taken its space. */
html[data-theme][data-pp-scheme] .pp-cal-pro {
  container-type: inline-size;
  container-name: ppcal;
  min-width: 0;
  max-width: 100%;
}

@container ppcal (max-width: 75rem) {
  .pp-cal-pro__layout {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .pp-cal-pro__grid-wrap {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .pp-cal-pro__detail {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}

@container ppcal (max-width: 46rem) {
  .pp-cal-pro__grid-wrap {
    overflow-x: auto;
  }
  .pp-cal-pro__dow,
  .pp-cal-pro__grid {
    min-width: 44rem;
  }
}

/* Director / admin calendar: same rule, using the component width. */
html[data-theme][data-pp-scheme] .pp-admin-league-cal {
  container-type: inline-size;
  container-name: ppadmincal;
  min-width: 0;
  max-width: 100%;
}

@container ppadmincal (max-width: 76rem) {
  .pp-op-split__body {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .pp-admin-league-cal__filters {
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)) !important;
  }
}

@container ppadmincal (max-width: 40rem) {
  .pp-op-split__body {
    overflow-x: auto;
  }
  .pp-cal-gm001-grid {
    min-width: 44rem;
  }
}

/* Public filters follow the cockpit width, not the monitor width. */
html[data-theme][data-pp-scheme] .pp-public-cockpit-page__frame {
  container-type: inline-size;
  container-name: ppframe;
  min-width: 0;
  max-width: none !important;
  width: 100% !important;
}

@container ppframe (max-width: 46rem) {
  .pp-public-cockpit-filters {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
  }
  .pp-public-cockpit-filter {
    flex: 0 0 auto !important;
    min-width: 0;
    width: 100%;
  }
}