/* Shared order cards for the investor and administrator lists. */
:is(#ordersList, #adminPending) .transactions{gap:8px}
:is(#ordersList, #adminPending) .order-card{
  --order-accent:#8d9691;
  --order-border:#c9cecb;
  --order-tint:#f8f9f8;
  padding:0;
  overflow:hidden;
  min-width:0;
  background:#fff;
  border:2px solid var(--order-border);
  border-radius:12px;
  box-shadow:0 2px 8px rgba(24,59,43,.035);
  color:#203d30;
  direction:rtl;
  text-align:right;
  container-type:inline-size;
}
:is(#ordersList, #adminPending) .order-card-state-pending{--order-accent:#b58a19;--order-border:#dbb344;--order-tint:#fff2cc}
:is(#ordersList, #adminPending) .order-card-state-buy{--order-accent:#16834a;--order-border:#4ca675;--order-tint:#e0f3e7}
:is(#ordersList, #adminPending) .order-card-state-sell{--order-accent:#c34f59;--order-border:#ce737c;--order-tint:#fbe3e6}
:is(#ordersList, #adminPending) .order-card-state-rejected{--order-accent:#828985;--order-border:#a0aaa4;--order-tint:#e8ece9}
:is(#ordersList, #adminPending) .order-card.automatic-order-row{box-shadow:0 2px 8px rgba(24,59,43,.035)}
:is(#ordersList, #adminPending) .order-card .order-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:6px 12px;
  padding:9px 12px;
  border-inline-start:0;
  background:var(--order-tint);
}
:is(#ordersList, #adminPending) .order-card-identity{min-width:0;flex:1 1 170px}
:is(#ordersList, #adminPending) .order-card-identity>b{display:block;font-size:13px;line-height:1.6;font-weight:800;overflow-wrap:anywhere;color:#203d30}
:is(#ordersList, #adminPending) .order-card-meta{display:flex;align-items:center;flex-wrap:wrap;gap:3px 8px;margin-top:1px}
:is(#ordersList, #adminPending) .order-card-meta>span{font-size:10px;line-height:1.6;color:#7a8980;white-space:normal;overflow-wrap:anywhere}
:is(#ordersList, #adminPending) .order-card-reference{border-inline-start:1px solid #dde6e0;padding-inline-start:8px;font-variant-numeric:tabular-nums}
:is(#ordersList, #adminPending) .order-card-badges{display:flex;align-items:center;flex-wrap:wrap;gap:5px;min-width:0}
:is(#ordersList, #adminPending) .order-card .order-card-badges>span{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-width:0;
  padding:3px 7px;
  border-radius:6px;
  font-size:11px;
  font-weight:700;
  line-height:1.8;
  white-space:normal;
}
:is(#ordersList, #adminPending) .order-card .trade-type.buy{background:#eaf7ef;color:#16834a;border:1px solid #d5ecdf}
:is(#ordersList, #adminPending) .order-card .trade-type.sell{background:#fff0f1;color:#bd4752;border:1px solid #f6d9dd}
:is(#ordersList, #adminPending) .order-card .trade-asset{background:#f4f7f5;border:1px solid #e2e9e4;grid-column:auto;justify-self:auto}
:is(#ordersList, #adminPending) .order-card .trade-asset small{font-size:10px!important;color:#7a8980!important}
:is(#ordersList, #adminPending) .order-card .trade-asset b{font-size:11px;color:#365443}
:is(#ordersList, #adminPending) .order-card .order-status-badge{background:#f2f5f3;color:#67776d;border:1px solid #e2e9e4}
:is(#ordersList, #adminPending) .order-card .order-status-badge.pending{background:#fff8e7;color:#947022;border-color:#f1e4bd}
:is(#ordersList, #adminPending) .order-card .order-status-badge.ok{background:#eaf7ef;color:#16834a;border-color:#d5ecdf}
:is(#ordersList, #adminPending) .order-card .order-status-badge.bad{background:#fff0f1;color:#bd4752;border-color:#f6d9dd}
:is(#ordersList, #adminPending) .order-card .order-card-values{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin:0;
  padding:9px 12px;
  border-top:1px solid #edf2ee;
}
:is(#ordersList, #adminPending) .order-card .order-card-values.has-net{grid-template-columns:repeat(4,minmax(0,1fr))}
:is(#ordersList, #adminPending) .order-card .order-card-values>span{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:0;
  padding:0 10px;
  border:0;
  border-inline-start:1px solid #e9efeb;
  border-radius:0;
  background:transparent;
}
:is(#ordersList, #adminPending) .order-card .order-card-values>span:first-child{padding-inline-start:0;border-inline-start:0}
:is(#ordersList, #adminPending) .order-card .order-card-values>span:last-child{padding-inline-end:0}
:is(#ordersList, #adminPending) .order-card .order-card-values small{font-size:10px;color:#7a8980;line-height:1.6}
:is(#ordersList, #adminPending) .order-card .order-card-values b{font-size:13px;font-weight:750;color:#203d30;line-height:1.7;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
:is(#ordersList, #adminPending) .order-card .order-card-values em{font-style:normal;font-size:10px;font-weight:400;color:#7a8980;white-space:nowrap}
:is(#ordersList, #adminPending) .order-card .order-card-total b{color:#16834a}
:is(#ordersList, #adminPending) .order-card .order-card-net b{color:#a54e57}
:is(#ordersList, #adminPending) .order-card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:6px 8px;
  padding:7px 12px;
  border-top:1px solid #edf2ee;
  background:#fafcfb;
}
:is(#ordersList, #adminPending) .order-card-footer-note{font-size:11px;color:#7a8980}
:is(#ordersList, #adminPending) .order-card .order-source-badge{font-size:9px;padding:3px 7px;border-radius:6px;line-height:1.8;white-space:normal}
:is(#ordersList, #adminPending) .order-card .admin-order-actions{flex:1 1 auto;min-width:0}
:is(#ordersList, #adminPending) .order-card .order-card-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-direction:row!important;
  flex-wrap:wrap!important;
  gap:6px 10px!important;
  white-space:normal!important;
  padding:0;
  margin:0;
}
:is(#ordersList, #adminPending) .order-card-tools,
:is(#ordersList, #adminPending) .order-card-decisions{display:flex;flex-wrap:wrap;align-items:center;gap:5px;min-width:0}
:is(#ordersList, #adminPending) .order-card-tools:empty{display:none}
:is(#ordersList, #adminPending) .order-card .order-card-actions button{
  display:inline-flex!important;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:30px;
  width:auto!important;
  max-width:100%;
  margin:0;
  padding:5px 9px;
  border-radius:7px;
  font:inherit;
  font-size:10px;
  font-weight:650;
  line-height:1.7;
  white-space:normal;
  cursor:pointer;
  transition:background .15s,border-color .15s,box-shadow .15s;
}
:is(#ordersList, #adminPending) .order-card .order-card-actions .ghost{background:#fff;color:#4e6558;border:1px solid #dce6df}
:is(#ordersList, #adminPending) .order-card .order-card-actions .ghost:hover{background:#f0f7f3;border-color:#b9d7c5}
:is(#ordersList, #adminPending) .order-card .order-card-actions .approve{background:#16834a;color:#fff;border:1px solid #16834a;padding-inline:14px}
:is(#ordersList, #adminPending) .order-card .order-card-actions .approve:hover{background:#106d3c}
:is(#ordersList, #adminPending) .order-card .order-card-actions .reject{background:#fff;color:#bc4f59;border:1px solid #edcdd1;padding-inline:14px}
:is(#ordersList, #adminPending) .order-card .order-card-actions .reject:hover{background:#fff0f1}
:is(#ordersList, #adminPending) .order-card .order-card-actions button:focus-visible{outline:2px solid #16834a;outline-offset:3px}
:is(#ordersList, #adminPending) .order-card .order-card-actions button:disabled{opacity:.5;cursor:wait}
:is(#ordersList, #adminPending) .order-card-rejected{border-color:var(--order-border)}
@container(max-width:700px){
  :is(#ordersList, #adminPending) .order-card .order-card-values.has-net{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 0}
  :is(#ordersList, #adminPending) .order-card .order-card-values.has-net>span:nth-child(odd){border-inline-start:0;padding-inline-start:0}
}
@media(max-width:900px){
  :is(#ordersList, #adminPending) .order-card .order-card-values.has-net{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 0}
  :is(#ordersList, #adminPending) .order-card .order-card-values.has-net>span:nth-child(odd){border-inline-start:0;padding-inline-start:0}
}
@media(max-width:600px){
  :is(#ordersList, #adminPending) .transactions{gap:8px}
  :is(#ordersList, #adminPending) .order-card{border-radius:11px}
  :is(#ordersList, #adminPending) .order-card .order-card-header{padding:8px 10px;gap:5px}
  :is(#ordersList, #adminPending) .order-card-identity{flex-basis:100%}
  :is(#ordersList, #adminPending) .order-card-identity>b{font-size:12px}
  :is(#ordersList, #adminPending) .order-card-meta>span{font-size:9px}
  :is(#ordersList, #adminPending) .order-card .order-card-badges>span{font-size:9px;padding:2px 6px}
  :is(#ordersList, #adminPending) .order-card .order-card-values,
  :is(#ordersList, #adminPending) .order-card .order-card-values.has-net{grid-template-columns:repeat(2,minmax(0,1fr));padding:9px 10px;gap:7px 0}
  :is(#ordersList, #adminPending) .order-card .order-card-values>span{padding:0 9px}
  :is(#ordersList, #adminPending) .order-card .order-card-values>span:nth-child(odd){padding-inline-start:0;border-inline-start:0}
  :is(#ordersList, #adminPending) .order-card .order-card-values>span:nth-child(even){padding-inline-end:0}
  :is(#ordersList, #adminPending) .order-card .order-card-values small{font-size:9px}
  :is(#ordersList, #adminPending) .order-card .order-card-values b{font-size:12px}
  :is(#ordersList, #adminPending) .order-card-footer{padding:6px 10px;gap:5px}
  :is(#ordersList, #adminPending) .order-card .admin-order-actions{flex-basis:100%}
  :is(#ordersList, #adminPending) .order-card .order-card-actions{justify-content:flex-start!important;gap:5px!important}
  :is(#ordersList, #adminPending) .order-card-tools{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}
  :is(#ordersList, #adminPending) .order-card-decisions{display:grid;grid-template-columns:1fr 1fr;width:100%;padding-top:5px;border-top:1px solid #e6ede8}
  :is(#ordersList, #adminPending) .order-card .order-card-actions button{min-height:32px;font-size:9px;padding:5px 6px}
}

:is(#ordersList, #adminPending) .order-card-state-sell .order-status-badge.ok{color:#b54c56;background:#fff0f1;border-color:#efced2}
:is(#ordersList, #adminPending) .order-card-state-rejected .order-status-badge.bad{color:#747d77;background:#eef0ee;border-color:#d9dedb}
