/* ============================================================
   CART PAGE — layout unique to /cart/. Uses .cart-item styles
   from theme.css but in a larger, full-page list layout.
   ============================================================ */

.cart-page-grid{display:grid; grid-template-columns:1.6fr 1fr; gap:28px; align-items:start;}

.cart-list-card{
  background:var(--card); border:1.5px solid var(--border); border-radius:var(--radius-lg);
  overflow:hidden;
}
.cart-list-head{padding:22px 26px; border-bottom:1px solid var(--border); display:flex; align-items:center; justify-content:space-between;}
.cart-list-head h2{font-size:17px; font-weight:800;}
.clear-link{font-size:12.5px; color:var(--gray); font-weight:700; cursor:pointer;}
.clear-link:hover{color:var(--pink);}

.cart-row{
  display:flex; align-items:center; gap:16px;
  padding:20px 26px; border-bottom:1px solid var(--border);
}
.cart-row:last-child{border-bottom:none;}
.cart-row .cr-thumb{
  width:64px; height:64px; border-radius:14px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:28px;
}
.cart-row .cr-info{flex:1;}
.cart-row .cr-name{font-weight:800; font-size:15px; margin-bottom:6px;}
.cart-row .cr-unit{font-size:12.5px; color:var(--gray);}
.cart-row .cr-qty{display:flex; align-items:center; gap:10px;}
.cart-row .cr-qty button{
  width:30px; height:30px; border-radius:8px; background:#0d0f16; border:1px solid var(--border);
  color:var(--white); cursor:pointer; font-size:15px; display:flex; align-items:center; justify-content:center;
}
.cart-row .cr-qty span{font-weight:800; font-size:14px; min-width:18px; text-align:center;}
.cart-row .cr-price{font-weight:900; font-size:16px; color:var(--cyan); min-width:90px; text-align:left;}
.cart-row .cr-remove{
  width:34px; height:34px; border-radius:9px; background:rgba(255,45,120,0.08);
  border:1px solid rgba(255,45,120,0.3); color:var(--pink); cursor:pointer; font-size:14px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}

.empty-cart{
  text-align:center; padding:80px 30px; color:var(--gray);
}
.empty-cart .ec-icon{font-size:54px; margin-bottom:18px;}
.empty-cart h3{font-size:18px; color:var(--white); margin-bottom:8px;}
.empty-cart p{font-size:13.5px; margin-bottom:26px;}

.summary-card{
  background:var(--card); border:1.5px solid var(--border); border-radius:var(--radius-lg);
  padding:26px; position:sticky; top:98px;
}
.summary-card h3{font-size:16px; font-weight:800; margin-bottom:18px;}
.summary-line{display:flex; justify-content:space-between; font-size:13.5px; color:var(--gray); font-weight:700; padding:10px 0; border-bottom:1px dashed var(--border);}
.summary-line span:last-child{color:var(--white); font-weight:800;}
.summary-total{display:flex; justify-content:space-between; align-items:center; margin:18px 0;}
.summary-total .lbl{font-weight:800; font-size:15px;}
.summary-total .val{font-weight:900; font-size:28px; color:var(--cyan);}

.notes-field{margin-bottom:16px;}
.notes-field label{display:block; font-weight:800; font-size:13px; margin-bottom:8px;}
.notes-field textarea{
  width:100%; min-height:80px; resize:vertical;
  background:#0d0f16; border:1.5px solid var(--border); border-radius:10px;
  padding:12px 14px; color:var(--white); font-family:'Almarai',sans-serif; font-size:13.5px; outline:none;
}
.notes-field textarea:focus{border-color:var(--cyan);}
.notes-field .hint{font-size:11.5px; color:var(--gray); margin-top:6px;}

@media(max-width:900px){
  .cart-page-grid{grid-template-columns:1fr;}
  .cart-row{flex-wrap:wrap;}
  .cart-row .cr-price{margin-right:auto;}
}

.cart-row .cr-lock-hint{font-size:12px; color:var(--gray); margin-top:6px;}
.cart-row .cr-lock-hint a{color:var(--cyan); text-decoration:none; font-weight:700;}
.cart-row .cr-lock-hint a:hover{text-decoration:underline;}
.cart-row .cr-users{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin-top:8px;}
.cart-row .cr-users-label{font-size:12px; color:var(--gray); font-weight:700;}
.cart-row .cr-user-chip{display:inline-block; padding:3px 10px; border-radius:999px; background:rgba(0,200,255,.08); border:1px solid rgba(0,200,255,.25); color:var(--cyan); font-size:12px; font-weight:700; direction:ltr;}
.cr-qty button:disabled{opacity:.35; cursor:not-allowed;}
.qty-ctrl button:disabled{opacity:.35; cursor:not-allowed;}