/* ShahrVam v672 — container-responsive manager/supervisor contact table.
   Root fix: responsive mode is decided by the REAL workbench width, not the browser viewport.
   This keeps square/4:3 monitors and constrained desktop layouts in the two-line mode even when
   the outer browser width or sidebar makes viewport breakpoints misleading. Mobile remains separate. */

/* Semantic colour is intentionally desktop/tablet-only. Mobile keeps its own card system. */
@media (min-width:821px){
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="answered"]{background:#edf9f1!important;border-color:#bddfc9!important;color:#17613a!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="no_answer"]{background:#f4f6f8!important;border-color:#d5dde5!important;color:#526679!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="busy"]{background:#fff7e8!important;border-color:#ead49d!important;color:#875a12!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="unreachable"]{background:#f3f1fb!important;border-color:#d9d2ee!important;color:#65529a!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="followup"]{background:#eef6ff!important;border-color:#bfd8ef!important;color:#185c92!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current="no_interest"]{background:#fff1f2!important;border-color:#efc9ce!important;color:#9b3944!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select:not([data-current]),
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select[data-current=""]{background:#f8fbfd!important;border-color:#cfdce7!important;color:#38546d!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select:hover{filter:brightness(.99);border-color:#8fb4d1!important}

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm668-business-state .badge{box-shadow:0 0 0 1px rgba(22,54,91,.035)}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tr.sm668-case-inbox{--v672-accent:#4e94c9}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tr.sm668-case-payment_pending{--v672-accent:#8a74c4}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tr.sm668-case-partial_payment{--v672-accent:#d7a13e}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tr.sm668-case-registered{--v672-accent:#61a779}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tr.is-due{--v672-accent:#df7b3f}
}

/* Establish an inline-size container on the real sales workbench.
   Container queries below react to the actual usable panel width rather than window.innerWidth. */
@media (min-width:821px){
  body[data-page="sales-operations"] #page-content .sm564-ops-queue{
    container-type:inline-size;
    container-name:sm672-contact-workbench;
  }
}

/* Square / constrained desktop monitors: one record, two horizontal information lines.
   1540px is intentionally based on workbench width, not viewport width. */
@media (min-width:821px){
@container sm672-contact-workbench (max-width:1540px){
  body[data-page="sales-operations"] #page-content .sm564-queue-table-wrap{
    overflow-x:hidden!important;
    overflow-y:visible!important;
    padding:0 8px 8px!important;
    background:#f7fafc!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    table-layout:auto!important;
    border-collapse:separate!important;
    background:transparent!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead,
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody{
    display:block!important;
    width:100%!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead{
    position:sticky!important;
    top:0!important;
    z-index:4!important;
    margin:0 -8px 7px!important;
    width:calc(100% + 16px)!important;
    background:#0c365b!important;
    box-shadow:0 2px 8px rgba(12,54,91,.09)!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead tr,
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row{
    display:grid!important;
    grid-template-columns:44px minmax(150px,1.28fr) minmax(120px,.92fr) minmax(120px,.92fr) minmax(224px,1.62fr)!important;
    grid-template-rows:minmax(33px,auto) minmax(33px,auto)!important;
    width:100%!important;
    min-width:0!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead tr{
    min-height:66px!important;
    padding:0 8px!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead th{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    min-height:33px!important;
    padding:5px 7px!important;
    border:0!important;
    border-inline-end:1px solid rgba(255,255,255,.08)!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
    background:#0c365b!important;
    color:#fff!important;
    font-size:9.5px!important;
    font-weight:850!important;
    line-height:1.35!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  /* The row-number header spans both header lines and must occupy their full height. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead th:nth-child(1){
    align-self:stretch!important;
    min-height:66px!important;
    border-bottom:0!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row{
    position:relative!important;
    height:auto!important;
    min-height:96px!important;
    margin:0 0 7px!important;
    border:1px solid #dce7ef!important;
    border-radius:11px!important;
    background:linear-gradient(to bottom,var(--row-bg,#fff) 0 50%,#f9fbfd 50% 100%)!important;
    overflow:visible!important;
    isolation:isolate!important;
    box-shadow:inset -3px 0 0 var(--v672-accent,#b8c7d4),0 2px 7px rgba(30,64,92,.035)!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row:hover{
    border-color:#bfd4e3!important;
    box-shadow:inset -3px 0 0 var(--v672-accent,#91afc4),0 4px 11px rgba(30,64,92,.065)!important;
  }

  /* Keep the no-results row usable after tbody becomes block-level. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody>tr:not(.sm564-queue-row){
    display:block!important;
    width:100%!important;
    min-width:0!important;
  }
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody>tr:not(.sm564-queue-row)>td.empty{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:54px!important;
    padding:16px!important;
    text-align:center!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    min-height:47px!important;
    padding:6px 9px!important;
    border:0!important;
    border-inline-end:1px solid #edf2f6!important;
    border-bottom:1px solid #edf2f6!important;
    background:transparent!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  /* First line: row / customer / phone / expert / contact result. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(1){grid-column:1!important;grid-row:1 / span 2!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(2){grid-column:2!important;grid-row:1!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(3){grid-column:3!important;grid-row:1!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(4){grid-column:4!important;grid-row:1!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(5){grid-column:5!important;grid-row:1!important}

  /* Second line: credit / business state / handoff date / actions. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(6){grid-column:2!important;grid-row:2!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(7){grid-column:3!important;grid-row:2!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(8){grid-column:4!important;grid-row:2!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(9){grid-column:5!important;grid-row:2!important}

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(1){
    border-bottom:0!important;
    background:rgba(241,246,250,.72)!important;
  }
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(n+6){border-bottom:0!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(5),
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(9){border-inline-end:0!important}

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm564-person,
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm564-sales-expert{width:100%!important;min-width:0!important}

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-inline-contact{
    width:min(100%,285px)!important;
    min-width:0!important;
    margin-inline:auto!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm669-contact-select{
    width:100%!important;
    max-width:100%!important;
    height:34px!important;
    min-height:34px!important;
    font-size:10px!important;
  }

  /* When "تماس مجدد" opens its inline date/time editor, let row one grow instead of
     letting the editor overflow into the operations line below. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(5):has(.sm669-inline-followup:not(.hidden)){
    min-height:96px!important;
    align-items:flex-start!important;
    padding-block:7px!important;
  }

  /* Action capacity is sized for the maximum current six controls. */
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table td:nth-child(9){padding-inline:7px!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm564-queue-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:4px!important;
    flex-wrap:nowrap!important;
    white-space:nowrap!important;
    overflow:visible!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm564-queue-actions .sm148-icon-action{
    width:28px!important;
    min-width:28px!important;
    height:28px!important;
    min-height:28px!important;
    flex:0 0 28px!important;
    padding:5px!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm668-business-state{align-items:center!important;min-width:0!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm668-business-state>small{text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important}
}
}

/* Classic 4:3 / 5:4 widths: split the contact/actions area into two grid tracks.
   Contact result spans both tracks on line one; actions span both on line two.
   This preserves exactly two visual lines while providing enough width for all action icons. */
@media (min-width:821px){
@container sm672-contact-workbench (max-width:1099px){
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table thead tr,
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row{
    grid-template-columns:40px minmax(126px,1.22fr) minmax(108px,.95fr) minmax(108px,.95fr) minmax(104px,.94fr) minmax(104px,.94fr)!important;
  }

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(5){grid-column:5 / span 2!important;grid-row:1!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table :is(th,td):nth-child(9){grid-column:5 / span 2!important;grid-row:2!important}

  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td{padding-inline:7px!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table tbody tr.sm564-queue-row>td:nth-child(9){padding-inline:8px!important}
  body[data-page="sales-operations"] #page-content .sm668-supervisor-table .sm564-queue-actions{gap:4px!important}
}
}
