/* /public_html/assets/css/planning/planning-public.desktop.css
   Planning hebdomadaire — PC >= 1024px
*/

@media (min-width: 1024px) {
  body.is-dashboard-shell-visible:has(#planning-public-content) {
    --planning-public-navbar-action-left: max(.86rem, calc(var(--edq-safe-area-left-effective, env(safe-area-inset-left, 0px)) + .72rem));
    --edq-navbar-edge-left-current: var(--planning-public-navbar-action-left) !important;
    --planning-wide-navbar-height: var(--edq-navbar-height-current, 4.45rem);
    --planning-wide-day-header-height: clamp(3.95rem, 4.2vw, 4.85rem);
    --planning-wide-glass-bleed: clamp(1.15rem, 1.7vw, 1.75rem);
    --planning-wide-glass-height: calc(var(--planning-wide-navbar-height) + var(--planning-wide-day-header-height));
    --planning-wide-safe-left: clamp(.8rem, 1.1vw, 1.35rem);
    --planning-wide-safe-right: clamp(.8rem, 1.1vw, 1.35rem);
    --planning-wide-bottom-gutter: max(.28rem, calc(var(--edq-safe-area-bottom-effective, env(safe-area-inset-bottom, 0px)) + .28rem));
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .mobile-shell-navbar__left {
    left: var(--planning-public-navbar-action-left) !important;
    gap: .42rem !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .mobile-shell-navbar__left .filter-bubbles-trigger {
    display: inline-flex !important;
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .filter-bubbles-trigger.filter-bubbles-trigger--bottom-right,
  body.is-dashboard-shell-visible:has(#planning-public-content) .filter-bubbles-trigger[data-filter-trigger-placement="bottom-right"] {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
    margin: 0 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) #app-root,
  body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-app-shell,
  body.is-dashboard-shell-visible:has(#planning-public-content) .dashboard-app-main,
  body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view,
  body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view > .panel-body {
    height: 100vh !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  @supports (height: 100dvh) {
    body.is-dashboard-shell-visible:has(#planning-public-content) #app-root,
    body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-app-shell,
    body.is-dashboard-shell-visible:has(#planning-public-content) .dashboard-app-main,
    body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view,
    body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view > .panel-body {
      height: 100dvh !important;
    }
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .dashboard-app-main,
  body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view,
  body.is-dashboard-shell-visible:has(#planning-public-content) #dashboard-view > .panel-body {
    margin-top: 0 !important;
    padding: 0 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-wrapper {
    position: fixed !important;
    z-index: 1 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: var(--dashboard-shell-content-left, calc(.2rem + 4.35rem + 1rem)) !important;
    right: var(--dashboard-shell-content-right, 1rem) !important;
    width: auto !important;
    max-width: none !important;
    height: 100vh !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 var(--planning-wide-safe-right) var(--planning-wide-bottom-gutter) var(--planning-wide-safe-left) !important;
    overflow: hidden !important;
    background: var(--color-background, var(--color-bg, #fff)) !important;
  }

  @supports (height: 100dvh) {
    body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-wrapper {
      height: 100dvh !important;
    }
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-content,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-mobile-week {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-mobile-daybar,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-day-inline-title,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-day-header {
    display: none !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar {
    position: fixed !important;
    z-index: 6 !important;
    top: var(--planning-wide-navbar-height) !important;
    left: calc(var(--dashboard-shell-content-left, calc(.2rem + 4.35rem + 1rem)) + var(--planning-wide-safe-left)) !important;
    right: calc(var(--dashboard-shell-content-right, 1rem) + var(--planning-wide-safe-right)) !important;
    display: grid !important;
    grid-template-columns: repeat(var(--planning-landscape-days-count, 5), minmax(0, 1fr)) !important;
    gap: clamp(.58rem, .9vw, 1rem) !important;
    height: var(--planning-wide-day-header-height) !important;
    min-height: var(--planning-wide-day-header-height) !important;
    max-width: 120rem !important;
    margin-inline: auto !important;
    pointer-events: none !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar__item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 0 !important;
    padding: .48rem .18rem .54rem !important;
    text-align: center !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar__label,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar__count {
    display: block !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    text-align: center !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar__label {
    color: var(--color-text) !important;
    font-size: clamp(1.08rem, 1.75vw, 1.62rem) !important;
    font-weight: 900 !important;
    line-height: 1.02 !important;
    letter-spacing: -.025em !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar__count {
    margin-top: .16rem !important;
    color: color-mix(in srgb, var(--color-text-muted, #64748b) 82%, transparent 18%) !important;
    font-size: clamp(.78rem, 1.05vw, 1.05rem) !important;
    font-weight: 740 !important;
    line-height: 1 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-grid {
    position: relative !important;
    isolation: isolate !important;
    display: grid !important;
    grid-template-columns: repeat(var(--planning-landscape-days-count, 5), minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: clamp(.58rem, .9vw, 1rem) !important;
    width: 100% !important;
    max-width: 120rem !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 auto !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-grid::before {
    content: '' !important;
    position: fixed !important;
    z-index: 4 !important;
    top: 0 !important;
    left: var(--dashboard-shell-content-left, calc(.2rem + 4.35rem + 1rem)) !important;
    right: var(--dashboard-shell-content-right, 1rem) !important;
    height: calc(var(--planning-wide-glass-height) + var(--planning-wide-glass-bleed)) !important;
    background: linear-gradient(
      to bottom,
      color-mix(in srgb, var(--color-surface, #fff) 54%, transparent 46%) 0%,
      color-mix(in srgb, var(--color-surface, #fff) 40%, transparent 60%) 46%,
      color-mix(in srgb, var(--color-surface, #fff) 24%, transparent 76%) 72%,
      color-mix(in srgb, var(--color-surface, #fff) 10%, transparent 90%) 90%,
      transparent 100%
    ) !important;
    backdrop-filter: blur(26px) saturate(1.16) !important;
    -webkit-backdrop-filter: blur(26px) saturate(1.16) !important;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 2rem), rgba(0,0,0,.72) calc(100% - 1rem), transparent 100%) !important;
    mask-image: linear-gradient(to bottom, #000 0%, #000 calc(100% - 2rem), rgba(0,0,0,.72) calc(100% - 1rem), transparent 100%) !important;
    pointer-events: none !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-day {
    position: relative !important;
    z-index: 2 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-day-list {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: calc(var(--planning-wide-glass-height) + var(--planning-wide-glass-bleed) + .22rem) 0 .22rem !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-day-list::-webkit-scrollbar {
    display: none !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-row,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-row.is-two {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: clamp(.4rem, .55vw, .58rem) !important;
    margin: 0 0 clamp(.4rem, .55vw, .58rem) !important;
    padding: 0 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-course {
    justify-self: stretch !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: clamp(6.15rem, 8.9vw, 9.2rem) !important;
    padding: clamp(.58rem, .95vw, .9rem) clamp(.35rem, .64vw, .74rem) !important;
    gap: clamp(.22rem, .36vw, .4rem) !important;
    border-radius: clamp(.95rem, 1.25vw, 1.25rem) !important;
    box-shadow: 0 .8rem 1.9rem rgba(15, 23, 42, .10) !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-course-time {
    font-size: clamp(.88rem, 1.18vw, 1.12rem) !important;
    line-height: 1.08 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-course .style-badge {
    padding-inline: clamp(.4rem, .64vw, .76rem) !important;
    font-size: clamp(.58rem, .82vw, .78rem) !important;
    line-height: 1.18 !important;
  }

  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-course-level,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-course-teacher {
    font-size: clamp(.78rem, .95vw, 1rem) !important;
    line-height: 1.08 !important;
  }
}

@media (min-width: 1800px) {
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-grid,
  body.is-dashboard-shell-visible:has(#planning-public-content) .planning-public-landscape-daybar {
    max-width: 120rem !important;
  }
}
