/*
 GreenEco — Items group buttons + dialogs
 Screen: الأصناف / وحدة الفواتير وعروض الأسعار

 Changes:
 - "مجموعة أصناف جديدة" => "إضافة مجموعة"
 - "إدارة مجموعات الأصناف" => "إدارة المجموعات"
 - Existing React SVG icons are preserved.
 - Add / Edit / Manage group dialogs use the same visual shell as
   the invoice/quotation line-item popup dialogs.
 - No item/group business logic changes.
 - No app.js / print changes.
 Version: 3.3.16.44.2.534
*/

@media screen {

  .items-restructured-workspace
  > .items-group-action
  > button svg{
    flex:0 0 auto!important;
    width:18px!important;
    height:18px!important;
    display:block!important;
  }

  .greeneco-managed-modal-backdrop.items-group-invoice-dialog{
    position:fixed!important;
    inset:0!important;
    z-index:12500!important;
    display:grid!important;
    place-items:center!important;
    padding:18px!important;
    margin:0!important;
    background:#071829b8!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  .greeneco-managed-modal-backdrop.items-group-invoice-dialog
  > .greeneco-managed-modal-card.items-group-invoice-dialog-card{
    position:relative!important;
    inset:auto!important;
    width:min(820px,100%)!important;
    min-width:0!important;
    max-width:820px!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100vh - 36px)!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    border:1px solid #68777f!important;
    border-radius:0!important;
    background:#fff!important;
    box-shadow:0 18px 55px #0006!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
  }

  .items-group-invoice-dialog-card
  > .modal-header{
    flex:0 0 auto!important;
    min-height:47px!important;
    margin:0!important;
    padding:7px 12px!important;
    display:flex!important;
    align-items:center!important;
    gap:6px!important;
    border:0!important;
    border-bottom:1px solid #a8b1b6!important;
    border-radius:0!important;
    background:#f4f8fa!important;
    box-sizing:border-box!important;
  }

  .items-group-invoice-dialog-card
  > .modal-header > h2{
    flex:1 1 auto!important;
    margin:0!important;
    padding:0!important;
    text-align:center!important;
    font-size:19px!important;
    font-weight:900!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  .items-group-invoice-dialog-card
  > .modal-header
  > .modal-taskbar-minimize,
  .items-group-invoice-dialog-card
  > .modal-header
  > .modal-size-controls{
    display:none!important;
  }

  .items-group-invoice-dialog-card
  > .modal-header
  > .icon-button{
    flex:0 0 32px!important;
    width:32px!important;
    min-width:32px!important;
    max-width:32px!important;
    height:32px!important;
    min-height:32px!important;
    max-height:32px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#d91920!important;
    box-shadow:none!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
  }

  .items-group-invoice-dialog-card
  > .modal-header
  > .icon-button svg{
    width:22px!important;
    height:22px!important;
  }

  .items-group-invoice-dialog-card
  > .modal-body{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:13px!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
    background:#fff!important;
    box-sizing:border-box!important;
  }

  .items-group-invoice-dialog-card
  .entity-form{
    margin:0!important;
    padding:0!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    margin:0!important;
    padding:0!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column > label{
    display:grid!important;
    grid-template-columns:120px minmax(0,1fr)!important;
    align-items:center!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    font-weight:900!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column > label > span{
    min-width:0!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column input,
  .items-group-invoice-dialog-card
  .form-grid.single-column textarea{
    width:100%!important;
    min-width:0!important;
    border:1px solid #6e858f!important;
    border-radius:0!important;
    background:#d7eff0!important;
    padding:4px 8px!important;
    box-sizing:border-box!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column input{
    height:34px!important;
    min-height:34px!important;
  }

  .items-group-invoice-dialog-card
  .form-grid.single-column textarea{
    min-height:86px!important;
    resize:vertical!important;
  }

  .items-group-invoice-dialog-card
  .modal-actions{
    display:flex!important;
    justify-content:flex-end!important;
    align-items:center!important;
    flex-wrap:nowrap!important;
    gap:7px!important;
    margin:12px 0 0!important;
    padding:10px 0 0!important;
    border-top:1px solid #ccd4d8!important;
  }

  .items-group-invoice-dialog-card
  .modal-actions > button{
    min-width:120px!important;
    height:35px!important;
    min-height:35px!important;
    border-radius:0!important;
    box-shadow:none!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
  }

  .items-group-invoice-dialog-card.items-group-manage-dialog-card{
    width:min(900px,100%)!important;
    max-width:900px!important;
  }

  .items-group-manage-dialog-card
  .toolbar{
    min-height:47px!important;
    margin:0 0 9px!important;
    padding:6px!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:6px!important;
    border:1px solid #b9c8d1!important;
    border-radius:0!important;
    background:#edf6fb!important;
  }

  .items-group-manage-dialog-card
  .toolbar > .toolbar-actions{
    flex:1 1 auto!important;
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:6px!important;
  }

  .items-group-manage-dialog-card
  .toolbar > .toolbar-actions > button{
    width:100%!important;
    min-width:0!important;
    height:35px!important;
    margin:0!important;
    padding:4px 7px!important;
    border-radius:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    white-space:nowrap!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
  }

  .items-group-manage-dialog-card
  .toolbar > .toolbar-extra{
    flex:0 0 110px!important;
  }

  .items-group-manage-dialog-card
  .toolbar > .toolbar-extra > button{
    width:100%!important;
    min-width:0!important;
    height:35px!important;
    margin:0!important;
    padding:4px 7px!important;
    border-radius:0!important;
    box-shadow:none!important;
    transform:none!important;
    translate:none!important;
    scale:none!important;
  }

  .items-group-manage-dialog-card
  .table-panel{
    margin:0!important;
    border:1px solid #9ca6ab!important;
    border-radius:0!important;
    overflow:hidden!important;
  }

  .items-group-manage-dialog-card
  .table-controls{
    padding:7px!important;
    gap:6px!important;
    border-bottom:1px solid #b9c8d1!important;
    background:#f7fafb!important;
  }

  .items-group-manage-dialog-card
  .table-scroll{
    max-height:380px!important;
    overflow:auto!important;
  }

  .items-group-manage-dialog-card
  .data-table thead th{
    position:sticky!important;
    top:0!important;
    z-index:4!important;
    background:#687279!important;
    color:#fff!important;
  }

  .items-group-manage-dialog-card
  .data-table th,
  .items-group-manage-dialog-card
  .data-table td{
    border-color:#9ca6ab!important;
    padding:6px 7px!important;
  }

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

  .items-group-invoice-dialog-card
  > .modal-header
  > .icon-button:hover,
  .items-group-invoice-dialog-card
  > .modal-header
  > .icon-button:focus-visible,
  .items-group-invoice-dialog-card
  > .modal-header
  > .icon-button:active{
    transform:none!important;
    translate:none!important;
    scale:none!important;
    box-shadow:none!important;
  }
}

@media screen and (max-width:760px){
  .items-group-invoice-dialog-card
  .form-grid.single-column > label{
    grid-template-columns:1fr!important;
  }

  .items-group-manage-dialog-card
  .toolbar{
    min-width:720px!important;
    overflow-x:auto!important;
  }
}

/* ===== v535 CENTER OVERRIDE START ===== */
/*
 Exact centering override.
 The generic application rule uses:
 .modal-backdrop.modal-fixed-under-ribbon.greeneco-managed-modal-backdrop
 { place-items:start center; align-content:start; top:... }

 Match it with an additional screen-specific class so these three
 item-group dialogs are centered exactly like the invoice item popup.
*/
@media screen {

  .modal-backdrop.modal-fixed-under-ribbon.greeneco-managed-modal-backdrop.items-group-invoice-dialog{
    position:fixed!important;

    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    inset:0!important;

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

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

    display:grid!important;
    place-items:center!important;
    align-items:center!important;
    justify-items:center!important;
    align-content:center!important;
    justify-content:center!important;

    overflow:hidden!important;

    background:#071829b8!important;
    box-sizing:border-box!important;
  }

  .modal-backdrop.modal-fixed-under-ribbon.greeneco-managed-modal-backdrop.items-group-invoice-dialog
  > .greeneco-managed-modal-card.items-group-invoice-dialog-card{
    position:relative!important;

    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    inset:auto!important;

    align-self:center!important;
    justify-self:center!important;

    margin:0!important;

    width:min(820px,calc(100vw - 36px))!important;
    max-width:820px!important;

    height:auto!important;
    min-height:0!important;
    max-height:calc(100vh - 36px)!important;

    overflow:hidden!important;

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

  .modal-backdrop.modal-fixed-under-ribbon.greeneco-managed-modal-backdrop.items-group-invoice-dialog
  > .greeneco-managed-modal-card.items-group-manage-dialog-card{
    width:min(900px,calc(100vw - 36px))!important;
    max-width:900px!important;
  }
}
/* ===== v535 CENTER OVERRIDE END ===== */