/* admin/css/orders.css — Senarai pesanan (#/pesanan). Awalan kelas: .ord-
   Telefon (≤ 900 px): kad EA.ui.orderCard. > 900 px: jadual. Sasaran sentuh ≥ 44 px. */

.ord-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.55rem 1.25rem;margin-bottom:.85rem}
.ord-top h1{flex:1 1 auto}
.ord-tools{display:flex;gap:.5rem;flex:1 1 100%;min-width:0}
@media (min-width:901px){.ord-top h1{flex:0 0 auto}.ord-tools{flex:0 1 36rem}}
.ord{display:flex;flex-direction:column}
.ord .btn{min-height:2.75rem}

/* ---------- carian & tapis ---------- */
.ord-search{position:relative;flex:1 1 auto;min-width:0}
.ord-search__input{min-height:2.75rem;padding-left:2.6rem;padding-right:2.75rem}
.ord-search__ico{position:absolute;left:.85rem;top:50%;width:1.15rem;height:1.15rem;margin-top:-.575rem;color:var(--muted);pointer-events:none}
.ord-search__clear{position:absolute;top:0;right:0;bottom:0;width:2.75rem;display:grid;place-items:center;border:0;border-radius:var(--r-md);background:transparent;color:var(--muted);cursor:pointer}
.ord-search__clear:hover{color:var(--plum-800);background:var(--lilac-100)}
.ord-search__input::-webkit-search-cancel-button,.ord-search__input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}
.ord-filterbtn{position:relative;flex:none;gap:.4rem}
.ord-filterbtn__n{position:absolute;top:-.4rem;right:-.35rem;box-shadow:0 0 0 2px var(--bg)}                /* lencana bertindih: lebar butang (dan ruang carian) tidak berubah apabila penapis dikenakan */

/* ---------- tab ---------- */
.ord-tabs{position:relative;margin-bottom:.45rem}
.ord-tabs a{padding:.6rem .8rem}
.ord-tabs .count.ord-count--alert{color:var(--orange);font-weight:700}
@media (min-width:901px){.ord-tabs{flex-wrap:wrap;overflow:visible}}          /* desktop: semua tab kelihatan (tiada skrol mendatar) */
@media (max-width:900px){
  .ord-tabs{margin-left:calc(-1 * clamp(1rem,3vw,2rem));margin-right:calc(-1 * clamp(1rem,3vw,2rem));padding-left:clamp(.5rem,2vw,1.5rem);padding-right:clamp(1rem,3vw,2rem)}
}

/* ---------- ringkasan, nota, cip penapis ---------- */
.ord-hint{margin:.1rem 0 .4rem;max-width:62ch;font-size:.8125rem;color:var(--muted)}
.ord-meta{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:2.75rem;margin-bottom:.15rem}
.ord-meta__text{flex:1 1 auto;min-width:0;font-size:.9rem;font-weight:600;color:var(--ink-soft)}
.ord-meta__acts{display:flex;align-items:center;gap:.25rem;flex:none}
.ord-iconbtn{width:2.75rem;padding:0}
.ord-fchips{display:flex;flex-wrap:wrap;gap:0 .1rem;margin:0 0 .3rem}
.ord-fchip{min-height:2.75rem;padding:.25rem .1rem;border:0;background:transparent;cursor:pointer;font:inherit}
.ord-fchip__in{display:inline-flex;align-items:center;gap:.3rem;padding:.3rem .5rem .3rem .75rem;border:1px solid var(--lilac-300);border-radius:999px;background:var(--lilac-100);color:var(--plum-800);font-size:.8125rem;font-weight:600;line-height:1.4}
.ord-fchip__in .ico{width:.9rem;height:.9rem}
.ord-fchip:hover .ord-fchip__in{background:var(--lilac-200)}
.ord-fchip:focus-visible{outline:0}
.ord-fchip:focus-visible .ord-fchip__in{outline:3px solid var(--focus);outline-offset:2px}
.ord-fchip--clear .ord-fchip__in{padding-left:.5rem;border-color:transparent;background:transparent;text-decoration:underline}
.ord-note{margin:0 0 .7rem}

/* ---------- senarai ---------- */
.ord-body{min-height:8rem;overflow-anchor:none}                    /* kedudukan skrol dijaga oleh view-orders.js */
.ord-cards{display:flex;flex-direction:column;gap:.6rem}
.ord-card.is-new{border-color:var(--plum-500);animation:ord-new 2.4s ease-out}
.ord-card.is-blocked{background:var(--lilac-50)}
.ord-card input[type="checkbox"]{accent-color:var(--plum-700)}
@keyframes ord-new{from{background:var(--lilac-200)}to{background:var(--card)}}
.ord-xline{font-size:.78rem;color:var(--muted)}
.ord-xline--warn{color:var(--warn);font-weight:600}
.ord-xline--ok{color:var(--ok)}
.ord-late{color:var(--warn);font-weight:600}
.ord-why{display:block;font-size:.78rem;font-weight:600;color:var(--warn)}
.ord-cell .ord-why{margin-top:.3rem}
.ord-err p{margin:0 0 .65rem}
.ord-empty{background:var(--card);border:1px dashed var(--line-strong);border-radius:var(--r-lg)}
.ord-empty__ico{width:2.2rem;height:2.2rem;color:var(--plum-500)}
.ord-empty .btn{margin-top:.5rem}

/* rangka muat */
.ord-skeleton{display:flex;flex-direction:column;gap:.6rem}
.ord-skel{display:flex;flex-direction:column;gap:.55rem;min-height:7.2rem;padding:.95rem .9rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.ord-skel__a{width:55%;height:1.1rem}
.ord-skel__b{width:35%;height:.8rem}
.ord-skel__c{width:78%;height:.9rem}
@media (min-width:901px){
  .ord-skeleton{gap:0;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card);box-shadow:var(--shadow-sm)}
  .ord-skel{min-height:4.1rem;border:0;border-bottom:1px solid var(--line);border-radius:0}
}

/* ---------- jadual (> 900 px) ---------- */
.ord-tablecard{overflow:hidden}
.ord-table th,.ord-table td{padding-left:.6rem;padding-right:.6rem}
.ord-table td{padding-top:.75rem;padding-bottom:.75rem;vertical-align:top}
.ord-table th:first-child,.ord-table td:first-child{padding-left:1rem}
.ord-table th:last-child,.ord-table td:last-child{padding-right:1rem}
.ord-table td.check-col,.ord-table th.check-col{width:2.75rem;padding:0 0 0 .5rem}
.ord-row{cursor:pointer}
.ord-row:focus-within{background:var(--lilac-50)}
.ord-row.is-selected{background:var(--lilac-100)}
.ord-row.is-blocked{cursor:default}
.ord-row.is-new td{animation:ord-new 2.4s ease-out}
.ord-cell{max-width:16rem;min-width:9rem}
.ord-name{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--ink);text-decoration:none}
.ord-name:hover{color:var(--plum-700);text-decoration:underline}
.ord-id{display:block;font-size:.78rem;color:var(--muted)}
.ord-idage{display:none;font-family:var(--font)}
.ord-flags{margin-top:.3rem}
.ord-c-time,.ord-c-pay{white-space:nowrap}
.ord-c-pack{min-width:7.5rem}
.ord-amt{font-weight:600;white-space:nowrap}
.ord-ship{display:flex;flex-direction:column;gap:.05rem;max-width:11rem;margin-top:.3rem;color:var(--ink-soft);overflow-wrap:anywhere}
.ord-ship .mono{font-size:.78rem}
.ord-ship .ord-xline--warn{color:var(--warn);font-weight:600}
.ord-ship .ord-xline--muted{color:var(--muted)}
.ord-ship .ord-xline--ok{color:var(--ok)}
.ord-check{display:grid;place-items:center;width:2.75rem;height:2.75rem;cursor:pointer}
.ord-check__box{width:1.25rem;height:1.25rem;margin:0;accent-color:var(--plum-700)}

/* skrin sempit (komputer riba kecil / tablet melintang): lajur Masuk dilipat — umur dipaparkan di bawah nama; elak skrol mendatar */
@media (min-width:901px) and (max-width:1100px){
  .ord-table .ord-c-time{display:none}
  .ord-idage{display:inline}
  .ord-table th,.ord-table td{padding-left:.5rem;padding-right:.5rem}
  .ord-table th:first-child,.ord-table td:first-child{padding-left:.85rem}
  .ord-table th:last-child,.ord-table td:last-child{padding-right:.85rem}
  .ord-cell{min-width:8rem;max-width:13rem}
  .ord-ship{max-width:8.5rem}
}
@media (min-width:901px) and (max-width:1000px){
  .ord-cell{min-width:6.5rem;max-width:11rem}
  .ord-c-pack{min-width:6.5rem}
  .ord-table th,.ord-table td{padding-left:.4rem;padding-right:.4rem}
}

/* ---------- halaman ---------- */
.ord-pager{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem 1rem;margin-top:.85rem;padding:.6rem .75rem;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--card)}
.ord-pager__n{font-size:.875rem;color:var(--muted)}
.ord-pager__ctl{display:flex;align-items:center;flex-wrap:wrap;gap:.5rem}
.ord-pager__pg{font-size:.875rem;font-weight:600;color:var(--ink-soft);white-space:nowrap}
@media (max-width:900px){.ord-pager{justify-content:center}.ord-pager__n{flex:1 1 100%;text-align:center}}

/* ---------- bar tindakan pukal (melekat di bawah, di atas nav bawah pada telefon) ---------- */
.ord-selbar{order:99;position:sticky;bottom:1rem;z-index:15;display:flex;align-items:center;flex-wrap:wrap;gap:.1rem .5rem;margin-top:1rem;padding:.35rem .5rem .35rem .9rem;border:1px solid var(--plum-500);border-radius:var(--r-lg);background:#fff;box-shadow:var(--shadow-md)}
.ord-selbar__count{flex:1 1 auto;margin:0;font-size:.9rem}
.ord-selbar__pick{flex:none;padding-left:.7rem;padding-right:.7rem;color:var(--plum-700);font-weight:600}
.ord-selbar__acts{display:flex;flex-wrap:wrap;gap:.5rem;margin-left:auto}
.ord-selbar__msg{position:absolute;left:0;bottom:calc(100% + .5rem);max-width:100%;padding:.55rem .85rem;border-radius:var(--r-md);background:var(--ok);color:#fff;font-size:.875rem;font-weight:600;line-height:1.4;box-shadow:var(--shadow-md);pointer-events:none}
.ord-selbar__msg.is-warn{background:var(--warn)}
@media (max-width:900px){
  .ord-selbar{bottom:calc(var(--bottombar-h) + var(--safe-b) + .6rem);padding:.3rem .4rem .5rem .9rem}
  .ord-selbar__acts{flex:1 1 100%;margin-left:0}
  .ord-selbar__acts .btn{flex:1 1 0}
}
@media (max-width:900px) and (max-height:520px){                       /* telefon melintang: satu baris sahaja supaya senarai masih kelihatan */
  .ord-selbar{flex-wrap:nowrap;padding:.25rem .4rem .25rem .9rem}
  .ord-selbar__acts{flex:0 0 auto;margin-left:auto}
  .ord-selbar__acts .btn{flex:0 0 auto}
  .ord-selbar__count{flex:0 1 auto}
}

/* ---------- dialog (Tapis, laporan kegagalan) ---------- */
.ord-presets{display:flex;flex-wrap:wrap;gap:.4rem}
.ord-fdlg .btn{min-height:2.75rem}
.ord-dates{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
.ord-fail{display:flex;flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none}
.ord-fail li{padding:.55rem .7rem;border:1px solid var(--line);border-radius:var(--r-md);background:var(--lilac-50);overflow-wrap:anywhere}
.ord-fail__why{font-size:.8125rem;color:var(--bad)}
@media (max-width:900px){.modal__foot .btn{min-height:2.75rem}}      /* butang dialog juga ≥ 44 px pada telefon */

@media (prefers-reduced-motion:reduce){.ord-card.is-new,.ord-row.is-new td{animation:none}}

/* ---------- Ninja Van: cip status kurier + tindakan Waybills ---------- */
.ord-njc{margin-top:.3rem;display:flex;flex-wrap:wrap;gap:.25rem}
.ord-selbar__wbn{display:block;font-size:.78rem;color:var(--ink-soft)}
.ord-selbar__wb{min-height:2.75rem}