/*
 GreenEco Meetings — Reports fixed title + two command rows
 Screen: تقارير الاجتماعات

 Fix:
 - the official app header / ticker / open-screens bar stay outside the scroll area
 - only the Reports workspace scrolls vertically
 - Reports title stays fixed at top of that workspace
 - both toolbar rows stay fixed directly under the title
 - report tables/content scroll underneath
 - printing is untouched (screen-only rules)

 Version: 3.3.16.44.2.524
*/

@media screen {

  /*
   * Make the Reports screen use the remaining application viewport as its
   * own scroll area. This avoids sticky elements drifting under the ribbon
   * or open-screens bar when the report becomes long.
   */
  .app-shell:has(.meeting-reports-page-title){
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
    overflow:hidden!important;
  }

  .app-shell:has(.meeting-reports-page-title) > .app-workspace{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;

    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable!important;

    position:relative!important;
    z-index:1!important;
  }

  /*
   * Title remains at the top of the Reports workspace.
   * Keep a fully opaque background so report rows never show through it.
   */
  .app-workspace .meeting-reports-page-title{
    position:sticky!important;
    top:0!important;
    z-index:620!important;

    height:46px!important;
    min-height:46px!important;
    max-height:46px!important;

    margin:0 0 3px!important;

    background:#fff!important;
    background-color:#fff!important;

    box-shadow:0 2px 4px rgba(19,48,61,.13)!important;
    isolation:isolate!important;
  }

  /*
   * Both Reports command rows are inside the same native toolbar.
   * Pin that complete toolbar immediately below the title.
   */
  .app-workspace
  .toolbar:has(> .toolbar-extra > .meeting-report-toolbar-controls){
    position:sticky!important;
    top:49px!important;
    z-index:610!important;

    margin-top:0!important;
    margin-bottom:7px!important;

    background:#f7f9fa!important;
    background-color:#f7f9fa!important;

    box-shadow:0 2px 5px rgba(19,48,61,.16)!important;
    isolation:isolate!important;
  }

  /*
   * Prevent any ancestor/result wrapper from clipping the sticky title or
   * command rows. This is strictly scoped to the Reports page container.
   */
  .page-container:has(> .meeting-reports-page-title){
    overflow:visible!important;
    min-height:100%!important;
  }

  /*
   * Report content remains the moving area. Table headers may keep their
   * existing internal sticky behavior inside each table scroll region.
   */
  .page-container:has(> .meeting-reports-page-title)
  .meeting-report-print-area,
  .page-container:has(> .meeting-reports-page-title)
  .meeting-reports-all-preview,
  .page-container:has(> .meeting-reports-page-title)
  .meeting-report-summary-preview,
  .page-container:has(> .meeting-reports-page-title)
  .meeting-detail-preview-panel{
    position:relative!important;
    z-index:1!important;
  }

  /*
   * Extra protection against visual bleed-through while rows pass behind
   * the fixed command block.
   */
  .app-workspace
  .toolbar:has(> .toolbar-extra > .meeting-report-toolbar-controls)::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:-1!important;
    background:#f7f9fa!important;
    pointer-events:none!important;
  }

  /* The title close X stays stable while pinned. */
  .meeting-reports-head-close,
  .meeting-reports-head-close:hover,
  .meeting-reports-head-close:focus-visible,
  .meeting-reports-head-close:active{
    transform:translateY(-50%)!important;
    translate:none!important;
    scale:none!important;
  }
}
