/* =========================================================
   ZEZO — WAREHOUSE CREDIT SALE
   PRODUCT CARD UI
   ========================================================= */

#wcRows{
  display:flex !important;
  flex-direction:column !important;
  gap:12px !important;
  width:100% !important;
  margin-top:14px !important;
}


/* إلغاء شكل الجدول القديم */
#wcRows table,
#wcRows tbody{
  width:100% !important;
}


/* كارت المنتج */
.wc-product-card{

  width:100%;
  box-sizing:border-box;

  background:#fff;

  border:1px solid #dce5f0;
  border-radius:15px;

  padding:13px;

  box-shadow:0 2px 8px rgba(20,50,90,.05);

  direction:rtl;
}


/* الجزء الرئيسي */
.wc-product-main{

  display:flex;
  align-items:center;
  gap:10px;

  width:100%;
}


/* رقم الصنف */
.wc-product-number{

  width:36px;
  height:36px;

  flex:0 0 36px;

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

  border-radius:10px;

  background:#edf5ff;
  color:#1769c2;

  font-size:17px;
  font-weight:950;
}


/* خانة المنتج */
.wc-product-field{

  flex:1;
  min-width:0;
}


.wc-product-field label{

  display:block;

  margin-bottom:5px;

  font-size:12px;
  font-weight:900;

  color:#53657d;
}


.wc-product-field select{

  width:100% !important;
  height:48px !important;

  box-sizing:border-box;

  padding:0 15px !important;

  border:1px solid #ccd8e6 !important;
  border-radius:11px !important;

  background:#fff !important;

  color:#152238 !important;

  font-size:17px !important;
  font-weight:850 !important;

  text-align:right !important;
}


.wc-product-field select:focus{

  outline:none !important;

  border-color:#1683ff !important;

  box-shadow:0 0 0 3px rgba(22,131,255,.12) !important;
}


/* زر الحذف */
.wc-delete-product{

  width:45px;
  height:45px;

  flex:0 0 45px;

  border:0;
  border-radius:11px;

  background:#fff0f0;
  color:#d62828;

  cursor:pointer;

  font-size:18px;
  font-weight:900;
}


.wc-delete-product:hover{
  background:#ffe0e0;
}


/* القيم */
.wc-product-values{

  display:grid;

  grid-template-columns:
    1fr
    1fr
    1fr
    1fr
    1.15fr;

  gap:10px;

  margin-top:11px;
}


/* صندوق الرقم */
.wc-value-box{

  min-width:0;

  padding:8px 9px 9px;

  background:#f8fafc;

  border:1px solid #e2e9f1;

  border-radius:11px;
}


.wc-value-box span{

  display:block;

  margin-bottom:5px;

  font-size:12px;
  font-weight:850;

  color:#5d6d82;

  text-align:center;
}


/* inputs */
.wc-value-box input{

  width:100% !important;
  height:42px !important;

  box-sizing:border-box;

  border:1px solid #ccd8e6 !important;
  border-radius:9px !important;

  background:#fff !important;

  color:#111827 !important;

  font-size:19px !important;
  font-weight:950 !important;

  text-align:center !important;
}


/* السعر بعد الخصم */
.wc-final-price{

  background:#f1f8ff;

  border-color:#d4e7fb;
}


.wc-final-price strong{

  display:flex;

  align-items:center;
  justify-content:center;

  height:42px;

  color:#175a9d;

  font-size:20px;
  font-weight:950;
}


/* إجمالي الصنف */
.wc-total-price{

  background:#effaf4;

  border-color:#d2efdd;
}


.wc-total-price strong{

  display:flex;

  align-items:center;
  justify-content:center;

  height:42px;

  color:#087443;

  font-size:21px;
  font-weight:950;
}


/* الخصم */
.wc-discount-box input{
  color:#c62828 !important;
}


/* =========================================================
   SUMMARY
   ========================================================= */

.wc-summary-grid{

  display:grid;

  grid-template-columns:
    1fr
    1fr
    1.25fr;

  gap:12px;

  width:100%;
}


.wc-summary-item{

  min-height:82px;

  display:flex;

  flex-direction:column;

  justify-content:center;

  align-items:center;

  gap:6px;

  border-radius:14px;

  background:#f5f8fc;

  border:1px solid #dfe7f0;
}


.wc-summary-item span{

  font-size:13px;

  font-weight:850;

  color:#5a6c83;
}


.wc-summary-item strong{

  font-size:24px;

  font-weight:950;

  color:#173b6d;
}


/* الخصم */
.wc-summary-discount{

  background:#fff7f7;
  border-color:#f2dada;
}


.wc-summary-discount strong{
  color:#d62828;
}


/* المديونية */
.wc-summary-total{

  background:#effaf4;
  border-color:#cfeedd;
}


.wc-summary-total span{
  color:#147044;
}


.wc-summary-total strong{

  color:#087443;

  font-size:27px;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media(max-width:800px){

  .wc-product-values{

    grid-template-columns:
      1fr
      1fr;

  }

  .wc-total-price{
    grid-column:span 2;
  }

  .wc-summary-grid{
    grid-template-columns:1fr;
  }

}


@media(max-width:520px){

  .wc-product-main{
    align-items:flex-start;
  }

  .wc-product-number{
    display:none;
  }

  .wc-product-field select{
    font-size:15px !important;
  }

  .wc-product-values{
    grid-template-columns:1fr 1fr;
    gap:8px;
  }

  .wc-value-box input{
    font-size:17px !important;
  }

}