/* ---- source style block #ayanCrmHeaderStabilityFixV1 ---- */
/*
  AYAN CRM HEADER STABILITY FIX V1

  Goal:
  - Keep desktop CRM header stable between views.
  - Prevent permission-based tabs from moving header items.
  - Keep mobile layout untouched.
  - Do NOT change permissions or JS navigation.
*/

@media (min-width:901px){

  .ayan-main-nav{
    display:grid !important;
    grid-template-columns:
      auto
      minmax(0,1fr)
      auto
      auto !important;

    align-items:center !important;
    gap:12px !important;

    flex-wrap:nowrap !important;
    width:100% !important;
  }


  .ayan-brand{
    min-width:max-content !important;
    flex:0 0 auto !important;
  }


  .ayan-tabs{
    display:flex !important;
    align-items:center !important;

    flex-wrap:nowrap !important;

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

    overflow-x:auto !important;
    overflow-y:hidden !important;

    scrollbar-width:thin;

    padding-bottom:2px;
  }


  .ayan-tabs .ayan-tab{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }


  .ayan-theme-control{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  #ayanCrmSystemSwitchBtn{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }


  #m3UserChip{
    flex:0 0 auto !important;
    min-width:max-content !important;
    white-space:nowrap !important;
  }


  #m3UserChip .m3-user-actions{
    flex-wrap:nowrap !important;
  }

}


/*
  IMPORTANT:
  Mobile rules start at <=900px and remain controlled
  by the existing AYAN mobile layout.
*/

/* ---- source style block #socialMobileCardsProStyle ---- */
@media (max-width: 700px) {
  #socialClientsSubView .table-wrap {
    overflow-x: hidden !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }
  #socialClientsSubView table.ayan-mobile-cards {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    border: none !important;
    background: transparent !important;
  }
  #socialClientsSubView table.ayan-mobile-cards thead {
    display: none !important;
  }
  #socialClientsSubView table.ayan-mobile-cards tbody {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
  }
  #socialClientsSubView table.ayan-mobile-cards tr {
    display: block !important;
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-inline-start: 5px solid #2563eb !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
    padding: 6px 0 !important;
    overflow: hidden !important;
  }
  body:not(.theme-light) #socialClientsSubView table.ayan-mobile-cards tr {
    border-color: #334155 !important;
    border-inline-start-color: #3b82f6 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
  }
  #socialClientsSubView table.ayan-mobile-cards td {
    display: grid !important;
    grid-template-columns: 110px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 8px 12px !important;
    border: none !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.7) !important;
    text-align: start !important;
    box-sizing: border-box !important;
  }
  body:not(.theme-light) #socialClientsSubView table.ayan-mobile-cards td {
    border-bottom-color: rgba(51, 65, 85, 0.5) !important;
  }
  #socialClientsSubView table.ayan-mobile-cards td:last-child {
    border-bottom: none !important;
  }
  #socialClientsSubView table.ayan-mobile-cards td::before {
    content: attr(data-label);
    font-size: 11px !important;
    font-weight: 800 !important;
    color: #64748b !important;
  }
  body:not(.theme-light) #socialClientsSubView table.ayan-mobile-cards td::before {
    color: #94a3b8 !important;
  }
  #socialClientsSubView table.ayan-mobile-cards td select,
  #socialClientsSubView table.ayan-mobile-cards td input,
  #socialClientsSubView table.ayan-mobile-cards td textarea {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    border-radius: 8px !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    box-sizing: border-box !important;
  }
}

/* ---- source style block #ayanQuotationStrictLock ---- */
  /* إخفاء الإجراء السفلي وحقول الإدارة المختصة عند وجود عرض معلق */
  .quotation-locked #opsWorkflowAction,
  .quotation-locked #opsWorkflowAction * {
    display: none !important;
  }
  .quotation-lock-banner {
    display: none;
    background: #fef3c7;
    border: 1px solid #f59e0b;
    color: #92400e;
    padding: 12px 14px;
    border-radius: 10px;
    font-weight: bold;
    font-size: 13px;
    text-align: center;
    margin-top: 14px;
  }
  .quotation-locked .quotation-lock-banner {
    display: block !important;
  }

/* ---- source style block #ayanStrictSystemSelectorFix ---- */
  #ayanSystemSelector {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-height: 100vh !important;
    background: #f1f5f9 !important; /* خلفية معتمة تمنع كشف ما تحتها تماماً */
    z-index: 999999 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-y !important;
    display: none;
  }
  
  /* قفل صفحة الخلفية تماماً عند فتح شاشة الاختيار */
  body.ayan-system-selector-active {
    overflow: hidden !important;
    height: 100vh !important;
    position: fixed !important;
    width: 100% !important;
  }

  /* 2. زر تبديل النظام على الجوال (واضح، مرئي ومناسب للمساحة) */
  @media (max-width: 768px) {
    #ayanCrmSystemSwitchBtn,
    .ops-switch-btn {
      display: inline-flex !important;
      align-items: center !important;
      justify-content: center !important;
      padding: 6px 10px !important;
      font-size: 11px !important;
      font-weight: 700 !important;
      border-radius: 8px !important;
      background: #0284c7 !important;
      color: #ffffff !important;
      border: none !important;
      box-shadow: 0 2px 5px rgba(2,132,199,0.3) !important;
      white-space: nowrap !important;
      width: auto !important;
      height: 32px !important;
      min-width: unset !important;
      text-indent: 0 !important;
      visibility: visible !important;
      opacity: 1 !important;
    }

    #ayanCrmSystemSwitchBtn::before,
    .ops-switch-btn::before {
      display: none !important;
    }
  }