/*
 GreenEco — Items screen / Invoices & Quotations
 Reorganized screen without changing business logic.

 Layout:
 - Fixed title with X at far left.
 - Row 1: all native item commands + item-group commands, 8 equal cells.
 - Row 2: quick search + results count + page-size control.
 - No side columns, wrapping, strange stretching, or hover jitter.
 - Table consumes remaining height and is the only vertical scroll area.
 - Table headers stay fixed.
 - Pagination stays fixed below the table body.

 No app.js or print changes.
 Version: 3.3.16.44.2.533
*/

@media screen {

  /* Scope is added only on /items by the narrow adapter. */
  .app-workspace.items-restructured-workspace{
    direction:rtl!important;

    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;

    display:grid!important;
    grid-template-columns:
      minmax(8px,1fr)
      repeat(8,minmax(0,147.5px))
      minmax(8px,1fr)!important;
    grid-template-rows:
      58px
      52px
      50px
      auto
      auto
      minmax(0,1fr)!important;
    column-gap:6px!important;
    row-gap:6px!important;
    align-items:stretch!important;
    align-content:stretch!important;

    margin:0!important;
    padding:8px 8px 10px!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
    position:relative!important;
    z-index:1!important;
  }

  /*
   * The React page remains untouched.
   * display:contents only exposes its existing children to this screen grid.
   */
  .items-restructured-workspace
  > .page-container.items-restructured-screen{
    display:contents!important;
  }

  /* The two existing group-management buttons join Row 1 directly. */
  .items-restructured-workspace
  > .items-group-action{
    display:contents!important;
  }

  /* ---------------------------------------------------------
     TITLE — fixed
     --------------------------------------------------------- */

  .items-restructured-screen
  > .page-title{
    grid-column:2 / 10!important;
    grid-row:1!important;

    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    max-height:58px!important;

    margin:0!important;
    padding:5px 54px!important;

    position:relative!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    box-sizing:border-box!important;
    overflow:hidden!important;

    transform:none!important;
    translate:none!important;
    scale:none!important;
  }

  .items-restructured-screen
  > .page-title h1{
    margin:0!important;
  }

  /* X is a safe proxy added by the route adapter. */
  .items-restructured-screen
  > .page-title
  > .items-restructured-close-x{
    position:absolute!important;
    left:6px!important;
    right:auto!important;
    top:50%!important;

    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;

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

    margin:0!important;
    padding:0!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;

    border:1px solid #87969c!important;
    border-radius:0!important;
    background:#fff!important;
    color:#1b3340!important;

    font-size:23px!important;
    font-weight:900!important;
    line-height:1!important;

    box-sizing:border-box!important;

    transform:translateY(-50%)!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
    filter:none!important;
  }

  /* ---------------------------------------------------------
     ROW 1 — 8 EQUAL COMMAND CELLS
     Native order:
       جديد | تعديل | حذف | بحث | تحديث | طباعة
     Then:
       مجموعة أصناف جديدة | إدارة مجموعات الأصناف
     --------------------------------------------------------- */

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified{
    display:contents!important;
  }

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions{
    display:contents!important;
  }

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button{
    grid-row:2!important;

    width:100%!important;
    min-width:0!important;
    max-width:none!important;

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

    align-self:center!important;

    margin:0!important;
    padding:5px 7px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;

    border-radius:0!important;
    box-sizing:border-box!important;

    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;

    transform:none!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
    filter:none!important;
  }

  /* Six native CRUD/search/refresh/print buttons occupy the first six cells. */
  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(1){grid-column:2!important}

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(2){grid-column:3!important}

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(3){grid-column:4!important}

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(4){grid-column:5!important}

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(5){grid-column:6!important}

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:nth-child(6){grid-column:7!important}

  /*
   * Group buttons are existing React buttons and keep their current handlers.
   * No cloning or DOM movement.
   */
  .items-restructured-workspace
  > .items-group-action
  > button{
    grid-row:2!important;

    width:100%!important;
    min-width:0!important;
    max-width:none!important;

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

    align-self:center!important;

    margin:0!important;
    padding:5px 7px!important;

    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;

    border-radius:0!important;
    box-sizing:border-box!important;

    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;

    transform:none!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
    filter:none!important;
  }

  .items-restructured-workspace
  > .items-group-action
  > button:nth-of-type(1){
    grid-column:8!important;
  }

  .items-restructured-workspace
  > .items-group-action
  > button:nth-of-type(2){
    grid-column:9!important;
  }

  /* ---------------------------------------------------------
     ROW 2 — SEARCH / RESULTS / PAGE SIZE
     --------------------------------------------------------- */

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-extra{
    grid-column:2 / 10!important;
    grid-row:3!important;

    direction:rtl!important;

    width:100%!important;
    min-width:0!important;
    max-width:100%!important;

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

    margin:0!important;
    padding:5px 6px!important;

    display:grid!important;
    grid-template-columns:minmax(0,5fr) minmax(145px,1.2fr) 110px!important;
    align-items:center!important;
    gap:6px!important;

    border:1px solid #b9c4c9!important;
    border-radius:0!important;
    background:#f7f9fa!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .items-restructured-screen
  .entity-toolbar-quick-search{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;

    height:38px!important;

    margin:0!important;
    padding:0 6px!important;

    display:flex!important;
    align-items:center!important;
    gap:6px!important;

    box-sizing:border-box!important;
  }

  .items-restructured-screen
  .entity-toolbar-quick-search input{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;

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

    margin:0!important;
    box-sizing:border-box!important;
  }

  .items-restructured-screen
  .entity-toolbar-results{
    width:100%!important;
    min-width:0!important;
    height:38px!important;

    margin:0!important;
    padding:0 8px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:4px!important;

    border:1px solid #c4cdd1!important;
    background:#fff!important;

    box-sizing:border-box!important;
    white-space:nowrap!important;
  }

  .items-restructured-screen
  .task-row-page-size{
    width:100%!important;
    min-width:0!important;
    height:38px!important;

    margin:0!important;
    padding:0 5px!important;

    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;

    border:1px solid #c4cdd1!important;
    background:#fff!important;

    box-sizing:border-box!important;
    white-space:nowrap!important;
  }

  .items-restructured-screen
  .task-row-page-size select{
    width:58px!important;
    min-width:58px!important;
    height:30px!important;
  }

  /* ---------------------------------------------------------
     FEEDBACK — retain every existing message
     --------------------------------------------------------- */

  .items-restructured-workspace
  > .items-group-action
  > span{
    grid-column:2 / 10!important;
    grid-row:4!important;

    width:100%!important;
    min-width:0!important;

    margin:0!important;
    padding:5px 8px!important;

    box-sizing:border-box!important;
  }

  .items-restructured-screen
  > .form-alert{
    grid-column:2 / 10!important;
    grid-row:5!important;

    width:100%!important;
    min-width:0!important;

    margin:0!important;
    box-sizing:border-box!important;
  }

  /* ---------------------------------------------------------
     TABLE — ONLY VERTICAL SCROLL AREA
     --------------------------------------------------------- */

  .items-restructured-screen
  > div:has(> .table-panel){
    grid-column:2 / 10!important;
    grid-row:6!important;

    width:100%!important;
    height:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-width:none!important;
    max-height:none!important;

    margin:0!important;
    padding:0!important;

    display:flex!important;
    flex-direction:column!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .items-restructured-screen
  > div:has(> .table-panel)
  > .table-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    height:100%!important;
    max-height:100%!important;

    margin:0!important;

    display:flex!important;
    flex-direction:column!important;

    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .items-restructured-screen
  > div:has(> .table-panel)
  > .table-panel
  > .table-scroll{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;

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

    margin:0!important;
  }

  /* Pagination/footer remains fixed below the scrolling rows. */
  .items-restructured-screen
  > div:has(> .table-panel)
  > .table-panel
  > .table-footer{
    flex:0 0 auto!important;
  }

  /* Column headings remain visible while rows scroll. */
  .items-restructured-screen
  .data-table thead th{
    position:sticky!important;
    top:0!important;
    z-index:5!important;
  }

  /* Preserve the existing 7 columns and all row data. */
  .items-restructured-screen
  .data-table{
    width:100%!important;
    min-width:860px!important;
  }

  /* ---------------------------------------------------------
     NO JITTER
     --------------------------------------------------------- */

  .items-restructured-workspace button:hover:not(:disabled),
  .items-restructured-workspace button:focus-visible,
  .items-restructured-workspace button:active{
    translate:none!important;
    scale:none!important;
  }

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:hover:not(:disabled),

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:focus-visible,

  .items-restructured-screen
  > .toolbar.entity-toolbar-unified
  > .toolbar-actions
  > button:active,

  .items-restructured-workspace
  > .items-group-action
  > button:hover:not(:disabled),

  .items-restructured-workspace
  > .items-group-action
  > button:focus-visible,

  .items-restructured-workspace
  > .items-group-action
  > button:active{
    transform:none!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
    filter:none!important;
  }

  .items-restructured-screen
  > .page-title
  > .items-restructured-close-x:hover,

  .items-restructured-screen
  > .page-title
  > .items-restructured-close-x:focus-visible,

  .items-restructured-screen
  > .page-title
  > .items-restructured-close-x:active{
    transform:translateY(-50%)!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
    filter:none!important;
  }
}
